# `PhoenixKitWeb.Components.Dashboard.Sidebar`
[🔗](https://github.com/BeamLabEU/phoenix_kit/blob/v1.7.165/lib/phoenix_kit_web/components/dashboard/sidebar.ex#L1)

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

# `dashboard_sidebar`

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`

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`

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`

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

## Attributes

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

# `tab_group`

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`

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`

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`.

---

*Consult [api-reference.md](api-reference.md) for complete listing*