Initial commit

2026-05-19 22:20:29 +02:00
commit 0fbe856dce
173 changed files with 38316 additions and 0 deletions
@@ -0,0 +1,145 @@
+"use client";
+
+import { useState } from "react";
+import { useRouter } from "next/navigation";
+import { ExternalLink, Copy, Check, Trash2, Clock } from "lucide-react";
+import { Button } from "@/components/ui/button";
+import { useToast } from "@/components/ui/use-toast";
+import { cn, formatRelativeDate } from "@/lib/utils";
+
+interface ReviewSession {
+  id: string;
+  token: string;
+  label: string | null;
+  email: string | null;
+  expiresAt: Date | string | null;
+  accessCount: number;
+  isActive: boolean;
+  project: { name: string };
+}
+
+interface ReviewSessionListProps {
+  sessions: ReviewSession[];
+}
+
+const APP_URL = process.env.NEXT_PUBLIC_APP_URL ?? "";
+
+export function ReviewSessionList({ sessions }: ReviewSessionListProps) {
+  const [copiedId, setCopiedId] = useState<string | null>(null);
+  const [deletingId, setDeletingId] = useState<string | null>(null);
+  const { toast } = useToast();
+  const router = useRouter();
+
+  const handleCopy = async (token: string, id: string) => {
+    const url = `${APP_URL}/client/${token}`;
+    await navigator.clipboard.writeText(url);
+    setCopiedId(id);
+    setTimeout(() => setCopiedId(null), 2000);
+  };
+
+  const handleDeactivate = async (id: string) => {
+    setDeletingId(id);
+    try {
+      const res = await fetch(`/api/review-sessions?id=${id}`, { method: "DELETE" });
+      if (!res.ok) throw new Error();
+      toast({ title: "Review link deactivated" });
+      router.refresh();
+    } catch {
+      toast({ title: "Failed to deactivate link", variant: "destructive" });
+    } finally {
+      setDeletingId(null);
+    }
+  };
+
+  if (sessions.length === 0) return null;
+
+  return (
+    <div>
+      <h2 className="text-base font-semibold text-white mb-3">
+        Active Review Links ({sessions.length})
+      </h2>
+      <div className="space-y-2">
+        {sessions.map((session) => {
+          const portalUrl = `${APP_URL}/client/${session.token}`;
+          const expired =
+            session.expiresAt && new Date(session.expiresAt) < new Date();
+
+          return (
+            <div
+              key={session.id}
+              className={cn(
+                "flex items-center gap-4 p-4 rounded-xl border transition-all",
+                expired
+                  ? "border-zinc-800 bg-zinc-900/50 opacity-60"
+                  : "border-zinc-800 bg-zinc-900"
+              )}
+            >
+              <div className="flex-1 min-w-0">
+                <div className="flex items-center gap-2">
+                  <p className="font-medium text-white text-sm">{session.label || "Untitled Review"}</p>
+                  {expired && (
+                    <span className="text-xs px-1.5 py-0.5 rounded bg-red-500/10 text-red-400">
+                      Expired
+                    </span>
+                  )}
+                </div>
+                <div className="flex items-center gap-3 mt-1">
+                  <span className="text-xs text-zinc-500">{session.project.name}</span>
+                  {session.email && (
+                    <>
+                      <span className="text-zinc-700">·</span>
+                      <span className="text-xs text-zinc-500">{session.email}</span>
+                    </>
+                  )}
+                  {session.expiresAt && (
+                    <>
+                      <span className="text-zinc-700">·</span>
+                      <span className="text-xs text-zinc-500 flex items-center gap-1">
+                        <Clock className="h-3 w-3" />
+                        {expired ? "Expired" : `Expires ${formatRelativeDate(session.expiresAt)}`}
+                      </span>
+                    </>
+                  )}
+                </div>
+                <p className="font-mono text-xs text-zinc-600 truncate mt-1">{portalUrl}</p>
+              </div>
+
+              <div className="flex items-center gap-1.5 shrink-0">
+                <span className="text-xs text-zinc-500 mr-2">
+                  {session.accessCount} view{session.accessCount !== 1 ? "s" : ""}
+                </span>
+                <Button
+                  size="sm"
+                  variant="outline"
+                  className="h-7 px-2.5 gap-1.5"
+                  onClick={() => handleCopy(session.token, session.id)}
+                >
+                  {copiedId === session.id ? (
+                    <Check className="h-3.5 w-3.5 text-emerald-400" />
+                  ) : (
+                    <Copy className="h-3.5 w-3.5" />
+                  )}
+                  {copiedId === session.id ? "Copied" : "Copy"}
+                </Button>
+                <a href={portalUrl} target="_blank" rel="noopener noreferrer">
+                  <Button size="sm" variant="outline" className="h-7 px-2">
+                    <ExternalLink className="h-3.5 w-3.5" />
+                  </Button>
+                </a>
+                <Button
+                  size="sm"
+                  variant="outline"
+                  className="h-7 px-2 text-red-400 hover:bg-red-500/10 border-red-500/20"
+                  onClick={() => handleDeactivate(session.id)}
+                  disabled={deletingId === session.id}
+                >
+                  <Trash2 className="h-3.5 w-3.5" />
+                </Button>
+              </div>
+            </div>
+          );
+        })}
+      </div>
+    </div>
+  );
+}