Add delete button to design approvals page

Allow admins to delete individual design submissions to clean up test data.
Includes confirmation dialog and reloads page on successful deletion.

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>

src/app/admin/designs/page.tsx

@@ -1,6 +1,7 @@
 import Link from 'next/link';
 import { prisma } from '@/lib/prisma';
 import AdminNav from '@/components/AdminNav';
+import DeleteDesignButton from '@/components/DeleteDesignButton';
 
 export default async function DesignsPage() {
   let designs = [];
@@ -50,10 +51,10 @@ export default async function DesignsPage() {
           {items.map((d) => {
             const last = d.messages[0];
             return (
+              <div key={d.id} className="flex items-center gap-4 py-4 hover:bg-surface">
                 <Link
-                key={d.id}
                   href={`/admin/designs/${d.id}`}
-                className="flex items-center gap-4 py-4 hover:bg-surface"
+                  className="flex-1 flex items-center gap-4"
                 >
                   <img
                     src={d.designPreviewUrl}
@@ -75,6 +76,8 @@ export default async function DesignsPage() {
                   </div>
                   <span className="tag-label">{d.product.name}</span>
                 </Link>
+                <DeleteDesignButton designId={d.id} />
+              </div>
             );
           })}
         </div>

src/components/DeleteDesignButton.tsx

@@ -0,0 +1,39 @@
+'use client';
+
+import { useState } from 'react';
+
+export default function DeleteDesignButton({ designId }: { designId: string }) {
+  const [deleting, setDeleting] = useState(false);
+
+  const handleDelete = async (e: React.MouseEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+
+    if (!confirm('Delete this design? This cannot be undone.')) return;
+
+    setDeleting(true);
+    try {
+      const res = await fetch(`/api/designs/${designId}`, { method: 'DELETE' });
+      if (res.ok) {
+        window.location.reload();
+      } else {
+        alert('Failed to delete design');
+        setDeleting(false);
+      }
+    } catch (err) {
+      console.error('Error deleting design:', err);
+      alert('Error deleting design');
+      setDeleting(false);
+    }
+  };
+
+  return (
+    <button
+      onClick={handleDelete}
+      disabled={deleting}
+      className="border border-line px-3 py-2 text-sm text-muted hover:border-ink hover:text-ink disabled:opacity-50"
+    >
+      {deleting ? 'Deleting…' : 'Delete'}
+    </button>
+  );
+}