Toggle group on runs

This commit is contained in:
2026-02-06 17:42:04 +01:00
parent b525ac542d
commit cea3d4a473
+9 -7
View File
@@ -18,6 +18,7 @@ import LiveRunRow from "./components/LiveRunNow";
import StatCard from "@/components/app/StatCard"; import StatCard from "@/components/app/StatCard";
import useAction from "@/hook/use-action"; import useAction from "@/hook/use-action";
import { getLiveRuns } from "@/modules/live-run/actions"; import { getLiveRuns } from "@/modules/live-run/actions";
import { ToggleGroup, ToggleGroupItem } from "@/components/ui/toggle-group";
export default function LiveRuns() { export default function LiveRuns() {
const [liveRuns, liveRunsLoaded, liveRunsError] = useAction(getLiveRuns); const [liveRuns, liveRunsLoaded, liveRunsError] = useAction(getLiveRuns);
@@ -55,13 +56,14 @@ export default function LiveRuns() {
{/* Filters */} {/* Filters */}
<div className="flex flex-wrap gap-2"> <div className="flex flex-wrap gap-2">
{["Any%", "100%", "Easy", "Hard"].map((cat) => ( <ToggleGroup variant="outline" type="single" defaultValue="any">
<Badge key={cat} variant="outline" className="cursor-pointer"> <ToggleGroupItem value="any" aria-label="any%">
{cat} any%
</Badge> </ToggleGroupItem>
))} <ToggleGroupItem value="100" aria-label="100%">
100%
<Badge className="bg-primary/10 text-primary">🔥 PB Pace</Badge> </ToggleGroupItem>
</ToggleGroup>
</div> </div>
{/* Table */} {/* Table */}