---
import HeaderNavbar from 'virtual:prosefly/lotus/components/HeaderNavbar';
import HeaderSocialIcons from 'virtual:prosefly/lotus/components/HeaderSocialIcons';
import LanguageSelect from '../components/theme/LanguageSelect.astro';
import SearchDialog from 'virtual:prosefly/lotus/components/SearchDialog';
import AssistantTrigger from '../components/theme/AssistantTrigger.astro';
import SiteBrand from 'virtual:prosefly/lotus/components/SiteBrand';
import ThemeSwitch from 'virtual:prosefly/lotus/components/ThemeSwitch';
import Dropdown from '../components/ui/Dropdown.astro';
import { Icon } from '@prosefly/astro-components';
import rawThemeConfig from 'virtual:prosefly/lotus/config';
import { isPagefindSearchEnabled } from '../lib/search';
import type { LotusThemeConfig } from '../lib/theme';

interface Props {
  assistant?: boolean;
  currentPath?: string;
  search?: boolean;
  showLanguage?: boolean;
  showSocials?: boolean;
  showThemeSwitch?: boolean;
  surface?: boolean;
}

const {
  assistant = true,
  currentPath,
  search = true,
  showLanguage = true,
  showSocials = true,
  showThemeSwitch = true,
  surface = true,
} = Astro.props as Props;
const t = Astro.locals.t;
const themeConfig = rawThemeConfig as LotusThemeConfig;
const searchEnabled = search && themeConfig.search !== false;
const assistantEnabled = assistant && Boolean(themeConfig.assistant);
const showThemeControl = showThemeSwitch && themeConfig.themeModeControl !== false;
const hasDesktopControls = showSocials || showThemeControl;
const hasMobileControls = showSocials || showThemeControl;
const hasMobileMenu = (themeConfig.siteNav?.length ?? 0) > 0 || hasMobileControls;
const mobileMenuClass = searchEnabled || assistantEnabled ? 'lg:hidden' : 'ms-auto lg:hidden';
const pagefindIgnoreAttrs = isPagefindSearchEnabled(themeConfig)
  ? { 'data-pagefind-ignore': true }
  : {};
---

<header
  class:list={[
    'relative z-40 h-(--lotus-header-height)',
    surface && 'lotus-border-subtle border-b bg-(--lotus-header-background)/95 backdrop-blur',
  ]}
  {...pagefindIgnoreAttrs}
>
  <div class="mx-auto flex h-full max-w-screen-2xl items-center gap-2 px-4 sm:gap-4 sm:px-6">
    <SiteBrand fetchPriority="high" markIdPrefix="lotus-site-header-brand" />

    {showLanguage && <LanguageSelect />}

    {searchEnabled ? (
      <SearchDialog />
    ) : assistantEnabled ? (
      <div class="ms-auto flex min-w-0 items-center gap-1 lg:ms-0">
        <AssistantTrigger />
      </div>
    ) : null}

    <div class="ms-auto hidden min-w-0 items-center gap-5 lg:flex">
      <HeaderNavbar currentPath={currentPath} />

      {hasDesktopControls && (
        <div class="flex items-center gap-2">
          <div class="lotus-border-subtle h-5 border-s"></div>
          {showSocials && <HeaderSocialIcons />}
          {showThemeControl && <ThemeSwitch />}
        </div>
      )}
    </div>

    {hasMobileMenu && (
      <Dropdown
        class={mobileMenuClass}
        contentClass="lotus-border-muted absolute end-0 top-[calc(100%+0.75rem)] z-50 w-72 rounded-[min(var(--lotus-radius-lg),1rem)] border bg-(--lotus-background) p-4 shadow-lg shadow-black/5"
        triggerClass="lotus-focus-ring flex h-10 w-10 cursor-pointer items-center justify-center rounded-(--lotus-radius-md) text-(--lotus-text-muted) transition-colors hover:bg-(--lotus-surface) hover:text-(--lotus-text-strong)"
      >
        <Fragment slot="trigger">
          <Icon aria-hidden="true" class="h-5 w-5" name="lucide:ellipsis-vertical" />
          <span class="sr-only">{t('menuButton.label')}</span>
        </Fragment>

        <nav aria-label={t('navbar.primary')} class="space-y-4">
          <HeaderNavbar currentPath={currentPath} mobile />

          {hasMobileControls && (
            <div class="lotus-border-subtle flex items-center justify-between gap-3 border-t pt-4">
              <div class="flex items-center gap-1">
                {showSocials && <HeaderSocialIcons mobile />}
              </div>
              {showThemeControl && <ThemeSwitch />}
            </div>
          )}
        </nav>
      </Dropdown>
    )}
  </div>
</header>