124 lines
3.6 KiB
TypeScript
124 lines
3.6 KiB
TypeScript
|
|
|
|
import { RaceFilterModal } from '@/components/races/RaceFilterModal';
|
|
import { RacePageHeader } from '@/components/races/RacePageHeader';
|
|
import { RaceScheduleTable } from '@/components/races/RaceScheduleTable';
|
|
import { RacesAllLayout, RacesAllStats } from '@/components/races/RacesAllLayout';
|
|
import { RaceScheduleSection } from '@/components/races/RacesLayout';
|
|
import type { SessionStatus } from '@/components/races/SessionStatusBadge';
|
|
import { TemplateProps } from '@/lib/contracts/components/ComponentContracts';
|
|
import type { RacesViewData } from '@/lib/view-data/RacesViewData';
|
|
import { Box } from '@/ui/Box';
|
|
import { Pagination } from '@/ui/Pagination';
|
|
import { Text } from '@/ui/Text';
|
|
|
|
export type StatusFilter = 'scheduled' | 'running' | 'completed' | 'cancelled' | 'all';
|
|
|
|
interface RacesAllTemplateProps extends TemplateProps<RacesViewData> {
|
|
races: RacesViewData['races'];
|
|
totalFilteredCount: number;
|
|
isLoading: boolean;
|
|
// Pagination
|
|
currentPage: number;
|
|
totalPages: number;
|
|
itemsPerPage: number;
|
|
onPageChange: (page: number) => void;
|
|
// Filters
|
|
statusFilter: StatusFilter;
|
|
setStatusFilter: (filter: StatusFilter) => void;
|
|
leagueFilter: string;
|
|
setLeagueFilter: (filter: string) => void;
|
|
searchQuery: string;
|
|
setSearchQuery: (query: string) => void;
|
|
// UI State
|
|
showFilters: boolean;
|
|
setShowFilters: (show: boolean) => void;
|
|
showFilterModal: boolean;
|
|
setShowFilterModal: (show: boolean) => void;
|
|
// Actions
|
|
onRaceClick: (raceId: string) => void;
|
|
onLeagueClick: (leagueId: string) => void;
|
|
}
|
|
|
|
export function RacesAllTemplate({
|
|
viewData,
|
|
races,
|
|
totalFilteredCount,
|
|
currentPage,
|
|
totalPages,
|
|
onPageChange,
|
|
statusFilter,
|
|
setStatusFilter,
|
|
leagueFilter,
|
|
setLeagueFilter,
|
|
searchQuery,
|
|
setSearchQuery,
|
|
showFilterModal,
|
|
setShowFilterModal,
|
|
onRaceClick,
|
|
}: RacesAllTemplateProps) {
|
|
// Note: Loading state is handled by StatefulPageWrapper in the client wrapper
|
|
|
|
return (
|
|
<RacesAllLayout
|
|
header={
|
|
<RacePageHeader
|
|
totalCount={viewData.totalCount}
|
|
scheduledCount={viewData.scheduledCount}
|
|
runningCount={viewData.runningCount}
|
|
completedCount={viewData.completedCount}
|
|
/>
|
|
}
|
|
stats={
|
|
<RacesAllStats
|
|
count={totalFilteredCount}
|
|
onFilterClick={() => setShowFilterModal(true)}
|
|
/>
|
|
}
|
|
pagination={
|
|
<Pagination
|
|
currentPage={currentPage}
|
|
totalPages={totalPages}
|
|
onPageChange={onPageChange}
|
|
/>
|
|
}
|
|
>
|
|
<RaceScheduleSection title="Race Schedule">
|
|
{races.length === 0 ? (
|
|
<Box p={12} textAlign="center">
|
|
<Text color="text-gray-500">No races found matching your criteria.</Text>
|
|
</Box>
|
|
) : (
|
|
<RaceScheduleTable
|
|
races={races.map(race => ({
|
|
id: race.id,
|
|
track: race.track,
|
|
car: race.car,
|
|
leagueName: race.leagueName,
|
|
time: race.timeLabel,
|
|
status: race.status as SessionStatus
|
|
}))}
|
|
onRaceClick={onRaceClick}
|
|
/>
|
|
)}
|
|
</RaceScheduleSection>
|
|
|
|
<RaceFilterModal
|
|
isOpen={showFilterModal}
|
|
onClose={() => setShowFilterModal(false)}
|
|
statusFilter={statusFilter}
|
|
setStatusFilter={setStatusFilter}
|
|
leagueFilter={leagueFilter}
|
|
setLeagueFilter={setLeagueFilter}
|
|
timeFilter="all"
|
|
setTimeFilter={() => {}}
|
|
searchQuery={searchQuery}
|
|
setSearchQuery={setSearchQuery}
|
|
leagues={viewData.leagues}
|
|
showSearch={true}
|
|
showTimeFilter={false}
|
|
/>
|
|
</RacesAllLayout>
|
|
);
|
|
}
|