<%!--
  PhoenixKit User Dashboard Layout

  This layout is specifically designed for authenticated user dashboard pages.
  It provides a clean interface for regular users to view their profile and activities.

  Features:
  - Dynamic tab navigation from PhoenixKit.Dashboard.Registry
  - Support for custom tabs via config or runtime registration
  - Real-time badge updates via PubSub
  - Presence tracking for viewer counts
  - Attention animations for important tabs
  - Mobile-friendly navigation

  Note: This layout does NOT use LayoutWrapper.app_layout as that's for admin pages only.
--%>
<% # Branding configuration
project_title = assigns[:project_title] || PhoenixKit.Settings.get_project_title()
project_title_suffix = assigns[:project_title_suffix]

project_title_suffix =
  if is_nil(project_title_suffix),
    do: PhoenixKit.Config.get(:project_title_suffix, "Dashboard"),
    else: project_title_suffix

project_logo = assigns[:project_logo] || PhoenixKit.Config.get(:project_logo, nil)
project_icon = assigns[:project_icon] || PhoenixKit.Config.get(:project_icon, "hero-home")

project_logo_height =
  assigns[:project_logo_height] || PhoenixKit.Config.get(:project_logo_height, "h-8")

project_logo_class =
  assigns[:project_logo_class] || PhoenixKit.Config.get(:project_logo_class, nil)

project_home_url_raw = assigns[:project_home_url] || PhoenixKit.Config.get(:project_home_url, "/")
# Paths starting with ~/ get the URL prefix applied, others stay as-is
project_home_url =
  case project_home_url_raw do
    "~/" <> path -> PhoenixKit.Utils.Routes.path("/" <> path)
    other -> other
  end

show_title_with_logo = assigns[:show_title_with_logo]

show_title_with_logo =
  if is_nil(show_title_with_logo),
    do: PhoenixKit.Config.get(:show_title_with_logo, true),
    else: show_title_with_logo

# Build full display title
display_title =
  if project_title_suffix && project_title_suffix != "" do
    "#{project_title} #{project_title_suffix}"
  else
    project_title
  end %>
<% # Get tabs from registry (with active state based on current path)
dashboard_tabs =
  assigns[:dashboard_tabs] ||
    PhoenixKit.Dashboard.Registry.get_tabs_with_active(
      assigns[:url_path] || "/dashboard",
      scope: assigns[:phoenix_kit_current_scope],
      level: :user
    )

# Get viewer counts if presence is enabled
viewer_counts = assigns[:tab_viewer_counts] || %{}

# Get collapsed groups
collapsed_groups = assigns[:collapsed_dashboard_groups] || MapSet.new()

# Get context selector data (may be nil if not configured)
show_context_selector = assigns[:show_context_selector] || false
dashboard_contexts = assigns[:dashboard_contexts] || []
current_context = assigns[:current_context]

context_selector_config =
  assigns[:context_selector_config] || %PhoenixKit.Dashboard.ContextSelector{enabled: false}

