import type { ReactNode } from 'react';
import { AppHeader } from '@/components/host/AppHeader';
import type { NavItem } from '@/components/host/client';
import { getHostContext } from '@/lib/auth/session';
import { signOutHost } from '../login/actions';

const NAV: readonly NavItem[] = [
  { href: '/host', label: 'Dashboard', exact: true },
  { href: '/host/events', label: 'Events' },
  { href: '/host/settings', label: 'Settings' },
  { href: '/host/metrics', label: 'Metrics' },
];

/** Signed-in host chrome. Pages and actions still call requireHost() themselves. */
export default async function HostAppLayout({ children }: { children: ReactNode }) {
  // Not signed in: render nothing extra and let the page's own requireHost(next) redirect, so the
  // login page can send the host back to where they were going.
  const ctx = await getHostContext();
  if (!ctx) return children;
  const { venue, user } = ctx;
  return (
    <div className="flex min-h-dvh flex-col">
      <AppHeader
        homeHref="/host"
        context={venue.name}
        contextLabel="Host dashboard"
        nav={NAV}
        navLabel="Host dashboard"
        userLabel={
          <>
            {user.name} · {user.role === 'OWNER' ? 'Owner' : 'Host'}
          </>
        }
        signOutAction={signOutHost}
      />
      <main id="main" tabIndex={-1} className="container-page flex-1 py-8 outline-none sm:py-10">
        {children}
      </main>
    </div>
  );
}