66 lines
2.0 KiB
TypeScript
66 lines
2.0 KiB
TypeScript
'use client';
|
|
|
|
import React from 'react';
|
|
import type { DashboardViewData } from '@/lib/view-data/DashboardViewData';
|
|
import { Box } from '@/ui/Box';
|
|
import { Container } from '@/ui/Container';
|
|
import { Grid } from '@/ui/Grid';
|
|
import { GridItem } from '@/ui/GridItem';
|
|
import { DashboardHero } from '@/ui/DashboardHeroWrapper';
|
|
import { NextRaceCard } from '@/ui/NextRaceCardWrapper';
|
|
import { ChampionshipStandings } from '@/ui/ChampionshipStandings';
|
|
import { ActivityFeed } from '@/ui/ActivityFeed';
|
|
import { UpcomingRaces } from '@/ui/UpcomingRaces';
|
|
import { FriendsSidebar } from '@/ui/FriendsSidebar';
|
|
import { Stack } from '@/ui/Stack';
|
|
|
|
interface DashboardTemplateProps {
|
|
viewData: DashboardViewData;
|
|
}
|
|
|
|
export function DashboardTemplate({ viewData }: DashboardTemplateProps) {
|
|
const {
|
|
currentDriver,
|
|
nextRace,
|
|
upcomingRaces,
|
|
leagueStandings,
|
|
feedItems,
|
|
friends,
|
|
activeLeaguesCount,
|
|
hasUpcomingRaces,
|
|
hasLeagueStandings,
|
|
hasFeedItems,
|
|
hasFriends,
|
|
} = viewData;
|
|
|
|
return (
|
|
<Box as="main">
|
|
<DashboardHero
|
|
currentDriver={currentDriver}
|
|
activeLeaguesCount={activeLeaguesCount}
|
|
/>
|
|
|
|
<Container size="lg" py={8}>
|
|
<Grid cols={12} gap={6}>
|
|
{/* Left Column - Main Content */}
|
|
<GridItem colSpan={12} lgSpan={8}>
|
|
<Stack gap={6}>
|
|
{nextRace && <NextRaceCard nextRace={nextRace} />}
|
|
{hasLeagueStandings && <ChampionshipStandings standings={leagueStandings} />}
|
|
<ActivityFeed items={feedItems} hasItems={hasFeedItems} />
|
|
</Stack>
|
|
</GridItem>
|
|
|
|
{/* Right Column - Sidebar */}
|
|
<GridItem colSpan={12} lgSpan={4}>
|
|
<Stack gap={6}>
|
|
<UpcomingRaces races={upcomingRaces} hasRaces={hasUpcomingRaces} />
|
|
<FriendsSidebar friends={friends} hasFriends={hasFriends} />
|
|
</Stack>
|
|
</GridItem>
|
|
</Grid>
|
|
</Container>
|
|
</Box>
|
|
);
|
|
}
|