# Multi-selector data (new)
context_selector_configs = assigns[:context_selector_configs] || []
dashboard_contexts_map = assigns[:dashboard_contexts_map] || %{}
current_contexts_map = assigns[:current_contexts_map] || %{}
show_context_selectors_map = assigns[:show_context_selectors_map] || %{}
has_multi_selector = context_selector_configs != [] %> <!DOCTYPE html>
<html lang="en">
  <head>
    <%!-- Pre-paint: stamps the saved theme before the stylesheets load.
         The larger script at the end of body still owns interaction. --%>
    <PhoenixKitWeb.Components.ThemeBootstrap.theme_bootstrap />
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="csrf-token" content={Plug.CSRFProtection.get_csrf_token()} />
    <.live_title default={display_title}>
      {assigns[:page_title] || "Dashboard"}
    </.live_title>
    <link
      phx-track-static
      rel="stylesheet"
      href={PhoenixKit.Utils.Routes.path("/assets/css/app.css")}
    />
    <%!-- PhoenixKit Custom Theme CSS (phoenix-light, phoenix-dark) --%>
    <style data-phoenix-kit-themes>
      <%= Phoenix.HTML.raw(PhoenixKit.ThemeConfig.custom_theme_css()) %>
    </style>
    <%!-- Dashboard animations CSS --%>
    <style>
      /* Shake animation for attention */
      @keyframes shake {
        0%, 100% { transform: translateX(0); }
        10%, 30%, 50%, 70%, 90% { transform: translateX(-2px); }
        20%, 40%, 60%, 80% { transform: translateX(2px); }
      }
      .animate-shake { animation: shake 0.5s ease-in-out; }

      /* Glow animation for highlighting */
      @keyframes glow {
        0%, 100% { box-shadow: 0 0 5px currentColor; }
        50% { box-shadow: 0 0 20px currentColor; }
      }
      .animate-glow { animation: glow 2s ease-in-out infinite; }

      /* Badge pop animation */
      @keyframes badge-pop {
        0% { transform: scale(0); }
        50% { transform: scale(1.2); }
        100% { transform: scale(1); }
      }
      .animate-badge-pop { animation: badge-pop 0.3s ease-out; }

      /* Subtab animations */
      @keyframes slide-in-left {
        0% { opacity: 0; transform: translateX(-24px); }
        100% { opacity: 1; transform: translateX(0); }
      }
      .animate-slide-in-left { animation: slide-in-left 0.35s ease-out; }

      @keyframes fade-in {
        0% { opacity: 0; }
        100% { opacity: 1; }
      }
      .animate-fade-in { animation: fade-in 0.3s ease-out; }

      @keyframes collapse-open {
        0% { opacity: 0; max-height: 0; }
        100% { opacity: 1; max-height: 100px; }
      }
      .animate-collapse-open { animation: collapse-open 0.3s ease-out; }

      /* Respect reduced motion preference */
      @media (prefers-reduced-motion: reduce) {
        *, *::before, *::after {
          animation-duration: 0.01ms !important;
          animation-iteration-count: 1 !important;
        }
      }
    </style>
    <%!-- PhoenixKit Cookie Consent Widget Setup --%>
    <.phoenix_kit_globals />
    <%!-- PhoenixKit Cookie Consent Widget Script --%>
    <%= if Code.ensure_loaded?(PhoenixKit.Modules.Legal) do %>
      <script defer src={PhoenixKit.Utils.Routes.path("/assets/phoenix_kit_consent.js")}>
      </script>
    <% end %>
  </head>
  <body class="bg-base-100 antialiased">
    <div class="min-h-screen bg-base-100">
      <%!-- User Dashboard Header --%>
      <header class="bg-base-100 shadow-sm border-b border-base-300 fixed top-0 left-0 right-0 z-50">
        <div class="flex items-center justify-between h-16 px-4">
          <%!-- Left: Logo and Title --%>
          <div class="flex items-center gap-3">
            <.link
              navigate={project_home_url}
              class="flex items-center gap-3 hover:opacity-80 transition-opacity"
            >
              <%= if project_logo do %>
                <%!-- Custom logo image --%>
                <img
                  src={project_logo}
                  alt={project_title}
                  class={[project_logo_height, "w-auto", project_logo_class]}
                />
              <% else %>
                <%!-- Default icon in colored box --%>
                <div class="w-8 h-8 bg-primary rounded-lg flex items-center justify-center">
                  <.icon name={project_icon} class="w-5 h-5 text-primary-content" />
                </div>
              <% end %>
              <%= if show_title_with_logo or is_nil(project_logo) do %>
                <span class="font-bold text-base-content hidden sm:inline">
                  {display_title}
                </span>
              <% end %>
            </.link>
            <%!-- Context Selector(s) (header start - after logo) --%>
            <%= if has_multi_selector do %>
              <%!-- Multi-selector mode --%>
              <PhoenixKitWeb.Components.Dashboard.MultiContextSelector.multi_context_selector
                position={:header}
                sub_position={:start}
                configs={context_selector_configs}
                contexts_map={dashboard_contexts_map}
                current_map={current_contexts_map}
                show_map={show_context_selectors_map}
                class="hidden sm:flex"
              />
            <% else %>
              <%!-- Legacy single selector --%>
              <%= if show_context_selector and context_selector_config.position == :header and context_selector_config.sub_position == :start do %>
                <div class="hidden sm:flex items-center">
                  <%= if context_selector_config.separator do %>
                    <span class="text-base-content/30 mx-2">
                      {context_selector_config.separator}
                    </span>
                  <% end %>
                  <PhoenixKitWeb.Components.Dashboard.ContextSelector.context_selector
                    contexts={dashboard_contexts}
                    current={current_context}
                    config={context_selector_config}
                  />
                </div>
              <% end %>
            <% end %>
          </div>

          <%!-- Right: Context Selector, Theme, User Dropdown --%>
          <div class="flex items-center gap-3">
            <%!-- Context Selector(s) (header end - before theme/user) --%>
            <%= if has_multi_selector do %>
              <%!-- Multi-selector mode --%>
              <PhoenixKitWeb.Components.Dashboard.MultiContextSelector.multi_context_selector
                position={:header}
                sub_position={:end}
                configs={context_selector_configs}
                contexts_map={dashboard_contexts_map}
                current_map={current_contexts_map}
                show_map={show_context_selectors_map}
                class="hidden sm:flex"
              />
            <% else %>
              <%!-- Legacy single selector --%>
              <%= if show_context_selector and context_selector_config.position == :header and context_selector_config.sub_position == :end do %>
                <PhoenixKitWeb.Components.Dashboard.ContextSelector.context_selector
                  contexts={dashboard_contexts}
                  current={current_context}
                  config={context_selector_config}
                  class="hidden sm:flex"
                />
              <% end %>
            <% end %>
            <%!-- Theme Switcher --%>
            <PhoenixKitWeb.Components.Core.ThemeController.theme_controller
              themes={PhoenixKit.Config.get(:dashboard_themes, :all)}
              id="dashboard-theme-dropdown"
            />
            <PhoenixKitWeb.Components.UserDashboardNav.user_dropdown
              scope={assigns[:phoenix_kit_current_scope]}
              current_path={assigns[:url_path] || "/dashboard"}
              current_locale={assigns[:current_locale]}
              admin_edit_url={assigns[:admin_edit_url]}
              admin_edit_label={assigns[:admin_edit_label]}
            />
          </div>
        </div>
      </header>

      <%!-- Main Content Area --%>
      <div class="pt-16">
        <div class="flex">
          <%!-- Left Sidebar Navigation (Desktop) --%>
          <aside class="w-64 h-[calc(100vh-4rem)] bg-base-100 border-r border-base-300 hidden lg:flex flex-col sticky top-16">
            <div class="p-4 flex-1 overflow-y-auto">
              <PhoenixKitWeb.Components.Dashboard.Sidebar.dashboard_sidebar
                current_path={assigns[:url_path] || "/dashboard"}
                scope={assigns[:phoenix_kit_current_scope]}
                locale={assigns[:current_locale_base]}
                tabs={dashboard_tabs}
                viewer_counts={viewer_counts}
                collapsed_groups={collapsed_groups}
                show_context_selector={show_context_selector}
                dashboard_contexts={dashboard_contexts}
                current_context={current_context}
                context_selector_config={context_selector_config}
                context_selector_configs={context_selector_configs}
                dashboard_contexts_map={dashboard_contexts_map}
                current_contexts_map={current_contexts_map}
                show_context_selectors_map={show_context_selectors_map}
              />
              <%!-- Optional extra sidebar content (e.g., shop filters + categories) --%>
              <%= if assigns[:sidebar_after_shop] do %>
                <div class="mt-3 pt-3 border-t border-base-300/50">
                  {assigns[:sidebar_after_shop]}
                </div>
              <% end %>
            </div>
            <%!-- Bottom Context Selector(s) (when sub_position: :end) --%>
            <%= if has_multi_selector do %>
              <%!-- Multi-selector mode --%>
              <div class="p-4 border-t border-base-300 mt-auto">
                <PhoenixKitWeb.Components.Dashboard.MultiContextSelector.multi_context_selector_sidebar
                  position={:sidebar}
                  sub_position={:end}
                  configs={context_selector_configs}
                  contexts_map={dashboard_contexts_map}
                  current_map={current_contexts_map}
                  show_map={show_context_selectors_map}
                />
              </div>
            <% else %>
              <%!-- Legacy single selector --%>
              <%= if show_context_selector and context_selector_config && context_selector_config.enabled and context_selector_config.position == :sidebar and context_selector_config.sub_position == :end do %>
                <div class="p-4 border-t border-base-300 mt-auto">
                  <PhoenixKitWeb.Components.Dashboard.ContextSelector.sidebar_context_selector
                    contexts={dashboard_contexts}
                    current={current_context}
                    config={context_selector_config}
                  />
                </div>
              <% end %>
            <% end %>
          </aside>

          <%!-- Mobile FAB Menu --%>
          <PhoenixKitWeb.Components.Dashboard.Sidebar.mobile_fab_menu
            current_path={assigns[:url_path] || "/dashboard"}
            scope={assigns[:phoenix_kit_current_scope]}
            locale={assigns[:current_locale_base]}
            show_context_selector={show_context_selector}
            dashboard_contexts={dashboard_contexts}
            current_context={current_context}
            context_selector_config={context_selector_config}
            context_selector_configs={context_selector_configs}
            dashboard_contexts_map={dashboard_contexts_map}
            current_contexts_map={current_contexts_map}
            show_context_selectors_map={show_context_selectors_map}
          />

          <%!-- Main Content --%>
          <main class="flex-1 px-4 py-8">
            <.flash_group flash={@flash} />
            {render_slot(@inner_block)}
          </main>
        </div>
      </div>
    </div>
    <%!-- Theme Controller JavaScript --%>
    <%!-- Shared theme controller — was a hand-written near-copy of the
         admin one that drifted (own base map, hardcoded phoenix-* system
         resolution). One generated script now serves every layout. --%>
    <PhoenixKitWeb.Components.ThemeControllerScript.theme_controller_script />

    <%!-- Cookie Consent Widget --%>
    <%= if Code.ensure_loaded?(PhoenixKit.Modules.Legal) and
           PhoenixKit.Modules.Legal.consent_widget_enabled?() do %>
      <% config = PhoenixKit.Modules.Legal.get_consent_widget_config() %>
      <PhoenixKit.Modules.Legal.CookieConsent.cookie_consent
        frameworks={config.frameworks}
        consent_mode={config.consent_mode}
        icon_position={config.icon_position}
        policy_version={config.policy_version}
        cookie_policy_url={config.cookie_policy_url}
        privacy_policy_url={config.privacy_policy_url}
        legal_links={config.legal_links}
        legal_index_url={config.legal_index_url}
        google_consent_mode={config.google_consent_mode}
      />
    <% end %>
  </body>
</html>
