PhoenixKitWeb.Components.Dashboard.Sidebar (phoenix_kit v1.7.42)

Sidebar component for the user dashboard.

Renders the complete dashboard navigation with:

Grouped tabs with headers
Active state highlighting
Badge indicators
Presence counts
Attention animations
Mobile bottom navigation
Collapsible groups
Context selector (when position: :sidebar is configured)

Usage

<.dashboard_sidebar
  current_path={@url_path}
  scope={@phoenix_kit_current_scope}
  locale={@current_locale}
/>

Live Updates

The sidebar automatically updates when tabs change if you subscribe to updates:

def mount(_params, _session, socket) do
  if connected?(socket) do
    Phoenix.PubSub.subscribe(PhoenixKit.PubSub, PhoenixKit.Dashboard.pubsub_topic())
  end
  {:ok, socket}
end

def handle_info({:tab_updated, _tab}, socket) do
  {:noreply, assign(socket, :tabs, PhoenixKit.Dashboard.get_tabs())}
end

Summary

Functions

dashboard_sidebar(assigns)

Renders the complete dashboard sidebar with all tabs.

mobile_fab_menu(assigns)

Renders a floating action button for mobile that opens a tab menu.

mobile_navigation(assigns)

Renders a mobile-friendly bottom navigation bar.

more_menu(assigns)

Renders a "more" dropdown menu for overflow tabs on mobile.

tab_group(assigns)

Renders a group of tabs with optional header.

tab_with_subtabs(assigns)

Renders a tab along with its subtabs (if any).

tabs_with_context_selector(assigns)

Renders tabs with a context selector inserted at the appropriate priority position.

Functions

dashboard_sidebar(assigns)

Renders the complete dashboard sidebar with all tabs.

Attributes

current_path - The current URL path for active state detection
scope - The current authentication scope for visibility filtering
locale - The current locale for path generation
tabs - Optional pre-loaded tabs (defaults to loading from registry)
viewer_counts - Optional map of tab_id => viewer_count
collapsed_groups - Set of collapsed group IDs
show_presence - Show presence indicators (default: true)
compact - Render in compact mode (default: false)
class - Additional CSS classes
show_context_selector - Show context selector at top of sidebar (default: false)
dashboard_contexts - List of available contexts
current_context - Currently selected context
context_selector_config - ContextSelector config struct

Multi-Selector Attributes (optional)

context_selector_configs - List of all ContextSelector configs
dashboard_contexts_map - Map of key => list of contexts
current_contexts_map - Map of key => current context
show_context_selectors_map - Map of key => boolean

Attributes

current_path (:string) - Defaults to "/dashboard".
scope (:any) - Defaults to nil.
locale (:string) - Defaults to nil.
tabs (:list) - Defaults to nil.
viewer_counts (:map) - Defaults to %{}.
collapsed_groups (:any) - Defaults to MapSet.new([]).
show_presence (:boolean) - Defaults to true.
compact (:boolean) - Defaults to false.
class (:string) - Defaults to "".
show_context_selector (:boolean) - Defaults to false.
dashboard_contexts (:list) - Defaults to [].
current_context (:any) - Defaults to nil.
context_selector_config (:any) - Defaults to nil.
context_selector_configs (:list) - Defaults to [].
dashboard_contexts_map (:map) - Defaults to %{}.
current_contexts_map (:map) - Defaults to %{}.
show_context_selectors_map (:map) - Defaults to %{}.

mobile_fab_menu(assigns)

Renders a floating action button for mobile that opens a tab menu.

Includes context selector at the top if configured and user has multiple contexts.

Attributes

current_path (:string) - Defaults to "/dashboard".
scope (:any) - Defaults to nil.
locale (:string) - Defaults to nil.
class (:string) - Defaults to "".
show_context_selector (:boolean) - Defaults to false.
dashboard_contexts (:list) - Defaults to [].
current_context (:any) - Defaults to nil.
context_selector_config (:any) - Defaults to nil.
context_selector_configs (:list) - Defaults to [].
dashboard_contexts_map (:map) - Defaults to %{}.
current_contexts_map (:map) - Defaults to %{}.
show_context_selectors_map (:map) - Defaults to %{}.

mobile_navigation(assigns)

Renders a mobile-friendly bottom navigation bar.

Attributes

current_path - The current URL path for active state detection
scope - The current authentication scope
locale - The current locale
max_tabs - Maximum tabs to show (default: 5)
class - Additional CSS classes

Attributes

current_path (:string) - Defaults to "/dashboard".
scope (:any) - Defaults to nil.
locale (:string) - Defaults to nil.
max_tabs (:integer) - Defaults to 5.
class (:string) - Defaults to "".

more_menu(assigns)

Renders a "more" dropdown menu for overflow tabs on mobile.

Attributes

tabs (:list) (required)
locale (:string) - Defaults to nil.

tab_group(assigns)

Renders a group of tabs with optional header.

Attributes

group (:map) (required)
tabs (:list) (required)
viewer_counts (:map) - Defaults to %{}.
locale (:string) - Defaults to nil.
collapsed (:boolean) - Defaults to false.
compact (:boolean) - Defaults to false.

tab_with_subtabs(assigns)

Renders a tab along with its subtabs (if any).

Subtabs are shown based on the parent tab's subtab_display setting:

:when_active - Subtabs only shown when parent is active
:always - Subtabs always visible

Attributes

tab (:any) (required)
all_tabs (:list) (required)
viewer_counts (:map) - Defaults to %{}.
locale (:string) - Defaults to nil.
compact (:boolean) - Defaults to false.

tabs_with_context_selector(assigns)

Renders tabs with a context selector inserted at the appropriate priority position.

Attributes

tabs (:list) (required)
all_tabs (:list) (required)
viewer_counts (:map) - Defaults to %{}.
locale (:string) - Defaults to nil.
compact (:boolean) - Defaults to false.
show_context_selector (:boolean) - Defaults to false.
dashboard_contexts (:list) - Defaults to [].
current_context (:any) - Defaults to nil.
context_selector_config (:any) - Defaults to nil.