valknarandClaude Sonnet 5
401b9b5033
Recordings were just a thin named pointer over an already-captured session's events, so the whole separate feature (recordings table, API routes, pages, UI) is gone: any completed session can now be named and replayed directly. Replaying no longer creates a session or duplicates events of its own - it just bumps the source session's playCount/lastPlayedAt. Also renames play_sessions/playSession(s) to sessions/session(s) throughout the schema, queries, API routes, and UI for consistency, and updates the README to match the new flow. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
78 lines
3.2 KiB
TypeScript
78 lines
3.2 KiB
TypeScript
import Link from "next/link";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
|
import { BrandMark } from "@/components/layout/BrandMark";
|
|
import { listSessions } from "@/lib/db/queries/sessions";
|
|
import { getSessionsSummary } from "@/lib/db/queries/stats";
|
|
|
|
// Always reflects live DB state for an authenticated, single-tenant app -
|
|
// never worth prerendering (and the DB file doesn't exist at build time).
|
|
export const dynamic = "force-dynamic";
|
|
|
|
export default async function DashboardPage() {
|
|
const [sessions, summary] = await Promise.all([listSessions(), getSessionsSummary()]);
|
|
|
|
const recentSessions = [...sessions].reverse().slice(0, 5);
|
|
|
|
return (
|
|
<div className="flex flex-col gap-8">
|
|
<Card className="bp-glass overflow-hidden">
|
|
<CardContent className="flex flex-col items-start gap-4 py-8">
|
|
<BrandMark size={48} animated className="rounded-[9px]" />
|
|
<h1 className="font-heading text-3xl font-semibold">Welcome back</h1>
|
|
<p className="max-w-xl text-sm text-muted-foreground">
|
|
Scan for nearby devices, take control, and replay completed sessions later - all running
|
|
directly from your browser over Web Bluetooth.
|
|
</p>
|
|
<Button asChild size="lg">
|
|
<Link href="/control">Start a session</Link>
|
|
</Button>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<div className="grid gap-4 sm:grid-cols-3">
|
|
<Card className="bp-glass">
|
|
<CardHeader>
|
|
<CardTitle className="text-sm text-muted-foreground">Completed sessions</CardTitle>
|
|
</CardHeader>
|
|
<CardContent className="bp-readout text-3xl">{summary.count}</CardContent>
|
|
</Card>
|
|
<Card className="bp-glass">
|
|
<CardHeader>
|
|
<CardTitle className="text-sm text-muted-foreground">Total play time</CardTitle>
|
|
</CardHeader>
|
|
<CardContent className="bp-readout text-3xl">
|
|
{(summary.totalDurationMs / 3_600_000).toFixed(1)}h
|
|
</CardContent>
|
|
</Card>
|
|
<Card className="bp-glass">
|
|
<CardHeader>
|
|
<CardTitle className="text-sm text-muted-foreground">Replays</CardTitle>
|
|
</CardHeader>
|
|
<CardContent className="bp-readout text-3xl">{summary.totalReplays}</CardContent>
|
|
</Card>
|
|
</div>
|
|
|
|
<Card className="bp-glass">
|
|
<CardHeader>
|
|
<CardTitle>Recent sessions</CardTitle>
|
|
</CardHeader>
|
|
<CardContent className="flex flex-col">
|
|
{recentSessions.length === 0 && <p className="text-sm text-muted-foreground">No sessions yet.</p>}
|
|
{recentSessions.map((s, i) => (
|
|
<Link key={s.id} href={`/sessions/${s.id}`} className="group">
|
|
{i > 0 && <div className="bp-hairline" />}
|
|
<div className="flex items-center justify-between px-1 py-2 text-sm">
|
|
<span className="group-hover:text-primary">{s.name ?? `Session #${s.id}`}</span>
|
|
<span className="bp-readout text-xs text-muted-foreground">
|
|
{new Date(s.startedAt).toLocaleDateString()}
|
|
</span>
|
|
</div>
|
|
</Link>
|
|
))}
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
);
|
|
}
|