Toggle group on runs
This commit is contained in:
@@ -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 */}
|
||||||
|
|||||||
Reference in New Issue
Block a user