mmintel/gridpilot.gg
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix e2e

Browse Source
This commit is contained in:
Marc Mintel
2026-01-05 19:35:49 +01:00
parent b4b915416b
commit d9e6151ae0
92 changed files with 10964 additions and 7893 deletions
Download Patch File Download Diff File Expand all files Collapse all files

121
apps/website/app/leaderboards/page.tsx
View File

@@ -1,126 +1,9 @@
'use client';
import { useState, useEffect } from 'react';
import { useRouter } from 'next/navigation';
import { Trophy, Users, Award } from 'lucide-react';
import Button from '@/components/ui/Button';
import Heading from '@/components/ui/Heading';
import DriverLeaderboardPreview from '@/components/leaderboards/DriverLeaderboardPreview';
import TeamLeaderboardPreview from '@/components/leaderboards/TeamLeaderboardPreview';
import type { DriverLeaderboardItemViewModel } from '@/lib/view-models/DriverLeaderboardItemViewModel';
import type { TeamSummaryViewModel } from '@/lib/view-models/TeamSummaryViewModel';
import { useServices } from '@/lib/services/ServiceProvider';
// ============================================================================
// TYPES
// ============================================================================
import LeaderboardsStatic from './LeaderboardsStatic';
// ============================================================================
// MAIN PAGE COMPONENT
// ============================================================================
export default function LeaderboardsPage() {
const router = useRouter();
const { driverService, teamService } = useServices();
const [drivers, setDrivers] = useState<DriverLeaderboardItemViewModel[]>([]);
const [teams, setTeams] = useState<TeamSummaryViewModel[]>([]);
const [loading, setLoading] = useState(true);
useEffect(() => {
const load = async () => {
try {
const driversViewModel = await driverService.getDriverLeaderboard();
const teams = await teamService.getAllTeams();
setDrivers(driversViewModel.drivers);
setTeams(teams);
} catch (error) {
console.error('Failed to load leaderboard data:', error);
setDrivers([]);
setTeams([]);
} finally {
setLoading(false);
}
};
void load();
}, []);
const handleDriverClick = (driverId: string) => {
router.push(`/drivers/${driverId}`);
};
const handleTeamClick = (teamId: string) => {
router.push(`/teams/${teamId}`);
};
if (loading) {
return (
<div className="max-w-7xl mx-auto px-4">
<div className="flex items-center justify-center min-h-[400px]">
<div className="flex flex-col items-center gap-4">
<div className="w-10 h-10 border-2 border-yellow-400 border-t-transparent rounded-full animate-spin" />
<p className="text-gray-400">Loading leaderboards...</p>
</div>
</div>
</div>
);
}
return (
<div className="max-w-7xl mx-auto px-4 pb-12">
{/* Hero Section */}
<div className="relative mb-10 py-10 px-8 rounded-2xl bg-gradient-to-br from-yellow-600/20 via-iron-gray/80 to-deep-graphite border border-yellow-500/20 overflow-hidden">
{/* Background decoration */}
<div className="absolute top-0 right-0 w-96 h-96 bg-yellow-400/10 rounded-full blur-3xl" />
<div className="absolute bottom-0 left-0 w-64 h-64 bg-amber-600/5 rounded-full blur-3xl" />
<div className="absolute top-1/2 right-1/4 w-48 h-48 bg-purple-500/5 rounded-full blur-2xl" />
<div className="relative z-10">
<div className="flex items-center gap-4 mb-4">
<div className="flex h-14 w-14 items-center justify-center rounded-2xl bg-gradient-to-br from-yellow-400/20 to-amber-600/10 border border-yellow-400/30">
<Award className="w-7 h-7 text-yellow-400" />
</div>
<div>
<Heading level={1} className="text-3xl lg:text-4xl">
Leaderboards
</Heading>
<p className="text-gray-400">Where champions rise and legends are made</p>
</div>
</div>
<p className="text-gray-400 text-lg leading-relaxed max-w-2xl mb-6">
Track the best drivers and teams across all competitions. Every race counts. Every position matters. Who will claim the throne?
</p>
{/* Quick Nav */}
<div className="flex flex-wrap gap-3">
<Button
variant="secondary"
onClick={() => router.push('/leaderboards/drivers')}
className="flex items-center gap-2"
>
<Trophy className="w-4 h-4 text-primary-blue" />
Driver Rankings
</Button>
<Button
variant="secondary"
onClick={() => router.push('/teams/leaderboard')}
className="flex items-center gap-2"
>
<Users className="w-4 h-4 text-purple-400" />
Team Rankings
</Button>
</div>
</div>
</div>
{/* Leaderboard Grids */}
<div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
<DriverLeaderboardPreview drivers={drivers} onDriverClick={handleDriverClick} />
<TeamLeaderboardPreview teams={teams} onTeamClick={handleTeamClick} />
</div>
</div>
);
return <LeaderboardsStatic />;
}