fix(boards): Cascade board deletion

Delete board-owned tasks, agents, and activity events before\nremoving the board. Adds board edit page with gateway settings\nand edit/delete actions in the boards table.\n\nCo-Authored-By: Claude <noreply@anthropic.com>

frontend/src/app/boards/page.tsx

@@ -15,6 +15,14 @@ import {
 import { DashboardSidebar } from "@/components/organisms/DashboardSidebar";
 import { DashboardShell } from "@/components/templates/DashboardShell";
 import { Button } from "@/components/ui/button";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
 
 type Board = {
   id: string;
@@ -32,6 +40,9 @@ export default function BoardsPage() {
   const [boards, setBoards] = useState<Board[]>([]);
   const [isLoading, setIsLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
+  const [deleteTarget, setDeleteTarget] = useState<Board | null>(null);
+  const [isDeleting, setIsDeleting] = useState(false);
+  const [deleteError, setDeleteError] = useState<string | null>(null);
 
   const sortedBoards = useMemo(
     () => [...boards].sort((a, b) => a.name.localeCompare(b.name)),
@@ -66,6 +77,30 @@ export default function BoardsPage() {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isSignedIn]);
 
+  const handleDelete = async () => {
+    if (!deleteTarget || !isSignedIn) return;
+    setIsDeleting(true);
+    setDeleteError(null);
+    try {
+      const token = await getToken();
+      const response = await fetch(`${apiBase}/api/v1/boards/${deleteTarget.id}`, {
+        method: "DELETE",
+        headers: {
+          Authorization: token ? `Bearer ${token}` : "",
+        },
+      });
+      if (!response.ok) {
+        throw new Error("Unable to delete board.");
+      }
+      setBoards((prev) => prev.filter((board) => board.id !== deleteTarget.id));
+      setDeleteTarget(null);
+    } catch (err) {
+      setDeleteError(err instanceof Error ? err.message : "Something went wrong.");
+    } finally {
+      setIsDeleting(false);
+    }
+  };
+
   const columns = useMemo<ColumnDef<Board>[]>(
     () => [
       {
@@ -83,7 +118,7 @@ export default function BoardsPage() {
         header: "",
         cell: ({ row }) => (
           <div
-            className="flex items-center justify-end"
+            className="flex items-center justify-end gap-2"
             onClick={(event) => event.stopPropagation()}
           >
             <Link
@@ -92,6 +127,19 @@ export default function BoardsPage() {
             >
               Open
             </Link>
+            <Link
+              href={`/boards/${row.original.id}/edit`}
+              className="inline-flex h-8 items-center justify-center rounded-lg border border-[color:var(--border)] px-3 text-xs font-medium text-muted transition hover:border-[color:var(--accent)] hover:text-[color:var(--accent)]"
+            >
+              Edit
+            </Link>
+            <Button
+              variant="outline"
+              size="sm"
+              onClick={() => setDeleteTarget(row.original)}
+            >
+              Delete
+            </Button>
           </div>
         ),
       },
@@ -190,6 +238,38 @@ export default function BoardsPage() {
           )}
         </div>
       </SignedIn>
+
+      <Dialog
+        open={!!deleteTarget}
+        onOpenChange={(nextOpen) => {
+          if (!nextOpen) {
+            setDeleteTarget(null);
+            setDeleteError(null);
+          }
+        }}
+      >
+        <DialogContent aria-label="Delete board">
+          <DialogHeader>
+            <DialogTitle>Delete board</DialogTitle>
+            <DialogDescription>
+              This will remove {deleteTarget?.name}. This action cannot be undone.
+            </DialogDescription>
+          </DialogHeader>
+          {deleteError ? (
+            <div className="rounded-lg border border-[color:var(--border)] bg-[color:var(--surface-muted)] p-3 text-xs text-muted">
+              {deleteError}
+            </div>
+          ) : null}
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setDeleteTarget(null)}>
+              Cancel
+            </Button>
+            <Button onClick={handleDelete} disabled={isDeleting}>
+              {isDeleting ? "Deleting…" : "Delete"}
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
     </DashboardShell>
   );
 }