This commit is contained in:
2025-12-05 12:47:20 +01:00
parent 5a9cd28d5b
commit b6c2b4a422
7 changed files with 1093 additions and 713 deletions

View File

@@ -1,5 +1,6 @@
'use client';
import { FileText, Users, Calendar, Trophy, Award, Info } from 'lucide-react';
import Card from '@/components/ui/Card';
import type { LeagueConfigFormModel } from '@gridpilot/racing/application';
import type { LeagueScoringPresetDTO } from '@gridpilot/racing/application/ports/LeagueScoringPresetProvider';
@@ -86,13 +87,29 @@ export default function LeagueReviewSummary({ form, presets }: LeagueReviewSumma
const gameLabel = 'iRacing';
return (
<Card className="bg-iron-gray/80">
<div className="space-y-6 text-sm text-gray-200">
{/* 1. Basics & visibility */}
<section className="space-y-3">
<h3 className="text-[11px] font-semibold text-gray-400 uppercase tracking-wide">
Basics & visibility
</h3>
<div className="space-y-6">
<div className="rounded-lg bg-primary-blue/5 border border-primary-blue/20 p-4">
<div className="flex items-start gap-3">
<Info className="w-5 h-5 text-primary-blue shrink-0 mt-0.5" />
<div>
<p className="text-sm font-medium text-white mb-1">Review your league configuration</p>
<p className="text-xs text-gray-400">
Double-check all settings before creating your league. You can modify most of these later.
</p>
</div>
</div>
</div>
<Card className="bg-iron-gray/80">
<div className="space-y-6 text-sm text-gray-200">
{/* 1. Basics & visibility */}
<section className="space-y-3">
<div className="flex items-center gap-2 pb-2 border-b border-charcoal-outline/40">
<FileText className="w-4 h-4 text-primary-blue" />
<h3 className="text-sm font-semibold text-white">
Basics & visibility
</h3>
</div>
<dl className="grid grid-cols-1 gap-4 md:grid-cols-2">
<div className="space-y-1">
<dt className="text-xs text-gray-500">Name</dt>
@@ -115,11 +132,14 @@ export default function LeagueReviewSummary({ form, presets }: LeagueReviewSumma
</dl>
</section>
{/* 2. Structure & capacity */}
<section className="space-y-3">
<h3 className="text-[11px] font-semibold text-gray-400 uppercase tracking-wide">
Structure & capacity
</h3>
{/* 2. Structure & capacity */}
<section className="space-y-3">
<div className="flex items-center gap-2 pb-2 border-b border-charcoal-outline/40">
<Users className="w-4 h-4 text-primary-blue" />
<h3 className="text-sm font-semibold text-white">
Structure & capacity
</h3>
</div>
<dl className="grid grid-cols-1 gap-4 md:grid-cols-2">
<div className="space-y-1">
<dt className="text-xs text-gray-500">Mode</dt>
@@ -132,11 +152,14 @@ export default function LeagueReviewSummary({ form, presets }: LeagueReviewSumma
</dl>
</section>
{/* 3. Schedule & timings */}
<section className="space-y-3">
<h3 className="text-[11px] font-semibold text-gray-400 uppercase tracking-wide">
Schedule & timings
</h3>
{/* 3. Schedule & timings */}
<section className="space-y-3">
<div className="flex items-center gap-2 pb-2 border-b border-charcoal-outline/40">
<Calendar className="w-4 h-4 text-primary-blue" />
<h3 className="text-sm font-semibold text-white">
Schedule & timings
</h3>
</div>
<dl className="grid grid-cols-1 gap-4 md:grid-cols-2">
<div className="space-y-1">
<dt className="text-xs text-gray-500">Planned rounds</dt>
@@ -165,11 +188,14 @@ export default function LeagueReviewSummary({ form, presets }: LeagueReviewSumma
</dl>
</section>
{/* 4. Scoring & drops */}
<section className="space-y-3">
<h3 className="text-[11px] font-semibold text-gray-400 uppercase tracking-wide">
Scoring & drops
</h3>
{/* 4. Scoring & drops */}
<section className="space-y-3">
<div className="flex items-center gap-2 pb-2 border-b border-charcoal-outline/40">
<Trophy className="w-4 h-4 text-primary-blue" />
<h3 className="text-sm font-semibold text-white">
Scoring & drops
</h3>
</div>
<dl className="grid grid-cols-1 gap-4 md:grid-cols-2">
<div className="space-y-1">
<dt className="text-xs text-gray-500">Scoring pattern</dt>
@@ -192,19 +218,34 @@ export default function LeagueReviewSummary({ form, presets }: LeagueReviewSumma
</dl>
</section>
{/* 5. Championships */}
<section className="space-y-3">
<h3 className="text-[11px] font-semibold text-gray-400 uppercase tracking-wide">
Championships
</h3>
<dl className="grid grid-cols-1 gap-4">
<div className="space-y-1">
<dt className="text-xs text-gray-500">Enabled championships</dt>
<dd>{championshipsSummary}</dd>
{/* 5. Championships */}
<section className="space-y-3">
<div className="flex items-center gap-2 pb-2 border-b border-charcoal-outline/40">
<Award className="w-4 h-4 text-primary-blue" />
<h3 className="text-sm font-semibold text-white">
Championships
</h3>
</div>
</dl>
</section>
</div>
</Card>
<dl className="grid grid-cols-1 gap-4">
<div className="space-y-1">
<dt className="text-xs text-gray-500">Enabled championships</dt>
<dd className="flex flex-wrap gap-2">
{enabledChampionshipsLabels.length > 0 ? (
enabledChampionshipsLabels.map((label) => (
<span key={label} className="inline-flex items-center gap-1 rounded-full bg-primary-blue/10 px-3 py-1 text-xs font-medium text-primary-blue">
<Award className="w-3 h-3" />
{label}
</span>
))
) : (
<span className="text-gray-400">None enabled yet</span>
)}
</dd>
</div>
</dl>
</section>
</div>
</Card>
</div>
);
}