remaned now to row

2026-02-07 14:43:45 +01:00
parent 6afe977066
commit f930f0bca1
2 changed files with 1 additions and 1 deletions
@@ -0,0 +1,86 @@
+"use client";
+
+import { Eye } from "lucide-react";
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import { TableRow, TableCell } from "@/components/ui/table";
+import { cn } from "@/lib/utils";
+import { LiveRun } from "@/modules/live-run/types";
+import formatTime from "@/lib/time-format";
+
+export default function LiveRunRow({
+  index,
+  run,
+}: {
+  index: number;
+  run: LiveRun;
+}) {
+  const now = new Date().getTime() + 1000;
+  const isTop = false;
+
+  return (
+    <TableRow
+      className={cn(
+        "opacity-0 animate-fade-in",
+        isTop ? "bg-primary/5 hover:bg-primary/10" : "hover:bg-secondary/50",
+      )}
+      style={{
+        animationDelay: `${index * 0.05}s`,
+        animationFillMode: "forwards",
+      }}
+    >
+      <TableCell className="font-medium pl-5">
+        {isTop ? `🔥 ${run.username}` : run.username}
+      </TableCell>
+
+      <TableCell>
+        <div className="flex flex-col gap-1">
+          <span>{run.problem}</span>
+          <Badge variant="outline" className="w-fit text-xs">
+            {run.category}
+          </Badge>
+        </div>
+      </TableCell>
+
+      <TableCell
+        className={`font-mono ${isTop ? "text-primary font-bold" : ""}`}
+      >
+        {formatTime(now - run.start, false)}
+      </TableCell>
+
+      <TableCell>
+        <Badge
+          className={
+            false
+              ? "bg-red-500/10 text-red-400"
+              : "bg-green-500/10 text-green-400"
+          }
+        >
+          0
+        </Badge>
+      </TableCell>
+
+      <TableCell>
+        <div className="flex items-center gap-2 text-sm">
+          <span
+            className={`h-2 w-2 rounded-full ${
+              status === "pb"
+                ? "bg-green-500"
+                : status === "danger"
+                  ? "bg-red-500"
+                  : "bg-emerald-400"
+            }`}
+          />
+          Live
+        </div>
+      </TableCell>
+
+      <TableCell className="text-right pr-5">
+        <Button size="sm" variant={isTop ? "default" : "ghost"}>
+          <Eye className="h-4 w-4 mr-1" />
+          Watch
+        </Button>
+      </TableCell>
+    </TableRow>
+  );
+}