import { DashboardRail } from '@/components/dashboard/DashboardRail';
import { AuthedNav } from '@/components/layout/AuthedNav';
import { PublicNav } from '@/components/layout/PublicNav';
import { useCurrentSession } from '@/hooks/auth/useCurrentSession';
import { ViewData } from '@/lib/contracts/view-data/ViewData';
import { Box } from '@/ui/Box';
import { Surface } from '@/ui/Surface';
import { Text } from '@/ui/Text';
import { usePathname } from 'next/navigation';

export interface GlobalSidebarViewData extends ViewData {}

export function GlobalSidebarTemplate(_props: GlobalSidebarViewData) {
  const pathname = usePathname();
  const { data: session } = useCurrentSession();
  const isAuthenticated = !!session;

  return (
    <Surface
      as="aside"
      variant="dark"
      width="260px"
      position="sticky"
      top="56px"
      height="calc(100vh - 56px)"
      borderRight={true}
      shadow="inset -1px 0 0 0 rgba(255, 255, 255, 0.01)"
      bg="linear-gradient(180deg, #0d0d0e 0%, #0a0a0b 100%)"
    >
      <DashboardRail>
        <Box py={8} fullWidth>
          <Box px={6} mb={10}>
            <Box display="flex" alignItems="center" gap={2} mb={2}>
              <Box w="2px" h="12px" bg="var(--ui-color-intent-primary)" />
              <Text size="xs" variant="low" weight="bold" font="mono" letterSpacing="0.2em">
                DASHBOARD
              </Text>
            </Box>
          </Box>
          <Box px={4}>
            {isAuthenticated ? (
              <AuthedNav pathname={pathname} />
            ) : (
              <PublicNav pathname={pathname} />
            )}
          </Box>
        </Box>
      </DashboardRail>
    </Surface>
  );
}