Files
gridpilot.gg/apps/website/templates/layout/RootAppShellTemplate.tsx
2026-01-19 19:15:21 +01:00

58 lines
1.8 KiB
TypeScript

'use client';
import { AppShell } from '@/components/app/AppShell';
import { useCurrentSession } from '@/hooks/auth/useCurrentSession';
import { routes } from '@/lib/routing/RouteConfig';
import { Box } from '@/ui/Box';
import { ContentViewport } from '@/ui/ContentViewport';
import { ControlBar } from '@/ui/ControlBar';
import { TopNav } from '@/ui/TopNav';
import { usePathname } from 'next/navigation';
import React from 'react';
import { GlobalFooterTemplate } from './GlobalFooterTemplate';
import { GlobalSidebarTemplate } from './GlobalSidebarTemplate';
import { HeaderContentTemplate } from './HeaderContentTemplate';
export interface RootAppShellViewData {
children: React.ReactNode;
}
/**
* RootAppShellTemplate orchestrates the top-level semantic shells of the application.
* It follows the "Telemetry Workspace" structure:
* - ControlBar = header/control bar
* - DashboardRail = sidebar rail
* - ContentViewport = content area
*/
export function RootAppShellTemplate({ children }: RootAppShellViewData) {
const pathname = usePathname();
const { data: session } = useCurrentSession();
const isAuthenticated = !!session;
// Hide sidebar on landing page for unauthenticated users
const isLandingPage = pathname === routes.public.home;
const showSidebar = isAuthenticated && !isLandingPage;
return (
<AppShell>
<ControlBar>
<TopNav>
<HeaderContentTemplate />
</TopNav>
</ControlBar>
<Box display="flex" flexGrow={1} width="full">
{showSidebar && <GlobalSidebarTemplate />}
<Box as="main" display="flex" flexGrow={1} flexDirection="col" minWidth="0">
<ContentViewport fullWidth={!showSidebar}>
{children}
</ContentViewport>
</Box>
</Box>
<GlobalFooterTemplate />
</AppShell>
);
}