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

website refactor

Browse Source
This commit is contained in:
Marc Mintel
2026-01-20 21:35:50 +01:00
parent 06207bf835
commit 51288234f4
42 changed files with 892 additions and 449 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
apps/website/templates/TeamLeaderboardTemplate.tsx
View File

@@ -11,7 +11,8 @@ import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@
import { Text } from '@/ui/Text';
import { Panel } from '@/ui/Panel';
import { Section } from '@/ui/Section';
import { Award, ChevronLeft } from 'lucide-react';
import { Select } from '@/ui/Select';
import { Award, ChevronLeft, Users } from 'lucide-react';
import React from 'react';
interface TeamLeaderboardTemplateProps {
@@ -26,13 +27,30 @@ interface TeamLeaderboardTemplateProps {
export function TeamLeaderboardTemplate({
viewData,
onSearchChange,
filterLevelChange,
onSortChange,
onTeamClick,
onBackToTeams,
}: TeamLeaderboardTemplateProps) {
const { searchQuery, filteredAndSortedTeams } = viewData;
const { searchQuery, filterLevel, sortBy, filteredAndSortedTeams } = viewData;
const levelOptions = [
{ value: 'all', label: 'All Levels' },
{ value: 'pro', label: 'Professional' },
{ value: 'advanced', label: 'Advanced' },
{ value: 'intermediate', label: 'Intermediate' },
{ value: 'beginner', label: 'Beginner' },
];
const sortOptions = [
{ value: 'rating', label: 'Rating' },
{ value: 'wins', label: 'Wins' },
{ value: 'winRate', label: 'Win Rate' },
{ value: 'races', label: 'Races' },
];
return (
<Container size="lg" py={12}>
<Section variant="default" padding="lg">
<Group direction="column" gap={8} fullWidth>
{/* Header */}
<Group direction="row" align="center" justify="between" fullWidth>
@@ -41,28 +59,44 @@ export function TeamLeaderboardTemplate({
Back
</Button>
<Group direction="column">
<Heading level={1} weight="bold">Global Standings</Heading>
<Text variant="low" size="sm" font="mono" uppercase letterSpacing="widest">Team Performance Index</Text>
<Heading level={1} weight="bold">Team Standings</Heading>
<Text variant="low" size="sm" font="mono" uppercase letterSpacing="widest">Global Performance Index</Text>
</Group>
</Group>
<Icon icon={Award} size={8} color="var(--ui-color-intent-warning)" />
<Icon icon={Award} size={8} intent="warning" />
</Group>
<LeaderboardFiltersBar
searchQuery={searchQuery}
onSearchChange={onSearchChange}
placeholder="Search teams..."
/>
>
<Group gap={4}>
<Select
size="sm"
value={filterLevel}
options={levelOptions}
onChange={(e) => filterLevelChange(e.target.value as SkillLevel | 'all')}
/>
<Select
size="sm"
value={sortBy}
options={sortOptions}
onChange={(e) => onSortChange(e.target.value as SortBy)}
/>
</Group>
</LeaderboardFiltersBar>
<Panel variant="dark" padding={0}>
<Panel variant="dark" padding="none">
<Table>
<TableHead>
<TableRow>
<TableHeader w="20">Rank</TableHeader>
<TableHeader>Team</TableHeader>
<TableHeader textAlign="center">Personnel</TableHeader>
<TableHeader textAlign="center">Races</TableHeader>
<TableHeader textAlign="right">Rating</TableHeader>
<TableCell w="80px">Rank</TableCell>
<TableCell>Team</TableCell>
<TableCell textAlign="center">Personnel</TableCell>
<TableCell textAlign="center">Races</TableCell>
<TableCell textAlign="center">Wins</TableCell>
<TableCell textAlign="right">Rating</TableCell>
</TableRow>
</TableHead>
<TableBody>
@@ -80,10 +114,13 @@ export function TeamLeaderboardTemplate({
</TableCell>
<TableCell>
<Group direction="row" align="center" gap={3}>
<Panel variant="muted" padding={2}>
<Text size="xs" weight="bold" color="text-primary-accent">{team.name.substring(0, 2).toUpperCase()}</Text>
<Panel variant="muted" padding="sm">
<Icon icon={Users} size={4} intent="low" />
</Panel>
<Text weight="bold" size="sm">{team.name}</Text>
<Group direction="column" gap={0}>
<Text weight="bold" size="sm">{team.name}</Text>
<Text size="xs" variant="low" uppercase font="mono">{team.performanceLevel}</Text>
</Group>
</Group>
</TableCell>
<TableCell textAlign="center">
@@ -92,14 +129,19 @@ export function TeamLeaderboardTemplate({
<TableCell textAlign="center">
<Text size="xs" variant="low" font="mono">{team.totalRaces}</Text>
</TableCell>
<TableCell textAlign="center">
<Text size="xs" variant="low" font="mono">{team.totalWins}</Text>
</TableCell>
<TableCell textAlign="right">
<Text font="mono" weight="bold" color="text-primary-accent">1450</Text>
<Text font="mono" weight="bold" variant="primary">
{team.rating?.toFixed(0) || '1000'}
</Text>
</TableCell>
</TableRow>
))
) : (
<TableRow>
<TableCell colSpan={5} textAlign="center">
<TableCell colSpan={6} textAlign="center">
<Section variant="dark" padding="lg">
<Group align="center" justify="center" fullWidth>
<Text variant="low" font="mono" size="xs" uppercase letterSpacing="widest">
@@ -114,6 +156,6 @@ export function TeamLeaderboardTemplate({
</Table>
</Panel>
</Group>
</Container>
</Section>
);
}