Kirubel-Kibru-Yaltopia
89440985f1
Some checks failed
Deploy to Cloudflare Workers / deploy (push) Has been cancelled
90 lines
3.0 KiB
TypeScript
90 lines
3.0 KiB
TypeScript
import Link from "next/link";
|
|
import { notFound } from "next/navigation";
|
|
import { createClient } from "@/lib/supabase/server";
|
|
import { createCompetition } from "@/actions/leagues";
|
|
import { GlassCard } from "@/components/ui/glass-card";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Input } from "@/components/ui/input";
|
|
import { Label } from "@/components/ui/label";
|
|
|
|
export default async function LeaguePage({
|
|
params,
|
|
}: {
|
|
params: Promise<{ leagueId: string }>;
|
|
}) {
|
|
const { leagueId } = await params;
|
|
const supabase = await createClient();
|
|
|
|
const { data: league } = await supabase
|
|
.from("leagues")
|
|
.select("*")
|
|
.eq("id", leagueId)
|
|
.single();
|
|
|
|
if (!league) notFound();
|
|
|
|
const { data: competitions } = await supabase
|
|
.from("competitions")
|
|
.select("*")
|
|
.eq("league_id", leagueId)
|
|
.order("created_at", { ascending: false });
|
|
|
|
return (
|
|
<div className="space-y-6">
|
|
<div className="flex items-center justify-between">
|
|
<div>
|
|
<h1 className="text-2xl font-bold">{league.name}</h1>
|
|
<p className="text-sm text-[var(--color-muted)]">{league.description}</p>
|
|
</div>
|
|
<Button variant="outline" asChild>
|
|
<Link href={`/leagues/${leagueId}/rules`}>Edit rules</Link>
|
|
</Button>
|
|
</div>
|
|
|
|
<GlassCard title="New competition">
|
|
<form
|
|
action={createCompetition.bind(null, leagueId)}
|
|
className="flex flex-wrap items-end gap-4"
|
|
>
|
|
<div>
|
|
<Label htmlFor="name">Name</Label>
|
|
<Input id="name" name="name" required className="mt-1" placeholder="Season 2025" />
|
|
</div>
|
|
<div>
|
|
<Label htmlFor="tournament_mode">Mode</Label>
|
|
<select
|
|
id="tournament_mode"
|
|
name="tournament_mode"
|
|
className="mt-1 flex h-10 rounded-lg border border-white/15 bg-white/5 px-3 text-sm"
|
|
>
|
|
<option value="league">League (round-robin)</option>
|
|
<option value="cup">Cup (knockout)</option>
|
|
</select>
|
|
</div>
|
|
<Button type="submit">Create competition</Button>
|
|
</form>
|
|
</GlassCard>
|
|
|
|
<div className="grid gap-4 sm:grid-cols-2">
|
|
{competitions?.map((c) => (
|
|
<Link key={c.id} href={`/leagues/${leagueId}/competitions/${c.id}`}>
|
|
<GlassCard className="hover:border-cyan-400/30">
|
|
<div className="flex items-center justify-between">
|
|
<div>
|
|
<h3 className="font-semibold">{c.name}</h3>
|
|
<p className="text-xs text-[var(--color-muted)] capitalize">
|
|
{c.tournament_mode} · {c.status}
|
|
</p>
|
|
</div>
|
|
<span className="rounded-full bg-white/10 px-2 py-0.5 text-xs capitalize">
|
|
{c.status}
|
|
</span>
|
|
</div>
|
|
</GlassCard>
|
|
</Link>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|