102 lines
2.7 KiB
TypeScript
102 lines
2.7 KiB
TypeScript
'use client';
|
|
|
|
import { EmptyState } from '@/ui/EmptyState';
|
|
import { LoadingWrapper } from '@/ui/LoadingWrapper';
|
|
import { Button } from '@/ui/Button';
|
|
import { Card } from '@/ui/Card';
|
|
import { Pagination } from '@/ui/Pagination';
|
|
import { Text } from '@/ui/Text';
|
|
import { Box } from '@/ui/Box';
|
|
import { Group } from '@/ui/Group';
|
|
import { Stack } from '@/ui/Stack';
|
|
import { ControlBar } from '@/ui/ControlBar';
|
|
import { Trophy } from 'lucide-react';
|
|
import { useEffect, useState } from 'react';
|
|
import React from 'react';
|
|
|
|
interface RaceHistoryProps {
|
|
driverId: string;
|
|
}
|
|
|
|
export function ProfileRaceHistory({ driverId }: RaceHistoryProps) {
|
|
const [filter, setFilter] = useState<'all' | 'wins' | 'podiums'>('all');
|
|
const [page, setPage] = useState(1);
|
|
const [loading, setLoading] = useState(true);
|
|
const resultsPerPage = 10;
|
|
|
|
useEffect(() => {
|
|
async function loadRaceHistory() {
|
|
try {
|
|
// Driver race history is not exposed via API yet.
|
|
} catch (err) {
|
|
console.error('Failed to load race history:', err);
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
}
|
|
|
|
loadRaceHistory();
|
|
}, [driverId]);
|
|
|
|
const filteredResults: Array<unknown> = [];
|
|
|
|
const totalPages = Math.ceil(filteredResults.length / resultsPerPage);
|
|
|
|
if (loading) {
|
|
return <LoadingWrapper variant="spinner" message="Loading race history..." />;
|
|
}
|
|
|
|
if (filteredResults.length === 0) {
|
|
return (
|
|
<EmptyState
|
|
icon={Trophy}
|
|
title="No race history yet"
|
|
description="Complete races to build your racing record"
|
|
variant="minimal"
|
|
/>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<Stack gap={4}>
|
|
<ControlBar>
|
|
<Group gap={2}>
|
|
<Button
|
|
variant={filter === 'all' ? 'primary' : 'secondary'}
|
|
onClick={() => { setFilter('all'); setPage(1); }}
|
|
size="sm"
|
|
>
|
|
All Races
|
|
</Button>
|
|
<Button
|
|
variant={filter === 'wins' ? 'primary' : 'secondary'}
|
|
onClick={() => { setFilter('wins'); setPage(1); }}
|
|
size="sm"
|
|
>
|
|
Wins Only
|
|
</Button>
|
|
<Button
|
|
variant={filter === 'podiums' ? 'primary' : 'secondary'}
|
|
onClick={() => { setFilter('podiums'); setPage(1); }}
|
|
size="sm"
|
|
>
|
|
Podiums
|
|
</Button>
|
|
</Group>
|
|
</ControlBar>
|
|
|
|
<Card>
|
|
<Box minHeight="10rem" display="flex" alignItems="center" justifyContent="center">
|
|
<Text variant="low">No results found for the selected filter.</Text>
|
|
</Box>
|
|
|
|
<Pagination
|
|
currentPage={page}
|
|
totalPages={totalPages}
|
|
onPageChange={setPage}
|
|
/>
|
|
</Card>
|
|
</Stack>
|
|
);
|
|
}
|