From 4b0f2a7b275c3b493f3e328babafcedc328a5bcf Mon Sep 17 00:00:00 2001
From: olliethedev <5933733+olliethedev@users.noreply.github.com>
Date: Wed, 19 Aug 2026 22:16:59 +0000
Subject: [PATCH 1/3] feat(kanban): complete phase-2 primitive sweep

---
 docs/content/docs/plugins/kanban.mdx          |  79 +++
 e2e/tests/smoke.kanban.spec.ts                |  70 ++-
 packages/stack/registry/btst-kanban.json      |  36 +-
 .../src/__tests__/kanban-query-keys.test.ts   |  51 ++
 .../src/__tests__/resource-factory.test.tsx   |   2 +
 .../src/plugins/client/resource/internal.ts   |   4 +-
 .../kanban/__tests__/client-sweep.test.tsx    | 259 +++++++++
 .../client/components/forms/board-form.tsx    | 131 +++--
 .../client/components/forms/column-form.tsx   | 103 ++--
 .../client/components/forms/task-form.tsx     | 387 ++++++++-----
 .../client/components/pages/404-page.tsx      |  21 +-
 .../components/pages/board-page.internal.tsx  | 277 +++++++---
 .../client/components/pages/board-page.tsx    |   5 +
 .../pages/boards-list-page.internal.tsx       |  62 ++-
 .../components/pages/boards-list-page.tsx     |   1 +
 .../pages/new-board-page.internal.tsx         |  30 +-
 .../components/pages/new-board-page.tsx       |   1 +
 .../components/shared/column-content.tsx      |  92 +++-
 .../components/shared/default-error.tsx       |  17 +-
 .../client/components/shared/kanban-board.tsx |   9 +
 .../client/components/shared/task-card.tsx    |  50 +-
 .../client/components/shared/user-avatar.tsx  |  14 +-
 .../src/plugins/kanban/client/hooks/index.tsx |   3 +
 .../kanban/client/hooks/kanban-hooks.tsx      | 511 +++---------------
 .../kanban/client/hooks/kanban-resource.ts    |  13 +
 .../client/localization/kanban-common.ts      |  24 +
 .../client/localization/kanban-forms.ts       |  11 +
 .../kanban/client/localization/kanban-list.ts |  25 +
 .../stack/src/plugins/kanban/query-keys.ts    | 382 ++++++++-----
 29 files changed, 1716 insertions(+), 954 deletions(-)
 create mode 100644 packages/stack/src/__tests__/kanban-query-keys.test.ts
 create mode 100644 packages/stack/src/plugins/kanban/__tests__/client-sweep.test.tsx
 create mode 100644 packages/stack/src/plugins/kanban/client/hooks/kanban-resource.ts

diff --git a/docs/content/docs/plugins/kanban.mdx b/docs/content/docs/plugins/kanban.mdx
index f531db82..0244021a 100644
--- a/docs/content/docs/plugins/kanban.mdx
+++ b/docs/content/docs/plugins/kanban.mdx
@@ -311,6 +311,39 @@ The kanban plugin automatically creates the following pages (mounted at your con
 - `/kanban/new` - Create new board page
 - `/kanban/:boardId` - Board detail page with kanban view
 
+### Client permissions
+
+Pass an [`auth` provider](/auth) to `StackProvider` to gate Kanban routes and controls. Without an auth provider (or without `auth.can`), every check is allowed, preserving the default behavior.
+
+| UI | Resource | Action | Params |
+|---|---|---|---|
+| Boards route | `kanban:board` | `read` | — |
+| New board route and buttons | `kanban:board` | `create` | — |
+| Board route | `kanban:board` | `read` | `{ id: boardId }` |
+| Edit/delete board | `kanban:board` | `update` / `delete` | `{ id: boardId }` |
+| Create column | `kanban:column` | `create` | `{ boardId }` |
+| Edit/delete column | `kanban:column` | `update` / `delete` | `{ id, boardId }` |
+| Create task | `kanban:task` | `create` | `{ boardId, columnId }` |
+| Edit/delete task | `kanban:task` | `update` / `delete` | `{ id, boardId, columnId }` |
+| Drag columns/tasks | `kanban:column` / `kanban:task` | `update` | `{ boardId }` |
+
+Denied task cards stay visible, but cannot be opened for editing. A denied board-level update check disables the corresponding drag handle.
+
+```tsx title="app/pages/[[...all]]/layout.tsx"
+<StackProvider
+  auth={{
+    getIdentity: () => getCurrentUser(),
+    can: async ({ resource, action, params, identity }) => {
+      if (!identity) return false
+      return authorizeKanban({ resource, action, params, userId: identity.id })
+    },
+  }}
+  // ...router and overrides
+>
+  {children}
+</StackProvider>
+```
+
 ### Page Component Overrides
 
 You can replace any built-in page with your own React component using the optional `pageComponents` field in `kanbanClientPlugin(config)`. The built-in component is used as the fallback whenever an override is not provided. Overrides for parameterized routes receive the route context (`{ params }`) as props.
@@ -486,6 +519,26 @@ When a task has an assignee:
 
 When no assignee is set, the task card shows "Unassigned" with a placeholder icon.
 
+<Callout type="info">
+`useResolveUser` and `useSearchUsers` intentionally remain callback-backed hooks. Assignees come from your application's user directory rather than a Kanban HTTP endpoint, so these hooks do not use the resource factory's HTTP-backed `useSelect` helper.
+</Callout>
+
+## Localization
+
+All built-in Kanban component copy is routed through the `i18n` provider on `StackProvider`. Translation keys use the `kanban.*` namespace, for example `kanban.list.kanbanBoards`, `kanban.forms.createTask`, and `kanban.common.unassigned`.
+
+```tsx
+<StackProvider
+  i18n={{
+    translate: (key, defaultValue, params) =>
+      i18next.t(key, { defaultValue, ...params }),
+  }}
+  // ...
+/>
+```
+
+The existing camel-case `overrides.kanban.localization` fields remain supported and take precedence over `i18n`, so current consumers can migrate incrementally.
+
 ## API Reference
 
 ### Backend (`@btst/stack/plugins/kanban/api`)
@@ -730,8 +783,11 @@ Import hooks from `@btst/stack/plugins/kanban/client/hooks` to use in your compo
 import { 
   useBoards,
   useBoard,
+  useBoardForm,
   useBoardMutations,
+  useColumnForm,
   useColumnMutations,
+  useTaskForm,
   useTaskMutations,
   useResolveUser,
   useSearchUsers,
@@ -752,6 +808,29 @@ const { createColumn, updateColumn, deleteColumn } = useColumnMutations()
 // Task mutations (includes assigneeId support)
 const { createTask, updateTask, deleteTask, moveTask } = useTaskMutations()
 
+// Resource form lifecycles choose create/update, await cache invalidation,
+// and expose normalized server validation issues through fieldErrors.
+const boardForm = useBoardForm({
+  action: board ? "edit" : "create",
+  record: board ?? null,
+  toCreateVars: (values) => values,
+  toUpdateVars: (values) => ({ id: board.id, data: values }),
+})
+
+const columnForm = useColumnForm({
+  action: column ? "edit" : "create",
+  record: column ?? null,
+  toCreateVars: (values) => ({ ...values, boardId }),
+  toUpdateVars: (values) => ({ id: column.id, data: values }),
+})
+
+const taskForm = useTaskForm({
+  action: task ? "edit" : "create",
+  record: task ?? null,
+  toCreateVars: (values) => values,
+  toUpdateVars: (values) => ({ id: task.id, data: values }),
+})
+
 // Resolve user info (with caching)
 const { data: user, isLoading } = useResolveUser(assigneeId)
 
diff --git a/e2e/tests/smoke.kanban.spec.ts b/e2e/tests/smoke.kanban.spec.ts
index 9d489b38..86b6fe23 100644
--- a/e2e/tests/smoke.kanban.spec.ts
+++ b/e2e/tests/smoke.kanban.spec.ts
@@ -69,32 +69,11 @@ test("create task in column", async ({ page, request }) => {
 	await page.goto(`/pages/kanban/${board.id}`, { waitUntil: "networkidle" });
 	await expect(page.locator('[data-testid="board-page"]')).toBeVisible();
 
-	// Find the "To Do" column and click "Add Task" button within it
-	// The "Add Task" button should be in the column dropdown menu or as a direct action
+	// Find the "To Do" column and click its direct "Add Task" action.
 	const toDoColumn = page.locator('[data-slot="kanban-column"]').first();
 	await expect(toDoColumn).toBeVisible();
 
-	// Click the column options and select "Add Task"
-	const columnMenuButton = toDoColumn
-		.locator("button")
-		.filter({ has: page.locator("svg") })
-		.first();
-	await columnMenuButton.click();
-
-	// Look for Add Task in menu or click directly if there's an add button
-	const addTaskButton = page.getByRole("menuitem", { name: /add task/i });
-	const addTaskVisible = await addTaskButton.isVisible().catch(() => false);
-
-	if (addTaskVisible) {
-		await addTaskButton.click();
-	} else {
-		// Close the menu and look for an alternative add task button
-		await page.keyboard.press("Escape");
-		const directAddButton = toDoColumn.getByRole("button", {
-			name: /add task/i,
-		});
-		await directAddButton.click();
-	}
+	await toDoColumn.getByRole("button", { name: /add task/i }).click();
 
 	// Wait for the task form dialog to appear
 	const dialog = page.locator('div[role="dialog"][data-slot="dialog-content"]');
@@ -184,6 +163,51 @@ test("edit task", async ({ page, request }) => {
 	expect(errors, `Console errors detected: \n${errors.join("\n")}`).toEqual([]);
 });
 
+test("edit task into another column", async ({ page, request }) => {
+	const errors: string[] = [];
+	page.on("console", (msg) => {
+		if (msg.type() === "error") errors.push(msg.text());
+	});
+
+	const board = await createBoard(request, {
+		name: "Move Task Test Board",
+		description: "Board for moving a task through the edit form",
+	});
+	const sourceColumn = board.columns[0];
+	const targetColumn = board.columns[1];
+
+	await createTask(request, {
+		title: "Task to Move in Form",
+		priority: "MEDIUM",
+		columnId: sourceColumn.id,
+	});
+
+	await page.goto(`/pages/kanban/${board.id}`, { waitUntil: "networkidle" });
+	await expect(page.locator('[data-testid="board-page"]')).toBeVisible();
+	await page.getByText("Task to Move in Form").click();
+
+	const dialog = page.locator('div[role="dialog"][data-slot="dialog-content"]');
+	await expect(dialog).toBeVisible({ timeout: 5000 });
+
+	// Priority is the first select and Column is the second.
+	await dialog.locator('[data-slot="select-trigger"]').nth(1).click();
+	await page
+		.getByRole("option", { name: targetColumn.title, exact: true })
+		.click();
+	await page.getByRole("button", { name: /update task/i }).click();
+
+	await expect(dialog).not.toBeVisible({ timeout: 5000 });
+	const columns = page.locator('[data-slot="kanban-column"]');
+	await expect(
+		columns.nth(1).getByText("Task to Move in Form", { exact: true }),
+	).toBeVisible({ timeout: 5000 });
+	await expect(
+		columns.nth(0).getByText("Task to Move in Form", { exact: true }),
+	).toHaveCount(0);
+
+	expect(errors, `Console errors detected: \n${errors.join("\n")}`).toEqual([]);
+});
+
 test("delete task", async ({ page, request }) => {
 	const errors: string[] = [];
 	page.on("console", (msg) => {
diff --git a/packages/stack/registry/btst-kanban.json b/packages/stack/registry/btst-kanban.json
index fa67c9ec..68916588 100644
--- a/packages/stack/registry/btst-kanban.json
+++ b/packages/stack/registry/btst-kanban.json
@@ -49,19 +49,19 @@
     {
       "path": "btst/kanban/client/components/forms/board-form.tsx",
       "type": "registry:component",
-      "content": "\"use client\";\n\nimport { useState } from \"react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Textarea } from \"@/components/ui/textarea\";\nimport { Label } from \"@/components/ui/label\";\nimport { useBoardMutations } from \"@btst/stack/plugins/kanban/client/hooks\";\nimport type { SerializedBoard } from \"../../../types\";\n\ninterface BoardFormProps {\n\tboard?: SerializedBoard;\n\tonClose: () => void;\n\tonSuccess: (boardId: string) => void;\n}\n\nexport function BoardForm({ board, onClose, onSuccess }: BoardFormProps) {\n\tconst isEditing = !!board;\n\tconst { createBoard, updateBoard, isCreating, isUpdating } =\n\t\tuseBoardMutations();\n\n\tconst [name, setName] = useState(board?.name || \"\");\n\tconst [description, setDescription] = useState(board?.description || \"\");\n\tconst [error, setError] = useState<string | null>(null);\n\n\tconst isPending = isCreating || isUpdating;\n\n\tconst handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {\n\t\te.preventDefault();\n\t\tsetError(null);\n\n\t\tif (!name.trim()) {\n\t\t\tsetError(\"Name is required\");\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tif (isEditing && board) {\n\t\t\t\tawait updateBoard(board.id, { name, description });\n\t\t\t\tonSuccess(board.id);\n\t\t\t} else {\n\t\t\t\tconst newBoard = await createBoard({ name, description });\n\t\t\t\tif (newBoard?.id) {\n\t\t\t\t\tonSuccess(newBoard.id);\n\t\t\t\t}\n\t\t\t}\n\t\t} catch (err) {\n\t\t\tsetError(err instanceof Error ? err.message : \"An error occurred\");\n\t\t}\n\t};\n\n\treturn (\n\t\t<form onSubmit={handleSubmit} className=\"space-y-4 overflow-x-hidden\">\n\t\t\t<div className=\"space-y-2\">\n\t\t\t\t<Label htmlFor=\"name\">Name *</Label>\n\t\t\t\t<Input\n\t\t\t\t\tid=\"name\"\n\t\t\t\t\tvalue={name}\n\t\t\t\t\tonChange={(e: React.ChangeEvent<HTMLInputElement>) =>\n\t\t\t\t\t\tsetName(e.target.value)\n\t\t\t\t\t}\n\t\t\t\t\tplaceholder=\"e.g., Project Alpha\"\n\t\t\t\t\tdisabled={isPending}\n\t\t\t\t/>\n\t\t\t</div>\n\n\t\t\t<div className=\"space-y-2\">\n\t\t\t\t<Label htmlFor=\"description\">Description</Label>\n\t\t\t\t<Textarea\n\t\t\t\t\tid=\"description\"\n\t\t\t\t\tvalue={description}\n\t\t\t\t\tonChange={(e: React.ChangeEvent<HTMLTextAreaElement>) =>\n\t\t\t\t\t\tsetDescription(e.target.value)\n\t\t\t\t\t}\n\t\t\t\t\tplaceholder=\"Describe your board...\"\n\t\t\t\t\tdisabled={isPending}\n\t\t\t\t\trows={3}\n\t\t\t\t/>\n\t\t\t</div>\n\n\t\t\t{error && (\n\t\t\t\t<div className=\"p-3 text-sm text-red-600 bg-red-50 border border-red-200 rounded-md\">\n\t\t\t\t\t{error}\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t<div className=\"flex gap-2 pt-2\">\n\t\t\t\t<Button type=\"submit\" disabled={isPending}>\n\t\t\t\t\t{isPending\n\t\t\t\t\t\t? isEditing\n\t\t\t\t\t\t\t? \"Updating...\"\n\t\t\t\t\t\t\t: \"Creating...\"\n\t\t\t\t\t\t: isEditing\n\t\t\t\t\t\t\t? \"Update Board\"\n\t\t\t\t\t\t\t: \"Create Board\"}\n\t\t\t\t</Button>\n\t\t\t\t<Button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tvariant=\"outline\"\n\t\t\t\t\tonClick={onClose}\n\t\t\t\t\tdisabled={isPending}\n\t\t\t\t>\n\t\t\t\t\tCancel\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t</form>\n\t);\n}\n",
+      "content": "\"use client\";\n\nimport { useState } from \"react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Textarea } from \"@/components/ui/textarea\";\nimport { Label } from \"@/components/ui/label\";\nimport { usePluginOverrides, useTranslate } from \"@btst/stack/context\";\nimport { useBoardForm } from \"@btst/stack/plugins/kanban/client/hooks\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\nimport type { SerializedBoard } from \"../../../types\";\n\ninterface BoardFormProps {\n\tboard?: SerializedBoard;\n\tonClose: () => void;\n\tonSuccess: (boardId: string) => void;\n}\n\ninterface BoardFormValues {\n\tname: string;\n\tdescription: string;\n}\n\nfunction firstError(error: string | string[] | undefined): string | undefined {\n\treturn Array.isArray(error) ? error[0] : error;\n}\n\nexport function BoardForm({ board, onClose, onSuccess }: BoardFormProps) {\n\tconst t = useTranslate();\n\tconst { localization } = usePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst isEditing = !!board;\n\n\tconst [name, setName] = useState(board?.name || \"\");\n\tconst [description, setDescription] = useState(board?.description || \"\");\n\tconst [nameError, setNameError] = useState<string | null>(null);\n\n\tconst resourceForm = useBoardForm<BoardFormValues>({\n\t\taction: isEditing ? \"edit\" : \"create\",\n\t\trecord: board ?? null,\n\t\ttoCreateVars: (values) => values,\n\t\ttoUpdateVars: (values) => ({ id: board?.id ?? \"\", data: values }),\n\t\tonSuccess: (savedBoard) => onSuccess(savedBoard.id),\n\t});\n\n\tconst serverNameError = firstError(resourceForm.fieldErrors.name);\n\tconst serverDescriptionError = firstError(\n\t\tresourceForm.fieldErrors.description,\n\t);\n\tconst topLevelError =\n\t\tresourceForm.error && Object.keys(resourceForm.fieldErrors).length === 0\n\t\t\t? resourceForm.error.message\n\t\t\t: null;\n\n\tconst handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n\t\tevent.preventDefault();\n\t\tresourceForm.clearErrors();\n\t\tsetNameError(null);\n\n\t\tif (!name.trim()) {\n\t\t\tsetNameError(\n\t\t\t\tlocalization?.nameRequired ??\n\t\t\t\t\tt(\"kanban.forms.nameRequired\", \"Name is required\"),\n\t\t\t);\n\t\t\treturn;\n\t\t}\n\n\t\tawait resourceForm.submit({ name, description });\n\t};\n\n\treturn (\n\t\t<form onSubmit={handleSubmit} className=\"space-y-4 overflow-x-hidden\">\n\t\t\t<div className=\"space-y-2\">\n\t\t\t\t<Label htmlFor=\"name\">\n\t\t\t\t\t{localization?.boardName ?? t(\"kanban.forms.boardName\", \"Name\")} *\n\t\t\t\t</Label>\n\t\t\t\t<Input\n\t\t\t\t\tid=\"name\"\n\t\t\t\t\tvalue={name}\n\t\t\t\t\tonChange={(event: React.ChangeEvent<HTMLInputElement>) => {\n\t\t\t\t\t\tsetName(event.target.value);\n\t\t\t\t\t\tsetNameError(null);\n\t\t\t\t\t}}\n\t\t\t\t\tplaceholder={\n\t\t\t\t\t\tlocalization?.boardNamePlaceholder ??\n\t\t\t\t\t\tt(\"kanban.forms.boardNamePlaceholder\", \"e.g., Project Alpha\")\n\t\t\t\t\t}\n\t\t\t\t\tdisabled={resourceForm.isSubmitting}\n\t\t\t\t\taria-invalid={!!(nameError || serverNameError)}\n\t\t\t\t/>\n\t\t\t\t{(nameError || serverNameError) && (\n\t\t\t\t\t<p className=\"text-sm text-destructive\">\n\t\t\t\t\t\t{nameError || serverNameError}\n\t\t\t\t\t</p>\n\t\t\t\t)}\n\t\t\t</div>\n\n\t\t\t<div className=\"space-y-2\">\n\t\t\t\t<Label htmlFor=\"description\">\n\t\t\t\t\t{localization?.boardDescription ??\n\t\t\t\t\t\tt(\"kanban.forms.boardDescription\", \"Description\")}\n\t\t\t\t</Label>\n\t\t\t\t<Textarea\n\t\t\t\t\tid=\"description\"\n\t\t\t\t\tvalue={description}\n\t\t\t\t\tonChange={(event: React.ChangeEvent<HTMLTextAreaElement>) =>\n\t\t\t\t\t\tsetDescription(event.target.value)\n\t\t\t\t\t}\n\t\t\t\t\tplaceholder={\n\t\t\t\t\t\tlocalization?.boardDescriptionPlaceholder ??\n\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\"kanban.forms.boardDescriptionPlaceholder\",\n\t\t\t\t\t\t\t\"Describe your board...\",\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\tdisabled={resourceForm.isSubmitting}\n\t\t\t\t\trows={3}\n\t\t\t\t\taria-invalid={!!serverDescriptionError}\n\t\t\t\t/>\n\t\t\t\t{serverDescriptionError && (\n\t\t\t\t\t<p className=\"text-sm text-destructive\">{serverDescriptionError}</p>\n\t\t\t\t)}\n\t\t\t</div>\n\n\t\t\t{topLevelError && (\n\t\t\t\t<div className=\"p-3 text-sm text-red-600 bg-red-50 border border-red-200 rounded-md\">\n\t\t\t\t\t{topLevelError}\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t<div className=\"flex gap-2 pt-2\">\n\t\t\t\t<Button type=\"submit\" disabled={resourceForm.isSubmitting}>\n\t\t\t\t\t{resourceForm.isSubmitting\n\t\t\t\t\t\t? isEditing\n\t\t\t\t\t\t\t? (localization?.updating ??\n\t\t\t\t\t\t\t\tt(\"kanban.common.updating\", \"Updating...\"))\n\t\t\t\t\t\t\t: (localization?.creating ??\n\t\t\t\t\t\t\t\tt(\"kanban.common.creating\", \"Creating...\"))\n\t\t\t\t\t\t: isEditing\n\t\t\t\t\t\t\t? (localization?.updateBoard ??\n\t\t\t\t\t\t\t\tt(\"kanban.forms.updateBoard\", \"Update Board\"))\n\t\t\t\t\t\t\t: (localization?.createBoard ??\n\t\t\t\t\t\t\t\tt(\"kanban.forms.createBoard\", \"Create Board\"))}\n\t\t\t\t</Button>\n\t\t\t\t<Button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tvariant=\"outline\"\n\t\t\t\t\tonClick={onClose}\n\t\t\t\t\tdisabled={resourceForm.isSubmitting}\n\t\t\t\t>\n\t\t\t\t\t{localization?.cancel ?? t(\"kanban.common.cancel\", \"Cancel\")}\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t</form>\n\t);\n}\n",
       "target": "src/components/btst/kanban/client/components/forms/board-form.tsx"
     },
     {
       "path": "btst/kanban/client/components/forms/column-form.tsx",
       "type": "registry:component",
-      "content": "\"use client\";\n\nimport { useState } from \"react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Label } from \"@/components/ui/label\";\nimport { useColumnMutations } from \"@btst/stack/plugins/kanban/client/hooks\";\nimport type { SerializedColumn } from \"../../../types\";\n\ninterface ColumnFormProps {\n\tboardId: string;\n\tcolumnId?: string;\n\tcolumn?: SerializedColumn;\n\tonClose: () => void;\n\tonSuccess: () => void;\n}\n\nexport function ColumnForm({\n\tboardId,\n\tcolumnId,\n\tcolumn,\n\tonClose,\n\tonSuccess,\n}: ColumnFormProps) {\n\tconst isEditing = !!columnId;\n\tconst { createColumn, updateColumn, isCreating, isUpdating } =\n\t\tuseColumnMutations();\n\n\tconst [title, setTitle] = useState(column?.title || \"\");\n\tconst [error, setError] = useState<string | null>(null);\n\n\tconst isPending = isCreating || isUpdating;\n\n\tconst handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {\n\t\te.preventDefault();\n\t\tsetError(null);\n\n\t\tif (!title.trim()) {\n\t\t\tsetError(\"Title is required\");\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tif (isEditing && columnId) {\n\t\t\t\tawait updateColumn(columnId, { title });\n\t\t\t} else {\n\t\t\t\tawait createColumn({ title, boardId });\n\t\t\t}\n\t\t\tonSuccess();\n\t\t} catch (err) {\n\t\t\tsetError(err instanceof Error ? err.message : \"An error occurred\");\n\t\t}\n\t};\n\n\treturn (\n\t\t<form onSubmit={handleSubmit} className=\"space-y-4\">\n\t\t\t<div className=\"space-y-2\">\n\t\t\t\t<Label htmlFor=\"title\">Title *</Label>\n\t\t\t\t<Input\n\t\t\t\t\tid=\"title\"\n\t\t\t\t\tvalue={title}\n\t\t\t\t\tonChange={(e: React.ChangeEvent<HTMLInputElement>) =>\n\t\t\t\t\t\tsetTitle(e.target.value)\n\t\t\t\t\t}\n\t\t\t\t\tplaceholder=\"e.g., To Do\"\n\t\t\t\t\tdisabled={isPending}\n\t\t\t\t/>\n\t\t\t</div>\n\n\t\t\t{error && (\n\t\t\t\t<div className=\"p-3 text-sm text-red-600 bg-red-50 border border-red-200 rounded-md\">\n\t\t\t\t\t{error}\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t<div className=\"flex gap-2 pt-2\">\n\t\t\t\t<Button type=\"submit\" disabled={isPending}>\n\t\t\t\t\t{isPending\n\t\t\t\t\t\t? isEditing\n\t\t\t\t\t\t\t? \"Updating...\"\n\t\t\t\t\t\t\t: \"Creating...\"\n\t\t\t\t\t\t: isEditing\n\t\t\t\t\t\t\t? \"Update Column\"\n\t\t\t\t\t\t\t: \"Create Column\"}\n\t\t\t\t</Button>\n\t\t\t\t<Button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tvariant=\"outline\"\n\t\t\t\t\tonClick={onClose}\n\t\t\t\t\tdisabled={isPending}\n\t\t\t\t>\n\t\t\t\t\tCancel\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t</form>\n\t);\n}\n",
+      "content": "\"use client\";\n\nimport { useState } from \"react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Label } from \"@/components/ui/label\";\nimport { usePluginOverrides, useTranslate } from \"@btst/stack/context\";\nimport { useColumnForm } from \"@btst/stack/plugins/kanban/client/hooks\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\nimport type { SerializedColumn } from \"../../../types\";\n\ninterface ColumnFormProps {\n\tboardId: string;\n\tcolumnId?: string;\n\tcolumn?: SerializedColumn;\n\tonClose: () => void;\n\tonSuccess: () => void;\n}\n\ninterface ColumnFormValues {\n\ttitle: string;\n}\n\nfunction firstError(error: string | string[] | undefined): string | undefined {\n\treturn Array.isArray(error) ? error[0] : error;\n}\n\nexport function ColumnForm({\n\tboardId,\n\tcolumnId,\n\tcolumn,\n\tonClose,\n\tonSuccess,\n}: ColumnFormProps) {\n\tconst t = useTranslate();\n\tconst { localization } = usePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst isEditing = !!columnId;\n\tconst [title, setTitle] = useState(column?.title || \"\");\n\tconst [titleError, setTitleError] = useState<string | null>(null);\n\n\tconst resourceForm = useColumnForm<ColumnFormValues>({\n\t\taction: isEditing ? \"edit\" : \"create\",\n\t\trecord: column ?? null,\n\t\ttoCreateVars: (values) => ({ ...values, boardId }),\n\t\ttoUpdateVars: (values) => ({ id: columnId ?? \"\", data: values }),\n\t\tonSuccess,\n\t});\n\n\tconst serverTitleError = firstError(resourceForm.fieldErrors.title);\n\tconst topLevelError =\n\t\tresourceForm.error && Object.keys(resourceForm.fieldErrors).length === 0\n\t\t\t? resourceForm.error.message\n\t\t\t: null;\n\n\tconst handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n\t\tevent.preventDefault();\n\t\tresourceForm.clearErrors();\n\t\tsetTitleError(null);\n\n\t\tif (!title.trim()) {\n\t\t\tsetTitleError(\n\t\t\t\tlocalization?.titleRequired ??\n\t\t\t\t\tt(\"kanban.forms.titleRequired\", \"Title is required\"),\n\t\t\t);\n\t\t\treturn;\n\t\t}\n\n\t\tawait resourceForm.submit({ title });\n\t};\n\n\treturn (\n\t\t<form onSubmit={handleSubmit} className=\"space-y-4\">\n\t\t\t<div className=\"space-y-2\">\n\t\t\t\t<Label htmlFor=\"title\">\n\t\t\t\t\t{localization?.columnTitle ?? t(\"kanban.forms.columnTitle\", \"Title\")}{\" \"}\n\t\t\t\t\t*\n\t\t\t\t</Label>\n\t\t\t\t<Input\n\t\t\t\t\tid=\"title\"\n\t\t\t\t\tvalue={title}\n\t\t\t\t\tonChange={(event: React.ChangeEvent<HTMLInputElement>) => {\n\t\t\t\t\t\tsetTitle(event.target.value);\n\t\t\t\t\t\tsetTitleError(null);\n\t\t\t\t\t}}\n\t\t\t\t\tplaceholder={\n\t\t\t\t\t\tlocalization?.columnTitlePlaceholder ??\n\t\t\t\t\t\tt(\"kanban.forms.columnTitlePlaceholder\", \"e.g., To Do\")\n\t\t\t\t\t}\n\t\t\t\t\tdisabled={resourceForm.isSubmitting}\n\t\t\t\t\taria-invalid={!!(titleError || serverTitleError)}\n\t\t\t\t/>\n\t\t\t\t{(titleError || serverTitleError) && (\n\t\t\t\t\t<p className=\"text-sm text-destructive\">\n\t\t\t\t\t\t{titleError || serverTitleError}\n\t\t\t\t\t</p>\n\t\t\t\t)}\n\t\t\t</div>\n\n\t\t\t{topLevelError && (\n\t\t\t\t<div className=\"p-3 text-sm text-red-600 bg-red-50 border border-red-200 rounded-md\">\n\t\t\t\t\t{topLevelError}\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t<div className=\"flex gap-2 pt-2\">\n\t\t\t\t<Button type=\"submit\" disabled={resourceForm.isSubmitting}>\n\t\t\t\t\t{resourceForm.isSubmitting\n\t\t\t\t\t\t? isEditing\n\t\t\t\t\t\t\t? (localization?.updating ??\n\t\t\t\t\t\t\t\tt(\"kanban.common.updating\", \"Updating...\"))\n\t\t\t\t\t\t\t: (localization?.creating ??\n\t\t\t\t\t\t\t\tt(\"kanban.common.creating\", \"Creating...\"))\n\t\t\t\t\t\t: isEditing\n\t\t\t\t\t\t\t? (localization?.updateColumn ??\n\t\t\t\t\t\t\t\tt(\"kanban.forms.updateColumn\", \"Update Column\"))\n\t\t\t\t\t\t\t: (localization?.createColumn ??\n\t\t\t\t\t\t\t\tt(\"kanban.forms.createColumn\", \"Create Column\"))}\n\t\t\t\t</Button>\n\t\t\t\t<Button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tvariant=\"outline\"\n\t\t\t\t\tonClick={onClose}\n\t\t\t\t\tdisabled={resourceForm.isSubmitting}\n\t\t\t\t>\n\t\t\t\t\t{localization?.cancel ?? t(\"kanban.common.cancel\", \"Cancel\")}\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t</form>\n\t);\n}\n",
       "target": "src/components/btst/kanban/client/components/forms/column-form.tsx"
     },
     {
       "path": "btst/kanban/client/components/forms/task-form.tsx",
       "type": "registry:component",
-      "content": "\"use client\";\n\nimport { useState } from \"react\";\nimport { Trash2 } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Label } from \"@/components/ui/label\";\nimport {\n\tSelect,\n\tSelectContent,\n\tSelectItem,\n\tSelectTrigger,\n\tSelectValue,\n} from \"@/components/ui/select\";\nimport { MinimalTiptapEditor } from \"@/components/ui/minimal-tiptap\";\nimport SearchSelect from \"@/components/ui/search-select\";\nimport { usePluginOverrides } from \"@btst/stack/context\";\nimport { useTaskMutations, useSearchUsers } from \"@btst/stack/plugins/kanban/client/hooks\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\nimport { PRIORITY_OPTIONS } from \"../../../utils\";\nimport type {\n\tSerializedColumn,\n\tSerializedTask,\n\tPriority,\n} from \"../../../types\";\n\ninterface TaskFormProps {\n\tcolumnId: string;\n\tboardId: string;\n\ttaskId?: string;\n\ttask?: SerializedTask;\n\tcolumns: SerializedColumn[];\n\tonClose: () => void;\n\tonSuccess: () => void;\n\tonDelete?: () => void;\n}\n\nexport function TaskForm({\n\tcolumnId,\n\tboardId,\n\ttaskId,\n\ttask,\n\tcolumns,\n\tonClose,\n\tonSuccess,\n\tonDelete,\n}: TaskFormProps) {\n\tconst isEditing = !!taskId;\n\tconst { uploadImage, imagePicker: imagePickerTrigger } =\n\t\tusePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst {\n\t\tcreateTask,\n\t\tupdateTask,\n\t\tmoveTask,\n\t\tisCreating,\n\t\tisUpdating,\n\t\tisDeleting,\n\t\tisMoving,\n\t} = useTaskMutations();\n\n\tconst [title, setTitle] = useState(task?.title || \"\");\n\tconst [description, setDescription] = useState(task?.description || \"\");\n\tconst [priority, setPriority] = useState<Priority>(\n\t\ttask?.priority || \"MEDIUM\",\n\t);\n\tconst [selectedColumnId, setSelectedColumnId] = useState(\n\t\ttask?.columnId || columnId,\n\t);\n\tconst [assigneeId, setAssigneeId] = useState<string>(task?.assigneeId || \"\");\n\tconst [error, setError] = useState<string | null>(null);\n\n\t// Fetch available users for assignment\n\tconst { data: users = [] } = useSearchUsers(\"\", boardId);\n\tconst userOptions = [\n\t\t{ value: \"\", label: \"Unassigned\" },\n\t\t...users.map((user) => ({ value: user.id, label: user.name })),\n\t];\n\n\tconst isPending = isCreating || isUpdating || isDeleting || isMoving;\n\n\tconst handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {\n\t\te.preventDefault();\n\t\tsetError(null);\n\n\t\tif (!title.trim()) {\n\t\t\tsetError(\"Title is required\");\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tif (isEditing && taskId) {\n\t\t\t\tconst isColumnChanging =\n\t\t\t\t\ttask?.columnId && selectedColumnId !== task.columnId;\n\n\t\t\t\tif (isColumnChanging) {\n\t\t\t\t\t// When changing columns, we need two operations:\n\t\t\t\t\t// 1. Update task properties (title, description, priority, assigneeId)\n\t\t\t\t\t// 2. Move task to new column with proper order calculation\n\t\t\t\t\t//\n\t\t\t\t\t// To avoid partial failure confusion, we attempt both operations\n\t\t\t\t\t// but provide clear messaging if one succeeds and the other fails.\n\n\t\t\t\t\t// First update the task properties (title, description, priority, assigneeId)\n\t\t\t\t\t// If this fails, nothing is saved and the outer catch handles it\n\t\t\t\t\tawait updateTask(taskId, {\n\t\t\t\t\t\ttitle,\n\t\t\t\t\t\tdescription,\n\t\t\t\t\t\tpriority,\n\t\t\t\t\t\tassigneeId: assigneeId || null,\n\t\t\t\t\t});\n\n\t\t\t\t\t// Then move the task to the new column with calculated order\n\t\t\t\t\t// Place at the end of the destination column\n\t\t\t\t\ttry {\n\t\t\t\t\t\tconst targetColumn = columns.find((c) => c.id === selectedColumnId);\n\t\t\t\t\t\tconst targetTasks = targetColumn?.tasks || [];\n\t\t\t\t\t\tconst targetOrder =\n\t\t\t\t\t\t\ttargetTasks.length > 0\n\t\t\t\t\t\t\t\t? Math.max(...targetTasks.map((t) => t.order)) + 1\n\t\t\t\t\t\t\t\t: 0;\n\n\t\t\t\t\t\tawait moveTask(taskId, selectedColumnId, targetOrder);\n\t\t\t\t\t} catch (moveErr) {\n\t\t\t\t\t\t// Properties were saved but column move failed\n\t\t\t\t\t\t// Provide specific error message about partial success\n\t\t\t\t\t\tconst moveErrorMsg =\n\t\t\t\t\t\t\tmoveErr instanceof Error ? moveErr.message : \"Unknown error\";\n\t\t\t\t\t\tsetError(\n\t\t\t\t\t\t\t`Task properties were saved, but moving to the new column failed: ${moveErrorMsg}. ` +\n\t\t\t\t\t\t\t\t`You can try dragging the task to the desired column.`,\n\t\t\t\t\t\t);\n\t\t\t\t\t\t// Don't call onSuccess since the operation wasn't fully completed\n\t\t\t\t\t\t// but also don't throw - we want to show the specific error\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\t// Same column - just update the task properties\n\t\t\t\t\tawait updateTask(taskId, {\n\t\t\t\t\t\ttitle,\n\t\t\t\t\t\tdescription,\n\t\t\t\t\t\tpriority,\n\t\t\t\t\t\tcolumnId: selectedColumnId,\n\t\t\t\t\t\tassigneeId: assigneeId || null,\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tawait createTask({\n\t\t\t\t\ttitle,\n\t\t\t\t\tdescription,\n\t\t\t\t\tpriority,\n\t\t\t\t\tcolumnId: selectedColumnId,\n\t\t\t\t\tassigneeId: assigneeId || undefined,\n\t\t\t\t});\n\t\t\t}\n\t\t\tonSuccess();\n\t\t} catch (err) {\n\t\t\tsetError(err instanceof Error ? err.message : \"An error occurred\");\n\t\t}\n\t};\n\n\treturn (\n\t\t<form onSubmit={handleSubmit} className=\"space-y-4 overflow-x-hidden\">\n\t\t\t<div className=\"space-y-2\">\n\t\t\t\t<Label htmlFor=\"title\">Title *</Label>\n\t\t\t\t<Input\n\t\t\t\t\tid=\"title\"\n\t\t\t\t\tvalue={title}\n\t\t\t\t\tonChange={(e: React.ChangeEvent<HTMLInputElement>) =>\n\t\t\t\t\t\tsetTitle(e.target.value)\n\t\t\t\t\t}\n\t\t\t\t\tplaceholder=\"e.g., Fix login bug\"\n\t\t\t\t\tdisabled={isPending}\n\t\t\t\t/>\n\t\t\t</div>\n\n\t\t\t<div className=\"grid grid-cols-2 gap-4\">\n\t\t\t\t<div className=\"space-y-2\">\n\t\t\t\t\t<Label htmlFor=\"priority\">Priority</Label>\n\t\t\t\t\t<Select\n\t\t\t\t\t\tvalue={priority}\n\t\t\t\t\t\tonValueChange={(v: string) => setPriority(v as Priority)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<SelectTrigger>\n\t\t\t\t\t\t\t<SelectValue placeholder=\"Select priority\" />\n\t\t\t\t\t\t</SelectTrigger>\n\t\t\t\t\t\t<SelectContent>\n\t\t\t\t\t\t\t{PRIORITY_OPTIONS.map((option) => (\n\t\t\t\t\t\t\t\t<SelectItem key={option.value} value={option.value}>\n\t\t\t\t\t\t\t\t\t{option.label}\n\t\t\t\t\t\t\t\t</SelectItem>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</SelectContent>\n\t\t\t\t\t</Select>\n\t\t\t\t</div>\n\n\t\t\t\t<div className=\"space-y-2\">\n\t\t\t\t\t<Label htmlFor=\"column\">Column</Label>\n\t\t\t\t\t<Select value={selectedColumnId} onValueChange={setSelectedColumnId}>\n\t\t\t\t\t\t<SelectTrigger>\n\t\t\t\t\t\t\t<SelectValue placeholder=\"Select column\" />\n\t\t\t\t\t\t</SelectTrigger>\n\t\t\t\t\t\t<SelectContent>\n\t\t\t\t\t\t\t{columns.map((col) => (\n\t\t\t\t\t\t\t\t<SelectItem key={col.id} value={col.id}>\n\t\t\t\t\t\t\t\t\t{col.title}\n\t\t\t\t\t\t\t\t</SelectItem>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</SelectContent>\n\t\t\t\t\t</Select>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<div className=\"space-y-2\">\n\t\t\t\t<Label htmlFor=\"assignee\">Assignee</Label>\n\t\t\t\t<SearchSelect\n\t\t\t\t\toptions={userOptions}\n\t\t\t\t\tvalue={assigneeId}\n\t\t\t\t\tonChange={setAssigneeId}\n\t\t\t\t\tplaceholder=\"Select assignee\"\n\t\t\t\t\temptyMessage=\"No users found\"\n\t\t\t\t/>\n\t\t\t</div>\n\n\t\t\t<div className=\"space-y-2\">\n\t\t\t\t<Label>Description</Label>\n\t\t\t\t<MinimalTiptapEditor\n\t\t\t\t\tvalue={description}\n\t\t\t\t\tonChange={(value) =>\n\t\t\t\t\t\tsetDescription(typeof value === \"string\" ? value : \"\")\n\t\t\t\t\t}\n\t\t\t\t\toutput=\"markdown\"\n\t\t\t\t\tplaceholder=\"Describe the task...\"\n\t\t\t\t\tclassName=\"min-h-[150px]\"\n\t\t\t\t\tuploader={uploadImage}\n\t\t\t\t\timagePickerTrigger={imagePickerTrigger}\n\t\t\t\t/>\n\t\t\t</div>\n\n\t\t\t{error && (\n\t\t\t\t<div className=\"p-3 text-sm text-red-600 bg-red-50 border border-red-200 rounded-md\">\n\t\t\t\t\t{error}\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t<div className=\"flex justify-between pt-2\">\n\t\t\t\t<div className=\"flex gap-2\">\n\t\t\t\t\t<Button type=\"submit\" disabled={isPending}>\n\t\t\t\t\t\t{isPending\n\t\t\t\t\t\t\t? isEditing\n\t\t\t\t\t\t\t\t? \"Updating...\"\n\t\t\t\t\t\t\t\t: \"Creating...\"\n\t\t\t\t\t\t\t: isEditing\n\t\t\t\t\t\t\t\t? \"Update Task\"\n\t\t\t\t\t\t\t\t: \"Create Task\"}\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"outline\"\n\t\t\t\t\t\tonClick={onClose}\n\t\t\t\t\t\tdisabled={isPending}\n\t\t\t\t\t>\n\t\t\t\t\t\tCancel\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\t\t\t\t{isEditing && onDelete && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"destructive\"\n\t\t\t\t\t\tonClick={onDelete}\n\t\t\t\t\t\tdisabled={isPending}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Trash2 className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\tDelete\n\t\t\t\t\t</Button>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</form>\n\t);\n}\n",
+      "content": "\"use client\";\n\nimport { useState } from \"react\";\nimport { Trash2 } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Label } from \"@/components/ui/label\";\nimport {\n\tSelect,\n\tSelectContent,\n\tSelectItem,\n\tSelectTrigger,\n\tSelectValue,\n} from \"@/components/ui/select\";\nimport { MinimalTiptapEditor } from \"@/components/ui/minimal-tiptap\";\nimport SearchSelect from \"@/components/ui/search-select\";\nimport {\n\tCanAccess,\n\tusePluginOverrides,\n\tuseTranslate,\n} from \"@btst/stack/context\";\nimport {\n\tuseTaskForm,\n\tuseTaskMutations,\n\tuseSearchUsers,\n} from \"@btst/stack/plugins/kanban/client/hooks\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\nimport type {\n\tSerializedColumn,\n\tSerializedTask,\n\tPriority,\n} from \"../../../types\";\n\ninterface TaskFormProps {\n\tcolumnId: string;\n\tboardId: string;\n\ttaskId?: string;\n\ttask?: SerializedTask;\n\tcolumns: SerializedColumn[];\n\tonClose: () => void;\n\tonSuccess: () => void;\n\tonDelete?: () => void | Promise<void>;\n}\n\ninterface TaskFormValues {\n\ttitle: string;\n\tdescription: string;\n\tpriority: Priority;\n\tcolumnId: string;\n\tassigneeId: string;\n}\n\nfunction firstError(error: string | string[] | undefined): string | undefined {\n\treturn Array.isArray(error) ? error[0] : error;\n}\n\nexport function TaskForm({\n\tcolumnId,\n\tboardId,\n\ttaskId,\n\ttask,\n\tcolumns,\n\tonClose,\n\tonSuccess,\n\tonDelete,\n}: TaskFormProps) {\n\tconst t = useTranslate();\n\tconst {\n\t\tuploadImage,\n\t\timagePicker: imagePickerTrigger,\n\t\tlocalization,\n\t} = usePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst isEditing = !!taskId;\n\tconst { moveTask, isMoving } = useTaskMutations();\n\n\tconst [title, setTitle] = useState(task?.title || \"\");\n\tconst [description, setDescription] = useState(task?.description || \"\");\n\tconst [priority, setPriority] = useState<Priority>(\n\t\ttask?.priority || \"MEDIUM\",\n\t);\n\tconst [selectedColumnId, setSelectedColumnId] = useState(\n\t\ttask?.columnId || columnId,\n\t);\n\tconst [assigneeId, setAssigneeId] = useState<string>(task?.assigneeId || \"\");\n\tconst [titleError, setTitleError] = useState<string | null>(null);\n\tconst [isDeleting, setIsDeleting] = useState(false);\n\n\tconst resourceForm = useTaskForm<TaskFormValues>({\n\t\taction: isEditing ? \"edit\" : \"create\",\n\t\trecord: task ?? null,\n\t\ttoCreateVars: (values) => ({\n\t\t\ttitle: values.title,\n\t\t\tdescription: values.description,\n\t\t\tpriority: values.priority,\n\t\t\tcolumnId: values.columnId,\n\t\t\tassigneeId: values.assigneeId || undefined,\n\t\t}),\n\t\ttoUpdateVars: (values) => ({\n\t\t\tid: taskId ?? \"\",\n\t\t\tdata: {\n\t\t\t\ttitle: values.title,\n\t\t\t\tdescription: values.description,\n\t\t\t\tpriority: values.priority,\n\t\t\t\t...(values.columnId === task?.columnId\n\t\t\t\t\t? { columnId: values.columnId }\n\t\t\t\t\t: {}),\n\t\t\t\tassigneeId: values.assigneeId || null,\n\t\t\t},\n\t\t}),\n\t\tonSuccess: async () => {\n\t\t\tif (isEditing && taskId && selectedColumnId !== task?.columnId) {\n\t\t\t\tconst targetTasks =\n\t\t\t\t\tcolumns.find((column) => column.id === selectedColumnId)?.tasks ?? [];\n\t\t\t\tconst targetOrder =\n\t\t\t\t\ttargetTasks.length > 0\n\t\t\t\t\t\t? Math.max(...targetTasks.map((targetTask) => targetTask.order)) + 1\n\t\t\t\t\t\t: 0;\n\n\t\t\t\ttry {\n\t\t\t\t\tawait moveTask(taskId, selectedColumnId, targetOrder);\n\t\t\t\t} catch (error) {\n\t\t\t\t\tconst message =\n\t\t\t\t\t\terror instanceof Error\n\t\t\t\t\t\t\t? error.message\n\t\t\t\t\t\t\t: (localization?.errorGeneric ??\n\t\t\t\t\t\t\t\tt(\"kanban.common.errorGeneric\", \"Something went wrong\"));\n\t\t\t\t\tconst partialErrorTemplate = localization?.taskMovePartialError;\n\t\t\t\t\tthrow new Error(\n\t\t\t\t\t\tpartialErrorTemplate\n\t\t\t\t\t\t\t? partialErrorTemplate.replaceAll(\"{{message}}\", message)\n\t\t\t\t\t\t\t: t(\n\t\t\t\t\t\t\t\t\t\"kanban.forms.taskMovePartialError\",\n\t\t\t\t\t\t\t\t\t\"Task properties were saved, but moving to the new column failed: {{message}}. You can try dragging the task to the desired column.\",\n\t\t\t\t\t\t\t\t\t{ message },\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tonSuccess();\n\t\t},\n\t});\n\n\tconst { data: users = [] } = useSearchUsers(\"\", boardId);\n\tconst unassigned =\n\t\tlocalization?.unassigned ?? t(\"kanban.common.unassigned\", \"Unassigned\");\n\tconst userOptions = [\n\t\t{ value: \"\", label: unassigned },\n\t\t...users.map((user) => ({ value: user.id, label: user.name })),\n\t];\n\tconst priorityOptions: Array<{ value: Priority; label: string }> = [\n\t\t{\n\t\t\tvalue: \"LOW\",\n\t\t\tlabel: localization?.priorityLow ?? t(\"kanban.common.priorityLow\", \"Low\"),\n\t\t},\n\t\t{\n\t\t\tvalue: \"MEDIUM\",\n\t\t\tlabel:\n\t\t\t\tlocalization?.priorityMedium ??\n\t\t\t\tt(\"kanban.common.priorityMedium\", \"Medium\"),\n\t\t},\n\t\t{\n\t\t\tvalue: \"HIGH\",\n\t\t\tlabel:\n\t\t\t\tlocalization?.priorityHigh ?? t(\"kanban.common.priorityHigh\", \"High\"),\n\t\t},\n\t\t{\n\t\t\tvalue: \"URGENT\",\n\t\t\tlabel:\n\t\t\t\tlocalization?.priorityUrgent ??\n\t\t\t\tt(\"kanban.common.priorityUrgent\", \"Urgent\"),\n\t\t},\n\t];\n\n\tconst isPending = resourceForm.isSubmitting || isMoving || isDeleting;\n\tconst serverTitleError = firstError(resourceForm.fieldErrors.title);\n\tconst serverDescriptionError = firstError(\n\t\tresourceForm.fieldErrors.description,\n\t);\n\tconst serverPriorityError = firstError(resourceForm.fieldErrors.priority);\n\tconst serverColumnError = firstError(resourceForm.fieldErrors.columnId);\n\tconst serverAssigneeError = firstError(resourceForm.fieldErrors.assigneeId);\n\tconst topLevelError =\n\t\tresourceForm.error && Object.keys(resourceForm.fieldErrors).length === 0\n\t\t\t? resourceForm.error.message\n\t\t\t: null;\n\n\tconst handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n\t\tevent.preventDefault();\n\t\tresourceForm.clearErrors();\n\t\tsetTitleError(null);\n\n\t\tif (!title.trim()) {\n\t\t\tsetTitleError(\n\t\t\t\tlocalization?.titleRequired ??\n\t\t\t\t\tt(\"kanban.forms.titleRequired\", \"Title is required\"),\n\t\t\t);\n\t\t\treturn;\n\t\t}\n\n\t\tawait resourceForm.submit({\n\t\t\ttitle,\n\t\t\tdescription,\n\t\t\tpriority,\n\t\t\tcolumnId: selectedColumnId,\n\t\t\tassigneeId,\n\t\t});\n\t};\n\n\tconst handleDelete = async () => {\n\t\tif (!onDelete) return;\n\t\tsetIsDeleting(true);\n\t\ttry {\n\t\t\tawait onDelete();\n\t\t} finally {\n\t\t\tsetIsDeleting(false);\n\t\t}\n\t};\n\n\treturn (\n\t\t<form onSubmit={handleSubmit} className=\"space-y-4 overflow-x-hidden\">\n\t\t\t<div className=\"space-y-2\">\n\t\t\t\t<Label htmlFor=\"title\">\n\t\t\t\t\t{localization?.taskTitle ?? t(\"kanban.forms.taskTitle\", \"Title\")} *\n\t\t\t\t</Label>\n\t\t\t\t<Input\n\t\t\t\t\tid=\"title\"\n\t\t\t\t\tvalue={title}\n\t\t\t\t\tonChange={(event: React.ChangeEvent<HTMLInputElement>) => {\n\t\t\t\t\t\tsetTitle(event.target.value);\n\t\t\t\t\t\tsetTitleError(null);\n\t\t\t\t\t}}\n\t\t\t\t\tplaceholder={\n\t\t\t\t\t\tlocalization?.taskTitlePlaceholder ??\n\t\t\t\t\t\tt(\"kanban.forms.taskTitlePlaceholder\", \"e.g., Fix login bug\")\n\t\t\t\t\t}\n\t\t\t\t\tdisabled={isPending}\n\t\t\t\t\taria-invalid={!!(titleError || serverTitleError)}\n\t\t\t\t/>\n\t\t\t\t{(titleError || serverTitleError) && (\n\t\t\t\t\t<p className=\"text-sm text-destructive\">\n\t\t\t\t\t\t{titleError || serverTitleError}\n\t\t\t\t\t</p>\n\t\t\t\t)}\n\t\t\t</div>\n\n\t\t\t<div className=\"grid grid-cols-2 gap-4\">\n\t\t\t\t<div className=\"space-y-2\">\n\t\t\t\t\t<Label htmlFor=\"priority\">\n\t\t\t\t\t\t{localization?.taskPriority ??\n\t\t\t\t\t\t\tt(\"kanban.forms.taskPriority\", \"Priority\")}\n\t\t\t\t\t</Label>\n\t\t\t\t\t<Select\n\t\t\t\t\t\tvalue={priority}\n\t\t\t\t\t\tonValueChange={(value: string) => setPriority(value as Priority)}\n\t\t\t\t\t\tdisabled={isPending}\n\t\t\t\t\t>\n\t\t\t\t\t\t<SelectTrigger id=\"priority\" aria-invalid={!!serverPriorityError}>\n\t\t\t\t\t\t\t<SelectValue\n\t\t\t\t\t\t\t\tplaceholder={\n\t\t\t\t\t\t\t\t\tlocalization?.selectPriority ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.forms.selectPriority\", \"Select priority\")\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</SelectTrigger>\n\t\t\t\t\t\t<SelectContent>\n\t\t\t\t\t\t\t{priorityOptions.map((option) => (\n\t\t\t\t\t\t\t\t<SelectItem key={option.value} value={option.value}>\n\t\t\t\t\t\t\t\t\t{option.label}\n\t\t\t\t\t\t\t\t</SelectItem>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</SelectContent>\n\t\t\t\t\t</Select>\n\t\t\t\t\t{serverPriorityError && (\n\t\t\t\t\t\t<p className=\"text-sm text-destructive\">{serverPriorityError}</p>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t<div className=\"space-y-2\">\n\t\t\t\t\t<Label htmlFor=\"column\">\n\t\t\t\t\t\t{localization?.taskColumn ?? t(\"kanban.forms.taskColumn\", \"Column\")}\n\t\t\t\t\t</Label>\n\t\t\t\t\t<Select\n\t\t\t\t\t\tvalue={selectedColumnId}\n\t\t\t\t\t\tonValueChange={setSelectedColumnId}\n\t\t\t\t\t\tdisabled={isPending}\n\t\t\t\t\t>\n\t\t\t\t\t\t<SelectTrigger id=\"column\" aria-invalid={!!serverColumnError}>\n\t\t\t\t\t\t\t<SelectValue\n\t\t\t\t\t\t\t\tplaceholder={\n\t\t\t\t\t\t\t\t\tlocalization?.selectColumn ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.forms.selectColumn\", \"Select column\")\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</SelectTrigger>\n\t\t\t\t\t\t<SelectContent>\n\t\t\t\t\t\t\t{columns.map((column) => (\n\t\t\t\t\t\t\t\t<SelectItem key={column.id} value={column.id}>\n\t\t\t\t\t\t\t\t\t{column.title}\n\t\t\t\t\t\t\t\t</SelectItem>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</SelectContent>\n\t\t\t\t\t</Select>\n\t\t\t\t\t{serverColumnError && (\n\t\t\t\t\t\t<p className=\"text-sm text-destructive\">{serverColumnError}</p>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<div className=\"space-y-2\">\n\t\t\t\t<Label htmlFor=\"assignee\">\n\t\t\t\t\t{localization?.taskAssignee ??\n\t\t\t\t\t\tt(\"kanban.forms.taskAssignee\", \"Assignee\")}\n\t\t\t\t</Label>\n\t\t\t\t<SearchSelect\n\t\t\t\t\toptions={userOptions}\n\t\t\t\t\tvalue={assigneeId}\n\t\t\t\t\tonChange={setAssigneeId}\n\t\t\t\t\tplaceholder={\n\t\t\t\t\t\tlocalization?.selectAssignee ??\n\t\t\t\t\t\tt(\"kanban.forms.selectAssignee\", \"Select assignee\")\n\t\t\t\t\t}\n\t\t\t\t\temptyMessage={\n\t\t\t\t\t\tlocalization?.noUsersFound ??\n\t\t\t\t\t\tt(\"kanban.forms.noUsersFound\", \"No users found\")\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\t{serverAssigneeError && (\n\t\t\t\t\t<p className=\"text-sm text-destructive\">{serverAssigneeError}</p>\n\t\t\t\t)}\n\t\t\t</div>\n\n\t\t\t<div className=\"space-y-2\">\n\t\t\t\t<Label>\n\t\t\t\t\t{localization?.taskDescription ??\n\t\t\t\t\t\tt(\"kanban.forms.taskDescription\", \"Description\")}\n\t\t\t\t</Label>\n\t\t\t\t<MinimalTiptapEditor\n\t\t\t\t\tvalue={description}\n\t\t\t\t\tonChange={(value) =>\n\t\t\t\t\t\tsetDescription(typeof value === \"string\" ? value : \"\")\n\t\t\t\t\t}\n\t\t\t\t\toutput=\"markdown\"\n\t\t\t\t\tplaceholder={\n\t\t\t\t\t\tlocalization?.taskDescriptionPlaceholder ??\n\t\t\t\t\t\tt(\"kanban.forms.taskDescriptionPlaceholder\", \"Describe the task...\")\n\t\t\t\t\t}\n\t\t\t\t\tclassName=\"min-h-[150px]\"\n\t\t\t\t\tuploader={uploadImage}\n\t\t\t\t\timagePickerTrigger={imagePickerTrigger}\n\t\t\t\t/>\n\t\t\t\t{serverDescriptionError && (\n\t\t\t\t\t<p className=\"text-sm text-destructive\">{serverDescriptionError}</p>\n\t\t\t\t)}\n\t\t\t</div>\n\n\t\t\t{topLevelError && (\n\t\t\t\t<div className=\"p-3 text-sm text-red-600 bg-red-50 border border-red-200 rounded-md\">\n\t\t\t\t\t{topLevelError}\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t<div className=\"flex justify-between pt-2\">\n\t\t\t\t<div className=\"flex gap-2\">\n\t\t\t\t\t<Button type=\"submit\" disabled={isPending}>\n\t\t\t\t\t\t{resourceForm.isSubmitting || isMoving\n\t\t\t\t\t\t\t? isEditing\n\t\t\t\t\t\t\t\t? (localization?.updating ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.common.updating\", \"Updating...\"))\n\t\t\t\t\t\t\t\t: (localization?.creating ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.common.creating\", \"Creating...\"))\n\t\t\t\t\t\t\t: isEditing\n\t\t\t\t\t\t\t\t? (localization?.updateTask ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.forms.updateTask\", \"Update Task\"))\n\t\t\t\t\t\t\t\t: (localization?.createTask ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.forms.createTask\", \"Create Task\"))}\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"outline\"\n\t\t\t\t\t\tonClick={onClose}\n\t\t\t\t\t\tdisabled={isPending}\n\t\t\t\t\t>\n\t\t\t\t\t\t{localization?.cancel ?? t(\"kanban.common.cancel\", \"Cancel\")}\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\t\t\t\t{isEditing && onDelete && taskId && (\n\t\t\t\t\t<CanAccess\n\t\t\t\t\t\tresource=\"kanban:task\"\n\t\t\t\t\t\taction=\"delete\"\n\t\t\t\t\t\tparams={{ id: taskId, boardId, columnId }}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tvariant=\"destructive\"\n\t\t\t\t\t\t\tonClick={handleDelete}\n\t\t\t\t\t\t\tdisabled={isPending}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Trash2 className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t{isDeleting\n\t\t\t\t\t\t\t\t? (localization?.deleting ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.common.deleting\", \"Deleting...\"))\n\t\t\t\t\t\t\t\t: (localization?.delete ?? t(\"kanban.common.delete\", \"Delete\"))}\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</CanAccess>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</form>\n\t);\n}\n",
       "target": "src/components/btst/kanban/client/components/forms/task-form.tsx"
     },
     {
@@ -85,55 +85,55 @@
     {
       "path": "btst/kanban/client/components/pages/404-page.tsx",
       "type": "registry:page",
-      "content": "\"use client\";\n\nimport { Button } from \"@/components/ui/button\";\nimport { usePluginOverrides } from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\n\nexport function NotFoundPage() {\n\tconst { navigate: overrideNavigate } =\n\t\tusePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst navigate =\n\t\toverrideNavigate ||\n\t\t((path: string) => {\n\t\t\twindow.location.href = path;\n\t\t});\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"flex min-h-[400px] flex-col items-center justify-center text-center\"\n\t\t\tdata-testid=\"empty-state\"\n\t\t>\n\t\t\t<h2 className=\"text-2xl font-bold mb-2\">Page Not Found</h2>\n\t\t\t<p className=\"text-muted-foreground mb-6\">\n\t\t\t\tThe page you're looking for doesn't exist.\n\t\t\t</p>\n\t\t\t<Button onClick={() => navigate(\"/pages/kanban\")}>Back to Boards</Button>\n\t\t</div>\n\t);\n}\n",
+      "content": "\"use client\";\n\nimport { Button } from \"@/components/ui/button\";\nimport { usePluginOverrides, useTranslate } from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\n\nexport function NotFoundPage() {\n\tconst t = useTranslate();\n\tconst { navigate: overrideNavigate, localization } =\n\t\tusePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst navigate =\n\t\toverrideNavigate ||\n\t\t((path: string) => {\n\t\t\twindow.location.href = path;\n\t\t});\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"flex min-h-[400px] flex-col items-center justify-center text-center\"\n\t\t\tdata-testid=\"empty-state\"\n\t\t>\n\t\t\t<h2 className=\"text-2xl font-bold mb-2\">\n\t\t\t\t{localization?.pageNotFound ??\n\t\t\t\t\tt(\"kanban.common.pageNotFound\", \"Page Not Found\")}\n\t\t\t</h2>\n\t\t\t<p className=\"text-muted-foreground mb-6\">\n\t\t\t\t{localization?.pageNotFoundDescription ??\n\t\t\t\t\tt(\n\t\t\t\t\t\t\"kanban.common.pageNotFoundDescription\",\n\t\t\t\t\t\t\"The page you're looking for doesn't exist.\",\n\t\t\t\t\t)}\n\t\t\t</p>\n\t\t\t<Button onClick={() => navigate(\"/pages/kanban\")}>\n\t\t\t\t{localization?.backToBoards ??\n\t\t\t\t\tt(\"kanban.common.backToBoards\", \"Back to Boards\")}\n\t\t\t</Button>\n\t\t</div>\n\t);\n}\n",
       "target": "src/components/btst/kanban/client/components/pages/404-page.tsx"
     },
     {
       "path": "btst/kanban/client/components/pages/board-page.internal.tsx",
       "type": "registry:component",
-      "content": "\"use client\";\n\nimport { useState, useCallback, useMemo, useEffect } from \"react\";\nimport { ArrowLeft, Plus, Settings, Trash2, Pencil } from \"lucide-react\";\nimport { toast } from \"sonner\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n\tDropdownMenu,\n\tDropdownMenuContent,\n\tDropdownMenuItem,\n\tDropdownMenuSeparator,\n\tDropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport {\n\tDialog,\n\tDialogContent,\n\tDialogDescription,\n\tDialogHeader,\n\tDialogTitle,\n} from \"@/components/ui/dialog\";\nimport {\n\tAlertDialog,\n\tAlertDialogAction,\n\tAlertDialogCancel,\n\tAlertDialogContent,\n\tAlertDialogDescription,\n\tAlertDialogFooter,\n\tAlertDialogHeader,\n\tAlertDialogTitle,\n} from \"@/components/ui/alert-dialog\";\nimport {\n\tuseSuspenseBoard,\n\tuseBoardMutations,\n\tuseColumnMutations,\n\tuseTaskMutations,\n} from \"@btst/stack/plugins/kanban/client/hooks\";\nimport { usePluginOverrides } from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\nimport { KanbanBoard } from \"../shared/kanban-board\";\nimport { ColumnForm } from \"../forms/column-form\";\nimport { BoardForm } from \"../forms/board-form\";\nimport { TaskForm } from \"../forms/task-form\";\nimport { PageWrapper } from \"../shared/page-wrapper\";\nimport { EmptyState } from \"../shared/empty-state\";\nimport type { SerializedTask, SerializedColumn } from \"../../../types\";\n\ninterface BoardPageProps {\n\tboardId: string;\n}\n\ntype ModalState =\n\t| { type: \"none\" }\n\t| { type: \"addColumn\" }\n\t| { type: \"editColumn\"; columnId: string }\n\t| { type: \"deleteColumn\"; columnId: string }\n\t| { type: \"editBoard\" }\n\t| { type: \"deleteBoard\" }\n\t| { type: \"addTask\"; columnId: string }\n\t| { type: \"editTask\"; columnId: string; taskId: string };\n\nexport function BoardPage({ boardId }: BoardPageProps) {\n\tconst { data: board, error, refetch, isFetching } = useSuspenseBoard(boardId);\n\n\t// Suspense hooks only throw on initial fetch, not refetch failures\n\tif (error && !isFetching) {\n\t\tthrow error;\n\t}\n\n\tconst {\n\t\tLink: OverrideLink,\n\t\tnavigate: overrideNavigate,\n\t\ttaskDetailBottomSlot,\n\t} = usePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst navigate =\n\t\toverrideNavigate ||\n\t\t((path: string) => {\n\t\t\twindow.location.href = path;\n\t\t});\n\tconst Link = OverrideLink || \"a\";\n\n\tconst { deleteBoard, isDeleting } = useBoardMutations();\n\tconst { deleteColumn, reorderColumns } = useColumnMutations();\n\tconst { deleteTask, moveTask, reorderTasks } = useTaskMutations();\n\n\tconst [modalState, setModalState] = useState<ModalState>({ type: \"none\" });\n\n\t// Helper function to convert board columns to kanban state format\n\tconst computeKanbanData = useCallback(\n\t\t(\n\t\t\tcolumns: SerializedColumn[] | undefined,\n\t\t): Record<string, SerializedTask[]> => {\n\t\t\tif (!columns) return {};\n\t\t\treturn columns.reduce(\n\t\t\t\t(acc, column) => {\n\t\t\t\t\tacc[column.id] = column.tasks || [];\n\t\t\t\t\treturn acc;\n\t\t\t\t},\n\t\t\t\t{} as Record<string, SerializedTask[]>,\n\t\t\t);\n\t\t},\n\t\t[],\n\t);\n\n\t// Initialize kanbanState with data from board to avoid flash of empty state\n\t// Using lazy initializer ensures we have the correct state on first render\n\tconst [kanbanState, setKanbanState] = useState<\n\t\tRecord<string, SerializedTask[]>\n\t>(() => computeKanbanData(board?.columns));\n\n\t// Keep kanbanState in sync when server data changes (e.g., after refetch)\n\tconst serverKanbanData = useMemo(\n\t\t() => computeKanbanData(board?.columns),\n\t\t[board?.columns, computeKanbanData],\n\t);\n\n\tuseEffect(() => {\n\t\tsetKanbanState(serverKanbanData);\n\t}, [serverKanbanData]);\n\n\tconst closeModal = useCallback(() => {\n\t\tsetModalState({ type: \"none\" });\n\t}, []);\n\n\tconst handleDeleteBoard = useCallback(async () => {\n\t\ttry {\n\t\t\tawait deleteBoard(boardId);\n\t\t\tcloseModal();\n\t\t\t// Use both navigate and a fallback to ensure navigation works\n\t\t\t// Some frameworks may have issues with router.push after mutations\n\t\t\tnavigate(\"/pages/kanban\");\n\t\t\t// Fallback: if navigate doesn't work, use window.location\n\t\t\tif (typeof window !== \"undefined\") {\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t// Only redirect if we're still on the same page after 100ms\n\t\t\t\t\tif (window.location.pathname.includes(boardId)) {\n\t\t\t\t\t\twindow.location.href = \"/pages/kanban\";\n\t\t\t\t\t}\n\t\t\t\t}, 100);\n\t\t\t}\n\t\t} catch (error) {\n\t\t\tconst message =\n\t\t\t\terror instanceof Error ? error.message : \"Failed to delete board\";\n\t\t\ttoast.error(message);\n\t\t}\n\t}, [deleteBoard, boardId, navigate, closeModal]);\n\n\tconst handleKanbanChange = useCallback(\n\t\tasync (newData: Record<string, SerializedTask[]>) => {\n\t\t\tif (!board) return;\n\n\t\t\t// Capture current state for change detection\n\t\t\t// Note: We use a functional update to get the actual current state,\n\t\t\t// avoiding stale closure issues with rapid successive operations\n\t\t\tlet previousState: Record<string, SerializedTask[]> = {};\n\t\t\tsetKanbanState((current) => {\n\t\t\t\tpreviousState = current;\n\t\t\t\treturn newData;\n\t\t\t});\n\n\t\t\ttry {\n\t\t\t\t// Detect column reorder\n\t\t\t\tconst oldKeys = Object.keys(previousState);\n\t\t\t\tconst newKeys = Object.keys(newData);\n\t\t\t\tconst isColumnMove =\n\t\t\t\t\toldKeys.length === newKeys.length &&\n\t\t\t\t\toldKeys.join(\"\") !== newKeys.join(\"\");\n\n\t\t\t\tif (isColumnMove) {\n\t\t\t\t\t// Column reorder - use atomic batch endpoint with transaction support\n\t\t\t\t\tawait reorderColumns(board.id, newKeys);\n\t\t\t\t} else {\n\t\t\t\t\t// Task changes - detect cross-column moves and within-column reorders\n\t\t\t\t\tconst crossColumnMoves: Array<{\n\t\t\t\t\t\ttaskId: string;\n\t\t\t\t\t\ttargetColumnId: string;\n\t\t\t\t\t\ttargetOrder: number;\n\t\t\t\t\t}> = [];\n\t\t\t\t\tconst columnsToReorder: Map<string, string[]> = new Map();\n\t\t\t\t\tconst targetColumnsOfCrossMove = new Set<string>();\n\n\t\t\t\t\tfor (const [columnId, tasks] of Object.entries(newData)) {\n\t\t\t\t\t\tconst oldTasks = previousState[columnId] || [];\n\t\t\t\t\t\tlet hasOrderChanges = false;\n\n\t\t\t\t\t\tfor (let i = 0; i < tasks.length; i++) {\n\t\t\t\t\t\t\tconst task = tasks[i];\n\t\t\t\t\t\t\tif (!task) continue;\n\n\t\t\t\t\t\t\tif (task.columnId !== columnId) {\n\t\t\t\t\t\t\t\t// Task moved from another column - needs cross-column move\n\t\t\t\t\t\t\t\tcrossColumnMoves.push({\n\t\t\t\t\t\t\t\t\ttaskId: task.id,\n\t\t\t\t\t\t\t\t\ttargetColumnId: columnId,\n\t\t\t\t\t\t\t\t\ttargetOrder: i,\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\ttargetColumnsOfCrossMove.add(columnId);\n\t\t\t\t\t\t\t} else if (task.order !== i) {\n\t\t\t\t\t\t\t\t// Task order changed within same column\n\t\t\t\t\t\t\t\thasOrderChanges = true;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Check if tasks were removed from this column (moved elsewhere)\n\t\t\t\t\t\tconst newTaskIds = new Set(tasks.map((t) => t.id));\n\t\t\t\t\t\tconst tasksRemoved = oldTasks.some((t) => !newTaskIds.has(t.id));\n\n\t\t\t\t\t\t// If order changes within column (not a target of cross-column move),\n\t\t\t\t\t\t// use atomic reorder\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\thasOrderChanges &&\n\t\t\t\t\t\t\t!targetColumnsOfCrossMove.has(columnId) &&\n\t\t\t\t\t\t\t!tasksRemoved\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tcolumnsToReorder.set(\n\t\t\t\t\t\t\t\tcolumnId,\n\t\t\t\t\t\t\t\ttasks.map((t) => t.id),\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// Handle cross-column moves first (these need individual moveTask calls)\n\t\t\t\t\tfor (const move of crossColumnMoves) {\n\t\t\t\t\t\tawait moveTask(move.taskId, move.targetColumnId, move.targetOrder);\n\t\t\t\t\t}\n\n\t\t\t\t\t// Then handle within-column reorders atomically\n\t\t\t\t\tfor (const [columnId, taskIds] of columnsToReorder) {\n\t\t\t\t\t\tawait reorderTasks(columnId, taskIds);\n\t\t\t\t\t}\n\n\t\t\t\t\t// Reorder target columns of cross-column moves to fix order collisions\n\t\t\t\t\t// The moveTask only sets the moved task's order, so other tasks need reordering\n\t\t\t\t\tfor (const targetColumnId of targetColumnsOfCrossMove) {\n\t\t\t\t\t\tconst tasks = newData[targetColumnId];\n\t\t\t\t\t\tif (tasks) {\n\t\t\t\t\t\t\tawait reorderTasks(\n\t\t\t\t\t\t\t\ttargetColumnId,\n\t\t\t\t\t\t\t\ttasks.map((t) => t.id),\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// Sync with server after successful mutations\n\t\t\t\trefetch();\n\t\t\t} catch (error) {\n\t\t\t\t// On error, refetch from server to get the authoritative state.\n\t\t\t\t// We avoid manual rollback to previousState because with rapid successive\n\t\t\t\t// operations, the captured previousState may be stale - a later operation\n\t\t\t\t// may have already updated the state, and reverting would incorrectly\n\t\t\t\t// undo that operation too. The server is the source of truth.\n\t\t\t\trefetch();\n\t\t\t\t// Re-throw so error boundaries or toast handlers can catch it\n\t\t\t\tthrow error;\n\t\t\t}\n\t\t},\n\t\t[board, reorderColumns, moveTask, reorderTasks, refetch],\n\t);\n\n\tconst orderedColumns = useMemo(() => {\n\t\tif (!board?.columns) return [];\n\t\tconst columnMap = new Map(board.columns.map((c) => [c.id, c]));\n\t\treturn Object.keys(kanbanState)\n\t\t\t.map((columnId) => {\n\t\t\t\tconst column = columnMap.get(columnId);\n\t\t\t\tif (!column) return null;\n\t\t\t\treturn {\n\t\t\t\t\t...column,\n\t\t\t\t\ttasks: kanbanState[columnId] || [],\n\t\t\t\t};\n\t\t\t})\n\t\t\t.filter(\n\t\t\t\t(c): c is SerializedColumn & { tasks: SerializedTask[] } => c !== null,\n\t\t\t);\n\t}, [board?.columns, kanbanState]);\n\n\t// Board not found - only shown after data has loaded (not during loading)\n\tif (!board) {\n\t\treturn (\n\t\t\t<EmptyState\n\t\t\t\ttitle=\"Board not found\"\n\t\t\t\tdescription=\"The board you're looking for doesn't exist or you don't have access to it.\"\n\t\t\t\taction={\n\t\t\t\t\t<Button onClick={() => navigate(\"/pages/kanban\")}>\n\t\t\t\t\t\t<ArrowLeft className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\tBack to Boards\n\t\t\t\t\t</Button>\n\t\t\t\t}\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<PageWrapper\n\t\t\tdata-testid=\"board-page\"\n\t\t\tclassName=\"flex flex-col items-center\"\n\t\t>\n\t\t\t<div className=\"w-full flex items-center justify-between mb-8\">\n\t\t\t\t<div className=\"flex items-center gap-4\">\n\t\t\t\t\t<Link\n\t\t\t\t\t\thref=\"/pages/kanban\"\n\t\t\t\t\t\tclassName=\"text-muted-foreground hover:text-foreground\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<ArrowLeft className=\"h-5 w-5\" />\n\t\t\t\t\t</Link>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<h1 className=\"text-3xl font-bold\" data-testid=\"page-header\">\n\t\t\t\t\t\t\t{board.name}\n\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t{board.description && (\n\t\t\t\t\t\t\t<p className=\"text-muted-foreground mt-1\">{board.description}</p>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<DropdownMenu>\n\t\t\t\t\t<DropdownMenuTrigger asChild>\n\t\t\t\t\t\t<Button variant=\"outline\">\n\t\t\t\t\t\t\t<Settings className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\tActions\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</DropdownMenuTrigger>\n\t\t\t\t\t<DropdownMenuContent align=\"end\">\n\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\tonClick={() => setModalState({ type: \"addColumn\" })}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\tAdd Column\n\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\tonClick={() => setModalState({ type: \"editBoard\" })}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Pencil className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\tEdit Board\n\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t<DropdownMenuSeparator />\n\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\tonClick={() => setModalState({ type: \"deleteBoard\" })}\n\t\t\t\t\t\t\tclassName=\"text-red-600 focus:text-red-600\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Trash2 className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\tDelete Board\n\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t</DropdownMenuContent>\n\t\t\t\t</DropdownMenu>\n\t\t\t</div>\n\n\t\t\t{orderedColumns.length > 0 ? (\n\t\t\t\t<KanbanBoard\n\t\t\t\t\tcolumns={orderedColumns}\n\t\t\t\t\tkanbanState={kanbanState}\n\t\t\t\t\tonKanbanChange={handleKanbanChange}\n\t\t\t\t\tonAddTask={(columnId) => setModalState({ type: \"addTask\", columnId })}\n\t\t\t\t\tonEditTask={(columnId, taskId) =>\n\t\t\t\t\t\tsetModalState({ type: \"editTask\", columnId, taskId })\n\t\t\t\t\t}\n\t\t\t\t\tonEditColumn={(columnId) =>\n\t\t\t\t\t\tsetModalState({ type: \"editColumn\", columnId })\n\t\t\t\t\t}\n\t\t\t\t\tonDeleteColumn={(columnId) =>\n\t\t\t\t\t\tsetModalState({ type: \"deleteColumn\", columnId })\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<EmptyState\n\t\t\t\t\ttitle=\"No columns yet\"\n\t\t\t\t\tdescription=\"Create your first column to start organizing tasks.\"\n\t\t\t\t\taction={\n\t\t\t\t\t\t<Button onClick={() => setModalState({ type: \"addColumn\" })}>\n\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\tAdd Column\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{/* Add Column Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"addColumn\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent>\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>Add Column</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\tAdd a new column to this board.\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t<ColumnForm\n\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\tonSuccess={() => {\n\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t\trefetch();\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Edit Column Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"editColumn\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent>\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>Edit Column</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>Update the column details.</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t{modalState.type === \"editColumn\" && (\n\t\t\t\t\t\t<ColumnForm\n\t\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\t\tcolumnId={modalState.columnId}\n\t\t\t\t\t\t\tcolumn={board.columns?.find((c) => c.id === modalState.columnId)}\n\t\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\t\tonSuccess={() => {\n\t\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t\t\trefetch();\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Delete Column Modal */}\n\t\t\t<AlertDialog\n\t\t\t\topen={modalState.type === \"deleteColumn\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<AlertDialogContent>\n\t\t\t\t\t<AlertDialogHeader>\n\t\t\t\t\t\t<AlertDialogTitle>Delete Column</AlertDialogTitle>\n\t\t\t\t\t\t<AlertDialogDescription>\n\t\t\t\t\t\t\tAre you sure you want to delete this column? All tasks in this\n\t\t\t\t\t\t\tcolumn will be permanently removed.\n\t\t\t\t\t\t</AlertDialogDescription>\n\t\t\t\t\t</AlertDialogHeader>\n\t\t\t\t\t<AlertDialogFooter>\n\t\t\t\t\t\t<AlertDialogCancel>Cancel</AlertDialogCancel>\n\t\t\t\t\t\t<AlertDialogAction\n\t\t\t\t\t\t\tonClick={async () => {\n\t\t\t\t\t\t\t\tif (modalState.type === \"deleteColumn\") {\n\t\t\t\t\t\t\t\t\ttry {\n\t\t\t\t\t\t\t\t\t\tawait deleteColumn(modalState.columnId);\n\t\t\t\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t\t\t\t\trefetch();\n\t\t\t\t\t\t\t\t\t} catch (error) {\n\t\t\t\t\t\t\t\t\t\tconst message =\n\t\t\t\t\t\t\t\t\t\t\terror instanceof Error\n\t\t\t\t\t\t\t\t\t\t\t\t? error.message\n\t\t\t\t\t\t\t\t\t\t\t\t: \"Failed to delete column\";\n\t\t\t\t\t\t\t\t\t\ttoast.error(message);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tclassName=\"bg-red-600 hover:bg-red-700\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\tDelete\n\t\t\t\t\t\t</AlertDialogAction>\n\t\t\t\t\t</AlertDialogFooter>\n\t\t\t\t</AlertDialogContent>\n\t\t\t</AlertDialog>\n\n\t\t\t{/* Edit Board Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"editBoard\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent>\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>Edit Board</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>Update board details.</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t<BoardForm\n\t\t\t\t\t\tboard={board}\n\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\tonSuccess={() => {\n\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t\trefetch();\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Delete Board Modal */}\n\t\t\t<AlertDialog\n\t\t\t\topen={modalState.type === \"deleteBoard\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<AlertDialogContent>\n\t\t\t\t\t<AlertDialogHeader>\n\t\t\t\t\t\t<AlertDialogTitle>Delete Board</AlertDialogTitle>\n\t\t\t\t\t\t<AlertDialogDescription>\n\t\t\t\t\t\t\tAre you sure you want to delete this board? This action cannot be\n\t\t\t\t\t\t\tundone. All columns and tasks will be permanently removed.\n\t\t\t\t\t\t</AlertDialogDescription>\n\t\t\t\t\t</AlertDialogHeader>\n\t\t\t\t\t<AlertDialogFooter>\n\t\t\t\t\t\t<AlertDialogCancel>Cancel</AlertDialogCancel>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tonClick={handleDeleteBoard}\n\t\t\t\t\t\t\tdisabled={isDeleting}\n\t\t\t\t\t\t\tclassName=\"bg-red-600 hover:bg-red-700\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{isDeleting ? \"Deleting...\" : \"Delete\"}\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</AlertDialogFooter>\n\t\t\t\t</AlertDialogContent>\n\t\t\t</AlertDialog>\n\n\t\t\t{/* Add Task Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"addTask\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent className=\"max-w-3xl! max-h-screen overflow-y-auto\">\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>Add Task</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>Create a new task.</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t{modalState.type === \"addTask\" && (\n\t\t\t\t\t\t<TaskForm\n\t\t\t\t\t\t\tcolumnId={modalState.columnId}\n\t\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\t\tcolumns={board.columns || []}\n\t\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\t\tonSuccess={() => {\n\t\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t\t\trefetch();\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Edit Task Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"editTask\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent className=\"max-w-3xl! max-h-screen overflow-y-auto\">\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>Edit Task</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>Update task details.</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t{modalState.type === \"editTask\" && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<TaskForm\n\t\t\t\t\t\t\t\tcolumnId={modalState.columnId}\n\t\t\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\t\t\ttaskId={modalState.taskId}\n\t\t\t\t\t\t\t\ttask={board.columns\n\t\t\t\t\t\t\t\t\t?.find((c) => c.id === modalState.columnId)\n\t\t\t\t\t\t\t\t\t?.tasks?.find((t) => t.id === modalState.taskId)}\n\t\t\t\t\t\t\t\tcolumns={board.columns || []}\n\t\t\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\t\t\tonSuccess={() => {\n\t\t\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t\t\t\trefetch();\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tonDelete={async () => {\n\t\t\t\t\t\t\t\t\ttry {\n\t\t\t\t\t\t\t\t\t\tawait deleteTask(modalState.taskId);\n\t\t\t\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t\t\t\t\trefetch();\n\t\t\t\t\t\t\t\t\t} catch (error) {\n\t\t\t\t\t\t\t\t\t\tconst message =\n\t\t\t\t\t\t\t\t\t\t\terror instanceof Error\n\t\t\t\t\t\t\t\t\t\t\t\t? error.message\n\t\t\t\t\t\t\t\t\t\t\t\t: \"Failed to delete task\";\n\t\t\t\t\t\t\t\t\t\ttoast.error(message);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{taskDetailBottomSlot &&\n\t\t\t\t\t\t\t\t(() => {\n\t\t\t\t\t\t\t\t\tconst task = board.columns\n\t\t\t\t\t\t\t\t\t\t?.find((c) => c.id === modalState.columnId)\n\t\t\t\t\t\t\t\t\t\t?.tasks?.find((t) => t.id === modalState.taskId);\n\t\t\t\t\t\t\t\t\treturn task ? (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"mt-4 pt-4 border-t\"\n\t\t\t\t\t\t\t\t\t\t\tdata-testid=\"task-detail-bottom-slot\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{taskDetailBottomSlot(task)}\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t) : null;\n\t\t\t\t\t\t\t\t})()}\n\t\t\t\t\t\t</>\n\t\t\t\t\t)}\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\t\t</PageWrapper>\n\t);\n}\n",
+      "content": "\"use client\";\n\nimport { useState, useCallback, useMemo, useEffect } from \"react\";\nimport { ArrowLeft, Plus, Settings, Trash2, Pencil } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n\tDropdownMenu,\n\tDropdownMenuContent,\n\tDropdownMenuItem,\n\tDropdownMenuSeparator,\n\tDropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport {\n\tDialog,\n\tDialogContent,\n\tDialogDescription,\n\tDialogHeader,\n\tDialogTitle,\n} from \"@/components/ui/dialog\";\nimport {\n\tAlertDialog,\n\tAlertDialogAction,\n\tAlertDialogCancel,\n\tAlertDialogContent,\n\tAlertDialogDescription,\n\tAlertDialogFooter,\n\tAlertDialogHeader,\n\tAlertDialogTitle,\n} from \"@/components/ui/alert-dialog\";\nimport {\n\tuseSuspenseBoard,\n\tuseBoardMutations,\n\tuseColumnMutations,\n\tuseTaskMutations,\n} from \"@btst/stack/plugins/kanban/client/hooks\";\nimport {\n\tCanAccess,\n\tuseCan,\n\tuseNotify,\n\tusePluginOverrides,\n\tuseTranslate,\n} from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\nimport { KanbanBoard } from \"../shared/kanban-board\";\nimport { ColumnForm } from \"../forms/column-form\";\nimport { BoardForm } from \"../forms/board-form\";\nimport { TaskForm } from \"../forms/task-form\";\nimport { PageWrapper } from \"../shared/page-wrapper\";\nimport { EmptyState } from \"../shared/empty-state\";\nimport type { SerializedTask, SerializedColumn } from \"../../../types\";\n\ninterface BoardPageProps {\n\tboardId: string;\n}\n\ntype ModalState =\n\t| { type: \"none\" }\n\t| { type: \"addColumn\" }\n\t| { type: \"editColumn\"; columnId: string }\n\t| { type: \"deleteColumn\"; columnId: string }\n\t| { type: \"editBoard\" }\n\t| { type: \"deleteBoard\" }\n\t| { type: \"addTask\"; columnId: string }\n\t| { type: \"editTask\"; columnId: string; taskId: string };\n\nexport function BoardPage({ boardId }: BoardPageProps) {\n\tconst t = useTranslate();\n\tconst notify = useNotify();\n\tconst { data: board, error, refetch, isFetching } = useSuspenseBoard(boardId);\n\n\t// Suspense hooks only throw on initial fetch, not refetch failures\n\tif (error && !isFetching) {\n\t\tthrow error;\n\t}\n\n\tconst {\n\t\tLink: OverrideLink,\n\t\tnavigate: overrideNavigate,\n\t\ttaskDetailBottomSlot,\n\t\tlocalization,\n\t} = usePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst navigate =\n\t\toverrideNavigate ||\n\t\t((path: string) => {\n\t\t\twindow.location.href = path;\n\t\t});\n\tconst Link = OverrideLink || \"a\";\n\n\tconst { deleteBoard, isDeleting } = useBoardMutations();\n\tconst { deleteColumn, reorderColumns } = useColumnMutations();\n\tconst { deleteTask, moveTask, reorderTasks } = useTaskMutations();\n\tconst { can: canMoveColumns, isPending: isCheckingColumnMove } = useCan({\n\t\tresource: \"kanban:column\",\n\t\taction: \"update\",\n\t\tparams: { boardId },\n\t});\n\tconst { can: canMoveTasks, isPending: isCheckingTaskMove } = useCan({\n\t\tresource: \"kanban:task\",\n\t\taction: \"update\",\n\t\tparams: { boardId },\n\t});\n\n\tconst [modalState, setModalState] = useState<ModalState>({ type: \"none\" });\n\n\t// Helper function to convert board columns to kanban state format\n\tconst computeKanbanData = useCallback(\n\t\t(\n\t\t\tcolumns: SerializedColumn[] | undefined,\n\t\t): Record<string, SerializedTask[]> => {\n\t\t\tif (!columns) return {};\n\t\t\treturn columns.reduce(\n\t\t\t\t(acc, column) => {\n\t\t\t\t\tacc[column.id] = column.tasks || [];\n\t\t\t\t\treturn acc;\n\t\t\t\t},\n\t\t\t\t{} as Record<string, SerializedTask[]>,\n\t\t\t);\n\t\t},\n\t\t[],\n\t);\n\n\t// Initialize kanbanState with data from board to avoid flash of empty state\n\t// Using lazy initializer ensures we have the correct state on first render\n\tconst [kanbanState, setKanbanState] = useState<\n\t\tRecord<string, SerializedTask[]>\n\t>(() => computeKanbanData(board?.columns));\n\n\t// Keep kanbanState in sync when server data changes (e.g., after refetch)\n\tconst serverKanbanData = useMemo(\n\t\t() => computeKanbanData(board?.columns),\n\t\t[board?.columns, computeKanbanData],\n\t);\n\n\tuseEffect(() => {\n\t\tsetKanbanState(serverKanbanData);\n\t}, [serverKanbanData]);\n\n\tconst closeModal = useCallback(() => {\n\t\tsetModalState({ type: \"none\" });\n\t}, []);\n\n\tconst handleDeleteBoard = useCallback(async () => {\n\t\ttry {\n\t\t\tawait deleteBoard(boardId);\n\t\t\tcloseModal();\n\t\t\t// Use both navigate and a fallback to ensure navigation works\n\t\t\t// Some frameworks may have issues with router.push after mutations\n\t\t\tnavigate(\"/pages/kanban\");\n\t\t\t// Fallback: if navigate doesn't work, use window.location\n\t\t\tif (typeof window !== \"undefined\") {\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t// Only redirect if we're still on the same page after 100ms\n\t\t\t\t\tif (window.location.pathname.includes(boardId)) {\n\t\t\t\t\t\twindow.location.href = \"/pages/kanban\";\n\t\t\t\t\t}\n\t\t\t\t}, 100);\n\t\t\t}\n\t\t} catch (error) {\n\t\t\tconst message =\n\t\t\t\terror instanceof Error\n\t\t\t\t\t? error.message\n\t\t\t\t\t: (localization?.deleteBoardError ??\n\t\t\t\t\t\tt(\"kanban.common.deleteBoardError\", \"Failed to delete board\"));\n\t\t\tnotify.error(message);\n\t\t}\n\t}, [\n\t\tdeleteBoard,\n\t\tboardId,\n\t\tnavigate,\n\t\tcloseModal,\n\t\tlocalization?.deleteBoardError,\n\t\tnotify,\n\t\tt,\n\t]);\n\n\tconst handleKanbanChange = useCallback(\n\t\tasync (newData: Record<string, SerializedTask[]>) => {\n\t\t\tif (!board) return;\n\n\t\t\t// Capture current state for change detection\n\t\t\t// Note: We use a functional update to get the actual current state,\n\t\t\t// avoiding stale closure issues with rapid successive operations\n\t\t\tlet previousState: Record<string, SerializedTask[]> = {};\n\t\t\tsetKanbanState((current) => {\n\t\t\t\tpreviousState = current;\n\t\t\t\treturn newData;\n\t\t\t});\n\n\t\t\ttry {\n\t\t\t\t// Detect column reorder\n\t\t\t\tconst oldKeys = Object.keys(previousState);\n\t\t\t\tconst newKeys = Object.keys(newData);\n\t\t\t\tconst isColumnMove =\n\t\t\t\t\toldKeys.length === newKeys.length &&\n\t\t\t\t\toldKeys.join(\"\") !== newKeys.join(\"\");\n\n\t\t\t\tif (isColumnMove) {\n\t\t\t\t\t// Column reorder - use atomic batch endpoint with transaction support\n\t\t\t\t\tawait reorderColumns(board.id, newKeys);\n\t\t\t\t} else {\n\t\t\t\t\t// Task changes - detect cross-column moves and within-column reorders\n\t\t\t\t\tconst crossColumnMoves: Array<{\n\t\t\t\t\t\ttaskId: string;\n\t\t\t\t\t\ttargetColumnId: string;\n\t\t\t\t\t\ttargetOrder: number;\n\t\t\t\t\t}> = [];\n\t\t\t\t\tconst columnsToReorder: Map<string, string[]> = new Map();\n\t\t\t\t\tconst targetColumnsOfCrossMove = new Set<string>();\n\n\t\t\t\t\tfor (const [columnId, tasks] of Object.entries(newData)) {\n\t\t\t\t\t\tconst oldTasks = previousState[columnId] || [];\n\t\t\t\t\t\tlet hasOrderChanges = false;\n\n\t\t\t\t\t\tfor (let i = 0; i < tasks.length; i++) {\n\t\t\t\t\t\t\tconst task = tasks[i];\n\t\t\t\t\t\t\tif (!task) continue;\n\n\t\t\t\t\t\t\tif (task.columnId !== columnId) {\n\t\t\t\t\t\t\t\t// Task moved from another column - needs cross-column move\n\t\t\t\t\t\t\t\tcrossColumnMoves.push({\n\t\t\t\t\t\t\t\t\ttaskId: task.id,\n\t\t\t\t\t\t\t\t\ttargetColumnId: columnId,\n\t\t\t\t\t\t\t\t\ttargetOrder: i,\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\ttargetColumnsOfCrossMove.add(columnId);\n\t\t\t\t\t\t\t} else if (task.order !== i) {\n\t\t\t\t\t\t\t\t// Task order changed within same column\n\t\t\t\t\t\t\t\thasOrderChanges = true;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Check if tasks were removed from this column (moved elsewhere)\n\t\t\t\t\t\tconst newTaskIds = new Set(tasks.map((t) => t.id));\n\t\t\t\t\t\tconst tasksRemoved = oldTasks.some((t) => !newTaskIds.has(t.id));\n\n\t\t\t\t\t\t// If order changes within column (not a target of cross-column move),\n\t\t\t\t\t\t// use atomic reorder\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\thasOrderChanges &&\n\t\t\t\t\t\t\t!targetColumnsOfCrossMove.has(columnId) &&\n\t\t\t\t\t\t\t!tasksRemoved\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tcolumnsToReorder.set(\n\t\t\t\t\t\t\t\tcolumnId,\n\t\t\t\t\t\t\t\ttasks.map((t) => t.id),\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// Handle cross-column moves first (these need individual moveTask calls)\n\t\t\t\t\tfor (const move of crossColumnMoves) {\n\t\t\t\t\t\tawait moveTask(move.taskId, move.targetColumnId, move.targetOrder);\n\t\t\t\t\t}\n\n\t\t\t\t\t// Then handle within-column reorders atomically\n\t\t\t\t\tfor (const [columnId, taskIds] of columnsToReorder) {\n\t\t\t\t\t\tawait reorderTasks(columnId, taskIds);\n\t\t\t\t\t}\n\n\t\t\t\t\t// Reorder target columns of cross-column moves to fix order collisions\n\t\t\t\t\t// The moveTask only sets the moved task's order, so other tasks need reordering\n\t\t\t\t\tfor (const targetColumnId of targetColumnsOfCrossMove) {\n\t\t\t\t\t\tconst tasks = newData[targetColumnId];\n\t\t\t\t\t\tif (tasks) {\n\t\t\t\t\t\t\tawait reorderTasks(\n\t\t\t\t\t\t\t\ttargetColumnId,\n\t\t\t\t\t\t\t\ttasks.map((t) => t.id),\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// Sync with server after successful mutations\n\t\t\t\trefetch();\n\t\t\t} catch (error) {\n\t\t\t\t// On error, refetch from server to get the authoritative state.\n\t\t\t\t// We avoid manual rollback to previousState because with rapid successive\n\t\t\t\t// operations, the captured previousState may be stale - a later operation\n\t\t\t\t// may have already updated the state, and reverting would incorrectly\n\t\t\t\t// undo that operation too. The server is the source of truth.\n\t\t\t\trefetch();\n\t\t\t\t// Re-throw so the caller's error handling can surface it\n\t\t\t\tthrow error;\n\t\t\t}\n\t\t},\n\t\t[board, reorderColumns, moveTask, reorderTasks, refetch],\n\t);\n\n\tconst orderedColumns = useMemo(() => {\n\t\tif (!board?.columns) return [];\n\t\tconst columnMap = new Map(board.columns.map((c) => [c.id, c]));\n\t\treturn Object.keys(kanbanState)\n\t\t\t.map((columnId) => {\n\t\t\t\tconst column = columnMap.get(columnId);\n\t\t\t\tif (!column) return null;\n\t\t\t\treturn {\n\t\t\t\t\t...column,\n\t\t\t\t\ttasks: kanbanState[columnId] || [],\n\t\t\t\t};\n\t\t\t})\n\t\t\t.filter(\n\t\t\t\t(c): c is SerializedColumn & { tasks: SerializedTask[] } => c !== null,\n\t\t\t);\n\t}, [board?.columns, kanbanState]);\n\n\t// Board not found - only shown after data has loaded (not during loading)\n\tif (!board) {\n\t\treturn (\n\t\t\t<EmptyState\n\t\t\t\ttitle={\n\t\t\t\t\tlocalization?.boardNotFound ??\n\t\t\t\t\tt(\"kanban.list.boardNotFound\", \"Board not found\")\n\t\t\t\t}\n\t\t\t\tdescription={\n\t\t\t\t\tlocalization?.boardNotFoundDescription ??\n\t\t\t\t\tt(\n\t\t\t\t\t\t\"kanban.list.boardNotFoundDescription\",\n\t\t\t\t\t\t\"The board you're looking for doesn't exist or you don't have access to it.\",\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t\taction={\n\t\t\t\t\t<Button onClick={() => navigate(\"/pages/kanban\")}>\n\t\t\t\t\t\t<ArrowLeft className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t{localization?.backToBoards ??\n\t\t\t\t\t\t\tt(\"kanban.common.backToBoards\", \"Back to Boards\")}\n\t\t\t\t\t</Button>\n\t\t\t\t}\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<PageWrapper\n\t\t\tdata-testid=\"board-page\"\n\t\t\tclassName=\"flex flex-col items-center\"\n\t\t>\n\t\t\t<div className=\"w-full flex items-center justify-between mb-8\">\n\t\t\t\t<div className=\"flex items-center gap-4\">\n\t\t\t\t\t<Link\n\t\t\t\t\t\thref=\"/pages/kanban\"\n\t\t\t\t\t\tclassName=\"text-muted-foreground hover:text-foreground\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<ArrowLeft className=\"h-5 w-5\" />\n\t\t\t\t\t</Link>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<h1 className=\"text-3xl font-bold\" data-testid=\"page-header\">\n\t\t\t\t\t\t\t{board.name}\n\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t{board.description && (\n\t\t\t\t\t\t\t<p className=\"text-muted-foreground mt-1\">{board.description}</p>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<DropdownMenu>\n\t\t\t\t\t<DropdownMenuTrigger asChild>\n\t\t\t\t\t\t<Button variant=\"outline\">\n\t\t\t\t\t\t\t<Settings className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t{localization?.actions ?? t(\"kanban.common.actions\", \"Actions\")}\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</DropdownMenuTrigger>\n\t\t\t\t\t<DropdownMenuContent align=\"end\">\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:column\"\n\t\t\t\t\t\t\taction=\"create\"\n\t\t\t\t\t\t\tparams={{ boardId }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\tonClick={() => setModalState({ type: \"addColumn\" })}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.addColumn ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.list.addColumn\", \"Add Column\")}\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:board\"\n\t\t\t\t\t\t\taction=\"update\"\n\t\t\t\t\t\t\tparams={{ id: boardId }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\tonClick={() => setModalState({ type: \"editBoard\" })}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Pencil className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.editBoard ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.list.editBoard\", \"Edit Board\")}\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t\t<DropdownMenuSeparator />\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:board\"\n\t\t\t\t\t\t\taction=\"delete\"\n\t\t\t\t\t\t\tparams={{ id: boardId }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\tonClick={() => setModalState({ type: \"deleteBoard\" })}\n\t\t\t\t\t\t\t\tclassName=\"text-red-600 focus:text-red-600\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Trash2 className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.deleteBoard ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.forms.deleteBoard\", \"Delete Board\")}\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t</DropdownMenuContent>\n\t\t\t\t</DropdownMenu>\n\t\t\t</div>\n\n\t\t\t{orderedColumns.length > 0 ? (\n\t\t\t\t<KanbanBoard\n\t\t\t\t\tboardId={boardId}\n\t\t\t\t\tcolumns={orderedColumns}\n\t\t\t\t\tkanbanState={kanbanState}\n\t\t\t\t\tcanMoveColumns={!isCheckingColumnMove && canMoveColumns}\n\t\t\t\t\tcanMoveTasks={!isCheckingTaskMove && canMoveTasks}\n\t\t\t\t\tonKanbanChange={handleKanbanChange}\n\t\t\t\t\tonAddTask={(columnId) => setModalState({ type: \"addTask\", columnId })}\n\t\t\t\t\tonEditTask={(columnId, taskId) =>\n\t\t\t\t\t\tsetModalState({ type: \"editTask\", columnId, taskId })\n\t\t\t\t\t}\n\t\t\t\t\tonEditColumn={(columnId) =>\n\t\t\t\t\t\tsetModalState({ type: \"editColumn\", columnId })\n\t\t\t\t\t}\n\t\t\t\t\tonDeleteColumn={(columnId) =>\n\t\t\t\t\t\tsetModalState({ type: \"deleteColumn\", columnId })\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<EmptyState\n\t\t\t\t\ttitle={\n\t\t\t\t\t\tlocalization?.noColumns ??\n\t\t\t\t\t\tt(\"kanban.common.noColumns\", \"No columns yet\")\n\t\t\t\t\t}\n\t\t\t\t\tdescription={\n\t\t\t\t\t\tlocalization?.noColumnsDescription ??\n\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\"kanban.list.noColumnsDescription\",\n\t\t\t\t\t\t\t\"Create your first column to start organizing tasks.\",\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\taction={\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:column\"\n\t\t\t\t\t\t\taction=\"create\"\n\t\t\t\t\t\t\tparams={{ boardId }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Button onClick={() => setModalState({ type: \"addColumn\" })}>\n\t\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.addColumn ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.list.addColumn\", \"Add Column\")}\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{/* Add Column Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"addColumn\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent>\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>\n\t\t\t\t\t\t\t{localization?.addColumn ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.addColumn\", \"Add Column\")}\n\t\t\t\t\t\t</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\t{localization?.addColumnDescription ??\n\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\"kanban.list.addColumnDescription\",\n\t\t\t\t\t\t\t\t\t\"Add a new column to this board.\",\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t<ColumnForm\n\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\tonSuccess={closeModal}\n\t\t\t\t\t/>\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Edit Column Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"editColumn\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent>\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>\n\t\t\t\t\t\t\t{localization?.editColumn ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.editColumn\", \"Edit Column\")}\n\t\t\t\t\t\t</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\t{localization?.editColumnDescription ??\n\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\"kanban.list.editColumnDescription\",\n\t\t\t\t\t\t\t\t\t\"Update the column details.\",\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t{modalState.type === \"editColumn\" && (\n\t\t\t\t\t\t<ColumnForm\n\t\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\t\tcolumnId={modalState.columnId}\n\t\t\t\t\t\t\tcolumn={board.columns?.find((c) => c.id === modalState.columnId)}\n\t\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\t\tonSuccess={closeModal}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Delete Column Modal */}\n\t\t\t<AlertDialog\n\t\t\t\topen={modalState.type === \"deleteColumn\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<AlertDialogContent>\n\t\t\t\t\t<AlertDialogHeader>\n\t\t\t\t\t\t<AlertDialogTitle>\n\t\t\t\t\t\t\t{localization?.deleteColumn ??\n\t\t\t\t\t\t\t\tt(\"kanban.forms.deleteColumn\", \"Delete Column\")}\n\t\t\t\t\t\t</AlertDialogTitle>\n\t\t\t\t\t\t<AlertDialogDescription>\n\t\t\t\t\t\t\t{localization?.deleteColumnConfirm ??\n\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\"kanban.forms.deleteColumnConfirm\",\n\t\t\t\t\t\t\t\t\t\"Are you sure you want to delete this column? All tasks in this column will be permanently removed.\",\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</AlertDialogDescription>\n\t\t\t\t\t</AlertDialogHeader>\n\t\t\t\t\t<AlertDialogFooter>\n\t\t\t\t\t\t<AlertDialogCancel>\n\t\t\t\t\t\t\t{localization?.cancel ?? t(\"kanban.common.cancel\", \"Cancel\")}\n\t\t\t\t\t\t</AlertDialogCancel>\n\t\t\t\t\t\t<AlertDialogAction\n\t\t\t\t\t\t\tonClick={async () => {\n\t\t\t\t\t\t\t\tif (modalState.type === \"deleteColumn\") {\n\t\t\t\t\t\t\t\t\ttry {\n\t\t\t\t\t\t\t\t\t\tawait deleteColumn(modalState.columnId);\n\t\t\t\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t\t\t\t} catch (error) {\n\t\t\t\t\t\t\t\t\t\tconst message =\n\t\t\t\t\t\t\t\t\t\t\terror instanceof Error\n\t\t\t\t\t\t\t\t\t\t\t\t? error.message\n\t\t\t\t\t\t\t\t\t\t\t\t: (localization?.deleteColumnError ??\n\t\t\t\t\t\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"kanban.common.deleteColumnError\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"Failed to delete column\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t));\n\t\t\t\t\t\t\t\t\t\tnotify.error(message);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tclassName=\"bg-red-600 hover:bg-red-700\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{localization?.delete ?? t(\"kanban.common.delete\", \"Delete\")}\n\t\t\t\t\t\t</AlertDialogAction>\n\t\t\t\t\t</AlertDialogFooter>\n\t\t\t\t</AlertDialogContent>\n\t\t\t</AlertDialog>\n\n\t\t\t{/* Edit Board Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"editBoard\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent>\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>\n\t\t\t\t\t\t\t{localization?.editBoard ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.editBoard\", \"Edit Board\")}\n\t\t\t\t\t\t</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\t{localization?.editBoardDescription ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.editBoardDescription\", \"Update board details.\")}\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t<BoardForm\n\t\t\t\t\t\tboard={board}\n\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\tonSuccess={closeModal}\n\t\t\t\t\t/>\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Delete Board Modal */}\n\t\t\t<AlertDialog\n\t\t\t\topen={modalState.type === \"deleteBoard\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<AlertDialogContent>\n\t\t\t\t\t<AlertDialogHeader>\n\t\t\t\t\t\t<AlertDialogTitle>\n\t\t\t\t\t\t\t{localization?.deleteBoard ??\n\t\t\t\t\t\t\t\tt(\"kanban.forms.deleteBoard\", \"Delete Board\")}\n\t\t\t\t\t\t</AlertDialogTitle>\n\t\t\t\t\t\t<AlertDialogDescription>\n\t\t\t\t\t\t\t{localization?.deleteBoardConfirm ??\n\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\"kanban.forms.deleteBoardConfirm\",\n\t\t\t\t\t\t\t\t\t\"Are you sure you want to delete this board? This action cannot be undone. All columns and tasks will be permanently removed.\",\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</AlertDialogDescription>\n\t\t\t\t\t</AlertDialogHeader>\n\t\t\t\t\t<AlertDialogFooter>\n\t\t\t\t\t\t<AlertDialogCancel>\n\t\t\t\t\t\t\t{localization?.cancel ?? t(\"kanban.common.cancel\", \"Cancel\")}\n\t\t\t\t\t\t</AlertDialogCancel>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tonClick={handleDeleteBoard}\n\t\t\t\t\t\t\tdisabled={isDeleting}\n\t\t\t\t\t\t\tclassName=\"bg-red-600 hover:bg-red-700\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{isDeleting\n\t\t\t\t\t\t\t\t? (localization?.deleting ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.common.deleting\", \"Deleting...\"))\n\t\t\t\t\t\t\t\t: (localization?.delete ?? t(\"kanban.common.delete\", \"Delete\"))}\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</AlertDialogFooter>\n\t\t\t\t</AlertDialogContent>\n\t\t\t</AlertDialog>\n\n\t\t\t{/* Add Task Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"addTask\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent className=\"max-w-3xl! max-h-screen overflow-y-auto\">\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>\n\t\t\t\t\t\t\t{localization?.addTask ?? t(\"kanban.list.addTask\", \"Add Task\")}\n\t\t\t\t\t\t</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\t{localization?.addTaskDescription ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.addTaskDescription\", \"Create a new task.\")}\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t{modalState.type === \"addTask\" && (\n\t\t\t\t\t\t<TaskForm\n\t\t\t\t\t\t\tcolumnId={modalState.columnId}\n\t\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\t\tcolumns={board.columns || []}\n\t\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\t\tonSuccess={closeModal}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Edit Task Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"editTask\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent className=\"max-w-3xl! max-h-screen overflow-y-auto\">\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>\n\t\t\t\t\t\t\t{localization?.editTask ?? t(\"kanban.list.editTask\", \"Edit Task\")}\n\t\t\t\t\t\t</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\t{localization?.editTaskDescription ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.editTaskDescription\", \"Update task details.\")}\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t{modalState.type === \"editTask\" && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<TaskForm\n\t\t\t\t\t\t\t\tcolumnId={modalState.columnId}\n\t\t\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\t\t\ttaskId={modalState.taskId}\n\t\t\t\t\t\t\t\ttask={board.columns\n\t\t\t\t\t\t\t\t\t?.find((c) => c.id === modalState.columnId)\n\t\t\t\t\t\t\t\t\t?.tasks?.find((t) => t.id === modalState.taskId)}\n\t\t\t\t\t\t\t\tcolumns={board.columns || []}\n\t\t\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\t\t\tonSuccess={closeModal}\n\t\t\t\t\t\t\t\tonDelete={async () => {\n\t\t\t\t\t\t\t\t\ttry {\n\t\t\t\t\t\t\t\t\t\tawait deleteTask(modalState.taskId);\n\t\t\t\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t\t\t\t} catch (error) {\n\t\t\t\t\t\t\t\t\t\tconst message =\n\t\t\t\t\t\t\t\t\t\t\terror instanceof Error\n\t\t\t\t\t\t\t\t\t\t\t\t? error.message\n\t\t\t\t\t\t\t\t\t\t\t\t: (localization?.deleteTaskError ??\n\t\t\t\t\t\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"kanban.common.deleteTaskError\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"Failed to delete task\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t));\n\t\t\t\t\t\t\t\t\t\tnotify.error(message);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{taskDetailBottomSlot &&\n\t\t\t\t\t\t\t\t(() => {\n\t\t\t\t\t\t\t\t\tconst task = board.columns\n\t\t\t\t\t\t\t\t\t\t?.find((c) => c.id === modalState.columnId)\n\t\t\t\t\t\t\t\t\t\t?.tasks?.find((t) => t.id === modalState.taskId);\n\t\t\t\t\t\t\t\t\treturn task ? (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"mt-4 pt-4 border-t\"\n\t\t\t\t\t\t\t\t\t\t\tdata-testid=\"task-detail-bottom-slot\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{taskDetailBottomSlot(task)}\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t) : null;\n\t\t\t\t\t\t\t\t})()}\n\t\t\t\t\t\t</>\n\t\t\t\t\t)}\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\t\t</PageWrapper>\n\t);\n}\n",
       "target": "src/components/btst/kanban/client/components/pages/board-page.internal.tsx"
     },
     {
       "path": "btst/kanban/client/components/pages/board-page.tsx",
       "type": "registry:page",
-      "content": "\"use client\";\n\nimport { lazy } from \"react\";\nimport { ComposedRoute } from \"@btst/stack/client/components\";\nimport { DefaultError } from \"../shared/default-error\";\nimport { BoardSkeleton } from \"../loading/board-skeleton\";\nimport { NotFoundPage } from \"./404-page\";\n\nconst BoardPage = lazy(() =>\n\timport(\"./board-page.internal\").then((m) => ({\n\t\tdefault: m.BoardPage,\n\t})),\n);\n\ninterface BoardPageComponentProps {\n\tboardId: string;\n}\n\nexport function BoardPageComponent({ boardId }: BoardPageComponentProps) {\n\treturn (\n\t\t<ComposedRoute\n\t\t\tpath={`/kanban/${boardId}`}\n\t\t\tPageComponent={BoardPage}\n\t\t\tErrorComponent={DefaultError}\n\t\t\tLoadingComponent={BoardSkeleton}\n\t\t\tNotFoundComponent={NotFoundPage}\n\t\t\tprops={{ boardId }}\n\t\t\tonError={(error) => console.error(\"BoardPage error:\", error)}\n\t\t/>\n\t);\n}\n",
+      "content": "\"use client\";\n\nimport { lazy } from \"react\";\nimport { ComposedRoute } from \"@btst/stack/client/components\";\nimport { DefaultError } from \"../shared/default-error\";\nimport { BoardSkeleton } from \"../loading/board-skeleton\";\nimport { NotFoundPage } from \"./404-page\";\n\nconst BoardPage = lazy(() =>\n\timport(\"./board-page.internal\").then((m) => ({\n\t\tdefault: m.BoardPage,\n\t})),\n);\n\ninterface BoardPageComponentProps {\n\tboardId: string;\n}\n\nexport function BoardPageComponent({ boardId }: BoardPageComponentProps) {\n\treturn (\n\t\t<ComposedRoute\n\t\t\tpath={`/kanban/${boardId}`}\n\t\t\tpermission={{\n\t\t\t\tresource: \"kanban:board\",\n\t\t\t\taction: \"read\",\n\t\t\t\tparams: { id: boardId },\n\t\t\t}}\n\t\t\tPageComponent={BoardPage}\n\t\t\tErrorComponent={DefaultError}\n\t\t\tLoadingComponent={BoardSkeleton}\n\t\t\tNotFoundComponent={NotFoundPage}\n\t\t\tprops={{ boardId }}\n\t\t\tonError={(error) => console.error(\"BoardPage error:\", error)}\n\t\t/>\n\t);\n}\n",
       "target": "src/components/btst/kanban/client/components/pages/board-page.tsx"
     },
     {
       "path": "btst/kanban/client/components/pages/boards-list-page.internal.tsx",
       "type": "registry:component",
-      "content": "\"use client\";\n\nimport { Plus } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n\tCard,\n\tCardContent,\n\tCardDescription,\n\tCardHeader,\n\tCardTitle,\n} from \"@/components/ui/card\";\nimport { useSuspenseBoards } from \"@btst/stack/plugins/kanban/client/hooks\";\nimport { usePluginOverrides } from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\nimport { EmptyState } from \"../shared/empty-state\";\nimport { PageWrapper } from \"../shared/page-wrapper\";\nimport { format } from \"date-fns\";\n\nexport function BoardsListPage() {\n\tconst { data: boards, error, isFetching } = useSuspenseBoards();\n\n\t// Suspense hooks only throw on initial fetch, not refetch failures\n\tif (error && !isFetching) {\n\t\tthrow error;\n\t}\n\tconst { Link: OverrideLink, navigate: overrideNavigate } =\n\t\tusePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst Link = OverrideLink || \"a\";\n\tconst navigate =\n\t\toverrideNavigate ||\n\t\t((path: string) => {\n\t\t\twindow.location.href = path;\n\t\t});\n\n\tconst handleNewBoard = () => {\n\t\tnavigate(\"/pages/kanban/new\");\n\t};\n\n\treturn (\n\t\t<PageWrapper data-testid=\"boards-list-page\">\n\t\t\t<div className=\"w-full flex items-center justify-between mb-8\">\n\t\t\t\t<div>\n\t\t\t\t\t<h1 className=\"text-3xl font-bold\" data-testid=\"page-header\">\n\t\t\t\t\t\tKanban Boards\n\t\t\t\t\t</h1>\n\t\t\t\t\t<p className=\"text-muted-foreground mt-1\">\n\t\t\t\t\t\tManage your projects and tasks\n\t\t\t\t\t</p>\n\t\t\t\t</div>\n\t\t\t\t<Button onClick={handleNewBoard}>\n\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\tNew Board\n\t\t\t\t</Button>\n\t\t\t</div>\n\n\t\t\t{boards.length > 0 ? (\n\t\t\t\t<div className=\"grid gap-4 md:grid-cols-2 lg:grid-cols-3\">\n\t\t\t\t\t{boards.map((board) => (\n\t\t\t\t\t\t<Link\n\t\t\t\t\t\t\tkey={board.id}\n\t\t\t\t\t\t\thref={`/pages/kanban/${board.id}`}\n\t\t\t\t\t\t\tclassName=\"block group\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Card className=\"h-full transition-shadow hover:shadow-md cursor-pointer\">\n\t\t\t\t\t\t\t\t<CardHeader>\n\t\t\t\t\t\t\t\t\t<CardTitle className=\"group-hover:text-primary transition-colors\">\n\t\t\t\t\t\t\t\t\t\t{board.name}\n\t\t\t\t\t\t\t\t\t</CardTitle>\n\t\t\t\t\t\t\t\t\t{board.description && (\n\t\t\t\t\t\t\t\t\t\t<CardDescription className=\"line-clamp-2\">\n\t\t\t\t\t\t\t\t\t\t\t{board.description}\n\t\t\t\t\t\t\t\t\t\t</CardDescription>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</CardHeader>\n\t\t\t\t\t\t\t\t<CardContent>\n\t\t\t\t\t\t\t\t\t<div className=\"flex items-center justify-between text-sm text-muted-foreground\">\n\t\t\t\t\t\t\t\t\t\t<span>{board.columns?.length || 0} columns</span>\n\t\t\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t\t\t{format(new Date(board.createdAt), \"MMM d, yyyy\")}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</CardContent>\n\t\t\t\t\t\t\t</Card>\n\t\t\t\t\t\t</Link>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t) : (\n\t\t\t\t<EmptyState\n\t\t\t\t\ttitle=\"No boards yet\"\n\t\t\t\t\tdescription=\"Create your first kanban board to start organizing your tasks.\"\n\t\t\t\t\taction={\n\t\t\t\t\t\t<Button onClick={handleNewBoard}>\n\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\tCreate Board\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</PageWrapper>\n\t);\n}\n",
+      "content": "\"use client\";\n\nimport { Plus } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n\tCard,\n\tCardContent,\n\tCardDescription,\n\tCardHeader,\n\tCardTitle,\n} from \"@/components/ui/card\";\nimport { useSuspenseBoards } from \"@btst/stack/plugins/kanban/client/hooks\";\nimport {\n\tCanAccess,\n\tusePluginOverrides,\n\tuseTranslate,\n} from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\nimport { EmptyState } from \"../shared/empty-state\";\nimport { PageWrapper } from \"../shared/page-wrapper\";\nimport { format } from \"date-fns\";\n\nexport function BoardsListPage() {\n\tconst t = useTranslate();\n\tconst { data: boards, error, isFetching } = useSuspenseBoards();\n\n\t// Suspense hooks only throw on initial fetch, not refetch failures\n\tif (error && !isFetching) {\n\t\tthrow error;\n\t}\n\tconst {\n\t\tLink: OverrideLink,\n\t\tnavigate: overrideNavigate,\n\t\tlocalization,\n\t} = usePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst Link = OverrideLink || \"a\";\n\tconst navigate =\n\t\toverrideNavigate ||\n\t\t((path: string) => {\n\t\t\twindow.location.href = path;\n\t\t});\n\n\tconst handleNewBoard = () => {\n\t\tnavigate(\"/pages/kanban/new\");\n\t};\n\n\treturn (\n\t\t<PageWrapper data-testid=\"boards-list-page\">\n\t\t\t<div className=\"w-full flex items-center justify-between mb-8\">\n\t\t\t\t<div>\n\t\t\t\t\t<h1 className=\"text-3xl font-bold\" data-testid=\"page-header\">\n\t\t\t\t\t\t{localization?.kanbanBoards ??\n\t\t\t\t\t\t\tt(\"kanban.list.kanbanBoards\", \"Kanban Boards\")}\n\t\t\t\t\t</h1>\n\t\t\t\t\t<p className=\"text-muted-foreground mt-1\">\n\t\t\t\t\t\t{localization?.manageProjects ??\n\t\t\t\t\t\t\tt(\"kanban.list.manageProjects\", \"Manage your projects and tasks\")}\n\t\t\t\t\t</p>\n\t\t\t\t</div>\n\t\t\t\t<CanAccess resource=\"kanban:board\" action=\"create\">\n\t\t\t\t\t<Button onClick={handleNewBoard}>\n\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t{localization?.newBoard ?? t(\"kanban.list.newBoard\", \"New Board\")}\n\t\t\t\t\t</Button>\n\t\t\t\t</CanAccess>\n\t\t\t</div>\n\n\t\t\t{boards.length > 0 ? (\n\t\t\t\t<div className=\"grid gap-4 md:grid-cols-2 lg:grid-cols-3\">\n\t\t\t\t\t{boards.map((board) => (\n\t\t\t\t\t\t<Link\n\t\t\t\t\t\t\tkey={board.id}\n\t\t\t\t\t\t\thref={`/pages/kanban/${board.id}`}\n\t\t\t\t\t\t\tclassName=\"block group\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Card className=\"h-full transition-shadow hover:shadow-md cursor-pointer\">\n\t\t\t\t\t\t\t\t<CardHeader>\n\t\t\t\t\t\t\t\t\t<CardTitle className=\"group-hover:text-primary transition-colors\">\n\t\t\t\t\t\t\t\t\t\t{board.name}\n\t\t\t\t\t\t\t\t\t</CardTitle>\n\t\t\t\t\t\t\t\t\t{board.description && (\n\t\t\t\t\t\t\t\t\t\t<CardDescription className=\"line-clamp-2\">\n\t\t\t\t\t\t\t\t\t\t\t{board.description}\n\t\t\t\t\t\t\t\t\t\t</CardDescription>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</CardHeader>\n\t\t\t\t\t\t\t\t<CardContent>\n\t\t\t\t\t\t\t\t\t<div className=\"flex items-center justify-between text-sm text-muted-foreground\">\n\t\t\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t\t\t{localization?.columnsCount\n\t\t\t\t\t\t\t\t\t\t\t\t? `${board.columns?.length || 0} ${localization.columnsCount}`\n\t\t\t\t\t\t\t\t\t\t\t\t: t(\"kanban.list.columnsCount\", \"{{count}} columns\", {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcount: board.columns?.length || 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t\t\t{format(new Date(board.createdAt), \"MMM d, yyyy\")}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</CardContent>\n\t\t\t\t\t\t\t</Card>\n\t\t\t\t\t\t</Link>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t) : (\n\t\t\t\t<EmptyState\n\t\t\t\t\ttitle={\n\t\t\t\t\t\tlocalization?.noBoards ??\n\t\t\t\t\t\tt(\"kanban.common.noBoards\", \"No boards yet\")\n\t\t\t\t\t}\n\t\t\t\t\tdescription={\n\t\t\t\t\t\tlocalization?.noBoardsDescription ??\n\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\"kanban.list.noBoardsDescription\",\n\t\t\t\t\t\t\t\"Create your first kanban board to start organizing your tasks.\",\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\taction={\n\t\t\t\t\t\t<CanAccess resource=\"kanban:board\" action=\"create\">\n\t\t\t\t\t\t\t<Button onClick={handleNewBoard}>\n\t\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.createBoard ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.forms.createBoard\", \"Create Board\")}\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</PageWrapper>\n\t);\n}\n",
       "target": "src/components/btst/kanban/client/components/pages/boards-list-page.internal.tsx"
     },
     {
       "path": "btst/kanban/client/components/pages/boards-list-page.tsx",
       "type": "registry:page",
-      "content": "\"use client\";\n\nimport { lazy } from \"react\";\nimport { ComposedRoute } from \"@btst/stack/client/components\";\nimport { DefaultError } from \"../shared/default-error\";\nimport { BoardsListSkeleton } from \"../loading/boards-list-skeleton\";\nimport { NotFoundPage } from \"./404-page\";\n\nconst BoardsListPage = lazy(() =>\n\timport(\"./boards-list-page.internal\").then((m) => ({\n\t\tdefault: m.BoardsListPage,\n\t})),\n);\n\nexport function BoardsListPageComponent() {\n\treturn (\n\t\t<ComposedRoute\n\t\t\tpath=\"/kanban\"\n\t\t\tPageComponent={BoardsListPage}\n\t\t\tErrorComponent={DefaultError}\n\t\t\tLoadingComponent={BoardsListSkeleton}\n\t\t\tNotFoundComponent={NotFoundPage}\n\t\t\tonError={(error) => console.error(\"BoardsListPage error:\", error)}\n\t\t/>\n\t);\n}\n",
+      "content": "\"use client\";\n\nimport { lazy } from \"react\";\nimport { ComposedRoute } from \"@btst/stack/client/components\";\nimport { DefaultError } from \"../shared/default-error\";\nimport { BoardsListSkeleton } from \"../loading/boards-list-skeleton\";\nimport { NotFoundPage } from \"./404-page\";\n\nconst BoardsListPage = lazy(() =>\n\timport(\"./boards-list-page.internal\").then((m) => ({\n\t\tdefault: m.BoardsListPage,\n\t})),\n);\n\nexport function BoardsListPageComponent() {\n\treturn (\n\t\t<ComposedRoute\n\t\t\tpath=\"/kanban\"\n\t\t\tpermission={{ resource: \"kanban:board\", action: \"read\" }}\n\t\t\tPageComponent={BoardsListPage}\n\t\t\tErrorComponent={DefaultError}\n\t\t\tLoadingComponent={BoardsListSkeleton}\n\t\t\tNotFoundComponent={NotFoundPage}\n\t\t\tonError={(error) => console.error(\"BoardsListPage error:\", error)}\n\t\t/>\n\t);\n}\n",
       "target": "src/components/btst/kanban/client/components/pages/boards-list-page.tsx"
     },
     {
       "path": "btst/kanban/client/components/pages/new-board-page.internal.tsx",
       "type": "registry:component",
-      "content": "\"use client\";\n\nimport { ArrowLeft } from \"lucide-react\";\nimport {\n\tCard,\n\tCardContent,\n\tCardDescription,\n\tCardHeader,\n\tCardTitle,\n} from \"@/components/ui/card\";\nimport { usePluginOverrides } from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\nimport { BoardForm } from \"../forms/board-form\";\nimport { PageWrapper } from \"../shared/page-wrapper\";\n\nexport function NewBoardPage() {\n\tconst { Link: OverrideLink, navigate: overrideNavigate } =\n\t\tusePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst navigate =\n\t\toverrideNavigate ||\n\t\t((path: string) => {\n\t\t\twindow.location.href = path;\n\t\t});\n\tconst Link = OverrideLink || \"a\";\n\n\tconst handleSuccess = (boardId: string) => {\n\t\tnavigate(`/pages/kanban/${boardId}`);\n\t};\n\n\treturn (\n\t\t<PageWrapper data-testid=\"new-board-page\">\n\t\t\t<div className=\"flex items-center gap-4 mb-8\">\n\t\t\t\t<Link\n\t\t\t\t\thref=\"/pages/kanban\"\n\t\t\t\t\tclassName=\"text-muted-foreground hover:text-foreground\"\n\t\t\t\t>\n\t\t\t\t\t<ArrowLeft className=\"h-5 w-5\" />\n\t\t\t\t</Link>\n\t\t\t\t<div>\n\t\t\t\t\t<h1 className=\"text-3xl font-bold\" data-testid=\"page-header\">\n\t\t\t\t\t\tCreate New Board\n\t\t\t\t\t</h1>\n\t\t\t\t\t<p className=\"text-muted-foreground mt-1\">\n\t\t\t\t\t\tSet up a new kanban board for your project\n\t\t\t\t\t</p>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<Card className=\"max-w-2xl\">\n\t\t\t\t<CardHeader>\n\t\t\t\t\t<CardTitle>Board Details</CardTitle>\n\t\t\t\t\t<CardDescription>\n\t\t\t\t\t\tEnter the details for your new kanban board.\n\t\t\t\t\t</CardDescription>\n\t\t\t\t</CardHeader>\n\t\t\t\t<CardContent>\n\t\t\t\t\t<BoardForm\n\t\t\t\t\t\tonClose={() => navigate(\"/pages/kanban\")}\n\t\t\t\t\t\tonSuccess={handleSuccess}\n\t\t\t\t\t/>\n\t\t\t\t</CardContent>\n\t\t\t</Card>\n\t\t</PageWrapper>\n\t);\n}\n",
+      "content": "\"use client\";\n\nimport { ArrowLeft } from \"lucide-react\";\nimport {\n\tCard,\n\tCardContent,\n\tCardDescription,\n\tCardHeader,\n\tCardTitle,\n} from \"@/components/ui/card\";\nimport { usePluginOverrides, useTranslate } from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\nimport { BoardForm } from \"../forms/board-form\";\nimport { PageWrapper } from \"../shared/page-wrapper\";\n\nexport function NewBoardPage() {\n\tconst t = useTranslate();\n\tconst {\n\t\tLink: OverrideLink,\n\t\tnavigate: overrideNavigate,\n\t\tlocalization,\n\t} = usePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst navigate =\n\t\toverrideNavigate ||\n\t\t((path: string) => {\n\t\t\twindow.location.href = path;\n\t\t});\n\tconst Link = OverrideLink || \"a\";\n\n\tconst handleSuccess = (boardId: string) => {\n\t\tnavigate(`/pages/kanban/${boardId}`);\n\t};\n\n\treturn (\n\t\t<PageWrapper data-testid=\"new-board-page\">\n\t\t\t<div className=\"flex items-center gap-4 mb-8\">\n\t\t\t\t<Link\n\t\t\t\t\thref=\"/pages/kanban\"\n\t\t\t\t\tclassName=\"text-muted-foreground hover:text-foreground\"\n\t\t\t\t>\n\t\t\t\t\t<ArrowLeft className=\"h-5 w-5\" />\n\t\t\t\t</Link>\n\t\t\t\t<div>\n\t\t\t\t\t<h1 className=\"text-3xl font-bold\" data-testid=\"page-header\">\n\t\t\t\t\t\t{localization?.createNewBoard ??\n\t\t\t\t\t\t\tt(\"kanban.list.createNewBoard\", \"Create New Board\")}\n\t\t\t\t\t</h1>\n\t\t\t\t\t<p className=\"text-muted-foreground mt-1\">\n\t\t\t\t\t\t{localization?.createNewBoardDescription ??\n\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\"kanban.list.createNewBoardDescription\",\n\t\t\t\t\t\t\t\t\"Set up a new kanban board for your project\",\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t</p>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<Card className=\"max-w-2xl\">\n\t\t\t\t<CardHeader>\n\t\t\t\t\t<CardTitle>\n\t\t\t\t\t\t{localization?.boardDetails ??\n\t\t\t\t\t\t\tt(\"kanban.list.boardDetails\", \"Board Details\")}\n\t\t\t\t\t</CardTitle>\n\t\t\t\t\t<CardDescription>\n\t\t\t\t\t\t{localization?.boardDetailsDescription ??\n\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\"kanban.list.boardDetailsDescription\",\n\t\t\t\t\t\t\t\t\"Enter the details for your new kanban board.\",\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t</CardDescription>\n\t\t\t\t</CardHeader>\n\t\t\t\t<CardContent>\n\t\t\t\t\t<BoardForm\n\t\t\t\t\t\tonClose={() => navigate(\"/pages/kanban\")}\n\t\t\t\t\t\tonSuccess={handleSuccess}\n\t\t\t\t\t/>\n\t\t\t\t</CardContent>\n\t\t\t</Card>\n\t\t</PageWrapper>\n\t);\n}\n",
       "target": "src/components/btst/kanban/client/components/pages/new-board-page.internal.tsx"
     },
     {
       "path": "btst/kanban/client/components/pages/new-board-page.tsx",
       "type": "registry:page",
-      "content": "\"use client\";\n\nimport { lazy } from \"react\";\nimport { ComposedRoute } from \"@btst/stack/client/components\";\nimport { DefaultError } from \"../shared/default-error\";\nimport { BoardsListSkeleton } from \"../loading/boards-list-skeleton\";\nimport { NotFoundPage } from \"./404-page\";\n\nconst NewBoardPage = lazy(() =>\n\timport(\"./new-board-page.internal\").then((m) => ({\n\t\tdefault: m.NewBoardPage,\n\t})),\n);\n\nexport function NewBoardPageComponent() {\n\treturn (\n\t\t<ComposedRoute\n\t\t\tpath=\"/kanban/new\"\n\t\t\tPageComponent={NewBoardPage}\n\t\t\tErrorComponent={DefaultError}\n\t\t\tLoadingComponent={BoardsListSkeleton}\n\t\t\tNotFoundComponent={NotFoundPage}\n\t\t\tonError={(error) => console.error(\"NewBoardPage error:\", error)}\n\t\t/>\n\t);\n}\n",
+      "content": "\"use client\";\n\nimport { lazy } from \"react\";\nimport { ComposedRoute } from \"@btst/stack/client/components\";\nimport { DefaultError } from \"../shared/default-error\";\nimport { BoardsListSkeleton } from \"../loading/boards-list-skeleton\";\nimport { NotFoundPage } from \"./404-page\";\n\nconst NewBoardPage = lazy(() =>\n\timport(\"./new-board-page.internal\").then((m) => ({\n\t\tdefault: m.NewBoardPage,\n\t})),\n);\n\nexport function NewBoardPageComponent() {\n\treturn (\n\t\t<ComposedRoute\n\t\t\tpath=\"/kanban/new\"\n\t\t\tpermission={{ resource: \"kanban:board\", action: \"create\" }}\n\t\t\tPageComponent={NewBoardPage}\n\t\t\tErrorComponent={DefaultError}\n\t\t\tLoadingComponent={BoardsListSkeleton}\n\t\t\tNotFoundComponent={NotFoundPage}\n\t\t\tonError={(error) => console.error(\"NewBoardPage error:\", error)}\n\t\t/>\n\t);\n}\n",
       "target": "src/components/btst/kanban/client/components/pages/new-board-page.tsx"
     },
     {
       "path": "btst/kanban/client/components/shared/column-content.tsx",
       "type": "registry:component",
-      "content": "\"use client\";\n\nimport { memo } from \"react\";\nimport { GripVertical, MoreVertical, Pencil, Plus, Trash2 } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Badge } from \"@/components/ui/badge\";\nimport * as Kanban from \"@/components/ui/kanban\";\nimport {\n\tDropdownMenu,\n\tDropdownMenuContent,\n\tDropdownMenuItem,\n\tDropdownMenuSeparator,\n\tDropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport { TaskCard } from \"./task-card\";\nimport type { SerializedColumn, SerializedTask } from \"../../../types\";\n\ninterface ColumnContentProps {\n\tcolumn: SerializedColumn & { tasks: SerializedTask[] };\n\tonAddTask: () => void;\n\tonEditTask: (taskId: string) => void;\n\tonEditColumn: () => void;\n\tonDeleteColumn: () => void;\n}\n\nfunction ColumnContentComponent({\n\tcolumn,\n\tonAddTask,\n\tonEditTask,\n\tonEditColumn,\n\tonDeleteColumn,\n}: ColumnContentProps) {\n\tconst hasTasks = column.tasks && column.tasks.length > 0;\n\n\treturn (\n\t\t<Kanban.Column key={column.id} value={column.id}>\n\t\t\t<div className=\"flex items-center\">\n\t\t\t\t<Kanban.ColumnHandle asChild>\n\t\t\t\t\t<Button variant=\"ghost\" size=\"icon\">\n\t\t\t\t\t\t<GripVertical className=\"h-4 w-4\" />\n\t\t\t\t\t</Button>\n\t\t\t\t</Kanban.ColumnHandle>\n\t\t\t\t<div className=\"flex items-center gap-2 flex-1\">\n\t\t\t\t\t<span className=\"font-bold text-lg line-clamp-1 flex-1 text-left\">\n\t\t\t\t\t\t{column.title}\n\t\t\t\t\t</span>\n\t\t\t\t\t<Badge variant=\"outline\" className=\"pointer-events-none rounded-sm\">\n\t\t\t\t\t\t{column.tasks?.length || 0}\n\t\t\t\t\t</Badge>\n\t\t\t\t</div>\n\t\t\t\t<DropdownMenu>\n\t\t\t\t\t<DropdownMenuTrigger asChild>\n\t\t\t\t\t\t<Button variant=\"ghost\" size=\"icon\">\n\t\t\t\t\t\t\t<MoreVertical className=\"h-4 w-4\" />\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</DropdownMenuTrigger>\n\t\t\t\t\t<DropdownMenuContent align=\"end\">\n\t\t\t\t\t\t<DropdownMenuItem onClick={onEditColumn}>\n\t\t\t\t\t\t\t<Pencil className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\tEdit Column\n\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t<DropdownMenuItem onClick={onAddTask}>\n\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\tAdd Task\n\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t<DropdownMenuSeparator />\n\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\tonClick={onDeleteColumn}\n\t\t\t\t\t\t\tclassName=\"text-red-600 focus:text-red-600\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Trash2 className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\tDelete Column\n\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t</DropdownMenuContent>\n\t\t\t\t</DropdownMenu>\n\t\t\t</div>\n\t\t\t<div className=\"p-0.5 space-y-2\">\n\t\t\t\t{hasTasks ? (\n\t\t\t\t\tcolumn.tasks.map((task) => (\n\t\t\t\t\t\t<TaskCard\n\t\t\t\t\t\t\tkey={task.id}\n\t\t\t\t\t\t\ttask={task}\n\t\t\t\t\t\t\tonClick={() => onEditTask(task.id)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))\n\t\t\t\t) : (\n\t\t\t\t\t<div className=\"flex flex-col items-center justify-center py-1 md:py-8 text-center\">\n\t\t\t\t\t\t<div className=\"rounded-full bg-muted p-4 mb-3 hidden md:block\">\n\t\t\t\t\t\t\t<Plus className=\"h-5 w-5 text-muted-foreground\" />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div className=\"space-y-1 mb-2 md:space-y-2 md:mb-4\">\n\t\t\t\t\t\t\t<p className=\"text-sm text-muted-foreground\">No tasks yet</p>\n\t\t\t\t\t\t\t<p className=\"text-xs text-muted-foreground\">\n\t\t\t\t\t\t\t\tAdd a task to get started\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<Button onClick={onAddTask} size=\"sm\">\n\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\tAdd Task\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</Kanban.Column>\n\t);\n}\n\nexport const ColumnContent = memo(ColumnContentComponent);\n",
+      "content": "\"use client\";\n\nimport { memo } from \"react\";\nimport { GripVertical, MoreVertical, Pencil, Plus, Trash2 } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Badge } from \"@/components/ui/badge\";\nimport * as Kanban from \"@/components/ui/kanban\";\nimport {\n\tCanAccess,\n\tusePluginOverrides,\n\tuseTranslate,\n} from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\nimport {\n\tDropdownMenu,\n\tDropdownMenuContent,\n\tDropdownMenuItem,\n\tDropdownMenuSeparator,\n\tDropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport { TaskCard } from \"./task-card\";\nimport type { SerializedColumn, SerializedTask } from \"../../../types\";\n\ninterface ColumnContentProps {\n\tboardId: string;\n\tcolumn: SerializedColumn & { tasks: SerializedTask[] };\n\tcanMoveColumn: boolean;\n\tcanMoveTasks: boolean;\n\tonAddTask: () => void;\n\tonEditTask: (taskId: string) => void;\n\tonEditColumn: () => void;\n\tonDeleteColumn: () => void;\n}\n\nfunction ColumnContentComponent({\n\tboardId,\n\tcolumn,\n\tcanMoveColumn,\n\tcanMoveTasks,\n\tonAddTask,\n\tonEditTask,\n\tonEditColumn,\n\tonDeleteColumn,\n}: ColumnContentProps) {\n\tconst t = useTranslate();\n\tconst { localization } = usePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst hasTasks = column.tasks && column.tasks.length > 0;\n\n\treturn (\n\t\t<Kanban.Column key={column.id} value={column.id}>\n\t\t\t<div className=\"flex items-center\">\n\t\t\t\t<Kanban.ColumnHandle asChild disabled={!canMoveColumn}>\n\t\t\t\t\t<Button variant=\"ghost\" size=\"icon\">\n\t\t\t\t\t\t<GripVertical className=\"h-4 w-4\" />\n\t\t\t\t\t</Button>\n\t\t\t\t</Kanban.ColumnHandle>\n\t\t\t\t<div className=\"flex items-center gap-2 flex-1\">\n\t\t\t\t\t<span className=\"font-bold text-lg line-clamp-1 flex-1 text-left\">\n\t\t\t\t\t\t{column.title}\n\t\t\t\t\t</span>\n\t\t\t\t\t<Badge variant=\"outline\" className=\"pointer-events-none rounded-sm\">\n\t\t\t\t\t\t{column.tasks?.length || 0}\n\t\t\t\t\t</Badge>\n\t\t\t\t</div>\n\t\t\t\t<DropdownMenu>\n\t\t\t\t\t<DropdownMenuTrigger asChild>\n\t\t\t\t\t\t<Button variant=\"ghost\" size=\"icon\">\n\t\t\t\t\t\t\t<MoreVertical className=\"h-4 w-4\" />\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</DropdownMenuTrigger>\n\t\t\t\t\t<DropdownMenuContent align=\"end\">\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:column\"\n\t\t\t\t\t\t\taction=\"update\"\n\t\t\t\t\t\t\tparams={{ id: column.id, boardId }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DropdownMenuItem onClick={onEditColumn}>\n\t\t\t\t\t\t\t\t<Pencil className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.editColumn ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.list.editColumn\", \"Edit Column\")}\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:task\"\n\t\t\t\t\t\t\taction=\"create\"\n\t\t\t\t\t\t\tparams={{ boardId, columnId: column.id }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DropdownMenuItem onClick={onAddTask}>\n\t\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.addTask ?? t(\"kanban.list.addTask\", \"Add Task\")}\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t\t<DropdownMenuSeparator />\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:column\"\n\t\t\t\t\t\t\taction=\"delete\"\n\t\t\t\t\t\t\tparams={{ id: column.id, boardId }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\tonClick={onDeleteColumn}\n\t\t\t\t\t\t\t\tclassName=\"text-red-600 focus:text-red-600\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Trash2 className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.deleteColumn ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.forms.deleteColumn\", \"Delete Column\")}\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t</DropdownMenuContent>\n\t\t\t\t</DropdownMenu>\n\t\t\t</div>\n\t\t\t<div className=\"p-0.5 space-y-2\">\n\t\t\t\t{hasTasks ? (\n\t\t\t\t\tcolumn.tasks.map((task) => (\n\t\t\t\t\t\t<TaskCard\n\t\t\t\t\t\t\tkey={task.id}\n\t\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\t\tcolumnId={column.id}\n\t\t\t\t\t\t\ttask={task}\n\t\t\t\t\t\t\tcanMove={canMoveTasks}\n\t\t\t\t\t\t\tonClick={() => onEditTask(task.id)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))\n\t\t\t\t) : (\n\t\t\t\t\t<div className=\"flex flex-col items-center justify-center py-1 md:py-8 text-center\">\n\t\t\t\t\t\t<div className=\"rounded-full bg-muted p-4 mb-3 hidden md:block\">\n\t\t\t\t\t\t\t<Plus className=\"h-5 w-5 text-muted-foreground\" />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div className=\"space-y-1 mb-2 md:space-y-2 md:mb-4\">\n\t\t\t\t\t\t\t<p className=\"text-sm text-muted-foreground\">\n\t\t\t\t\t\t\t\t{localization?.noTasks ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.common.noTasks\", \"No tasks yet\")}\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t<p className=\"text-xs text-muted-foreground\">\n\t\t\t\t\t\t\t\t{localization?.noTasksDescription ??\n\t\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\t\"kanban.list.noTasksDescription\",\n\t\t\t\t\t\t\t\t\t\t\"Add a task to get started\",\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:task\"\n\t\t\t\t\t\t\taction=\"create\"\n\t\t\t\t\t\t\tparams={{ boardId, columnId: column.id }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Button onClick={onAddTask} size=\"sm\">\n\t\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.addTask ?? t(\"kanban.list.addTask\", \"Add Task\")}\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</Kanban.Column>\n\t);\n}\n\nexport const ColumnContent = memo(ColumnContentComponent);\n",
       "target": "src/components/btst/kanban/client/components/shared/column-content.tsx"
     },
     {
       "path": "btst/kanban/client/components/shared/default-error.tsx",
       "type": "registry:component",
-      "content": "\"use client\";\n\nimport { AlertCircle, RefreshCw } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\n\ninterface DefaultErrorProps {\n\terror?: unknown;\n\treset?: () => void;\n}\n\nexport function DefaultError({ error, reset }: DefaultErrorProps) {\n\treturn (\n\t\t<div\n\t\t\tclassName=\"flex flex-col items-center justify-center py-12 text-center\"\n\t\t\tdata-testid=\"error-placeholder\"\n\t\t>\n\t\t\t<div className=\"rounded-full bg-destructive/10 p-6 mb-4\">\n\t\t\t\t<AlertCircle className=\"h-8 w-8 text-destructive\" />\n\t\t\t</div>\n\t\t\t<h3 className=\"text-lg font-semibold mb-2\">Something went wrong</h3>\n\t\t\t<p className=\"text-muted-foreground max-w-md mb-4\">\n\t\t\t\t{(error instanceof Error ? error.message : undefined) ||\n\t\t\t\t\t\"An unexpected error occurred. Please try again.\"}\n\t\t\t</p>\n\t\t\t{reset && (\n\t\t\t\t<Button onClick={reset} variant=\"outline\">\n\t\t\t\t\t<RefreshCw className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\tTry Again\n\t\t\t\t</Button>\n\t\t\t)}\n\t\t</div>\n\t);\n}\n",
+      "content": "\"use client\";\n\nimport { AlertCircle, RefreshCw } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport { usePluginOverrides, useTranslate } from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\n\ninterface DefaultErrorProps {\n\terror?: unknown;\n\treset?: () => void;\n}\n\nexport function DefaultError({ error, reset }: DefaultErrorProps) {\n\tconst t = useTranslate();\n\tconst { localization } = usePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\treturn (\n\t\t<div\n\t\t\tclassName=\"flex flex-col items-center justify-center py-12 text-center\"\n\t\t\tdata-testid=\"error-placeholder\"\n\t\t>\n\t\t\t<div className=\"rounded-full bg-destructive/10 p-6 mb-4\">\n\t\t\t\t<AlertCircle className=\"h-8 w-8 text-destructive\" />\n\t\t\t</div>\n\t\t\t<h3 className=\"text-lg font-semibold mb-2\">\n\t\t\t\t{localization?.errorGeneric ??\n\t\t\t\t\tt(\"kanban.common.errorGeneric\", \"Something went wrong\")}\n\t\t\t</h3>\n\t\t\t<p className=\"text-muted-foreground max-w-md mb-4\">\n\t\t\t\t{(error instanceof Error ? error.message : undefined) ||\n\t\t\t\t\t(localization?.unexpectedError ??\n\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\"kanban.common.unexpectedError\",\n\t\t\t\t\t\t\t\"An unexpected error occurred. Please try again.\",\n\t\t\t\t\t\t))}\n\t\t\t</p>\n\t\t\t{reset && (\n\t\t\t\t<Button onClick={reset} variant=\"outline\">\n\t\t\t\t\t<RefreshCw className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t{localization?.tryAgain ?? t(\"kanban.common.tryAgain\", \"Try Again\")}\n\t\t\t\t</Button>\n\t\t\t)}\n\t\t</div>\n\t);\n}\n",
       "target": "src/components/btst/kanban/client/components/shared/default-error.tsx"
     },
     {
@@ -145,7 +145,7 @@
     {
       "path": "btst/kanban/client/components/shared/kanban-board.tsx",
       "type": "registry:component",
-      "content": "\"use client\";\n\nimport { memo, useMemo } from \"react\";\nimport * as Kanban from \"@/components/ui/kanban\";\nimport { cn } from \"@/lib/utils\";\nimport { ColumnContent } from \"./column-content\";\nimport type { SerializedColumn, SerializedTask } from \"../../../types\";\n\ninterface KanbanBoardProps {\n\tcolumns: (SerializedColumn & { tasks: SerializedTask[] })[];\n\tkanbanState: Record<string, SerializedTask[]>;\n\tonKanbanChange: (newData: Record<string, SerializedTask[]>) => void;\n\tonAddTask: (columnId: string) => void;\n\tonEditTask: (columnId: string, taskId: string) => void;\n\tonEditColumn: (columnId: string) => void;\n\tonDeleteColumn: (columnId: string) => void;\n}\n\nfunction KanbanBoardComponent({\n\tcolumns,\n\tkanbanState,\n\tonKanbanChange,\n\tonAddTask,\n\tonEditTask,\n\tonEditColumn,\n\tonDeleteColumn,\n}: KanbanBoardProps) {\n\tconst orderedColumns = useMemo(() => {\n\t\tconst columnMap = new Map(columns.map((c) => [c.id, c]));\n\t\treturn Object.keys(kanbanState)\n\t\t\t.map((columnId) => {\n\t\t\t\tconst column = columnMap.get(columnId);\n\t\t\t\tif (!column) return null;\n\t\t\t\treturn {\n\t\t\t\t\t...column,\n\t\t\t\t\ttasks: kanbanState[columnId] || [],\n\t\t\t\t};\n\t\t\t})\n\t\t\t.filter(\n\t\t\t\t(c): c is SerializedColumn & { tasks: SerializedTask[] } => c !== null,\n\t\t\t);\n\t}, [columns, kanbanState]);\n\n\tconst mdClass = useMemo(() => {\n\t\tconst gridClassMap: Record<number, string> = {\n\t\t\t1: \"md:grid-cols-1\",\n\t\t\t2: \"md:grid-cols-2\",\n\t\t\t3: \"md:grid-cols-3\",\n\t\t\t4: \"md:grid-cols-4\",\n\t\t\t5: \"md:grid-cols-5\",\n\t\t\t6: \"md:grid-cols-6\",\n\t\t};\n\t\treturn gridClassMap[orderedColumns.length] || \"md:grid-cols-6\";\n\t}, [orderedColumns.length]);\n\n\treturn (\n\t\t<Kanban.Root\n\t\t\torientation=\"horizontal\"\n\t\t\tvalue={kanbanState}\n\t\t\tonValueChange={onKanbanChange}\n\t\t\tgetItemValue={(item: SerializedTask) => item.id}\n\t\t>\n\t\t\t<Kanban.Board\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"flex flex-col gap-4 md:auto-rows-fr md:grid-cols-1 md:grid min-h-[400px]\",\n\t\t\t\t\tmdClass,\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{orderedColumns.map((column) => (\n\t\t\t\t\t<ColumnContent\n\t\t\t\t\t\tkey={column.id}\n\t\t\t\t\t\tcolumn={column}\n\t\t\t\t\t\tonAddTask={() => onAddTask(column.id)}\n\t\t\t\t\t\tonEditTask={(taskId) => onEditTask(column.id, taskId)}\n\t\t\t\t\t\tonEditColumn={() => onEditColumn(column.id)}\n\t\t\t\t\t\tonDeleteColumn={() => onDeleteColumn(column.id)}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</Kanban.Board>\n\t\t\t<Kanban.Overlay>\n\t\t\t\t<div className=\"size-full rounded-md bg-primary/10\" />\n\t\t\t</Kanban.Overlay>\n\t\t</Kanban.Root>\n\t);\n}\n\nexport const KanbanBoard = memo(KanbanBoardComponent);\n",
+      "content": "\"use client\";\n\nimport { memo, useMemo } from \"react\";\nimport * as Kanban from \"@/components/ui/kanban\";\nimport { cn } from \"@/lib/utils\";\nimport { ColumnContent } from \"./column-content\";\nimport type { SerializedColumn, SerializedTask } from \"../../../types\";\n\ninterface KanbanBoardProps {\n\tboardId: string;\n\tcolumns: (SerializedColumn & { tasks: SerializedTask[] })[];\n\tkanbanState: Record<string, SerializedTask[]>;\n\tcanMoveColumns: boolean;\n\tcanMoveTasks: boolean;\n\tonKanbanChange: (newData: Record<string, SerializedTask[]>) => void;\n\tonAddTask: (columnId: string) => void;\n\tonEditTask: (columnId: string, taskId: string) => void;\n\tonEditColumn: (columnId: string) => void;\n\tonDeleteColumn: (columnId: string) => void;\n}\n\nfunction KanbanBoardComponent({\n\tboardId,\n\tcolumns,\n\tkanbanState,\n\tcanMoveColumns,\n\tcanMoveTasks,\n\tonKanbanChange,\n\tonAddTask,\n\tonEditTask,\n\tonEditColumn,\n\tonDeleteColumn,\n}: KanbanBoardProps) {\n\tconst orderedColumns = useMemo(() => {\n\t\tconst columnMap = new Map(columns.map((c) => [c.id, c]));\n\t\treturn Object.keys(kanbanState)\n\t\t\t.map((columnId) => {\n\t\t\t\tconst column = columnMap.get(columnId);\n\t\t\t\tif (!column) return null;\n\t\t\t\treturn {\n\t\t\t\t\t...column,\n\t\t\t\t\ttasks: kanbanState[columnId] || [],\n\t\t\t\t};\n\t\t\t})\n\t\t\t.filter(\n\t\t\t\t(c): c is SerializedColumn & { tasks: SerializedTask[] } => c !== null,\n\t\t\t);\n\t}, [columns, kanbanState]);\n\n\tconst mdClass = useMemo(() => {\n\t\tconst gridClassMap: Record<number, string> = {\n\t\t\t1: \"md:grid-cols-1\",\n\t\t\t2: \"md:grid-cols-2\",\n\t\t\t3: \"md:grid-cols-3\",\n\t\t\t4: \"md:grid-cols-4\",\n\t\t\t5: \"md:grid-cols-5\",\n\t\t\t6: \"md:grid-cols-6\",\n\t\t};\n\t\treturn gridClassMap[orderedColumns.length] || \"md:grid-cols-6\";\n\t}, [orderedColumns.length]);\n\n\treturn (\n\t\t<Kanban.Root\n\t\t\torientation=\"horizontal\"\n\t\t\tvalue={kanbanState}\n\t\t\tonValueChange={onKanbanChange}\n\t\t\tgetItemValue={(item: SerializedTask) => item.id}\n\t\t>\n\t\t\t<Kanban.Board\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"flex flex-col gap-4 md:auto-rows-fr md:grid-cols-1 md:grid min-h-[400px]\",\n\t\t\t\t\tmdClass,\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{orderedColumns.map((column) => (\n\t\t\t\t\t<ColumnContent\n\t\t\t\t\t\tkey={column.id}\n\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\tcolumn={column}\n\t\t\t\t\t\tcanMoveColumn={canMoveColumns}\n\t\t\t\t\t\tcanMoveTasks={canMoveTasks}\n\t\t\t\t\t\tonAddTask={() => onAddTask(column.id)}\n\t\t\t\t\t\tonEditTask={(taskId) => onEditTask(column.id, taskId)}\n\t\t\t\t\t\tonEditColumn={() => onEditColumn(column.id)}\n\t\t\t\t\t\tonDeleteColumn={() => onDeleteColumn(column.id)}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</Kanban.Board>\n\t\t\t<Kanban.Overlay>\n\t\t\t\t<div className=\"size-full rounded-md bg-primary/10\" />\n\t\t\t</Kanban.Overlay>\n\t\t</Kanban.Root>\n\t);\n}\n\nexport const KanbanBoard = memo(KanbanBoardComponent);\n",
       "target": "src/components/btst/kanban/client/components/shared/kanban-board.tsx"
     },
     {
@@ -157,13 +157,13 @@
     {
       "path": "btst/kanban/client/components/shared/task-card.tsx",
       "type": "registry:component",
-      "content": "\"use client\";\n\nimport { memo } from \"react\";\nimport { GripVertical } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Badge } from \"@/components/ui/badge\";\nimport * as Kanban from \"@/components/ui/kanban\";\nimport { format } from \"date-fns\";\nimport type { SerializedTask } from \"../../../types\";\nimport { getPriorityConfig } from \"../../../utils\";\nimport { useResolveUser } from \"@btst/stack/plugins/kanban/client/hooks\";\nimport { UserAvatar } from \"./user-avatar\";\n\ninterface TaskCardProps {\n\ttask: SerializedTask;\n\tonClick: () => void;\n}\n\nfunction TaskCardComponent({ task, onClick }: TaskCardProps) {\n\tconst priorityConfig = getPriorityConfig(task.priority);\n\tconst { data: assignee } = useResolveUser(task.assigneeId);\n\n\treturn (\n\t\t<Kanban.Item value={task.id} asChild>\n\t\t\t<div\n\t\t\t\tclassName=\"rounded-md border bg-card p-3 shadow-xs cursor-pointer hover:shadow-md transition-shadow\"\n\t\t\t\tonClick={onClick}\n\t\t\t>\n\t\t\t\t<div className=\"flex flex-col gap-2\">\n\t\t\t\t\t<div className=\"flex items-center gap-2\">\n\t\t\t\t\t\t<Kanban.ItemHandle asChild>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\t\t\tclassName=\"h-6 w-6\"\n\t\t\t\t\t\t\t\tonClick={(e: React.MouseEvent) => e.stopPropagation()}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<GripVertical className=\"h-3 w-3\" />\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</Kanban.ItemHandle>\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tclassName=\"line-clamp-1 font-medium text-base flex-1 text-left cursor-pointer hover:text-primary\"\n\t\t\t\t\t\t\ttitle={task.title}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{task.title}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<Badge\n\t\t\t\t\t\t\tvariant={priorityConfig.variant}\n\t\t\t\t\t\t\tclassName={`pointer-events-none h-5 rounded-sm px-1.5 text-[11px] capitalize ${priorityConfig.className}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{priorityConfig.label}\n\t\t\t\t\t\t</Badge>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<div className=\"flex items-center justify-between text-muted-foreground text-xs\">\n\t\t\t\t\t\t{task.assigneeId ? (\n\t\t\t\t\t\t\t<div className=\"flex items-center gap-1.5\">\n\t\t\t\t\t\t\t\t<UserAvatar user={assignee ?? null} size=\"sm\" />\n\t\t\t\t\t\t\t\t<span className=\"line-clamp-1\">\n\t\t\t\t\t\t\t\t\t{assignee?.name || \"Assigned\"}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<div className=\"flex items-center gap-1.5\">\n\t\t\t\t\t\t\t\t<UserAvatar user={null} size=\"sm\" />\n\t\t\t\t\t\t\t\t<span className=\"line-clamp-1\">Unassigned</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<time className=\"tabular-nums\">\n\t\t\t\t\t\t\t{format(new Date(task.createdAt), \"MMM d\")}\n\t\t\t\t\t\t</time>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Kanban.Item>\n\t);\n}\n\nexport const TaskCard = memo(TaskCardComponent);\n",
+      "content": "\"use client\";\n\nimport { memo } from \"react\";\nimport { GripVertical } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Badge } from \"@/components/ui/badge\";\nimport * as Kanban from \"@/components/ui/kanban\";\nimport { format } from \"date-fns\";\nimport type { SerializedTask } from \"../../../types\";\nimport { getPriorityConfig } from \"../../../utils\";\nimport { useResolveUser } from \"@btst/stack/plugins/kanban/client/hooks\";\nimport { UserAvatar } from \"./user-avatar\";\nimport { useCan, usePluginOverrides, useTranslate } from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\n\ninterface TaskCardProps {\n\tboardId: string;\n\tcolumnId: string;\n\ttask: SerializedTask;\n\tcanMove: boolean;\n\tonClick: () => void;\n}\n\nfunction TaskCardComponent({\n\tboardId,\n\tcolumnId,\n\ttask,\n\tcanMove,\n\tonClick,\n}: TaskCardProps) {\n\tconst t = useTranslate();\n\tconst { localization } = usePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst { can: canEdit, isPending: isCheckingEdit } = useCan({\n\t\tresource: \"kanban:task\",\n\t\taction: \"update\",\n\t\tparams: { id: task.id, boardId, columnId },\n\t});\n\tconst priorityConfig = getPriorityConfig(task.priority);\n\tconst { data: assignee } = useResolveUser(task.assigneeId);\n\tconst priorityLabels = {\n\t\tLOW: localization?.priorityLow ?? t(\"kanban.common.priorityLow\", \"Low\"),\n\t\tMEDIUM:\n\t\t\tlocalization?.priorityMedium ??\n\t\t\tt(\"kanban.common.priorityMedium\", \"Medium\"),\n\t\tHIGH: localization?.priorityHigh ?? t(\"kanban.common.priorityHigh\", \"High\"),\n\t\tURGENT:\n\t\t\tlocalization?.priorityUrgent ??\n\t\t\tt(\"kanban.common.priorityUrgent\", \"Urgent\"),\n\t};\n\tconst editable = !isCheckingEdit && canEdit;\n\n\treturn (\n\t\t<Kanban.Item value={task.id} asChild>\n\t\t\t<div\n\t\t\t\tclassName={`rounded-md border bg-card p-3 shadow-xs transition-shadow ${editable ? \"cursor-pointer hover:shadow-md\" : \"cursor-default\"}`}\n\t\t\t\tonClick={editable ? onClick : undefined}\n\t\t\t>\n\t\t\t\t<div className=\"flex flex-col gap-2\">\n\t\t\t\t\t<div className=\"flex items-center gap-2\">\n\t\t\t\t\t\t<Kanban.ItemHandle asChild disabled={!canMove}>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\t\t\tclassName=\"h-6 w-6\"\n\t\t\t\t\t\t\t\tonClick={(e: React.MouseEvent) => e.stopPropagation()}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<GripVertical className=\"h-3 w-3\" />\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</Kanban.ItemHandle>\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tclassName={`line-clamp-1 font-medium text-base flex-1 text-left ${editable ? \"cursor-pointer hover:text-primary\" : \"cursor-default\"}`}\n\t\t\t\t\t\t\ttitle={task.title}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{task.title}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<Badge\n\t\t\t\t\t\t\tvariant={priorityConfig.variant}\n\t\t\t\t\t\t\tclassName={`pointer-events-none h-5 rounded-sm px-1.5 text-[11px] capitalize ${priorityConfig.className}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{priorityLabels[task.priority] ?? priorityConfig.label}\n\t\t\t\t\t\t</Badge>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<div className=\"flex items-center justify-between text-muted-foreground text-xs\">\n\t\t\t\t\t\t{task.assigneeId ? (\n\t\t\t\t\t\t\t<div className=\"flex items-center gap-1.5\">\n\t\t\t\t\t\t\t\t<UserAvatar user={assignee ?? null} size=\"sm\" />\n\t\t\t\t\t\t\t\t<span className=\"line-clamp-1\">\n\t\t\t\t\t\t\t\t\t{assignee?.name ||\n\t\t\t\t\t\t\t\t\t\t(localization?.assigned ??\n\t\t\t\t\t\t\t\t\t\t\tt(\"kanban.common.assigned\", \"Assigned\"))}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<div className=\"flex items-center gap-1.5\">\n\t\t\t\t\t\t\t\t<UserAvatar user={null} size=\"sm\" />\n\t\t\t\t\t\t\t\t<span className=\"line-clamp-1\">\n\t\t\t\t\t\t\t\t\t{localization?.unassigned ??\n\t\t\t\t\t\t\t\t\t\tt(\"kanban.common.unassigned\", \"Unassigned\")}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<time className=\"tabular-nums\">\n\t\t\t\t\t\t\t{format(new Date(task.createdAt), \"MMM d\")}\n\t\t\t\t\t\t</time>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Kanban.Item>\n\t);\n}\n\nexport const TaskCard = memo(TaskCardComponent);\n",
       "target": "src/components/btst/kanban/client/components/shared/task-card.tsx"
     },
     {
       "path": "btst/kanban/client/components/shared/user-avatar.tsx",
       "type": "registry:component",
-      "content": "\"use client\";\n\nimport { memo } from \"react\";\nimport { User } from \"lucide-react\";\nimport {\n\tAvatar,\n\tAvatarImage,\n\tAvatarFallback,\n} from \"@/components/ui/avatar\";\nimport type { KanbanUser } from \"../../overrides\";\n\ninterface UserAvatarProps {\n\tuser: KanbanUser | null;\n\tsize?: \"sm\" | \"default\" | \"lg\";\n\tclassName?: string;\n}\n\n/**\n * Get initials from a user's name\n */\nfunction getInitials(name: string): string {\n\tconst parts = name.trim().split(/\\s+/);\n\tif (parts.length === 1) {\n\t\treturn parts[0]?.charAt(0).toUpperCase() || \"\";\n\t}\n\treturn (\n\t\t(parts[0]?.charAt(0) || \"\") + (parts[parts.length - 1]?.charAt(0) || \"\")\n\t).toUpperCase();\n}\n\n/**\n * UserAvatar component displays a user's avatar or initials fallback\n * Uses the shadcn Avatar component with Radix primitives\n */\nfunction UserAvatarComponent({\n\tuser,\n\tsize = \"sm\",\n\tclassName,\n}: UserAvatarProps) {\n\t// No user - show placeholder icon\n\tif (!user) {\n\t\treturn (\n\t\t\t<Avatar size={size} className={className} title=\"Unassigned\">\n\t\t\t\t<AvatarFallback>\n\t\t\t\t\t<User className=\"size-3 group-data-[size=default]/avatar:size-4 group-data-[size=lg]/avatar:size-5\" />\n\t\t\t\t</AvatarFallback>\n\t\t\t</Avatar>\n\t\t);\n\t}\n\n\tconst initials = getInitials(user.name);\n\n\treturn (\n\t\t<Avatar size={size} className={className} title={user.name}>\n\t\t\t{user.avatarUrl && <AvatarImage src={user.avatarUrl} alt={user.name} />}\n\t\t\t<AvatarFallback className=\"bg-primary/10 text-primary font-medium\">\n\t\t\t\t{initials}\n\t\t\t</AvatarFallback>\n\t\t</Avatar>\n\t);\n}\n\nexport const UserAvatar = memo(UserAvatarComponent);\n",
+      "content": "\"use client\";\n\nimport { memo } from \"react\";\nimport { User } from \"lucide-react\";\nimport {\n\tAvatar,\n\tAvatarImage,\n\tAvatarFallback,\n} from \"@/components/ui/avatar\";\nimport { usePluginOverrides, useTranslate } from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides, KanbanUser } from \"../../overrides\";\n\ninterface UserAvatarProps {\n\tuser: KanbanUser | null;\n\tsize?: \"sm\" | \"default\" | \"lg\";\n\tclassName?: string;\n}\n\n/**\n * Get initials from a user's name\n */\nfunction getInitials(name: string): string {\n\tconst parts = name.trim().split(/\\s+/);\n\tif (parts.length === 1) {\n\t\treturn parts[0]?.charAt(0).toUpperCase() || \"\";\n\t}\n\treturn (\n\t\t(parts[0]?.charAt(0) || \"\") + (parts[parts.length - 1]?.charAt(0) || \"\")\n\t).toUpperCase();\n}\n\n/**\n * UserAvatar component displays a user's avatar or initials fallback\n * Uses the shadcn Avatar component with Radix primitives\n */\nfunction UserAvatarComponent({\n\tuser,\n\tsize = \"sm\",\n\tclassName,\n}: UserAvatarProps) {\n\tconst t = useTranslate();\n\tconst { localization } = usePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\t// No user - show placeholder icon\n\tif (!user) {\n\t\treturn (\n\t\t\t<Avatar\n\t\t\t\tsize={size}\n\t\t\t\tclassName={className}\n\t\t\t\ttitle={\n\t\t\t\t\tlocalization?.unassigned ??\n\t\t\t\t\tt(\"kanban.common.unassigned\", \"Unassigned\")\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<AvatarFallback>\n\t\t\t\t\t<User className=\"size-3 group-data-[size=default]/avatar:size-4 group-data-[size=lg]/avatar:size-5\" />\n\t\t\t\t</AvatarFallback>\n\t\t\t</Avatar>\n\t\t);\n\t}\n\n\tconst initials = getInitials(user.name);\n\n\treturn (\n\t\t<Avatar size={size} className={className} title={user.name}>\n\t\t\t{user.avatarUrl && <AvatarImage src={user.avatarUrl} alt={user.name} />}\n\t\t\t<AvatarFallback className=\"bg-primary/10 text-primary font-medium\">\n\t\t\t\t{initials}\n\t\t\t</AvatarFallback>\n\t\t</Avatar>\n\t);\n}\n\nexport const UserAvatar = memo(UserAvatarComponent);\n",
       "target": "src/components/btst/kanban/client/components/shared/user-avatar.tsx"
     },
     {
@@ -175,19 +175,19 @@
     {
       "path": "btst/kanban/client/localization/kanban-common.ts",
       "type": "registry:lib",
-      "content": "export interface KanbanCommonLocalization {\n\t// Navigation\n\tbackToBoards: string;\n\t// Actions\n\tactions: string;\n\tcreate: string;\n\tedit: string;\n\tdelete: string;\n\tcancel: string;\n\tsave: string;\n\t// Status\n\tloading: string;\n\tsaving: string;\n\tdeleting: string;\n\t// Labels\n\tboard: string;\n\tboards: string;\n\tcolumn: string;\n\tcolumns: string;\n\ttask: string;\n\ttasks: string;\n\t// Priorities\n\tpriorityLow: string;\n\tpriorityMedium: string;\n\tpriorityHigh: string;\n\tpriorityUrgent: string;\n\t// Empty states\n\tnoBoards: string;\n\tnoColumns: string;\n\tnoTasks: string;\n\t// Errors\n\terrorGeneric: string;\n\terrorNotFound: string;\n}\n\nexport const defaultKanbanCommonLocalization: KanbanCommonLocalization = {\n\t// Navigation\n\tbackToBoards: \"Back to Boards\",\n\t// Actions\n\tactions: \"Actions\",\n\tcreate: \"Create\",\n\tedit: \"Edit\",\n\tdelete: \"Delete\",\n\tcancel: \"Cancel\",\n\tsave: \"Save\",\n\t// Status\n\tloading: \"Loading...\",\n\tsaving: \"Saving...\",\n\tdeleting: \"Deleting...\",\n\t// Labels\n\tboard: \"Board\",\n\tboards: \"Boards\",\n\tcolumn: \"Column\",\n\tcolumns: \"Columns\",\n\ttask: \"Task\",\n\ttasks: \"Tasks\",\n\t// Priorities\n\tpriorityLow: \"Low\",\n\tpriorityMedium: \"Medium\",\n\tpriorityHigh: \"High\",\n\tpriorityUrgent: \"Urgent\",\n\t// Empty states\n\tnoBoards: \"No boards yet\",\n\tnoColumns: \"No columns yet\",\n\tnoTasks: \"No tasks yet\",\n\t// Errors\n\terrorGeneric: \"Something went wrong\",\n\terrorNotFound: \"Not found\",\n};\n",
+      "content": "export interface KanbanCommonLocalization {\n\t// Navigation\n\tbackToBoards: string;\n\t// Actions\n\tactions: string;\n\tcreate: string;\n\tedit: string;\n\tdelete: string;\n\tcancel: string;\n\tsave: string;\n\t// Status\n\tloading: string;\n\tsaving: string;\n\tcreating: string;\n\tupdating: string;\n\tdeleting: string;\n\t// Labels\n\tboard: string;\n\tboards: string;\n\tcolumn: string;\n\tcolumns: string;\n\ttask: string;\n\ttasks: string;\n\t// Priorities\n\tpriorityLow: string;\n\tpriorityMedium: string;\n\tpriorityHigh: string;\n\tpriorityUrgent: string;\n\t// Empty states\n\tnoBoards: string;\n\tnoColumns: string;\n\tnoTasks: string;\n\tassigned: string;\n\tunassigned: string;\n\t// Generic UI\n\tpageNotFound: string;\n\tpageNotFoundDescription: string;\n\tunexpectedError: string;\n\ttryAgain: string;\n\t// Errors\n\terrorGeneric: string;\n\terrorNotFound: string;\n\tdeleteBoardError: string;\n\tdeleteColumnError: string;\n\tdeleteTaskError: string;\n}\n\nexport const defaultKanbanCommonLocalization: KanbanCommonLocalization = {\n\t// Navigation\n\tbackToBoards: \"Back to Boards\",\n\t// Actions\n\tactions: \"Actions\",\n\tcreate: \"Create\",\n\tedit: \"Edit\",\n\tdelete: \"Delete\",\n\tcancel: \"Cancel\",\n\tsave: \"Save\",\n\t// Status\n\tloading: \"Loading...\",\n\tsaving: \"Saving...\",\n\tcreating: \"Creating...\",\n\tupdating: \"Updating...\",\n\tdeleting: \"Deleting...\",\n\t// Labels\n\tboard: \"Board\",\n\tboards: \"Boards\",\n\tcolumn: \"Column\",\n\tcolumns: \"Columns\",\n\ttask: \"Task\",\n\ttasks: \"Tasks\",\n\t// Priorities\n\tpriorityLow: \"Low\",\n\tpriorityMedium: \"Medium\",\n\tpriorityHigh: \"High\",\n\tpriorityUrgent: \"Urgent\",\n\t// Empty states\n\tnoBoards: \"No boards yet\",\n\tnoColumns: \"No columns yet\",\n\tnoTasks: \"No tasks yet\",\n\tassigned: \"Assigned\",\n\tunassigned: \"Unassigned\",\n\t// Generic UI\n\tpageNotFound: \"Page Not Found\",\n\tpageNotFoundDescription: \"The page you're looking for doesn't exist.\",\n\tunexpectedError: \"An unexpected error occurred. Please try again.\",\n\ttryAgain: \"Try Again\",\n\t// Errors\n\terrorGeneric: \"Something went wrong\",\n\terrorNotFound: \"Not found\",\n\tdeleteBoardError: \"Failed to delete board\",\n\tdeleteColumnError: \"Failed to delete column\",\n\tdeleteTaskError: \"Failed to delete task\",\n};\n",
       "target": "src/components/btst/kanban/client/localization/kanban-common.ts"
     },
     {
       "path": "btst/kanban/client/localization/kanban-forms.ts",
       "type": "registry:lib",
-      "content": "export interface KanbanFormsLocalization {\n\t// Board form\n\tboardName: string;\n\tboardNamePlaceholder: string;\n\tboardDescription: string;\n\tboardDescriptionPlaceholder: string;\n\tcreateBoard: string;\n\tupdateBoard: string;\n\tdeleteBoard: string;\n\tdeleteBoardConfirm: string;\n\t// Column form\n\tcolumnTitle: string;\n\tcolumnTitlePlaceholder: string;\n\tcreateColumn: string;\n\tupdateColumn: string;\n\tdeleteColumn: string;\n\tdeleteColumnConfirm: string;\n\t// Task form\n\ttaskTitle: string;\n\ttaskTitlePlaceholder: string;\n\ttaskDescription: string;\n\ttaskDescriptionPlaceholder: string;\n\ttaskPriority: string;\n\ttaskColumn: string;\n\ttaskAssignee: string;\n\tcreateTask: string;\n\tupdateTask: string;\n\tdeleteTask: string;\n\tdeleteTaskConfirm: string;\n\t// Validation\n\tnameRequired: string;\n\ttitleRequired: string;\n}\n\nexport const defaultKanbanFormsLocalization: KanbanFormsLocalization = {\n\t// Board form\n\tboardName: \"Name\",\n\tboardNamePlaceholder: \"e.g., Project Alpha\",\n\tboardDescription: \"Description\",\n\tboardDescriptionPlaceholder: \"Describe your board...\",\n\tcreateBoard: \"Create Board\",\n\tupdateBoard: \"Update Board\",\n\tdeleteBoard: \"Delete Board\",\n\tdeleteBoardConfirm:\n\t\t\"Are you sure you want to delete this board? This action cannot be undone. All columns and tasks will be permanently removed.\",\n\t// Column form\n\tcolumnTitle: \"Title\",\n\tcolumnTitlePlaceholder: \"e.g., To Do\",\n\tcreateColumn: \"Create Column\",\n\tupdateColumn: \"Update Column\",\n\tdeleteColumn: \"Delete Column\",\n\tdeleteColumnConfirm:\n\t\t\"Are you sure you want to delete this column? All tasks in this column will be permanently removed.\",\n\t// Task form\n\ttaskTitle: \"Title\",\n\ttaskTitlePlaceholder: \"e.g., Fix login bug\",\n\ttaskDescription: \"Description\",\n\ttaskDescriptionPlaceholder: \"Describe the task...\",\n\ttaskPriority: \"Priority\",\n\ttaskColumn: \"Column\",\n\ttaskAssignee: \"Assignee\",\n\tcreateTask: \"Create Task\",\n\tupdateTask: \"Update Task\",\n\tdeleteTask: \"Delete Task\",\n\tdeleteTaskConfirm:\n\t\t\"Are you sure you want to delete this task? This action cannot be undone.\",\n\t// Validation\n\tnameRequired: \"Name is required\",\n\ttitleRequired: \"Title is required\",\n};\n",
+      "content": "export interface KanbanFormsLocalization {\n\t// Board form\n\tboardName: string;\n\tboardNamePlaceholder: string;\n\tboardDescription: string;\n\tboardDescriptionPlaceholder: string;\n\tcreateBoard: string;\n\tupdateBoard: string;\n\tdeleteBoard: string;\n\tdeleteBoardConfirm: string;\n\t// Column form\n\tcolumnTitle: string;\n\tcolumnTitlePlaceholder: string;\n\tcreateColumn: string;\n\tupdateColumn: string;\n\tdeleteColumn: string;\n\tdeleteColumnConfirm: string;\n\t// Task form\n\ttaskTitle: string;\n\ttaskTitlePlaceholder: string;\n\ttaskDescription: string;\n\ttaskDescriptionPlaceholder: string;\n\ttaskPriority: string;\n\ttaskColumn: string;\n\ttaskAssignee: string;\n\tselectPriority: string;\n\tselectColumn: string;\n\tselectAssignee: string;\n\tnoUsersFound: string;\n\ttaskMovePartialError: string;\n\tcreateTask: string;\n\tupdateTask: string;\n\tdeleteTask: string;\n\tdeleteTaskConfirm: string;\n\t// Validation\n\tnameRequired: string;\n\ttitleRequired: string;\n}\n\nexport const defaultKanbanFormsLocalization: KanbanFormsLocalization = {\n\t// Board form\n\tboardName: \"Name\",\n\tboardNamePlaceholder: \"e.g., Project Alpha\",\n\tboardDescription: \"Description\",\n\tboardDescriptionPlaceholder: \"Describe your board...\",\n\tcreateBoard: \"Create Board\",\n\tupdateBoard: \"Update Board\",\n\tdeleteBoard: \"Delete Board\",\n\tdeleteBoardConfirm:\n\t\t\"Are you sure you want to delete this board? This action cannot be undone. All columns and tasks will be permanently removed.\",\n\t// Column form\n\tcolumnTitle: \"Title\",\n\tcolumnTitlePlaceholder: \"e.g., To Do\",\n\tcreateColumn: \"Create Column\",\n\tupdateColumn: \"Update Column\",\n\tdeleteColumn: \"Delete Column\",\n\tdeleteColumnConfirm:\n\t\t\"Are you sure you want to delete this column? All tasks in this column will be permanently removed.\",\n\t// Task form\n\ttaskTitle: \"Title\",\n\ttaskTitlePlaceholder: \"e.g., Fix login bug\",\n\ttaskDescription: \"Description\",\n\ttaskDescriptionPlaceholder: \"Describe the task...\",\n\ttaskPriority: \"Priority\",\n\ttaskColumn: \"Column\",\n\ttaskAssignee: \"Assignee\",\n\tselectPriority: \"Select priority\",\n\tselectColumn: \"Select column\",\n\tselectAssignee: \"Select assignee\",\n\tnoUsersFound: \"No users found\",\n\ttaskMovePartialError:\n\t\t\"Task properties were saved, but moving to the new column failed: {{message}}. You can try dragging the task to the desired column.\",\n\tcreateTask: \"Create Task\",\n\tupdateTask: \"Update Task\",\n\tdeleteTask: \"Delete Task\",\n\tdeleteTaskConfirm:\n\t\t\"Are you sure you want to delete this task? This action cannot be undone.\",\n\t// Validation\n\tnameRequired: \"Name is required\",\n\ttitleRequired: \"Title is required\",\n};\n",
       "target": "src/components/btst/kanban/client/localization/kanban-forms.ts"
     },
     {
       "path": "btst/kanban/client/localization/kanban-list.ts",
       "type": "registry:lib",
-      "content": "export interface KanbanListLocalization {\n\t// Page titles\n\tkanbanBoards: string;\n\tmanageProjects: string;\n\tcreateNewBoard: string;\n\tboardDetails: string;\n\t// Actions\n\tnewBoard: string;\n\taddColumn: string;\n\taddTask: string;\n\t// List\n\tcolumnsCount: string;\n\t// Empty states\n\tnoBoardsDescription: string;\n\tnoColumnsDescription: string;\n\tnoTasksDescription: string;\n}\n\nexport const defaultKanbanListLocalization: KanbanListLocalization = {\n\t// Page titles\n\tkanbanBoards: \"Kanban Boards\",\n\tmanageProjects: \"Manage your projects and tasks\",\n\tcreateNewBoard: \"Create New Board\",\n\tboardDetails: \"Board Details\",\n\t// Actions\n\tnewBoard: \"New Board\",\n\taddColumn: \"Add Column\",\n\taddTask: \"Add Task\",\n\t// List\n\tcolumnsCount: \"columns\",\n\t// Empty states\n\tnoBoardsDescription:\n\t\t\"Create your first kanban board to start organizing your tasks.\",\n\tnoColumnsDescription: \"Create your first column to start organizing tasks.\",\n\tnoTasksDescription: \"Add a task to get started\",\n};\n",
+      "content": "export interface KanbanListLocalization {\n\t// Page titles\n\tkanbanBoards: string;\n\tmanageProjects: string;\n\tcreateNewBoard: string;\n\tcreateNewBoardDescription: string;\n\tboardDetails: string;\n\tboardDetailsDescription: string;\n\t// Actions\n\tnewBoard: string;\n\taddColumn: string;\n\taddTask: string;\n\teditBoard: string;\n\teditColumn: string;\n\teditTask: string;\n\t// List\n\tcolumnsCount: string;\n\t// Empty states\n\tnoBoardsDescription: string;\n\tnoColumnsDescription: string;\n\tnoTasksDescription: string;\n\tboardNotFound: string;\n\tboardNotFoundDescription: string;\n\taddColumnDescription: string;\n\teditColumnDescription: string;\n\teditBoardDescription: string;\n\taddTaskDescription: string;\n\teditTaskDescription: string;\n}\n\nexport const defaultKanbanListLocalization: KanbanListLocalization = {\n\t// Page titles\n\tkanbanBoards: \"Kanban Boards\",\n\tmanageProjects: \"Manage your projects and tasks\",\n\tcreateNewBoard: \"Create New Board\",\n\tcreateNewBoardDescription: \"Set up a new kanban board for your project\",\n\tboardDetails: \"Board Details\",\n\tboardDetailsDescription: \"Enter the details for your new kanban board.\",\n\t// Actions\n\tnewBoard: \"New Board\",\n\taddColumn: \"Add Column\",\n\taddTask: \"Add Task\",\n\teditBoard: \"Edit Board\",\n\teditColumn: \"Edit Column\",\n\teditTask: \"Edit Task\",\n\t// List\n\tcolumnsCount: \"columns\",\n\t// Empty states\n\tnoBoardsDescription:\n\t\t\"Create your first kanban board to start organizing your tasks.\",\n\tnoColumnsDescription: \"Create your first column to start organizing tasks.\",\n\tnoTasksDescription: \"Add a task to get started\",\n\tboardNotFound: \"Board not found\",\n\tboardNotFoundDescription:\n\t\t\"The board you're looking for doesn't exist or you don't have access to it.\",\n\taddColumnDescription: \"Add a new column to this board.\",\n\teditColumnDescription: \"Update the column details.\",\n\teditBoardDescription: \"Update board details.\",\n\taddTaskDescription: \"Create a new task.\",\n\teditTaskDescription: \"Update task details.\",\n};\n",
       "target": "src/components/btst/kanban/client/localization/kanban-list.ts"
     },
     {
diff --git a/packages/stack/src/__tests__/kanban-query-keys.test.ts b/packages/stack/src/__tests__/kanban-query-keys.test.ts
new file mode 100644
index 00000000..75f18d5e
--- /dev/null
+++ b/packages/stack/src/__tests__/kanban-query-keys.test.ts
@@ -0,0 +1,51 @@
+/**
+ * SSG guard: factory-generated Kanban query keys must stay deep-equal to the
+ * builders used by `prefetchForRoute`. Key drift silently breaks hydration.
+ */
+import { describe, expect, it, vi } from "vitest";
+import { KANBAN_QUERY_KEYS } from "../plugins/kanban/api/query-key-defs";
+import { createKanbanQueryKeys } from "../plugins/kanban/query-keys";
+
+const client = vi.fn() as any;
+
+describe("kanban query keys match SSG prefetch keys", () => {
+	const queries = createKanbanQueryKeys(client);
+
+	it("board list keys match for default params", () => {
+		expect([...queries.boards.list().queryKey]).toEqual([
+			...KANBAN_QUERY_KEYS.boardsList(),
+		]);
+	});
+
+	it("board list keys match for every supported filter", () => {
+		const params = {
+			slug: "roadmap",
+			ownerId: "user-1",
+			organizationId: "org-1",
+			limit: 10,
+			offset: 20,
+		};
+		expect([...queries.boards.list(params).queryKey]).toEqual([
+			...KANBAN_QUERY_KEYS.boardsList(params),
+		]);
+	});
+
+	it("board detail keys match", () => {
+		expect([...queries.boards.detail("board-1").queryKey]).toEqual([
+			...KANBAN_QUERY_KEYS.boardDetail("board-1"),
+		]);
+	});
+
+	it("preserves the previous query-key factory prefixes", () => {
+		expect([...queries.boards._def]).toEqual(["boards"]);
+		expect([...queries.boards.list._def]).toEqual(["boards", "list"]);
+		expect([...queries.boards.detail._def]).toEqual(["boards", "detail"]);
+		expect([...queries.boards.bySlug._def]).toEqual(["boards", "bySlug"]);
+		expect([...queries.boards.bySlug("roadmap").queryKey]).toEqual([
+			"boards",
+			"bySlug",
+			"slug",
+			"roadmap",
+		]);
+	});
+});
diff --git a/packages/stack/src/__tests__/resource-factory.test.tsx b/packages/stack/src/__tests__/resource-factory.test.tsx
index ae49506f..21ad9b87 100644
--- a/packages/stack/src/__tests__/resource-factory.test.tsx
+++ b/packages/stack/src/__tests__/resource-factory.test.tsx
@@ -313,6 +313,7 @@ describe("createResource hooks", () => {
 						"test-plugin": {
 							apiBaseURL: "http://test.local",
 							apiBasePath: "/api/data",
+							headers: { "x-resource-test": "forwarded" },
 							refresh,
 						},
 					}}
@@ -491,6 +492,7 @@ describe("createResource hooks", () => {
 		const [url, init] = fetchMock.mock.calls[0] as [unknown, RequestInit];
 		expect(String(url)).toContain("/api/data/items");
 		expect(init.method).toBe("POST");
+		expect(new Headers(init.headers).get("x-resource-test")).toBe("forwarded");
 
 		// Detail cache seeded from the result
 		expect(queryClient.getQueryData(["items", "detail", "42"])).toEqual(
diff --git a/packages/stack/src/plugins/client/resource/internal.ts b/packages/stack/src/plugins/client/resource/internal.ts
index 7b4bb2ae..94c04c7d 100644
--- a/packages/stack/src/plugins/client/resource/internal.ts
+++ b/packages/stack/src/plugins/client/resource/internal.ts
@@ -66,7 +66,7 @@ export function useResourceMutationForDef(
 	def: ResourceMutationDef<any, any> | undefined,
 ): UseMutationResult<unknown, Error, unknown> {
 	const queryClient = useQueryClient();
-	const { client, refresh } = context;
+	const { client, headers, refresh } = context;
 
 	return useMutation<unknown, Error, unknown>({
 		mutationKey: [resourceName, mutationName],
@@ -76,7 +76,7 @@ export function useResourceMutationForDef(
 					`Resource "${resourceName}" has no "${mutationName}" mutation declared`,
 				);
 			}
-			return runResourceMutation(client, def, vars);
+			return runResourceMutation(client, def, vars, headers);
 		},
 		onSuccess: async (result) => {
 			if (!def) return;
diff --git a/packages/stack/src/plugins/kanban/__tests__/client-sweep.test.tsx b/packages/stack/src/plugins/kanban/__tests__/client-sweep.test.tsx
new file mode 100644
index 00000000..515ed578
--- /dev/null
+++ b/packages/stack/src/plugins/kanban/__tests__/client-sweep.test.tsx
@@ -0,0 +1,259 @@
+// @vitest-environment jsdom
+import { act } from "react";
+import { createRoot, type Root } from "react-dom/client";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import {
+	StackProvider,
+	type StackAuthProvider,
+	type StackI18nProvider,
+} from "@btst/stack/context";
+import { BoardForm } from "../client/components/forms/board-form";
+import { ColumnForm } from "../client/components/forms/column-form";
+import { TaskForm } from "../client/components/forms/task-form";
+import { BoardsListPage } from "../client/components/pages/boards-list-page.internal";
+import type {
+	SerializedBoard,
+	SerializedColumn,
+	SerializedTask,
+} from "../types";
+
+(globalThis as any).IS_REACT_ACT_ENVIRONMENT = true;
+
+const hooks = vi.hoisted(() => ({
+	useSuspenseBoards: vi.fn(),
+	useBoardForm: vi.fn(),
+	useColumnForm: vi.fn(),
+	useTaskForm: vi.fn(),
+	useTaskMutations: vi.fn(),
+	useSearchUsers: vi.fn(),
+}));
+
+vi.mock("../client/hooks/kanban-hooks", () => hooks);
+
+vi.mock("@workspace/ui/components/minimal-tiptap", () => ({
+	MinimalTiptapEditor: () => <div data-testid="task-description-editor" />,
+}));
+
+vi.mock("@workspace/ui/components/search-select", () => ({
+	default: () => <div data-testid="assignee-select" />,
+}));
+
+const board: SerializedBoard = {
+	id: "board-1",
+	name: "Roadmap",
+	slug: "roadmap",
+	description: "Team roadmap",
+	createdAt: new Date("2024-01-01").toISOString(),
+	updatedAt: new Date("2024-01-01").toISOString(),
+};
+
+const column: SerializedColumn = {
+	id: "column-1",
+	boardId: board.id,
+	title: "To Do",
+	order: 0,
+	tasks: [],
+	createdAt: new Date("2024-01-01").toISOString(),
+	updatedAt: new Date("2024-01-01").toISOString(),
+};
+
+const task: SerializedTask = {
+	id: "task-1",
+	columnId: column.id,
+	title: "Ship it",
+	description: "",
+	priority: "MEDIUM",
+	order: 0,
+	isArchived: false,
+	createdAt: new Date("2024-01-01").toISOString(),
+	updatedAt: new Date("2024-01-01").toISOString(),
+};
+
+let container: HTMLDivElement;
+let root: Root;
+
+const formResult = {
+	action: "create",
+	record: null,
+	isLoadingRecord: false,
+	recordError: null,
+	defaultValues: undefined,
+	submit: vi.fn(),
+	isSubmitting: false,
+	error: null,
+	fieldErrors: {},
+	clearErrors: vi.fn(),
+};
+
+const kanbanOverrides = {
+	navigate: vi.fn(),
+	apiBaseURL: "http://test.local",
+	apiBasePath: "/api/data",
+	resolveUser: vi.fn(),
+	searchUsers: vi.fn().mockResolvedValue([]),
+};
+
+beforeEach(() => {
+	container = document.createElement("div");
+	document.body.appendChild(container);
+	root = createRoot(container);
+
+	hooks.useSuspenseBoards.mockReturnValue({
+		data: [],
+		error: null,
+		isFetching: false,
+	});
+	hooks.useBoardForm.mockReturnValue({ ...formResult });
+	hooks.useColumnForm.mockReturnValue({ ...formResult });
+	hooks.useTaskForm.mockReturnValue({ ...formResult });
+	hooks.useTaskMutations.mockReturnValue({
+		moveTask: vi.fn().mockResolvedValue(task),
+		isMoving: false,
+	});
+	hooks.useSearchUsers.mockReturnValue({ data: [] });
+});
+
+afterEach(async () => {
+	await act(async () => {
+		root.unmount();
+	});
+	container.remove();
+	document.body.innerHTML = "";
+	vi.clearAllMocks();
+});
+
+async function render(
+	ui: React.ReactElement,
+	options: {
+		auth?: StackAuthProvider;
+		i18n?: StackI18nProvider;
+		localization?: Record<string, string>;
+	} = {},
+) {
+	await act(async () => {
+		root.render(
+			<StackProvider
+				basePath="/pages"
+				auth={options.auth}
+				i18n={options.i18n}
+				overrides={{
+					kanban: {
+						...kanbanOverrides,
+						localization: options.localization,
+					},
+				}}
+			>
+				{ui}
+			</StackProvider>,
+		);
+	});
+}
+
+async function waitFor(check: () => boolean, timeout = 3000) {
+	const start = Date.now();
+	while (!check()) {
+		if (Date.now() - start > timeout) throw new Error("waitFor timed out");
+		await act(async () => {
+			await new Promise((resolve) => setTimeout(resolve, 10));
+		});
+	}
+}
+
+function texts(): string {
+	return document.body.textContent ?? "";
+}
+
+describe("Kanban permissions", () => {
+	it("shows create-board controls when auth is not configured", async () => {
+		await render(<BoardsListPage />);
+		expect(texts()).toContain("Create Board");
+	});
+
+	it("hides create-board controls when permission is denied", async () => {
+		const can = vi.fn(
+			({ resource, action }: { resource: string; action: string }) =>
+				!(resource === "kanban:board" && action === "create"),
+		);
+		const auth: StackAuthProvider = {
+			getIdentity: () => ({ id: "user-1" }),
+			can,
+		};
+
+		await render(<BoardsListPage />, { auth });
+		await waitFor(() => !texts().includes("Create Board"));
+
+		expect(texts()).toContain("No boards yet");
+		expect(can).toHaveBeenCalledWith(
+			expect.objectContaining({
+				resource: "kanban:board",
+				action: "create",
+			}),
+		);
+	});
+});
+
+describe("Kanban resource forms", () => {
+	it("renders normalized server field errors inline", async () => {
+		hooks.useBoardForm.mockReturnValue({
+			...formResult,
+			error: new Error("Validation failed"),
+			fieldErrors: { name: "Server says the name is invalid" },
+		});
+
+		await render(<BoardForm onClose={() => {}} onSuccess={() => {}} />);
+
+		expect(texts()).toContain("Server says the name is invalid");
+	});
+
+	it("wires all three forms to their public resource form hooks", async () => {
+		await render(
+			<>
+				<BoardForm board={board} onClose={() => {}} onSuccess={() => {}} />
+				<ColumnForm
+					boardId={board.id}
+					columnId={column.id}
+					column={column}
+					onClose={() => {}}
+					onSuccess={() => {}}
+				/>
+				<TaskForm
+					boardId={board.id}
+					columnId={column.id}
+					taskId={task.id}
+					task={task}
+					columns={[column]}
+					onClose={() => {}}
+					onSuccess={() => {}}
+				/>
+			</>,
+		);
+
+		expect(hooks.useBoardForm).toHaveBeenCalled();
+		expect(hooks.useColumnForm).toHaveBeenCalled();
+		expect(hooks.useTaskForm).toHaveBeenCalled();
+	});
+});
+
+describe("Kanban i18n precedence", () => {
+	it("routes UI strings through the i18n provider", async () => {
+		const i18n: StackI18nProvider = {
+			translate: (key, defaultValue) =>
+				key === "kanban.common.noBoards" ? "Noch keine Boards" : defaultValue,
+		};
+
+		await render(<BoardsListPage />, { i18n });
+		expect(texts()).toContain("Noch keine Boards");
+	});
+
+	it("lets the existing localization override win", async () => {
+		const translate = vi.fn((key: string) => `translated:${key}`);
+
+		await render(<BoardsListPage />, {
+			i18n: { translate },
+			localization: { noBoards: "Custom empty board copy" },
+		});
+
+		expect(texts()).toContain("Custom empty board copy");
+		expect(texts()).not.toContain("translated:kanban.common.noBoards");
+	});
+});
diff --git a/packages/stack/src/plugins/kanban/client/components/forms/board-form.tsx b/packages/stack/src/plugins/kanban/client/components/forms/board-form.tsx
index 1105d3bc..95159788 100644
--- a/packages/stack/src/plugins/kanban/client/components/forms/board-form.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/forms/board-form.tsx
@@ -5,7 +5,9 @@ import { Button } from "@workspace/ui/components/button";
 import { Input } from "@workspace/ui/components/input";
 import { Textarea } from "@workspace/ui/components/textarea";
 import { Label } from "@workspace/ui/components/label";
-import { useBoardMutations } from "../../hooks/kanban-hooks";
+import { usePluginOverrides, useTranslate } from "@btst/stack/context";
+import { useBoardForm } from "../../hooks/kanban-hooks";
+import type { KanbanPluginOverrides } from "../../overrides";
 import type { SerializedBoard } from "../../../types";
 
 interface BoardFormProps {
@@ -14,93 +16,138 @@ interface BoardFormProps {
 	onSuccess: (boardId: string) => void;
 }
 
+interface BoardFormValues {
+	name: string;
+	description: string;
+}
+
+function firstError(error: string | string[] | undefined): string | undefined {
+	return Array.isArray(error) ? error[0] : error;
+}
+
 export function BoardForm({ board, onClose, onSuccess }: BoardFormProps) {
+	const t = useTranslate();
+	const { localization } = usePluginOverrides<KanbanPluginOverrides>("kanban");
 	const isEditing = !!board;
-	const { createBoard, updateBoard, isCreating, isUpdating } =
-		useBoardMutations();
 
 	const [name, setName] = useState(board?.name || "");
 	const [description, setDescription] = useState(board?.description || "");
-	const [error, setError] = useState<string | null>(null);
+	const [nameError, setNameError] = useState<string | null>(null);
 
-	const isPending = isCreating || isUpdating;
+	const resourceForm = useBoardForm<BoardFormValues>({
+		action: isEditing ? "edit" : "create",
+		record: board ?? null,
+		toCreateVars: (values) => values,
+		toUpdateVars: (values) => ({ id: board?.id ?? "", data: values }),
+		onSuccess: (savedBoard) => onSuccess(savedBoard.id),
+	});
 
-	const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
-		e.preventDefault();
-		setError(null);
+	const serverNameError = firstError(resourceForm.fieldErrors.name);
+	const serverDescriptionError = firstError(
+		resourceForm.fieldErrors.description,
+	);
+	const topLevelError =
+		resourceForm.error && Object.keys(resourceForm.fieldErrors).length === 0
+			? resourceForm.error.message
+			: null;
+
+	const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
+		event.preventDefault();
+		resourceForm.clearErrors();
+		setNameError(null);
 
 		if (!name.trim()) {
-			setError("Name is required");
+			setNameError(
+				localization?.nameRequired ??
+					t("kanban.forms.nameRequired", "Name is required"),
+			);
 			return;
 		}
 
-		try {
-			if (isEditing && board) {
-				await updateBoard(board.id, { name, description });
-				onSuccess(board.id);
-			} else {
-				const newBoard = await createBoard({ name, description });
-				if (newBoard?.id) {
-					onSuccess(newBoard.id);
-				}
-			}
-		} catch (err) {
-			setError(err instanceof Error ? err.message : "An error occurred");
-		}
+		await resourceForm.submit({ name, description });
 	};
 
 	return (
 		<form onSubmit={handleSubmit} className="space-y-4 overflow-x-hidden">
 			<div className="space-y-2">
-				<Label htmlFor="name">Name *</Label>
+				<Label htmlFor="name">
+					{localization?.boardName ?? t("kanban.forms.boardName", "Name")} *
+				</Label>
 				<Input
 					id="name"
 					value={name}
-					onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
-						setName(e.target.value)
+					onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
+						setName(event.target.value);
+						setNameError(null);
+					}}
+					placeholder={
+						localization?.boardNamePlaceholder ??
+						t("kanban.forms.boardNamePlaceholder", "e.g., Project Alpha")
 					}
-					placeholder="e.g., Project Alpha"
-					disabled={isPending}
+					disabled={resourceForm.isSubmitting}
+					aria-invalid={!!(nameError || serverNameError)}
 				/>
+				{(nameError || serverNameError) && (
+					<p className="text-sm text-destructive">
+						{nameError || serverNameError}
+					</p>
+				)}
 			</div>
 
 			<div className="space-y-2">
-				<Label htmlFor="description">Description</Label>
+				<Label htmlFor="description">
+					{localization?.boardDescription ??
+						t("kanban.forms.boardDescription", "Description")}
+				</Label>
 				<Textarea
 					id="description"
 					value={description}
-					onChange={(e: React.ChangeEvent<HTMLTextAreaElement>) =>
-						setDescription(e.target.value)
+					onChange={(event: React.ChangeEvent<HTMLTextAreaElement>) =>
+						setDescription(event.target.value)
+					}
+					placeholder={
+						localization?.boardDescriptionPlaceholder ??
+						t(
+							"kanban.forms.boardDescriptionPlaceholder",
+							"Describe your board...",
+						)
 					}
-					placeholder="Describe your board..."
-					disabled={isPending}
+					disabled={resourceForm.isSubmitting}
 					rows={3}
+					aria-invalid={!!serverDescriptionError}
 				/>
+				{serverDescriptionError && (
+					<p className="text-sm text-destructive">{serverDescriptionError}</p>
+				)}
 			</div>
 
-			{error && (
+			{topLevelError && (
 				<div className="p-3 text-sm text-red-600 bg-red-50 border border-red-200 rounded-md">
-					{error}
+					{topLevelError}
 				</div>
 			)}
 
 			<div className="flex gap-2 pt-2">
-				<Button type="submit" disabled={isPending}>
-					{isPending
+				<Button type="submit" disabled={resourceForm.isSubmitting}>
+					{resourceForm.isSubmitting
 						? isEditing
-							? "Updating..."
-							: "Creating..."
+							? (localization?.updating ??
+								t("kanban.common.updating", "Updating..."))
+							: (localization?.creating ??
+								t("kanban.common.creating", "Creating..."))
 						: isEditing
-							? "Update Board"
-							: "Create Board"}
+							? (localization?.updateBoard ??
+								t("kanban.forms.updateBoard", "Update Board"))
+							: (localization?.createBoard ??
+								t("kanban.forms.createBoard", "Create Board"))}
 				</Button>
 				<Button
 					type="button"
 					variant="outline"
 					onClick={onClose}
-					disabled={isPending}
+					disabled={resourceForm.isSubmitting}
 				>
-					Cancel
+					{localization?.cancel ?? t("kanban.common.cancel", "Cancel")}
 				</Button>
 			</div>
 		</form>
diff --git a/packages/stack/src/plugins/kanban/client/components/forms/column-form.tsx b/packages/stack/src/plugins/kanban/client/components/forms/column-form.tsx
index dc684d95..7238972c 100644
--- a/packages/stack/src/plugins/kanban/client/components/forms/column-form.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/forms/column-form.tsx
@@ -4,7 +4,9 @@ import { useState } from "react";
 import { Button } from "@workspace/ui/components/button";
 import { Input } from "@workspace/ui/components/input";
 import { Label } from "@workspace/ui/components/label";
-import { useColumnMutations } from "../../hooks/kanban-hooks";
+import { usePluginOverrides, useTranslate } from "@btst/stack/context";
+import { useColumnForm } from "../../hooks/kanban-hooks";
+import type { KanbanPluginOverrides } from "../../overrides";
 import type { SerializedColumn } from "../../../types";
 
 interface ColumnFormProps {
@@ -15,6 +17,14 @@ interface ColumnFormProps {
 	onSuccess: () => void;
 }
 
+interface ColumnFormValues {
+	title: string;
+}
+
+function firstError(error: string | string[] | undefined): string | undefined {
+	return Array.isArray(error) ? error[0] : error;
+}
+
 export function ColumnForm({
 	boardId,
 	columnId,
@@ -22,74 +32,97 @@ export function ColumnForm({
 	onClose,
 	onSuccess,
 }: ColumnFormProps) {
+	const t = useTranslate();
+	const { localization } = usePluginOverrides<KanbanPluginOverrides>("kanban");
 	const isEditing = !!columnId;
-	const { createColumn, updateColumn, isCreating, isUpdating } =
-		useColumnMutations();
-
 	const [title, setTitle] = useState(column?.title || "");
-	const [error, setError] = useState<string | null>(null);
+	const [titleError, setTitleError] = useState<string | null>(null);
+
+	const resourceForm = useColumnForm<ColumnFormValues>({
+		action: isEditing ? "edit" : "create",
+		record: column ?? null,
+		toCreateVars: (values) => ({ ...values, boardId }),
+		toUpdateVars: (values) => ({ id: columnId ?? "", data: values }),
+		onSuccess,
+	});
 
-	const isPending = isCreating || isUpdating;
+	const serverTitleError = firstError(resourceForm.fieldErrors.title);
+	const topLevelError =
+		resourceForm.error && Object.keys(resourceForm.fieldErrors).length === 0
+			? resourceForm.error.message
+			: null;
 
-	const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
-		e.preventDefault();
-		setError(null);
+	const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
+		event.preventDefault();
+		resourceForm.clearErrors();
+		setTitleError(null);
 
 		if (!title.trim()) {
-			setError("Title is required");
+			setTitleError(
+				localization?.titleRequired ??
+					t("kanban.forms.titleRequired", "Title is required"),
+			);
 			return;
 		}
 
-		try {
-			if (isEditing && columnId) {
-				await updateColumn(columnId, { title });
-			} else {
-				await createColumn({ title, boardId });
-			}
-			onSuccess();
-		} catch (err) {
-			setError(err instanceof Error ? err.message : "An error occurred");
-		}
+		await resourceForm.submit({ title });
 	};
 
 	return (
 		<form onSubmit={handleSubmit} className="space-y-4">
 			<div className="space-y-2">
-				<Label htmlFor="title">Title *</Label>
+				<Label htmlFor="title">
+					{localization?.columnTitle ?? t("kanban.forms.columnTitle", "Title")}{" "}
+					*
+				</Label>
 				<Input
 					id="title"
 					value={title}
-					onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
-						setTitle(e.target.value)
+					onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
+						setTitle(event.target.value);
+						setTitleError(null);
+					}}
+					placeholder={
+						localization?.columnTitlePlaceholder ??
+						t("kanban.forms.columnTitlePlaceholder", "e.g., To Do")
 					}
-					placeholder="e.g., To Do"
-					disabled={isPending}
+					disabled={resourceForm.isSubmitting}
+					aria-invalid={!!(titleError || serverTitleError)}
 				/>
+				{(titleError || serverTitleError) && (
+					<p className="text-sm text-destructive">
+						{titleError || serverTitleError}
+					</p>
+				)}
 			</div>
 
-			{error && (
+			{topLevelError && (
 				<div className="p-3 text-sm text-red-600 bg-red-50 border border-red-200 rounded-md">
-					{error}
+					{topLevelError}
 				</div>
 			)}
 
 			<div className="flex gap-2 pt-2">
-				<Button type="submit" disabled={isPending}>
-					{isPending
+				<Button type="submit" disabled={resourceForm.isSubmitting}>
+					{resourceForm.isSubmitting
 						? isEditing
-							? "Updating..."
-							: "Creating..."
+							? (localization?.updating ??
+								t("kanban.common.updating", "Updating..."))
+							: (localization?.creating ??
+								t("kanban.common.creating", "Creating..."))
 						: isEditing
-							? "Update Column"
-							: "Create Column"}
+							? (localization?.updateColumn ??
+								t("kanban.forms.updateColumn", "Update Column"))
+							: (localization?.createColumn ??
+								t("kanban.forms.createColumn", "Create Column"))}
 				</Button>
 				<Button
 					type="button"
 					variant="outline"
 					onClick={onClose}
-					disabled={isPending}
+					disabled={resourceForm.isSubmitting}
 				>
-					Cancel
+					{localization?.cancel ?? t("kanban.common.cancel", "Cancel")}
 				</Button>
 			</div>
 		</form>
diff --git a/packages/stack/src/plugins/kanban/client/components/forms/task-form.tsx b/packages/stack/src/plugins/kanban/client/components/forms/task-form.tsx
index 231f2ae5..7ce16121 100644
--- a/packages/stack/src/plugins/kanban/client/components/forms/task-form.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/forms/task-form.tsx
@@ -14,10 +14,17 @@ import {
 } from "@workspace/ui/components/select";
 import { MinimalTiptapEditor } from "@workspace/ui/components/minimal-tiptap";
 import SearchSelect from "@workspace/ui/components/search-select";
-import { usePluginOverrides } from "@btst/stack/context";
-import { useTaskMutations, useSearchUsers } from "../../hooks/kanban-hooks";
+import {
+	CanAccess,
+	usePluginOverrides,
+	useTranslate,
+} from "@btst/stack/context";
+import {
+	useTaskForm,
+	useTaskMutations,
+	useSearchUsers,
+} from "../../hooks/kanban-hooks";
 import type { KanbanPluginOverrides } from "../../overrides";
-import { PRIORITY_OPTIONS } from "../../../utils";
 import type {
 	SerializedColumn,
 	SerializedTask,
@@ -32,7 +39,19 @@ interface TaskFormProps {
 	columns: SerializedColumn[];
 	onClose: () => void;
 	onSuccess: () => void;
-	onDelete?: () => void;
+	onDelete?: () => void | Promise<void>;
+}
+
+interface TaskFormValues {
+	title: string;
+	description: string;
+	priority: Priority;
+	columnId: string;
+	assigneeId: string;
+}
+
+function firstError(error: string | string[] | undefined): string | undefined {
+	return Array.isArray(error) ? error[0] : error;
 }
 
 export function TaskForm({
@@ -45,18 +64,14 @@ export function TaskForm({
 	onSuccess,
 	onDelete,
 }: TaskFormProps) {
-	const isEditing = !!taskId;
-	const { uploadImage, imagePicker: imagePickerTrigger } =
-		usePluginOverrides<KanbanPluginOverrides>("kanban");
+	const t = useTranslate();
 	const {
-		createTask,
-		updateTask,
-		moveTask,
-		isCreating,
-		isUpdating,
-		isDeleting,
-		isMoving,
-	} = useTaskMutations();
+		uploadImage,
+		imagePicker: imagePickerTrigger,
+		localization,
+	} = usePluginOverrides<KanbanPluginOverrides>("kanban");
+	const isEditing = !!taskId;
+	const { moveTask, isMoving } = useTaskMutations();
 
 	const [title, setTitle] = useState(task?.title || "");
 	const [description, setDescription] = useState(task?.description || "");
@@ -67,191 +82,298 @@ export function TaskForm({
 		task?.columnId || columnId,
 	);
 	const [assigneeId, setAssigneeId] = useState<string>(task?.assigneeId || "");
-	const [error, setError] = useState<string | null>(null);
+	const [titleError, setTitleError] = useState<string | null>(null);
+	const [isDeleting, setIsDeleting] = useState(false);
+
+	const resourceForm = useTaskForm<TaskFormValues>({
+		action: isEditing ? "edit" : "create",
+		record: task ?? null,
+		toCreateVars: (values) => ({
+			title: values.title,
+			description: values.description,
+			priority: values.priority,
+			columnId: values.columnId,
+			assigneeId: values.assigneeId || undefined,
+		}),
+		toUpdateVars: (values) => ({
+			id: taskId ?? "",
+			data: {
+				title: values.title,
+				description: values.description,
+				priority: values.priority,
+				...(values.columnId === task?.columnId
+					? { columnId: values.columnId }
+					: {}),
+				assigneeId: values.assigneeId || null,
+			},
+		}),
+		onSuccess: async () => {
+			if (isEditing && taskId && selectedColumnId !== task?.columnId) {
+				const targetTasks =
+					columns.find((column) => column.id === selectedColumnId)?.tasks ?? [];
+				const targetOrder =
+					targetTasks.length > 0
+						? Math.max(...targetTasks.map((targetTask) => targetTask.order)) + 1
+						: 0;
+
+				try {
+					await moveTask(taskId, selectedColumnId, targetOrder);
+				} catch (error) {
+					const message =
+						error instanceof Error
+							? error.message
+							: (localization?.errorGeneric ??
+								t("kanban.common.errorGeneric", "Something went wrong"));
+					const partialErrorTemplate = localization?.taskMovePartialError;
+					throw new Error(
+						partialErrorTemplate
+							? partialErrorTemplate.replaceAll("{{message}}", message)
+							: t(
+									"kanban.forms.taskMovePartialError",
+									"Task properties were saved, but moving to the new column failed: {{message}}. You can try dragging the task to the desired column.",
+									{ message },
+								),
+					);
+				}
+			}
+
+			onSuccess();
+		},
+	});
 
-	// Fetch available users for assignment
 	const { data: users = [] } = useSearchUsers("", boardId);
+	const unassigned =
+		localization?.unassigned ?? t("kanban.common.unassigned", "Unassigned");
 	const userOptions = [
-		{ value: "", label: "Unassigned" },
+		{ value: "", label: unassigned },
 		...users.map((user) => ({ value: user.id, label: user.name })),
 	];
+	const priorityOptions: Array<{ value: Priority; label: string }> = [
+		{
+			value: "LOW",
+			label: localization?.priorityLow ?? t("kanban.common.priorityLow", "Low"),
+		},
+		{
+			value: "MEDIUM",
+			label:
+				localization?.priorityMedium ??
+				t("kanban.common.priorityMedium", "Medium"),
+		},
+		{
+			value: "HIGH",
+			label:
+				localization?.priorityHigh ?? t("kanban.common.priorityHigh", "High"),
+		},
+		{
+			value: "URGENT",
+			label:
+				localization?.priorityUrgent ??
+				t("kanban.common.priorityUrgent", "Urgent"),
+		},
+	];
 
-	const isPending = isCreating || isUpdating || isDeleting || isMoving;
+	const isPending = resourceForm.isSubmitting || isMoving || isDeleting;
+	const serverTitleError = firstError(resourceForm.fieldErrors.title);
+	const serverDescriptionError = firstError(
+		resourceForm.fieldErrors.description,
+	);
+	const serverPriorityError = firstError(resourceForm.fieldErrors.priority);
+	const serverColumnError = firstError(resourceForm.fieldErrors.columnId);
+	const serverAssigneeError = firstError(resourceForm.fieldErrors.assigneeId);
+	const topLevelError =
+		resourceForm.error && Object.keys(resourceForm.fieldErrors).length === 0
+			? resourceForm.error.message
+			: null;
 
-	const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
-		e.preventDefault();
-		setError(null);
+	const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
+		event.preventDefault();
+		resourceForm.clearErrors();
+		setTitleError(null);
 
 		if (!title.trim()) {
-			setError("Title is required");
+			setTitleError(
+				localization?.titleRequired ??
+					t("kanban.forms.titleRequired", "Title is required"),
+			);
 			return;
 		}
 
-		try {
-			if (isEditing && taskId) {
-				const isColumnChanging =
-					task?.columnId && selectedColumnId !== task.columnId;
-
-				if (isColumnChanging) {
-					// When changing columns, we need two operations:
-					// 1. Update task properties (title, description, priority, assigneeId)
-					// 2. Move task to new column with proper order calculation
-					//
-					// To avoid partial failure confusion, we attempt both operations
-					// but provide clear messaging if one succeeds and the other fails.
-
-					// First update the task properties (title, description, priority, assigneeId)
-					// If this fails, nothing is saved and the outer catch handles it
-					await updateTask(taskId, {
-						title,
-						description,
-						priority,
-						assigneeId: assigneeId || null,
-					});
-
-					// Then move the task to the new column with calculated order
-					// Place at the end of the destination column
-					try {
-						const targetColumn = columns.find((c) => c.id === selectedColumnId);
-						const targetTasks = targetColumn?.tasks || [];
-						const targetOrder =
-							targetTasks.length > 0
-								? Math.max(...targetTasks.map((t) => t.order)) + 1
-								: 0;
+		await resourceForm.submit({
+			title,
+			description,
+			priority,
+			columnId: selectedColumnId,
+			assigneeId,
+		});
+	};
 
-						await moveTask(taskId, selectedColumnId, targetOrder);
-					} catch (moveErr) {
-						// Properties were saved but column move failed
-						// Provide specific error message about partial success
-						const moveErrorMsg =
-							moveErr instanceof Error ? moveErr.message : "Unknown error";
-						setError(
-							`Task properties were saved, but moving to the new column failed: ${moveErrorMsg}. ` +
-								`You can try dragging the task to the desired column.`,
-						);
-						// Don't call onSuccess since the operation wasn't fully completed
-						// but also don't throw - we want to show the specific error
-						return;
-					}
-				} else {
-					// Same column - just update the task properties
-					await updateTask(taskId, {
-						title,
-						description,
-						priority,
-						columnId: selectedColumnId,
-						assigneeId: assigneeId || null,
-					});
-				}
-			} else {
-				await createTask({
-					title,
-					description,
-					priority,
-					columnId: selectedColumnId,
-					assigneeId: assigneeId || undefined,
-				});
-			}
-			onSuccess();
-		} catch (err) {
-			setError(err instanceof Error ? err.message : "An error occurred");
+	const handleDelete = async () => {
+		if (!onDelete) return;
+		setIsDeleting(true);
+		try {
+			await onDelete();
+		} finally {
+			setIsDeleting(false);
 		}
 	};
 
 	return (
 		<form onSubmit={handleSubmit} className="space-y-4 overflow-x-hidden">
 			<div className="space-y-2">
-				<Label htmlFor="title">Title *</Label>
+				<Label htmlFor="title">
+					{localization?.taskTitle ?? t("kanban.forms.taskTitle", "Title")} *
+				</Label>
 				<Input
 					id="title"
 					value={title}
-					onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
-						setTitle(e.target.value)
+					onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
+						setTitle(event.target.value);
+						setTitleError(null);
+					}}
+					placeholder={
+						localization?.taskTitlePlaceholder ??
+						t("kanban.forms.taskTitlePlaceholder", "e.g., Fix login bug")
 					}
-					placeholder="e.g., Fix login bug"
 					disabled={isPending}
+					aria-invalid={!!(titleError || serverTitleError)}
 				/>
+				{(titleError || serverTitleError) && (
+					<p className="text-sm text-destructive">
+						{titleError || serverTitleError}
+					</p>
+				)}
 			</div>
 
 			<div className="grid grid-cols-2 gap-4">
 				<div className="space-y-2">
-					<Label htmlFor="priority">Priority</Label>
+					<Label htmlFor="priority">
+						{localization?.taskPriority ??
+							t("kanban.forms.taskPriority", "Priority")}
+					</Label>
 					<Select
 						value={priority}
-						onValueChange={(v: string) => setPriority(v as Priority)}
+						onValueChange={(value: string) => setPriority(value as Priority)}
+						disabled={isPending}
 					>
-						<SelectTrigger>
-							<SelectValue placeholder="Select priority" />
+						<SelectTrigger id="priority" aria-invalid={!!serverPriorityError}>
+							<SelectValue
+								placeholder={
+									localization?.selectPriority ??
+									t("kanban.forms.selectPriority", "Select priority")
+								}
+							/>
 						</SelectTrigger>
 						<SelectContent>
-							{PRIORITY_OPTIONS.map((option) => (
+							{priorityOptions.map((option) => (
 								<SelectItem key={option.value} value={option.value}>
 									{option.label}
 								</SelectItem>
 							))}
 						</SelectContent>
 					</Select>
+					{serverPriorityError && (
+						<p className="text-sm text-destructive">{serverPriorityError}</p>
+					)}
 				</div>
 
 				<div className="space-y-2">
-					<Label htmlFor="column">Column</Label>
-					<Select value={selectedColumnId} onValueChange={setSelectedColumnId}>
-						<SelectTrigger>
-							<SelectValue placeholder="Select column" />
+					<Label htmlFor="column">
+						{localization?.taskColumn ?? t("kanban.forms.taskColumn", "Column")}
+					</Label>
+					<Select
+						value={selectedColumnId}
+						onValueChange={setSelectedColumnId}
+						disabled={isPending}
+					>
+						<SelectTrigger id="column" aria-invalid={!!serverColumnError}>
+							<SelectValue
+								placeholder={
+									localization?.selectColumn ??
+									t("kanban.forms.selectColumn", "Select column")
+								}
+							/>
 						</SelectTrigger>
 						<SelectContent>
-							{columns.map((col) => (
-								<SelectItem key={col.id} value={col.id}>
-									{col.title}
+							{columns.map((column) => (
+								<SelectItem key={column.id} value={column.id}>
+									{column.title}
 								</SelectItem>
 							))}
 						</SelectContent>
 					</Select>
+					{serverColumnError && (
+						<p className="text-sm text-destructive">{serverColumnError}</p>
+					)}
 				</div>
 			</div>
 
 			<div className="space-y-2">
-				<Label htmlFor="assignee">Assignee</Label>
+				<Label htmlFor="assignee">
+					{localization?.taskAssignee ??
+						t("kanban.forms.taskAssignee", "Assignee")}
+				</Label>
 				<SearchSelect
 					options={userOptions}
 					value={assigneeId}
 					onChange={setAssigneeId}
-					placeholder="Select assignee"
-					emptyMessage="No users found"
+					placeholder={
+						localization?.selectAssignee ??
+						t("kanban.forms.selectAssignee", "Select assignee")
+					}
+					emptyMessage={
+						localization?.noUsersFound ??
+						t("kanban.forms.noUsersFound", "No users found")
+					}
 				/>
+				{serverAssigneeError && (
+					<p className="text-sm text-destructive">{serverAssigneeError}</p>
+				)}
 			</div>
 
 			<div className="space-y-2">
-				<Label>Description</Label>
+				<Label>
+					{localization?.taskDescription ??
+						t("kanban.forms.taskDescription", "Description")}
+				</Label>
 				<MinimalTiptapEditor
 					value={description}
 					onChange={(value) =>
 						setDescription(typeof value === "string" ? value : "")
 					}
 					output="markdown"
-					placeholder="Describe the task..."
+					placeholder={
+						localization?.taskDescriptionPlaceholder ??
+						t("kanban.forms.taskDescriptionPlaceholder", "Describe the task...")
+					}
 					className="min-h-[150px]"
 					uploader={uploadImage}
 					imagePickerTrigger={imagePickerTrigger}
 				/>
+				{serverDescriptionError && (
+					<p className="text-sm text-destructive">{serverDescriptionError}</p>
+				)}
 			</div>
 
-			{error && (
+			{topLevelError && (
 				<div className="p-3 text-sm text-red-600 bg-red-50 border border-red-200 rounded-md">
-					{error}
+					{topLevelError}
 				</div>
 			)}
 
 			<div className="flex justify-between pt-2">
 				<div className="flex gap-2">
 					<Button type="submit" disabled={isPending}>
-						{isPending
+						{resourceForm.isSubmitting || isMoving
 							? isEditing
-								? "Updating..."
-								: "Creating..."
+								? (localization?.updating ??
+									t("kanban.common.updating", "Updating..."))
+								: (localization?.creating ??
+									t("kanban.common.creating", "Creating..."))
 							: isEditing
-								? "Update Task"
-								: "Create Task"}
+								? (localization?.updateTask ??
+									t("kanban.forms.updateTask", "Update Task"))
+								: (localization?.createTask ??
+									t("kanban.forms.createTask", "Create Task"))}
 					</Button>
 					<Button
 						type="button"
@@ -259,19 +381,28 @@ export function TaskForm({
 						onClick={onClose}
 						disabled={isPending}
 					>
-						Cancel
+						{localization?.cancel ?? t("kanban.common.cancel", "Cancel")}
 					</Button>
 				</div>
-				{isEditing && onDelete && (
-					<Button
-						type="button"
-						variant="destructive"
-						onClick={onDelete}
-						disabled={isPending}
+				{isEditing && onDelete && taskId && (
+					<CanAccess
+						resource="kanban:task"
+						action="delete"
+						params={{ id: taskId, boardId, columnId }}
 					>
-						<Trash2 className="mr-2 h-4 w-4" />
-						Delete
-					</Button>
+						<Button
+							type="button"
+							variant="destructive"
+							onClick={handleDelete}
+							disabled={isPending}
+						>
+							<Trash2 className="mr-2 h-4 w-4" />
+							{isDeleting
+								? (localization?.deleting ??
+									t("kanban.common.deleting", "Deleting..."))
+								: (localization?.delete ?? t("kanban.common.delete", "Delete"))}
+						</Button>
+					</CanAccess>
 				)}
 			</div>
 		</form>
diff --git a/packages/stack/src/plugins/kanban/client/components/pages/404-page.tsx b/packages/stack/src/plugins/kanban/client/components/pages/404-page.tsx
index e1997be7..68f67ec4 100644
--- a/packages/stack/src/plugins/kanban/client/components/pages/404-page.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/pages/404-page.tsx
@@ -1,11 +1,12 @@
 "use client";
 
 import { Button } from "@workspace/ui/components/button";
-import { usePluginOverrides } from "@btst/stack/context";
+import { usePluginOverrides, useTranslate } from "@btst/stack/context";
 import type { KanbanPluginOverrides } from "../../overrides";
 
 export function NotFoundPage() {
-	const { navigate: overrideNavigate } =
+	const t = useTranslate();
+	const { navigate: overrideNavigate, localization } =
 		usePluginOverrides<KanbanPluginOverrides>("kanban");
 	const navigate =
 		overrideNavigate ||
@@ -18,11 +19,21 @@ export function NotFoundPage() {
 			className="flex min-h-[400px] flex-col items-center justify-center text-center"
 			data-testid="empty-state"
 		>
-			<h2 className="text-2xl font-bold mb-2">Page Not Found</h2>
+			<h2 className="text-2xl font-bold mb-2">
+				{localization?.pageNotFound ??
+					t("kanban.common.pageNotFound", "Page Not Found")}
+			</h2>
 			<p className="text-muted-foreground mb-6">
-				The page you're looking for doesn't exist.
+				{localization?.pageNotFoundDescription ??
+					t(
+						"kanban.common.pageNotFoundDescription",
+						"The page you're looking for doesn't exist.",
+					)}
 			</p>
-			<Button onClick={() => navigate("/pages/kanban")}>Back to Boards</Button>
+			<Button onClick={() => navigate("/pages/kanban")}>
+				{localization?.backToBoards ??
+					t("kanban.common.backToBoards", "Back to Boards")}
+			</Button>
 		</div>
 	);
 }
diff --git a/packages/stack/src/plugins/kanban/client/components/pages/board-page.internal.tsx b/packages/stack/src/plugins/kanban/client/components/pages/board-page.internal.tsx
index 26b25831..2a31e7bd 100644
--- a/packages/stack/src/plugins/kanban/client/components/pages/board-page.internal.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/pages/board-page.internal.tsx
@@ -2,7 +2,6 @@
 
 import { useState, useCallback, useMemo, useEffect } from "react";
 import { ArrowLeft, Plus, Settings, Trash2, Pencil } from "lucide-react";
-import { toast } from "sonner";
 import { Button } from "@workspace/ui/components/button";
 import {
 	DropdownMenu,
@@ -34,7 +33,13 @@ import {
 	useColumnMutations,
 	useTaskMutations,
 } from "../../hooks/kanban-hooks";
-import { usePluginOverrides } from "@btst/stack/context";
+import {
+	CanAccess,
+	useCan,
+	useNotify,
+	usePluginOverrides,
+	useTranslate,
+} from "@btst/stack/context";
 import type { KanbanPluginOverrides } from "../../overrides";
 import { KanbanBoard } from "../shared/kanban-board";
 import { ColumnForm } from "../forms/column-form";
@@ -59,6 +64,8 @@ type ModalState =
 	| { type: "editTask"; columnId: string; taskId: string };
 
 export function BoardPage({ boardId }: BoardPageProps) {
+	const t = useTranslate();
+	const notify = useNotify();
 	const { data: board, error, refetch, isFetching } = useSuspenseBoard(boardId);
 
 	// Suspense hooks only throw on initial fetch, not refetch failures
@@ -70,6 +77,7 @@ export function BoardPage({ boardId }: BoardPageProps) {
 		Link: OverrideLink,
 		navigate: overrideNavigate,
 		taskDetailBottomSlot,
+		localization,
 	} = usePluginOverrides<KanbanPluginOverrides>("kanban");
 	const navigate =
 		overrideNavigate ||
@@ -81,6 +89,16 @@ export function BoardPage({ boardId }: BoardPageProps) {
 	const { deleteBoard, isDeleting } = useBoardMutations();
 	const { deleteColumn, reorderColumns } = useColumnMutations();
 	const { deleteTask, moveTask, reorderTasks } = useTaskMutations();
+	const { can: canMoveColumns, isPending: isCheckingColumnMove } = useCan({
+		resource: "kanban:column",
+		action: "update",
+		params: { boardId },
+	});
+	const { can: canMoveTasks, isPending: isCheckingTaskMove } = useCan({
+		resource: "kanban:task",
+		action: "update",
+		params: { boardId },
+	});
 
 	const [modalState, setModalState] = useState<ModalState>({ type: "none" });
 
@@ -139,10 +157,21 @@ export function BoardPage({ boardId }: BoardPageProps) {
 			}
 		} catch (error) {
 			const message =
-				error instanceof Error ? error.message : "Failed to delete board";
-			toast.error(message);
+				error instanceof Error
+					? error.message
+					: (localization?.deleteBoardError ??
+						t("kanban.common.deleteBoardError", "Failed to delete board"));
+			notify.error(message);
 		}
-	}, [deleteBoard, boardId, navigate, closeModal]);
+	}, [
+		deleteBoard,
+		boardId,
+		navigate,
+		closeModal,
+		localization?.deleteBoardError,
+		notify,
+		t,
+	]);
 
 	const handleKanbanChange = useCallback(
 		async (newData: Record<string, SerializedTask[]>) => {
@@ -250,7 +279,7 @@ export function BoardPage({ boardId }: BoardPageProps) {
 				// may have already updated the state, and reverting would incorrectly
 				// undo that operation too. The server is the source of truth.
 				refetch();
-				// Re-throw so error boundaries or toast handlers can catch it
+				// Re-throw so the caller's error handling can surface it
 				throw error;
 			}
 		},
@@ -278,12 +307,22 @@ export function BoardPage({ boardId }: BoardPageProps) {
 	if (!board) {
 		return (
 			<EmptyState
-				title="Board not found"
-				description="The board you're looking for doesn't exist or you don't have access to it."
+				title={
+					localization?.boardNotFound ??
+					t("kanban.list.boardNotFound", "Board not found")
+				}
+				description={
+					localization?.boardNotFoundDescription ??
+					t(
+						"kanban.list.boardNotFoundDescription",
+						"The board you're looking for doesn't exist or you don't have access to it.",
+					)
+				}
 				action={
 					<Button onClick={() => navigate("/pages/kanban")}>
 						<ArrowLeft className="mr-2 h-4 w-4" />
-						Back to Boards
+						{localization?.backToBoards ??
+							t("kanban.common.backToBoards", "Back to Boards")}
 					</Button>
 				}
 			/>
@@ -316,38 +355,62 @@ export function BoardPage({ boardId }: BoardPageProps) {
 					<DropdownMenuTrigger asChild>
 						<Button variant="outline">
 							<Settings className="mr-2 h-4 w-4" />
-							Actions
+							{localization?.actions ?? t("kanban.common.actions", "Actions")}
 						</Button>
 					</DropdownMenuTrigger>
 					<DropdownMenuContent align="end">
-						<DropdownMenuItem
-							onClick={() => setModalState({ type: "addColumn" })}
+						<CanAccess
+							resource="kanban:column"
+							action="create"
+							params={{ boardId }}
 						>
-							<Plus className="mr-2 h-4 w-4" />
-							Add Column
-						</DropdownMenuItem>
-						<DropdownMenuItem
-							onClick={() => setModalState({ type: "editBoard" })}
+							<DropdownMenuItem
+								onClick={() => setModalState({ type: "addColumn" })}
+							>
+								<Plus className="mr-2 h-4 w-4" />
+								{localization?.addColumn ??
+									t("kanban.list.addColumn", "Add Column")}
+							</DropdownMenuItem>
+						</CanAccess>
+						<CanAccess
+							resource="kanban:board"
+							action="update"
+							params={{ id: boardId }}
 						>
-							<Pencil className="mr-2 h-4 w-4" />
-							Edit Board
-						</DropdownMenuItem>
+							<DropdownMenuItem
+								onClick={() => setModalState({ type: "editBoard" })}
+							>
+								<Pencil className="mr-2 h-4 w-4" />
+								{localization?.editBoard ??
+									t("kanban.list.editBoard", "Edit Board")}
+							</DropdownMenuItem>
+						</CanAccess>
 						<DropdownMenuSeparator />
-						<DropdownMenuItem
-							onClick={() => setModalState({ type: "deleteBoard" })}
-							className="text-red-600 focus:text-red-600"
+						<CanAccess
+							resource="kanban:board"
+							action="delete"
+							params={{ id: boardId }}
 						>
-							<Trash2 className="mr-2 h-4 w-4" />
-							Delete Board
-						</DropdownMenuItem>
+							<DropdownMenuItem
+								onClick={() => setModalState({ type: "deleteBoard" })}
+								className="text-red-600 focus:text-red-600"
+							>
+								<Trash2 className="mr-2 h-4 w-4" />
+								{localization?.deleteBoard ??
+									t("kanban.forms.deleteBoard", "Delete Board")}
+							</DropdownMenuItem>
+						</CanAccess>
 					</DropdownMenuContent>
 				</DropdownMenu>
 			</div>
 
 			{orderedColumns.length > 0 ? (
 				<KanbanBoard
+					boardId={boardId}
 					columns={orderedColumns}
 					kanbanState={kanbanState}
+					canMoveColumns={!isCheckingColumnMove && canMoveColumns}
+					canMoveTasks={!isCheckingTaskMove && canMoveTasks}
 					onKanbanChange={handleKanbanChange}
 					onAddTask={(columnId) => setModalState({ type: "addTask", columnId })}
 					onEditTask={(columnId, taskId) =>
@@ -362,13 +425,29 @@ export function BoardPage({ boardId }: BoardPageProps) {
 				/>
 			) : (
 				<EmptyState
-					title="No columns yet"
-					description="Create your first column to start organizing tasks."
+					title={
+						localization?.noColumns ??
+						t("kanban.common.noColumns", "No columns yet")
+					}
+					description={
+						localization?.noColumnsDescription ??
+						t(
+							"kanban.list.noColumnsDescription",
+							"Create your first column to start organizing tasks.",
+						)
+					}
 					action={
-						<Button onClick={() => setModalState({ type: "addColumn" })}>
-							<Plus className="mr-2 h-4 w-4" />
-							Add Column
-						</Button>
+						<CanAccess
+							resource="kanban:column"
+							action="create"
+							params={{ boardId }}
+						>
+							<Button onClick={() => setModalState({ type: "addColumn" })}>
+								<Plus className="mr-2 h-4 w-4" />
+								{localization?.addColumn ??
+									t("kanban.list.addColumn", "Add Column")}
+							</Button>
+						</CanAccess>
 					}
 				/>
 			)}
@@ -380,18 +459,22 @@ export function BoardPage({ boardId }: BoardPageProps) {
 			>
 				<DialogContent>
 					<DialogHeader>
-						<DialogTitle>Add Column</DialogTitle>
+						<DialogTitle>
+							{localization?.addColumn ??
+								t("kanban.list.addColumn", "Add Column")}
+						</DialogTitle>
 						<DialogDescription>
-							Add a new column to this board.
+							{localization?.addColumnDescription ??
+								t(
+									"kanban.list.addColumnDescription",
+									"Add a new column to this board.",
+								)}
 						</DialogDescription>
 					</DialogHeader>
 					<ColumnForm
 						boardId={boardId}
 						onClose={closeModal}
-						onSuccess={() => {
-							closeModal();
-							refetch();
-						}}
+						onSuccess={closeModal}
 					/>
 				</DialogContent>
 			</Dialog>
@@ -403,8 +486,17 @@ export function BoardPage({ boardId }: BoardPageProps) {
 			>
 				<DialogContent>
 					<DialogHeader>
-						<DialogTitle>Edit Column</DialogTitle>
-						<DialogDescription>Update the column details.</DialogDescription>
+						<DialogTitle>
+							{localization?.editColumn ??
+								t("kanban.list.editColumn", "Edit Column")}
+						</DialogTitle>
+						<DialogDescription>
+							{localization?.editColumnDescription ??
+								t(
+									"kanban.list.editColumnDescription",
+									"Update the column details.",
+								)}
+						</DialogDescription>
 					</DialogHeader>
 					{modalState.type === "editColumn" && (
 						<ColumnForm
@@ -412,10 +504,7 @@ export function BoardPage({ boardId }: BoardPageProps) {
 							columnId={modalState.columnId}
 							column={board.columns?.find((c) => c.id === modalState.columnId)}
 							onClose={closeModal}
-							onSuccess={() => {
-								closeModal();
-								refetch();
-							}}
+							onSuccess={closeModal}
 						/>
 					)}
 				</DialogContent>
@@ -428,33 +517,44 @@ export function BoardPage({ boardId }: BoardPageProps) {
 			>
 				<AlertDialogContent>
 					<AlertDialogHeader>
-						<AlertDialogTitle>Delete Column</AlertDialogTitle>
+						<AlertDialogTitle>
+							{localization?.deleteColumn ??
+								t("kanban.forms.deleteColumn", "Delete Column")}
+						</AlertDialogTitle>
 						<AlertDialogDescription>
-							Are you sure you want to delete this column? All tasks in this
-							column will be permanently removed.
+							{localization?.deleteColumnConfirm ??
+								t(
+									"kanban.forms.deleteColumnConfirm",
+									"Are you sure you want to delete this column? All tasks in this column will be permanently removed.",
+								)}
 						</AlertDialogDescription>
 					</AlertDialogHeader>
 					<AlertDialogFooter>
-						<AlertDialogCancel>Cancel</AlertDialogCancel>
+						<AlertDialogCancel>
+							{localization?.cancel ?? t("kanban.common.cancel", "Cancel")}
+						</AlertDialogCancel>
 						<AlertDialogAction
 							onClick={async () => {
 								if (modalState.type === "deleteColumn") {
 									try {
 										await deleteColumn(modalState.columnId);
 										closeModal();
-										refetch();
 									} catch (error) {
 										const message =
 											error instanceof Error
 												? error.message
-												: "Failed to delete column";
-										toast.error(message);
+												: (localization?.deleteColumnError ??
+													t(
+														"kanban.common.deleteColumnError",
+														"Failed to delete column",
+													));
+										notify.error(message);
 									}
 								}
 							}}
 							className="bg-red-600 hover:bg-red-700"
 						>
-							Delete
+							{localization?.delete ?? t("kanban.common.delete", "Delete")}
 						</AlertDialogAction>
 					</AlertDialogFooter>
 				</AlertDialogContent>
@@ -467,16 +567,19 @@ export function BoardPage({ boardId }: BoardPageProps) {
 			>
 				<DialogContent>
 					<DialogHeader>
-						<DialogTitle>Edit Board</DialogTitle>
-						<DialogDescription>Update board details.</DialogDescription>
+						<DialogTitle>
+							{localization?.editBoard ??
+								t("kanban.list.editBoard", "Edit Board")}
+						</DialogTitle>
+						<DialogDescription>
+							{localization?.editBoardDescription ??
+								t("kanban.list.editBoardDescription", "Update board details.")}
+						</DialogDescription>
 					</DialogHeader>
 					<BoardForm
 						board={board}
 						onClose={closeModal}
-						onSuccess={() => {
-							closeModal();
-							refetch();
-						}}
+						onSuccess={closeModal}
 					/>
 				</DialogContent>
 			</Dialog>
@@ -488,20 +591,31 @@ export function BoardPage({ boardId }: BoardPageProps) {
 			>
 				<AlertDialogContent>
 					<AlertDialogHeader>
-						<AlertDialogTitle>Delete Board</AlertDialogTitle>
+						<AlertDialogTitle>
+							{localization?.deleteBoard ??
+								t("kanban.forms.deleteBoard", "Delete Board")}
+						</AlertDialogTitle>
 						<AlertDialogDescription>
-							Are you sure you want to delete this board? This action cannot be
-							undone. All columns and tasks will be permanently removed.
+							{localization?.deleteBoardConfirm ??
+								t(
+									"kanban.forms.deleteBoardConfirm",
+									"Are you sure you want to delete this board? This action cannot be undone. All columns and tasks will be permanently removed.",
+								)}
 						</AlertDialogDescription>
 					</AlertDialogHeader>
 					<AlertDialogFooter>
-						<AlertDialogCancel>Cancel</AlertDialogCancel>
+						<AlertDialogCancel>
+							{localization?.cancel ?? t("kanban.common.cancel", "Cancel")}
+						</AlertDialogCancel>
 						<Button
 							onClick={handleDeleteBoard}
 							disabled={isDeleting}
 							className="bg-red-600 hover:bg-red-700"
 						>
-							{isDeleting ? "Deleting..." : "Delete"}
+							{isDeleting
+								? (localization?.deleting ??
+									t("kanban.common.deleting", "Deleting..."))
+								: (localization?.delete ?? t("kanban.common.delete", "Delete"))}
 						</Button>
 					</AlertDialogFooter>
 				</AlertDialogContent>
@@ -514,8 +628,13 @@ export function BoardPage({ boardId }: BoardPageProps) {
 			>
 				<DialogContent className="max-w-3xl! max-h-screen overflow-y-auto">
 					<DialogHeader>
-						<DialogTitle>Add Task</DialogTitle>
-						<DialogDescription>Create a new task.</DialogDescription>
+						<DialogTitle>
+							{localization?.addTask ?? t("kanban.list.addTask", "Add Task")}
+						</DialogTitle>
+						<DialogDescription>
+							{localization?.addTaskDescription ??
+								t("kanban.list.addTaskDescription", "Create a new task.")}
+						</DialogDescription>
 					</DialogHeader>
 					{modalState.type === "addTask" && (
 						<TaskForm
@@ -523,10 +642,7 @@ export function BoardPage({ boardId }: BoardPageProps) {
 							boardId={boardId}
 							columns={board.columns || []}
 							onClose={closeModal}
-							onSuccess={() => {
-								closeModal();
-								refetch();
-							}}
+							onSuccess={closeModal}
 						/>
 					)}
 				</DialogContent>
@@ -539,8 +655,13 @@ export function BoardPage({ boardId }: BoardPageProps) {
 			>
 				<DialogContent className="max-w-3xl! max-h-screen overflow-y-auto">
 					<DialogHeader>
-						<DialogTitle>Edit Task</DialogTitle>
-						<DialogDescription>Update task details.</DialogDescription>
+						<DialogTitle>
+							{localization?.editTask ?? t("kanban.list.editTask", "Edit Task")}
+						</DialogTitle>
+						<DialogDescription>
+							{localization?.editTaskDescription ??
+								t("kanban.list.editTaskDescription", "Update task details.")}
+						</DialogDescription>
 					</DialogHeader>
 					{modalState.type === "editTask" && (
 						<>
@@ -553,21 +674,21 @@ export function BoardPage({ boardId }: BoardPageProps) {
 									?.tasks?.find((t) => t.id === modalState.taskId)}
 								columns={board.columns || []}
 								onClose={closeModal}
-								onSuccess={() => {
-									closeModal();
-									refetch();
-								}}
+								onSuccess={closeModal}
 								onDelete={async () => {
 									try {
 										await deleteTask(modalState.taskId);
 										closeModal();
-										refetch();
 									} catch (error) {
 										const message =
 											error instanceof Error
 												? error.message
-												: "Failed to delete task";
-										toast.error(message);
+												: (localization?.deleteTaskError ??
+													t(
+														"kanban.common.deleteTaskError",
+														"Failed to delete task",
+													));
+										notify.error(message);
 									}
 								}}
 							/>
diff --git a/packages/stack/src/plugins/kanban/client/components/pages/board-page.tsx b/packages/stack/src/plugins/kanban/client/components/pages/board-page.tsx
index be0e6ab6..04518da5 100644
--- a/packages/stack/src/plugins/kanban/client/components/pages/board-page.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/pages/board-page.tsx
@@ -20,6 +20,11 @@ export function BoardPageComponent({ boardId }: BoardPageComponentProps) {
 	return (
 		<ComposedRoute
 			path={`/kanban/${boardId}`}
+			permission={{
+				resource: "kanban:board",
+				action: "read",
+				params: { id: boardId },
+			}}
 			PageComponent={BoardPage}
 			ErrorComponent={DefaultError}
 			LoadingComponent={BoardSkeleton}
diff --git a/packages/stack/src/plugins/kanban/client/components/pages/boards-list-page.internal.tsx b/packages/stack/src/plugins/kanban/client/components/pages/boards-list-page.internal.tsx
index d46c6785..2430aaed 100644
--- a/packages/stack/src/plugins/kanban/client/components/pages/boards-list-page.internal.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/pages/boards-list-page.internal.tsx
@@ -10,21 +10,29 @@ import {
 	CardTitle,
 } from "@workspace/ui/components/card";
 import { useSuspenseBoards } from "../../hooks/kanban-hooks";
-import { usePluginOverrides } from "@btst/stack/context";
+import {
+	CanAccess,
+	usePluginOverrides,
+	useTranslate,
+} from "@btst/stack/context";
 import type { KanbanPluginOverrides } from "../../overrides";
 import { EmptyState } from "../shared/empty-state";
 import { PageWrapper } from "../shared/page-wrapper";
 import { format } from "date-fns";
 
 export function BoardsListPage() {
+	const t = useTranslate();
 	const { data: boards, error, isFetching } = useSuspenseBoards();
 
 	// Suspense hooks only throw on initial fetch, not refetch failures
 	if (error && !isFetching) {
 		throw error;
 	}
-	const { Link: OverrideLink, navigate: overrideNavigate } =
-		usePluginOverrides<KanbanPluginOverrides>("kanban");
+	const {
+		Link: OverrideLink,
+		navigate: overrideNavigate,
+		localization,
+	} = usePluginOverrides<KanbanPluginOverrides>("kanban");
 	const Link = OverrideLink || "a";
 	const navigate =
 		overrideNavigate ||
@@ -41,16 +49,20 @@ export function BoardsListPage() {
 			<div className="w-full flex items-center justify-between mb-8">
 				<div>
 					<h1 className="text-3xl font-bold" data-testid="page-header">
-						Kanban Boards
+						{localization?.kanbanBoards ??
+							t("kanban.list.kanbanBoards", "Kanban Boards")}
 					</h1>
 					<p className="text-muted-foreground mt-1">
-						Manage your projects and tasks
+						{localization?.manageProjects ??
+							t("kanban.list.manageProjects", "Manage your projects and tasks")}
 					</p>
 				</div>
-				<Button onClick={handleNewBoard}>
-					<Plus className="mr-2 h-4 w-4" />
-					New Board
-				</Button>
+				<CanAccess resource="kanban:board" action="create">
+					<Button onClick={handleNewBoard}>
+						<Plus className="mr-2 h-4 w-4" />
+						{localization?.newBoard ?? t("kanban.list.newBoard", "New Board")}
+					</Button>
+				</CanAccess>
 			</div>
 
 			{boards.length > 0 ? (
@@ -74,7 +86,13 @@ export function BoardsListPage() {
 								</CardHeader>
 								<CardContent>
 									<div className="flex items-center justify-between text-sm text-muted-foreground">
-										<span>{board.columns?.length || 0} columns</span>
+										<span>
+											{localization?.columnsCount
+												? `${board.columns?.length || 0} ${localization.columnsCount}`
+												: t("kanban.list.columnsCount", "{{count}} columns", {
+														count: board.columns?.length || 0,
+													})}
+										</span>
 										<span>
 											{format(new Date(board.createdAt), "MMM d, yyyy")}
 										</span>
@@ -86,13 +104,25 @@ export function BoardsListPage() {
 				</div>
 			) : (
 				<EmptyState
-					title="No boards yet"
-					description="Create your first kanban board to start organizing your tasks."
+					title={
+						localization?.noBoards ??
+						t("kanban.common.noBoards", "No boards yet")
+					}
+					description={
+						localization?.noBoardsDescription ??
+						t(
+							"kanban.list.noBoardsDescription",
+							"Create your first kanban board to start organizing your tasks.",
+						)
+					}
 					action={
-						<Button onClick={handleNewBoard}>
-							<Plus className="mr-2 h-4 w-4" />
-							Create Board
-						</Button>
+						<CanAccess resource="kanban:board" action="create">
+							<Button onClick={handleNewBoard}>
+								<Plus className="mr-2 h-4 w-4" />
+								{localization?.createBoard ??
+									t("kanban.forms.createBoard", "Create Board")}
+							</Button>
+						</CanAccess>
 					}
 				/>
 			)}
diff --git a/packages/stack/src/plugins/kanban/client/components/pages/boards-list-page.tsx b/packages/stack/src/plugins/kanban/client/components/pages/boards-list-page.tsx
index 217d5cc9..7a335b95 100644
--- a/packages/stack/src/plugins/kanban/client/components/pages/boards-list-page.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/pages/boards-list-page.tsx
@@ -16,6 +16,7 @@ export function BoardsListPageComponent() {
 	return (
 		<ComposedRoute
 			path="/kanban"
+			permission={{ resource: "kanban:board", action: "read" }}
 			PageComponent={BoardsListPage}
 			ErrorComponent={DefaultError}
 			LoadingComponent={BoardsListSkeleton}
diff --git a/packages/stack/src/plugins/kanban/client/components/pages/new-board-page.internal.tsx b/packages/stack/src/plugins/kanban/client/components/pages/new-board-page.internal.tsx
index 2aba34c2..5e35b221 100644
--- a/packages/stack/src/plugins/kanban/client/components/pages/new-board-page.internal.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/pages/new-board-page.internal.tsx
@@ -8,14 +8,18 @@ import {
 	CardHeader,
 	CardTitle,
 } from "@workspace/ui/components/card";
-import { usePluginOverrides } from "@btst/stack/context";
+import { usePluginOverrides, useTranslate } from "@btst/stack/context";
 import type { KanbanPluginOverrides } from "../../overrides";
 import { BoardForm } from "../forms/board-form";
 import { PageWrapper } from "../shared/page-wrapper";
 
 export function NewBoardPage() {
-	const { Link: OverrideLink, navigate: overrideNavigate } =
-		usePluginOverrides<KanbanPluginOverrides>("kanban");
+	const t = useTranslate();
+	const {
+		Link: OverrideLink,
+		navigate: overrideNavigate,
+		localization,
+	} = usePluginOverrides<KanbanPluginOverrides>("kanban");
 	const navigate =
 		overrideNavigate ||
 		((path: string) => {
@@ -38,19 +42,31 @@ export function NewBoardPage() {
 				</Link>
 				<div>
 					<h1 className="text-3xl font-bold" data-testid="page-header">
-						Create New Board
+						{localization?.createNewBoard ??
+							t("kanban.list.createNewBoard", "Create New Board")}
 					</h1>
 					<p className="text-muted-foreground mt-1">
-						Set up a new kanban board for your project
+						{localization?.createNewBoardDescription ??
+							t(
+								"kanban.list.createNewBoardDescription",
+								"Set up a new kanban board for your project",
+							)}
 					</p>
 				</div>
 			</div>
 
 			<Card className="max-w-2xl">
 				<CardHeader>
-					<CardTitle>Board Details</CardTitle>
+					<CardTitle>
+						{localization?.boardDetails ??
+							t("kanban.list.boardDetails", "Board Details")}
+					</CardTitle>
 					<CardDescription>
-						Enter the details for your new kanban board.
+						{localization?.boardDetailsDescription ??
+							t(
+								"kanban.list.boardDetailsDescription",
+								"Enter the details for your new kanban board.",
+							)}
 					</CardDescription>
 				</CardHeader>
 				<CardContent>
diff --git a/packages/stack/src/plugins/kanban/client/components/pages/new-board-page.tsx b/packages/stack/src/plugins/kanban/client/components/pages/new-board-page.tsx
index 73f2654e..99b12826 100644
--- a/packages/stack/src/plugins/kanban/client/components/pages/new-board-page.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/pages/new-board-page.tsx
@@ -16,6 +16,7 @@ export function NewBoardPageComponent() {
 	return (
 		<ComposedRoute
 			path="/kanban/new"
+			permission={{ resource: "kanban:board", action: "create" }}
 			PageComponent={NewBoardPage}
 			ErrorComponent={DefaultError}
 			LoadingComponent={BoardsListSkeleton}
diff --git a/packages/stack/src/plugins/kanban/client/components/shared/column-content.tsx b/packages/stack/src/plugins/kanban/client/components/shared/column-content.tsx
index a5a61ba0..a2db039a 100644
--- a/packages/stack/src/plugins/kanban/client/components/shared/column-content.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/shared/column-content.tsx
@@ -5,6 +5,12 @@ import { GripVertical, MoreVertical, Pencil, Plus, Trash2 } from "lucide-react";
 import { Button } from "@workspace/ui/components/button";
 import { Badge } from "@workspace/ui/components/badge";
 import * as Kanban from "@workspace/ui/components/kanban";
+import {
+	CanAccess,
+	usePluginOverrides,
+	useTranslate,
+} from "@btst/stack/context";
+import type { KanbanPluginOverrides } from "../../overrides";
 import {
 	DropdownMenu,
 	DropdownMenuContent,
@@ -16,7 +22,10 @@ import { TaskCard } from "./task-card";
 import type { SerializedColumn, SerializedTask } from "../../../types";
 
 interface ColumnContentProps {
+	boardId: string;
 	column: SerializedColumn & { tasks: SerializedTask[] };
+	canMoveColumn: boolean;
+	canMoveTasks: boolean;
 	onAddTask: () => void;
 	onEditTask: (taskId: string) => void;
 	onEditColumn: () => void;
@@ -24,18 +33,23 @@ interface ColumnContentProps {
 }
 
 function ColumnContentComponent({
+	boardId,
 	column,
+	canMoveColumn,
+	canMoveTasks,
 	onAddTask,
 	onEditTask,
 	onEditColumn,
 	onDeleteColumn,
 }: ColumnContentProps) {
+	const t = useTranslate();
+	const { localization } = usePluginOverrides<KanbanPluginOverrides>("kanban");
 	const hasTasks = column.tasks && column.tasks.length > 0;
 
 	return (
 		<Kanban.Column key={column.id} value={column.id}>
 			<div className="flex items-center">
-				<Kanban.ColumnHandle asChild>
+				<Kanban.ColumnHandle asChild disabled={!canMoveColumn}>
 					<Button variant="ghost" size="icon">
 						<GripVertical className="h-4 w-4" />
 					</Button>
@@ -55,22 +69,42 @@ function ColumnContentComponent({
 						</Button>
 					</DropdownMenuTrigger>
 					<DropdownMenuContent align="end">
-						<DropdownMenuItem onClick={onEditColumn}>
-							<Pencil className="mr-2 h-4 w-4" />
-							Edit Column
-						</DropdownMenuItem>
-						<DropdownMenuItem onClick={onAddTask}>
-							<Plus className="mr-2 h-4 w-4" />
-							Add Task
-						</DropdownMenuItem>
+						<CanAccess
+							resource="kanban:column"
+							action="update"
+							params={{ id: column.id, boardId }}
+						>
+							<DropdownMenuItem onClick={onEditColumn}>
+								<Pencil className="mr-2 h-4 w-4" />
+								{localization?.editColumn ??
+									t("kanban.list.editColumn", "Edit Column")}
+							</DropdownMenuItem>
+						</CanAccess>
+						<CanAccess
+							resource="kanban:task"
+							action="create"
+							params={{ boardId, columnId: column.id }}
+						>
+							<DropdownMenuItem onClick={onAddTask}>
+								<Plus className="mr-2 h-4 w-4" />
+								{localization?.addTask ?? t("kanban.list.addTask", "Add Task")}
+							</DropdownMenuItem>
+						</CanAccess>
 						<DropdownMenuSeparator />
-						<DropdownMenuItem
-							onClick={onDeleteColumn}
-							className="text-red-600 focus:text-red-600"
+						<CanAccess
+							resource="kanban:column"
+							action="delete"
+							params={{ id: column.id, boardId }}
 						>
-							<Trash2 className="mr-2 h-4 w-4" />
-							Delete Column
-						</DropdownMenuItem>
+							<DropdownMenuItem
+								onClick={onDeleteColumn}
+								className="text-red-600 focus:text-red-600"
+							>
+								<Trash2 className="mr-2 h-4 w-4" />
+								{localization?.deleteColumn ??
+									t("kanban.forms.deleteColumn", "Delete Column")}
+							</DropdownMenuItem>
+						</CanAccess>
 					</DropdownMenuContent>
 				</DropdownMenu>
 			</div>
@@ -79,7 +113,10 @@ function ColumnContentComponent({
 					column.tasks.map((task) => (
 						<TaskCard
 							key={task.id}
+							boardId={boardId}
+							columnId={column.id}
 							task={task}
+							canMove={canMoveTasks}
 							onClick={() => onEditTask(task.id)}
 						/>
 					))
@@ -89,15 +126,28 @@ function ColumnContentComponent({
 							<Plus className="h-5 w-5 text-muted-foreground" />
 						</div>
 						<div className="space-y-1 mb-2 md:space-y-2 md:mb-4">
-							<p className="text-sm text-muted-foreground">No tasks yet</p>
+							<p className="text-sm text-muted-foreground">
+								{localization?.noTasks ??
+									t("kanban.common.noTasks", "No tasks yet")}
+							</p>
 							<p className="text-xs text-muted-foreground">
-								Add a task to get started
+								{localization?.noTasksDescription ??
+									t(
+										"kanban.list.noTasksDescription",
+										"Add a task to get started",
+									)}
 							</p>
 						</div>
-						<Button onClick={onAddTask} size="sm">
-							<Plus className="mr-2 h-4 w-4" />
-							Add Task
-						</Button>
+						<CanAccess
+							resource="kanban:task"
+							action="create"
+							params={{ boardId, columnId: column.id }}
+						>
+							<Button onClick={onAddTask} size="sm">
+								<Plus className="mr-2 h-4 w-4" />
+								{localization?.addTask ?? t("kanban.list.addTask", "Add Task")}
+							</Button>
+						</CanAccess>
 					</div>
 				)}
 			</div>
diff --git a/packages/stack/src/plugins/kanban/client/components/shared/default-error.tsx b/packages/stack/src/plugins/kanban/client/components/shared/default-error.tsx
index 15098024..db1d6e67 100644
--- a/packages/stack/src/plugins/kanban/client/components/shared/default-error.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/shared/default-error.tsx
@@ -2,6 +2,8 @@
 
 import { AlertCircle, RefreshCw } from "lucide-react";
 import { Button } from "@workspace/ui/components/button";
+import { usePluginOverrides, useTranslate } from "@btst/stack/context";
+import type { KanbanPluginOverrides } from "../../overrides";
 
 interface DefaultErrorProps {
 	error?: unknown;
@@ -9,6 +11,8 @@ interface DefaultErrorProps {
 }
 
 export function DefaultError({ error, reset }: DefaultErrorProps) {
+	const t = useTranslate();
+	const { localization } = usePluginOverrides<KanbanPluginOverrides>("kanban");
 	return (
 		<div
 			className="flex flex-col items-center justify-center py-12 text-center"
@@ -17,15 +21,22 @@ export function DefaultError({ error, reset }: DefaultErrorProps) {
 			<div className="rounded-full bg-destructive/10 p-6 mb-4">
 				<AlertCircle className="h-8 w-8 text-destructive" />
 			</div>
-			<h3 className="text-lg font-semibold mb-2">Something went wrong</h3>
+			<h3 className="text-lg font-semibold mb-2">
+				{localization?.errorGeneric ??
+					t("kanban.common.errorGeneric", "Something went wrong")}
+			</h3>
 			<p className="text-muted-foreground max-w-md mb-4">
 				{(error instanceof Error ? error.message : undefined) ||
-					"An unexpected error occurred. Please try again."}
+					(localization?.unexpectedError ??
+						t(
+							"kanban.common.unexpectedError",
+							"An unexpected error occurred. Please try again.",
+						))}
 			</p>
 			{reset && (
 				<Button onClick={reset} variant="outline">
 					<RefreshCw className="mr-2 h-4 w-4" />
-					Try Again
+					{localization?.tryAgain ?? t("kanban.common.tryAgain", "Try Again")}
 				</Button>
 			)}
 		</div>
diff --git a/packages/stack/src/plugins/kanban/client/components/shared/kanban-board.tsx b/packages/stack/src/plugins/kanban/client/components/shared/kanban-board.tsx
index afdcad1f..7408115a 100644
--- a/packages/stack/src/plugins/kanban/client/components/shared/kanban-board.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/shared/kanban-board.tsx
@@ -7,8 +7,11 @@ import { ColumnContent } from "./column-content";
 import type { SerializedColumn, SerializedTask } from "../../../types";
 
 interface KanbanBoardProps {
+	boardId: string;
 	columns: (SerializedColumn & { tasks: SerializedTask[] })[];
 	kanbanState: Record<string, SerializedTask[]>;
+	canMoveColumns: boolean;
+	canMoveTasks: boolean;
 	onKanbanChange: (newData: Record<string, SerializedTask[]>) => void;
 	onAddTask: (columnId: string) => void;
 	onEditTask: (columnId: string, taskId: string) => void;
@@ -17,8 +20,11 @@ interface KanbanBoardProps {
 }
 
 function KanbanBoardComponent({
+	boardId,
 	columns,
 	kanbanState,
+	canMoveColumns,
+	canMoveTasks,
 	onKanbanChange,
 	onAddTask,
 	onEditTask,
@@ -69,7 +75,10 @@ function KanbanBoardComponent({
 				{orderedColumns.map((column) => (
 					<ColumnContent
 						key={column.id}
+						boardId={boardId}
 						column={column}
+						canMoveColumn={canMoveColumns}
+						canMoveTasks={canMoveTasks}
 						onAddTask={() => onAddTask(column.id)}
 						onEditTask={(taskId) => onEditTask(column.id, taskId)}
 						onEditColumn={() => onEditColumn(column.id)}
diff --git a/packages/stack/src/plugins/kanban/client/components/shared/task-card.tsx b/packages/stack/src/plugins/kanban/client/components/shared/task-card.tsx
index 45f5ec0f..958fe0c6 100644
--- a/packages/stack/src/plugins/kanban/client/components/shared/task-card.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/shared/task-card.tsx
@@ -10,25 +10,54 @@ import type { SerializedTask } from "../../../types";
 import { getPriorityConfig } from "../../../utils";
 import { useResolveUser } from "../../hooks/kanban-hooks";
 import { UserAvatar } from "./user-avatar";
+import { useCan, usePluginOverrides, useTranslate } from "@btst/stack/context";
+import type { KanbanPluginOverrides } from "../../overrides";
 
 interface TaskCardProps {
+	boardId: string;
+	columnId: string;
 	task: SerializedTask;
+	canMove: boolean;
 	onClick: () => void;
 }
 
-function TaskCardComponent({ task, onClick }: TaskCardProps) {
+function TaskCardComponent({
+	boardId,
+	columnId,
+	task,
+	canMove,
+	onClick,
+}: TaskCardProps) {
+	const t = useTranslate();
+	const { localization } = usePluginOverrides<KanbanPluginOverrides>("kanban");
+	const { can: canEdit, isPending: isCheckingEdit } = useCan({
+		resource: "kanban:task",
+		action: "update",
+		params: { id: task.id, boardId, columnId },
+	});
 	const priorityConfig = getPriorityConfig(task.priority);
 	const { data: assignee } = useResolveUser(task.assigneeId);
+	const priorityLabels = {
+		LOW: localization?.priorityLow ?? t("kanban.common.priorityLow", "Low"),
+		MEDIUM:
+			localization?.priorityMedium ??
+			t("kanban.common.priorityMedium", "Medium"),
+		HIGH: localization?.priorityHigh ?? t("kanban.common.priorityHigh", "High"),
+		URGENT:
+			localization?.priorityUrgent ??
+			t("kanban.common.priorityUrgent", "Urgent"),
+	};
+	const editable = !isCheckingEdit && canEdit;
 
 	return (
 		<Kanban.Item value={task.id} asChild>
 			<div
-				className="rounded-md border bg-card p-3 shadow-xs cursor-pointer hover:shadow-md transition-shadow"
-				onClick={onClick}
+				className={`rounded-md border bg-card p-3 shadow-xs transition-shadow ${editable ? "cursor-pointer hover:shadow-md" : "cursor-default"}`}
+				onClick={editable ? onClick : undefined}
 			>
 				<div className="flex flex-col gap-2">
 					<div className="flex items-center gap-2">
-						<Kanban.ItemHandle asChild>
+						<Kanban.ItemHandle asChild disabled={!canMove}>
 							<Button
 								variant="ghost"
 								size="icon"
@@ -39,7 +68,7 @@ function TaskCardComponent({ task, onClick }: TaskCardProps) {
 							</Button>
 						</Kanban.ItemHandle>
 						<span
-							className="line-clamp-1 font-medium text-base flex-1 text-left cursor-pointer hover:text-primary"
+							className={`line-clamp-1 font-medium text-base flex-1 text-left ${editable ? "cursor-pointer hover:text-primary" : "cursor-default"}`}
 							title={task.title}
 						>
 							{task.title}
@@ -48,7 +77,7 @@ function TaskCardComponent({ task, onClick }: TaskCardProps) {
 							variant={priorityConfig.variant}
 							className={`pointer-events-none h-5 rounded-sm px-1.5 text-[11px] capitalize ${priorityConfig.className}`}
 						>
-							{priorityConfig.label}
+							{priorityLabels[task.priority] ?? priorityConfig.label}
 						</Badge>
 					</div>
 
@@ -57,13 +86,18 @@ function TaskCardComponent({ task, onClick }: TaskCardProps) {
 							<div className="flex items-center gap-1.5">
 								<UserAvatar user={assignee ?? null} size="sm" />
 								<span className="line-clamp-1">
-									{assignee?.name || "Assigned"}
+									{assignee?.name ||
+										(localization?.assigned ??
+											t("kanban.common.assigned", "Assigned"))}
 								</span>
 							</div>
 						) : (
 							<div className="flex items-center gap-1.5">
 								<UserAvatar user={null} size="sm" />
-								<span className="line-clamp-1">Unassigned</span>
+								<span className="line-clamp-1">
+									{localization?.unassigned ??
+										t("kanban.common.unassigned", "Unassigned")}
+								</span>
 							</div>
 						)}
 						<time className="tabular-nums">
diff --git a/packages/stack/src/plugins/kanban/client/components/shared/user-avatar.tsx b/packages/stack/src/plugins/kanban/client/components/shared/user-avatar.tsx
index 1454782a..f42d21ce 100644
--- a/packages/stack/src/plugins/kanban/client/components/shared/user-avatar.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/shared/user-avatar.tsx
@@ -7,7 +7,8 @@ import {
 	AvatarImage,
 	AvatarFallback,
 } from "@workspace/ui/components/avatar";
-import type { KanbanUser } from "../../overrides";
+import { usePluginOverrides, useTranslate } from "@btst/stack/context";
+import type { KanbanPluginOverrides, KanbanUser } from "../../overrides";
 
 interface UserAvatarProps {
 	user: KanbanUser | null;
@@ -37,10 +38,19 @@ function UserAvatarComponent({
 	size = "sm",
 	className,
 }: UserAvatarProps) {
+	const t = useTranslate();
+	const { localization } = usePluginOverrides<KanbanPluginOverrides>("kanban");
 	// No user - show placeholder icon
 	if (!user) {
 		return (
-			<Avatar size={size} className={className} title="Unassigned">
+			<Avatar
+				size={size}
+				className={className}
+				title={
+					localization?.unassigned ??
+					t("kanban.common.unassigned", "Unassigned")
+				}
+			>
 				<AvatarFallback>
 					<User className="size-3 group-data-[size=default]/avatar:size-4 group-data-[size=lg]/avatar:size-5" />
 				</AvatarFallback>
diff --git a/packages/stack/src/plugins/kanban/client/hooks/index.tsx b/packages/stack/src/plugins/kanban/client/hooks/index.tsx
index 2a33c236..6c4a4199 100644
--- a/packages/stack/src/plugins/kanban/client/hooks/index.tsx
+++ b/packages/stack/src/plugins/kanban/client/hooks/index.tsx
@@ -3,8 +3,11 @@ export {
 	useSuspenseBoards,
 	useBoard,
 	useSuspenseBoard,
+	useBoardForm,
 	useBoardMutations,
+	useColumnForm,
 	useColumnMutations,
+	useTaskForm,
 	useTaskMutations,
 	useResolveUser,
 	useSearchUsers,
diff --git a/packages/stack/src/plugins/kanban/client/hooks/kanban-hooks.tsx b/packages/stack/src/plugins/kanban/client/hooks/kanban-hooks.tsx
index b34bacfd..3eeb7ab2 100644
--- a/packages/stack/src/plugins/kanban/client/hooks/kanban-hooks.tsx
+++ b/packages/stack/src/plugins/kanban/client/hooks/kanban-hooks.tsx
@@ -1,231 +1,68 @@
 "use client";
 
-import {
-	useMutation,
-	useQuery,
-	useQueryClient,
-	useSuspenseQuery,
-} from "@tanstack/react-query";
-import { createApiClient } from "@btst/stack/plugins/client";
+import { useQuery } from "@tanstack/react-query";
 import { usePluginOverrides } from "@btst/stack/context";
-import type { KanbanApiRouter } from "../../api";
-import { createKanbanQueryKeys } from "../../query-keys";
+import type {
+	ResourceFormConfig,
+	ResourceFormResult,
+} from "@btst/stack/plugins/client/hooks";
 import type { KanbanPluginOverrides, KanbanUser } from "../overrides";
 import type {
 	SerializedBoard,
-	SerializedBoardWithColumns,
 	SerializedColumn,
 	SerializedTask,
-	Priority,
 } from "../../types";
-
-// ============ Error Handling ============
-
-// Type guard for better-call error responses
-function isErrorResponse(
-	response: unknown,
-): response is { error: unknown; data?: never } {
-	return (
-		typeof response === "object" &&
-		response !== null &&
-		"error" in response &&
-		response.error !== null &&
-		response.error !== undefined
-	);
-}
-
-// Helper to convert error to a proper Error object with meaningful message
-function toError(error: unknown): Error {
-	if (error instanceof Error) {
-		return error;
-	}
-
-	if (typeof error === "object" && error !== null) {
-		const errorObj = error as Record<string, unknown>;
-		const message =
-			(typeof errorObj.message === "string" ? errorObj.message : null) ||
-			(typeof errorObj.error === "string" ? errorObj.error : null) ||
-			JSON.stringify(error);
-
-		const err = new Error(message);
-		Object.assign(err, error);
-		return err;
-	}
-
-	return new Error(String(error));
-}
-
-// ============ API Client Hook ============
-
-function useKanbanClient() {
-	const { apiBaseURL, apiBasePath, headers } =
-		usePluginOverrides<KanbanPluginOverrides>("kanban");
-
-	const client = createApiClient<KanbanApiRouter>({
-		baseURL: apiBaseURL,
-		basePath: apiBasePath,
-	});
-
-	return { client, headers };
-}
+import { kanban } from "./kanban-resource";
 
 // ============ Board Hooks ============
 
-/**
- * Hook to fetch list of boards
- */
+/** Hook to fetch a list of boards. */
 export function useBoards(params?: {
 	slug?: string;
 	ownerId?: string;
 	organizationId?: string;
 }) {
-	const { client, headers } = useKanbanClient();
-	const queries = createKanbanQueryKeys(client, headers);
-
-	return useQuery({
-		...queries.boards.list(params),
-		staleTime: 30_000,
-		refetchOnWindowFocus: true,
-	});
+	return kanban.boards.list.use([params]);
 }
 
-/**
- * Hook to fetch list of boards with suspense
- */
+/** Suspense variant of useBoards. */
 export function useSuspenseBoards(params?: {
 	slug?: string;
 	ownerId?: string;
 	organizationId?: string;
 }) {
-	const { client, headers } = useKanbanClient();
-	const queries = createKanbanQueryKeys(client, headers);
-
-	const result = useSuspenseQuery({
-		...queries.boards.list(params),
-		staleTime: 30_000,
-		refetchOnWindowFocus: true,
-	});
-
-	if (result.error && !result.isFetching) {
-		throw result.error;
-	}
-
-	return result;
+	return kanban.boards.list.useSuspense([params]);
 }
 
-/**
- * Hook to fetch a single board by ID
- */
+/** Hook to fetch a single board by ID. */
 export function useBoard(boardId: string) {
-	const { client, headers } = useKanbanClient();
-	const queries = createKanbanQueryKeys(client, headers);
-
-	return useQuery({
-		...queries.boards.detail(boardId),
-		staleTime: 30_000,
-		refetchOnWindowFocus: true,
-		enabled: !!boardId,
-	});
+	return kanban.boards.detail.use([boardId], { enabled: !!boardId });
 }
 
-/**
- * Hook to fetch a single board with suspense
- */
+/** Suspense variant of useBoard. */
 export function useSuspenseBoard(boardId: string) {
-	const { client, headers } = useKanbanClient();
-	const queries = createKanbanQueryKeys(client, headers);
-
-	const result = useSuspenseQuery({
-		...queries.boards.detail(boardId),
-		staleTime: 30_000,
-		refetchOnWindowFocus: true,
-	});
-
-	if (result.error && !result.isFetching) {
-		throw result.error;
-	}
-
-	return result;
+	return kanban.boards.detail.useSuspense([boardId]);
 }
 
-// ============ Board Mutations ============
-
 /**
- * Hook for board CRUD mutations
+ * Form lifecycle hook for creating/editing boards. It submits the matching
+ * resource mutation and exposes normalized field-level server errors.
  */
-export function useBoardMutations() {
-	const { client, headers } = useKanbanClient();
-	const queryClient = useQueryClient();
-
-	const createMutation = useMutation({
-		mutationFn: async (data: {
-			name: string;
-			description?: string;
-			ownerId?: string;
-			organizationId?: string;
-		}) => {
-			const response = await client("@post/boards", {
-				method: "POST",
-				body: data,
-				headers,
-			});
-			if (isErrorResponse(response)) {
-				const errorResponse = response as { error: unknown };
-				throw toError(errorResponse.error);
-			}
-			return response.data as unknown as SerializedBoardWithColumns;
-		},
-		onSuccess: () => {
-			queryClient.invalidateQueries({ queryKey: ["boards"] });
-		},
-	});
-
-	const updateMutation = useMutation({
-		mutationFn: async ({
-			id,
-			data,
-		}: {
-			id: string;
-			data: Partial<{
-				name: string;
-				description: string;
-				slug: string;
-			}>;
-		}) => {
-			const response = await client("@put/boards/:id", {
-				method: "PUT",
-				params: { id },
-				body: data,
-				headers,
-			});
-			if (isErrorResponse(response)) {
-				const errorResponse = response as { error: unknown };
-				throw toError(errorResponse.error);
-			}
-			return response.data as unknown as SerializedBoard;
-		},
-		onSuccess: () => {
-			queryClient.invalidateQueries({ queryKey: ["boards"] });
-		},
-	});
+export function useBoardForm<TValues>(
+	config: ResourceFormConfig<TValues, SerializedBoard | null, SerializedBoard>,
+): ResourceFormResult<TValues, SerializedBoard | null, SerializedBoard> {
+	return kanban.boards.useForm<
+		TValues,
+		SerializedBoard,
+		SerializedBoard | null
+	>(config);
+}
 
-	const deleteMutation = useMutation({
-		mutationFn: async (id: string) => {
-			const response = await client("@delete/boards/:id", {
-				method: "DELETE",
-				params: { id },
-				headers,
-			});
-			if (isErrorResponse(response)) {
-				const errorResponse = response as { error: unknown };
-				throw toError(errorResponse.error);
-			}
-			return response.data as unknown as { success: boolean };
-		},
-		onSuccess: () => {
-			queryClient.invalidateQueries({ queryKey: ["boards"] });
-		},
-	});
+/** Hook for board CRUD mutations. */
+export function useBoardMutations() {
+	const createMutation = kanban.boards.create.use();
+	const updateMutation = kanban.boards.update.use();
+	const deleteMutation = kanban.boards.delete.use();
 
 	return {
 		createBoard: createMutation.mutateAsync,
@@ -243,106 +80,31 @@ export function useBoardMutations() {
 	};
 }
 
-// ============ Column Mutations ============
+// ============ Column Hooks ============
 
 /**
- * Hook for column CRUD mutations
+ * Form lifecycle hook for creating/editing columns with server field errors.
  */
-export function useColumnMutations() {
-	const { client, headers } = useKanbanClient();
-	const queryClient = useQueryClient();
-
-	const createMutation = useMutation({
-		mutationFn: async (data: {
-			title: string;
-			boardId: string;
-			order?: number;
-		}) => {
-			const response = await client("@post/columns", {
-				method: "POST",
-				body: data,
-				headers,
-			});
-			if (isErrorResponse(response)) {
-				const errorResponse = response as { error: unknown };
-				throw toError(errorResponse.error);
-			}
-			return response.data as unknown as SerializedColumn;
-		},
-		onSuccess: () => {
-			queryClient.invalidateQueries({ queryKey: ["boards"] });
-		},
-	});
-
-	const updateMutation = useMutation({
-		mutationFn: async ({
-			id,
-			data,
-		}: {
-			id: string;
-			data: Partial<{
-				title: string;
-				order: number;
-			}>;
-		}) => {
-			const response = await client("@put/columns/:id", {
-				method: "PUT",
-				params: { id },
-				body: data,
-				headers,
-			});
-			if (isErrorResponse(response)) {
-				const errorResponse = response as { error: unknown };
-				throw toError(errorResponse.error);
-			}
-			return response.data as unknown as SerializedColumn;
-		},
-		onSuccess: () => {
-			queryClient.invalidateQueries({ queryKey: ["boards"] });
-		},
-	});
-
-	const deleteMutation = useMutation({
-		mutationFn: async (id: string) => {
-			const response = await client("@delete/columns/:id", {
-				method: "DELETE",
-				params: { id },
-				headers,
-			});
-			if (isErrorResponse(response)) {
-				const errorResponse = response as { error: unknown };
-				throw toError(errorResponse.error);
-			}
-			return response.data as unknown as { success: boolean };
-		},
-		onSuccess: () => {
-			queryClient.invalidateQueries({ queryKey: ["boards"] });
-		},
-	});
+export function useColumnForm<TValues>(
+	config: ResourceFormConfig<
+		TValues,
+		SerializedColumn | null,
+		SerializedColumn
+	>,
+): ResourceFormResult<TValues, SerializedColumn | null, SerializedColumn> {
+	return kanban.columns.useForm<
+		TValues,
+		SerializedColumn,
+		SerializedColumn | null
+	>(config);
+}
 
-	const reorderMutation = useMutation({
-		mutationFn: async ({
-			boardId,
-			columnIds,
-		}: {
-			boardId: string;
-			columnIds: string[];
-		}) => {
-			const response = await client("@post/columns/reorder", {
-				method: "POST",
-				body: { boardId, columnIds },
-				headers,
-			});
-			if (isErrorResponse(response)) {
-				const errorResponse = response as { error: unknown };
-				throw toError(errorResponse.error);
-			}
-			return response.data as unknown as { success: boolean };
-		},
-		onSuccess: () => {
-			queryClient.invalidateQueries({ queryKey: ["boards"] });
-		},
-	});
+/** Hook for column CRUD and reorder mutations. */
+export function useColumnMutations() {
+	const createMutation = kanban.columns.create.use();
+	const updateMutation = kanban.columns.update.use();
+	const deleteMutation = kanban.columns.delete.use();
+	const reorderMutation = kanban.columns.reorder.use();
 
 	return {
 		createColumn: createMutation.mutateAsync,
@@ -364,140 +126,26 @@ export function useColumnMutations() {
 	};
 }
 
-// ============ Task Mutations ============
+// ============ Task Hooks ============
 
 /**
- * Hook for task CRUD mutations
+ * Form lifecycle hook for creating/editing tasks with server field errors.
  */
-export function useTaskMutations() {
-	const { client, headers } = useKanbanClient();
-	const queryClient = useQueryClient();
-
-	const createMutation = useMutation({
-		mutationFn: async (data: {
-			title: string;
-			description?: string;
-			priority?: Priority;
-			columnId: string;
-			assigneeId?: string;
-			order?: number;
-		}) => {
-			const response = await client("@post/tasks", {
-				method: "POST",
-				body: data,
-				headers,
-			});
-			if (isErrorResponse(response)) {
-				const errorResponse = response as { error: unknown };
-				throw toError(errorResponse.error);
-			}
-			return response.data as unknown as SerializedTask;
-		},
-		onSuccess: () => {
-			queryClient.invalidateQueries({ queryKey: ["boards"] });
-		},
-	});
-
-	const updateMutation = useMutation({
-		mutationFn: async ({
-			id,
-			data,
-		}: {
-			id: string;
-			data: Partial<{
-				title: string;
-				description: string;
-				priority: Priority;
-				columnId: string;
-				assigneeId: string | null;
-				order: number;
-				isArchived: boolean;
-			}>;
-		}) => {
-			const response = await client("@put/tasks/:id", {
-				method: "PUT",
-				params: { id },
-				body: data,
-				headers,
-			});
-			if (isErrorResponse(response)) {
-				const errorResponse = response as { error: unknown };
-				throw toError(errorResponse.error);
-			}
-			return response.data as unknown as SerializedTask;
-		},
-		onSuccess: () => {
-			queryClient.invalidateQueries({ queryKey: ["boards"] });
-		},
-	});
-
-	const deleteMutation = useMutation({
-		mutationFn: async (id: string) => {
-			const response = await client("@delete/tasks/:id", {
-				method: "DELETE",
-				params: { id },
-				headers,
-			});
-			if (isErrorResponse(response)) {
-				const errorResponse = response as { error: unknown };
-				throw toError(errorResponse.error);
-			}
-			return response.data as unknown as { success: boolean };
-		},
-		onSuccess: () => {
-			queryClient.invalidateQueries({ queryKey: ["boards"] });
-		},
-	});
-
-	const moveMutation = useMutation({
-		mutationFn: async ({
-			taskId,
-			targetColumnId,
-			targetOrder,
-		}: {
-			taskId: string;
-			targetColumnId: string;
-			targetOrder: number;
-		}) => {
-			const response = await client("@post/tasks/move", {
-				method: "POST",
-				body: { taskId, targetColumnId, targetOrder },
-				headers,
-			});
-			if (isErrorResponse(response)) {
-				const errorResponse = response as { error: unknown };
-				throw toError(errorResponse.error);
-			}
-			return response.data as unknown as SerializedTask;
-		},
-		onSuccess: () => {
-			queryClient.invalidateQueries({ queryKey: ["boards"] });
-		},
-	});
+export function useTaskForm<TValues>(
+	config: ResourceFormConfig<TValues, SerializedTask | null, SerializedTask>,
+): ResourceFormResult<TValues, SerializedTask | null, SerializedTask> {
+	return kanban.tasks.useForm<TValues, SerializedTask, SerializedTask | null>(
+		config,
+	);
+}
 
-	const reorderMutation = useMutation({
-		mutationFn: async ({
-			columnId,
-			taskIds,
-		}: {
-			columnId: string;
-			taskIds: string[];
-		}) => {
-			const response = await client("@post/tasks/reorder", {
-				method: "POST",
-				body: { columnId, taskIds },
-				headers,
-			});
-			if (isErrorResponse(response)) {
-				const errorResponse = response as { error: unknown };
-				throw toError(errorResponse.error);
-			}
-			return response.data as unknown as { success: boolean };
-		},
-		onSuccess: () => {
-			queryClient.invalidateQueries({ queryKey: ["boards"] });
-		},
-	});
+/** Hook for task CRUD, move, and reorder mutations. */
+export function useTaskMutations() {
+	const createMutation = kanban.tasks.create.use();
+	const updateMutation = kanban.tasks.update.use();
+	const deleteMutation = kanban.tasks.delete.use();
+	const moveMutation = kanban.tasks.move.use();
+	const reorderMutation = kanban.tasks.reorder.use();
 
 	return {
 		createTask: createMutation.mutateAsync,
@@ -525,10 +173,7 @@ export function useTaskMutations() {
 
 // ============ User Resolution Hooks ============
 
-/**
- * Hook to resolve a user from their ID
- * Caches results to avoid repeated lookups
- */
+/** Resolve a user from the consumer-provided callback. */
 export function useResolveUser(userId: string | undefined | null) {
 	const { resolveUser } = usePluginOverrides<KanbanPluginOverrides>("kanban");
 
@@ -536,29 +181,21 @@ export function useResolveUser(userId: string | undefined | null) {
 		queryKey: ["kanban", "users", userId],
 		queryFn: async () => {
 			if (!userId) return null;
-			const result = await resolveUser(userId);
-			return result;
+			return resolveUser(userId);
 		},
 		enabled: !!userId,
-		staleTime: 5 * 60 * 1000, // Cache user info for 5 minutes
-		gcTime: 10 * 60 * 1000, // Keep in cache for 10 minutes
+		staleTime: 5 * 60 * 1000,
+		gcTime: 10 * 60 * 1000,
 	});
 }
 
-/**
- * Hook to search for users available for assignment
- * @param query - Search query (empty string for all users)
- * @param boardId - Optional board context for scoped user lists
- */
+/** Search for assignable users through the consumer-provided callback. */
 export function useSearchUsers(query: string, boardId?: string) {
 	const { searchUsers } = usePluginOverrides<KanbanPluginOverrides>("kanban");
 
 	return useQuery<KanbanUser[]>({
 		queryKey: ["kanban", "users", "search", query, boardId],
-		queryFn: async () => {
-			const result = await searchUsers(query, boardId);
-			return result;
-		},
-		staleTime: 30_000, // Cache search results for 30 seconds
+		queryFn: () => searchUsers(query, boardId),
+		staleTime: 30_000,
 	});
 }
diff --git a/packages/stack/src/plugins/kanban/client/hooks/kanban-resource.ts b/packages/stack/src/plugins/kanban/client/hooks/kanban-resource.ts
new file mode 100644
index 00000000..9dd6d50d
--- /dev/null
+++ b/packages/stack/src/plugins/kanban/client/hooks/kanban-resource.ts
@@ -0,0 +1,13 @@
+"use client";
+
+import { createResource } from "@btst/stack/plugins/client/hooks";
+import { kanbanResources } from "../../query-keys";
+
+/**
+ * Factory-generated Kanban resource hooks. Internal — public hooks preserve
+ * the existing Kanban-specific names and return shapes in `kanban-hooks.tsx`.
+ */
+export const kanban = createResource({
+	plugin: "kanban",
+	resources: kanbanResources,
+});
diff --git a/packages/stack/src/plugins/kanban/client/localization/kanban-common.ts b/packages/stack/src/plugins/kanban/client/localization/kanban-common.ts
index 7f0932a5..a13fecd9 100644
--- a/packages/stack/src/plugins/kanban/client/localization/kanban-common.ts
+++ b/packages/stack/src/plugins/kanban/client/localization/kanban-common.ts
@@ -11,6 +11,8 @@ export interface KanbanCommonLocalization {
 	// Status
 	loading: string;
 	saving: string;
+	creating: string;
+	updating: string;
 	deleting: string;
 	// Labels
 	board: string;
@@ -28,9 +30,19 @@ export interface KanbanCommonLocalization {
 	noBoards: string;
 	noColumns: string;
 	noTasks: string;
+	assigned: string;
+	unassigned: string;
+	// Generic UI
+	pageNotFound: string;
+	pageNotFoundDescription: string;
+	unexpectedError: string;
+	tryAgain: string;
 	// Errors
 	errorGeneric: string;
 	errorNotFound: string;
+	deleteBoardError: string;
+	deleteColumnError: string;
+	deleteTaskError: string;
 }
 
 export const defaultKanbanCommonLocalization: KanbanCommonLocalization = {
@@ -46,6 +58,8 @@ export const defaultKanbanCommonLocalization: KanbanCommonLocalization = {
 	// Status
 	loading: "Loading...",
 	saving: "Saving...",
+	creating: "Creating...",
+	updating: "Updating...",
 	deleting: "Deleting...",
 	// Labels
 	board: "Board",
@@ -63,7 +77,17 @@ export const defaultKanbanCommonLocalization: KanbanCommonLocalization = {
 	noBoards: "No boards yet",
 	noColumns: "No columns yet",
 	noTasks: "No tasks yet",
+	assigned: "Assigned",
+	unassigned: "Unassigned",
+	// Generic UI
+	pageNotFound: "Page Not Found",
+	pageNotFoundDescription: "The page you're looking for doesn't exist.",
+	unexpectedError: "An unexpected error occurred. Please try again.",
+	tryAgain: "Try Again",
 	// Errors
 	errorGeneric: "Something went wrong",
 	errorNotFound: "Not found",
+	deleteBoardError: "Failed to delete board",
+	deleteColumnError: "Failed to delete column",
+	deleteTaskError: "Failed to delete task",
 };
diff --git a/packages/stack/src/plugins/kanban/client/localization/kanban-forms.ts b/packages/stack/src/plugins/kanban/client/localization/kanban-forms.ts
index 9e70a4e1..413a8700 100644
--- a/packages/stack/src/plugins/kanban/client/localization/kanban-forms.ts
+++ b/packages/stack/src/plugins/kanban/client/localization/kanban-forms.ts
@@ -23,6 +23,11 @@ export interface KanbanFormsLocalization {
 	taskPriority: string;
 	taskColumn: string;
 	taskAssignee: string;
+	selectPriority: string;
+	selectColumn: string;
+	selectAssignee: string;
+	noUsersFound: string;
+	taskMovePartialError: string;
 	createTask: string;
 	updateTask: string;
 	deleteTask: string;
@@ -59,6 +64,12 @@ export const defaultKanbanFormsLocalization: KanbanFormsLocalization = {
 	taskPriority: "Priority",
 	taskColumn: "Column",
 	taskAssignee: "Assignee",
+	selectPriority: "Select priority",
+	selectColumn: "Select column",
+	selectAssignee: "Select assignee",
+	noUsersFound: "No users found",
+	taskMovePartialError:
+		"Task properties were saved, but moving to the new column failed: {{message}}. You can try dragging the task to the desired column.",
 	createTask: "Create Task",
 	updateTask: "Update Task",
 	deleteTask: "Delete Task",
diff --git a/packages/stack/src/plugins/kanban/client/localization/kanban-list.ts b/packages/stack/src/plugins/kanban/client/localization/kanban-list.ts
index 2d1d4b80..b223e422 100644
--- a/packages/stack/src/plugins/kanban/client/localization/kanban-list.ts
+++ b/packages/stack/src/plugins/kanban/client/localization/kanban-list.ts
@@ -3,17 +3,29 @@ export interface KanbanListLocalization {
 	kanbanBoards: string;
 	manageProjects: string;
 	createNewBoard: string;
+	createNewBoardDescription: string;
 	boardDetails: string;
+	boardDetailsDescription: string;
 	// Actions
 	newBoard: string;
 	addColumn: string;
 	addTask: string;
+	editBoard: string;
+	editColumn: string;
+	editTask: string;
 	// List
 	columnsCount: string;
 	// Empty states
 	noBoardsDescription: string;
 	noColumnsDescription: string;
 	noTasksDescription: string;
+	boardNotFound: string;
+	boardNotFoundDescription: string;
+	addColumnDescription: string;
+	editColumnDescription: string;
+	editBoardDescription: string;
+	addTaskDescription: string;
+	editTaskDescription: string;
 }
 
 export const defaultKanbanListLocalization: KanbanListLocalization = {
@@ -21,11 +33,16 @@ export const defaultKanbanListLocalization: KanbanListLocalization = {
 	kanbanBoards: "Kanban Boards",
 	manageProjects: "Manage your projects and tasks",
 	createNewBoard: "Create New Board",
+	createNewBoardDescription: "Set up a new kanban board for your project",
 	boardDetails: "Board Details",
+	boardDetailsDescription: "Enter the details for your new kanban board.",
 	// Actions
 	newBoard: "New Board",
 	addColumn: "Add Column",
 	addTask: "Add Task",
+	editBoard: "Edit Board",
+	editColumn: "Edit Column",
+	editTask: "Edit Task",
 	// List
 	columnsCount: "columns",
 	// Empty states
@@ -33,4 +50,12 @@ export const defaultKanbanListLocalization: KanbanListLocalization = {
 		"Create your first kanban board to start organizing your tasks.",
 	noColumnsDescription: "Create your first column to start organizing tasks.",
 	noTasksDescription: "Add a task to get started",
+	boardNotFound: "Board not found",
+	boardNotFoundDescription:
+		"The board you're looking for doesn't exist or you don't have access to it.",
+	addColumnDescription: "Add a new column to this board.",
+	editColumnDescription: "Update the column details.",
+	editBoardDescription: "Update board details.",
+	addTaskDescription: "Create a new task.",
+	editTaskDescription: "Update task details.",
 };
diff --git a/packages/stack/src/plugins/kanban/query-keys.ts b/packages/stack/src/plugins/kanban/query-keys.ts
index 219ceb47..57d9271f 100644
--- a/packages/stack/src/plugins/kanban/query-keys.ts
+++ b/packages/stack/src/plugins/kanban/query-keys.ts
@@ -1,13 +1,19 @@
-import {
-	mergeQueryKeys,
-	createQueryKeys,
-} from "@lukemorales/query-key-factory";
 import type { KanbanApiRouter } from "./api";
-import { createApiClient } from "@btst/stack/plugins/client";
-import type { SerializedBoardWithColumns } from "./types";
+import {
+	createApiClient,
+	createResourceQueryKeys,
+	type ResourcesDeclaration,
+} from "@btst/stack/plugins/client";
+import type {
+	Priority,
+	SerializedBoard,
+	SerializedBoardWithColumns,
+	SerializedColumn,
+	SerializedTask,
+} from "./types";
 import { boardsListDiscriminator } from "./api/query-key-defs";
 
-interface BoardsListParams {
+export interface BoardsListParams {
 	slug?: string;
 	ownerId?: string;
 	organizationId?: string;
@@ -15,136 +21,254 @@ interface BoardsListParams {
 	offset?: number;
 }
 
-// Type guard for better-call error responses
-function isErrorResponse(
-	response: unknown,
-): response is { error: unknown; data?: never } {
-	return (
-		typeof response === "object" &&
-		response !== null &&
-		"error" in response &&
-		response.error !== null &&
-		response.error !== undefined
-	);
+export interface CreateBoardInput {
+	name: string;
+	description?: string;
+	ownerId?: string;
+	organizationId?: string;
 }
 
-// Helper to convert error to a proper Error object with meaningful message
-function toError(error: unknown): Error {
-	if (error instanceof Error) {
-		return error;
-	}
-
-	if (typeof error === "object" && error !== null) {
-		const errorObj = error as Record<string, unknown>;
-		const message =
-			(typeof errorObj.message === "string" ? errorObj.message : null) ||
-			(typeof errorObj.error === "string" ? errorObj.error : null) ||
-			JSON.stringify(error);
-
-		const err = new Error(message);
-		Object.assign(err, error);
-		return err;
-	}
-
-	return new Error(String(error));
+export interface UpdateBoardInput {
+	id: string;
+	data: Partial<{
+		name: string;
+		description: string;
+		slug: string;
+	}>;
 }
 
-export function createKanbanQueryKeys(
-	client: ReturnType<typeof createApiClient<KanbanApiRouter>>,
-	headers?: HeadersInit,
-) {
-	const boards = createBoardsQueries(client, headers);
+export interface CreateColumnInput {
+	title: string;
+	boardId: string;
+	order?: number;
+}
 
-	return mergeQueryKeys(boards);
+export interface UpdateColumnInput {
+	id: string;
+	data: Partial<{
+		title: string;
+		order: number;
+	}>;
 }
 
-function createBoardsQueries(
-	client: ReturnType<typeof createApiClient<KanbanApiRouter>>,
-	headers?: HeadersInit,
-) {
-	return createQueryKeys("boards", {
-		list: (params?: BoardsListParams) => ({
-			queryKey: [boardsListDiscriminator(params)],
-			queryFn: async () => {
-				try {
-					const response = await client("/boards", {
-						method: "GET",
-						query: {
-							slug: params?.slug,
-							ownerId: params?.ownerId,
-							organizationId: params?.organizationId,
-							limit: params?.limit ?? 50,
-							offset: params?.offset ?? 0,
-						},
-						headers,
-					});
-
-					if (isErrorResponse(response)) {
-						const errorResponse = response as { error: unknown };
-						throw toError(errorResponse.error);
-					}
-
-					const envelope = (response as { data?: unknown }).data as
-						| { items?: SerializedBoardWithColumns[] }
-						| undefined;
-					return envelope?.items ?? ([] as SerializedBoardWithColumns[]);
-				} catch (error) {
-					throw error;
-				}
+export interface ReorderColumnsInput {
+	boardId: string;
+	columnIds: string[];
+}
+
+export interface CreateTaskInput {
+	title: string;
+	description?: string;
+	priority?: Priority;
+	columnId: string;
+	assigneeId?: string;
+	order?: number;
+}
+
+export interface UpdateTaskInput {
+	id: string;
+	data: Partial<{
+		title: string;
+		description: string;
+		priority: Priority;
+		columnId: string;
+		assigneeId: string | null;
+		order: number;
+		isArchived: boolean;
+	}>;
+}
+
+export interface MoveTaskInput {
+	taskId: string;
+	targetColumnId: string;
+	targetOrder: number;
+}
+
+export interface ReorderTasksInput {
+	columnId: string;
+	taskIds: string[];
+}
+
+/**
+ * Kanban resource declaration — the single source of truth for query keys,
+ * HTTP mappings, cache invalidation, and generated client hooks.
+ *
+ * Board key shapes intentionally match `KANBAN_QUERY_KEYS` so SSR loaders and
+ * `prefetchForRoute` hydrate the same cache entries as client hooks.
+ */
+export const kanbanResources = {
+	boards: {
+		queries: {
+			list: {
+				path: "/boards",
+				query: (params?: BoardsListParams) => ({
+					slug: params?.slug,
+					ownerId: params?.ownerId,
+					organizationId: params?.organizationId,
+					limit: params?.limit ?? 50,
+					offset: params?.offset ?? 0,
+				}),
+				key: (params?: BoardsListParams) => [boardsListDiscriminator(params)],
+				select: (
+					data: any,
+					_params?: BoardsListParams,
+				): SerializedBoardWithColumns[] => data?.items ?? [],
 			},
-		}),
-
-		detail: (boardId: string) => ({
-			queryKey: [boardId],
-			queryFn: async () => {
-				if (!boardId) return null;
-
-				try {
-					const response = await client("/boards/:id", {
-						method: "GET",
-						params: { id: boardId },
-						headers,
-					});
-
-					if (isErrorResponse(response)) {
-						const errorResponse = response as { error: unknown };
-						throw toError(errorResponse.error);
-					}
-
-					return ((response as { data?: unknown }).data ??
-						null) as unknown as SerializedBoardWithColumns | null;
-				} catch (error) {
-					throw error;
-				}
+
+			detail: {
+				path: "/boards/:id",
+				params: (boardId: string) => ({ id: boardId }),
+				key: (boardId: string) => [boardId],
+				select: (
+					data: any,
+					_boardId: string,
+				): SerializedBoardWithColumns | null => data ?? null,
+				skip: (boardId: string) => !boardId,
 			},
-		}),
-
-		// Get board by slug
-		bySlug: (slug: string) => ({
-			queryKey: ["slug", slug],
-			queryFn: async () => {
-				if (!slug) return null;
-
-				try {
-					const response = await client("/boards", {
-						method: "GET",
-						query: { slug, limit: 1 },
-						headers,
-					});
-
-					if (isErrorResponse(response)) {
-						const errorResponse = response as { error: unknown };
-						throw toError(errorResponse.error);
-					}
-
-					const envelope = (response as { data?: unknown }).data as
-						| { items?: SerializedBoardWithColumns[] }
-						| undefined;
-					return envelope?.items?.[0] ?? null;
-				} catch (error) {
-					throw error;
-				}
+
+			bySlug: {
+				path: "/boards",
+				query: (slug: string) => ({ slug, limit: 1 }),
+				key: (slug: string) => ["slug", slug],
+				select: (data: any, _slug: string): SerializedBoardWithColumns | null =>
+					data?.items?.[0] ?? null,
+				skip: (slug: string) => !slug,
+			},
+		},
+
+		mutations: {
+			create: {
+				path: "@post/boards",
+				method: "POST" as const,
+				input: (data: CreateBoardInput) => ({ body: data }),
+				select: (data: any) => data as SerializedBoardWithColumns,
+				setData: {
+					query: "detail",
+					args: (board: SerializedBoardWithColumns) => [board.id],
+				},
+				invalidates: ["boards.list"],
+				refresh: false,
+			},
+			update: {
+				path: "@put/boards/:id",
+				method: "PUT" as const,
+				input: ({ id, data }: UpdateBoardInput) => ({
+					params: { id },
+					body: data,
+				}),
+				select: (data: any) => data as SerializedBoard,
+				invalidates: ["boards"],
+				refresh: false,
+			},
+			delete: {
+				path: "@delete/boards/:id",
+				method: "DELETE" as const,
+				input: (id: string) => ({ params: { id } }),
+				select: (data: any) => data as { success: boolean },
+				invalidates: ["boards.list"],
+				refresh: false,
+			},
+		},
+	},
+
+	columns: {
+		queries: {},
+		mutations: {
+			create: {
+				path: "@post/columns",
+				method: "POST" as const,
+				input: (data: CreateColumnInput) => ({ body: data }),
+				select: (data: any) => data as SerializedColumn,
+				invalidates: ["boards"],
+				refresh: false,
+			},
+			update: {
+				path: "@put/columns/:id",
+				method: "PUT" as const,
+				input: ({ id, data }: UpdateColumnInput) => ({
+					params: { id },
+					body: data,
+				}),
+				select: (data: any) => data as SerializedColumn,
+				invalidates: ["boards"],
+				refresh: false,
+			},
+			delete: {
+				path: "@delete/columns/:id",
+				method: "DELETE" as const,
+				input: (id: string) => ({ params: { id } }),
+				select: (data: any) => data as { success: boolean },
+				invalidates: ["boards"],
+				refresh: false,
+			},
+			reorder: {
+				path: "@post/columns/reorder",
+				method: "POST" as const,
+				input: (data: ReorderColumnsInput) => ({ body: data }),
+				select: (data: any) => data as { success: boolean },
+				invalidates: ["boards"],
+				refresh: false,
+			},
+		},
+	},
+
+	tasks: {
+		queries: {},
+		mutations: {
+			create: {
+				path: "@post/tasks",
+				method: "POST" as const,
+				input: (data: CreateTaskInput) => ({ body: data }),
+				select: (data: any) => data as SerializedTask,
+				invalidates: ["boards"],
+				refresh: false,
+			},
+			update: {
+				path: "@put/tasks/:id",
+				method: "PUT" as const,
+				input: ({ id, data }: UpdateTaskInput) => ({
+					params: { id },
+					body: data,
+				}),
+				select: (data: any) => data as SerializedTask,
+				invalidates: ["boards"],
+				refresh: false,
+			},
+			delete: {
+				path: "@delete/tasks/:id",
+				method: "DELETE" as const,
+				input: (id: string) => ({ params: { id } }),
+				select: (data: any) => data as { success: boolean },
+				invalidates: ["boards"],
+				refresh: false,
 			},
-		}),
-	});
+			move: {
+				path: "@post/tasks/move",
+				method: "POST" as const,
+				input: (data: MoveTaskInput) => ({ body: data }),
+				select: (data: any) => data as SerializedTask,
+				invalidates: ["boards"],
+				refresh: false,
+			},
+			reorder: {
+				path: "@post/tasks/reorder",
+				method: "POST" as const,
+				input: (data: ReorderTasksInput) => ({ body: data }),
+				select: (data: any) => data as { success: boolean },
+				invalidates: ["boards"],
+				refresh: false,
+			},
+		},
+	},
+} satisfies ResourcesDeclaration;
+
+const kanbanQueryResources = {
+	boards: kanbanResources.boards,
+} satisfies ResourcesDeclaration;
+
+export function createKanbanQueryKeys(
+	client: ReturnType<typeof createApiClient<KanbanApiRouter>>,
+	headers?: HeadersInit,
+) {
+	return createResourceQueryKeys(client, kanbanQueryResources, headers);
 }

From d31b0fdee84f9e8ecaf80c124e84adcf6e7cd78c Mon Sep 17 00:00:00 2001
From: olliethedev <5933733+olliethedev@users.noreply.github.com>
Date: Wed, 19 Aug 2026 22:26:01 +0000
Subject: [PATCH 2/3] fix(kanban): avoid empty permission menus

---
 packages/stack/registry/btst-kanban.json      |   4 +-
 .../kanban/__tests__/client-sweep.test.tsx    |  41 +++++++
 .../components/pages/board-page.internal.tsx  | 114 ++++++++++--------
 .../components/shared/column-content.tsx      | 104 +++++++++-------
 4 files changed, 165 insertions(+), 98 deletions(-)

diff --git a/packages/stack/registry/btst-kanban.json b/packages/stack/registry/btst-kanban.json
index 68916588..af9ca4b0 100644
--- a/packages/stack/registry/btst-kanban.json
+++ b/packages/stack/registry/btst-kanban.json
@@ -91,7 +91,7 @@
     {
       "path": "btst/kanban/client/components/pages/board-page.internal.tsx",
       "type": "registry:component",
-      "content": "\"use client\";\n\nimport { useState, useCallback, useMemo, useEffect } from \"react\";\nimport { ArrowLeft, Plus, Settings, Trash2, Pencil } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n\tDropdownMenu,\n\tDropdownMenuContent,\n\tDropdownMenuItem,\n\tDropdownMenuSeparator,\n\tDropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport {\n\tDialog,\n\tDialogContent,\n\tDialogDescription,\n\tDialogHeader,\n\tDialogTitle,\n} from \"@/components/ui/dialog\";\nimport {\n\tAlertDialog,\n\tAlertDialogAction,\n\tAlertDialogCancel,\n\tAlertDialogContent,\n\tAlertDialogDescription,\n\tAlertDialogFooter,\n\tAlertDialogHeader,\n\tAlertDialogTitle,\n} from \"@/components/ui/alert-dialog\";\nimport {\n\tuseSuspenseBoard,\n\tuseBoardMutations,\n\tuseColumnMutations,\n\tuseTaskMutations,\n} from \"@btst/stack/plugins/kanban/client/hooks\";\nimport {\n\tCanAccess,\n\tuseCan,\n\tuseNotify,\n\tusePluginOverrides,\n\tuseTranslate,\n} from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\nimport { KanbanBoard } from \"../shared/kanban-board\";\nimport { ColumnForm } from \"../forms/column-form\";\nimport { BoardForm } from \"../forms/board-form\";\nimport { TaskForm } from \"../forms/task-form\";\nimport { PageWrapper } from \"../shared/page-wrapper\";\nimport { EmptyState } from \"../shared/empty-state\";\nimport type { SerializedTask, SerializedColumn } from \"../../../types\";\n\ninterface BoardPageProps {\n\tboardId: string;\n}\n\ntype ModalState =\n\t| { type: \"none\" }\n\t| { type: \"addColumn\" }\n\t| { type: \"editColumn\"; columnId: string }\n\t| { type: \"deleteColumn\"; columnId: string }\n\t| { type: \"editBoard\" }\n\t| { type: \"deleteBoard\" }\n\t| { type: \"addTask\"; columnId: string }\n\t| { type: \"editTask\"; columnId: string; taskId: string };\n\nexport function BoardPage({ boardId }: BoardPageProps) {\n\tconst t = useTranslate();\n\tconst notify = useNotify();\n\tconst { data: board, error, refetch, isFetching } = useSuspenseBoard(boardId);\n\n\t// Suspense hooks only throw on initial fetch, not refetch failures\n\tif (error && !isFetching) {\n\t\tthrow error;\n\t}\n\n\tconst {\n\t\tLink: OverrideLink,\n\t\tnavigate: overrideNavigate,\n\t\ttaskDetailBottomSlot,\n\t\tlocalization,\n\t} = usePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst navigate =\n\t\toverrideNavigate ||\n\t\t((path: string) => {\n\t\t\twindow.location.href = path;\n\t\t});\n\tconst Link = OverrideLink || \"a\";\n\n\tconst { deleteBoard, isDeleting } = useBoardMutations();\n\tconst { deleteColumn, reorderColumns } = useColumnMutations();\n\tconst { deleteTask, moveTask, reorderTasks } = useTaskMutations();\n\tconst { can: canMoveColumns, isPending: isCheckingColumnMove } = useCan({\n\t\tresource: \"kanban:column\",\n\t\taction: \"update\",\n\t\tparams: { boardId },\n\t});\n\tconst { can: canMoveTasks, isPending: isCheckingTaskMove } = useCan({\n\t\tresource: \"kanban:task\",\n\t\taction: \"update\",\n\t\tparams: { boardId },\n\t});\n\n\tconst [modalState, setModalState] = useState<ModalState>({ type: \"none\" });\n\n\t// Helper function to convert board columns to kanban state format\n\tconst computeKanbanData = useCallback(\n\t\t(\n\t\t\tcolumns: SerializedColumn[] | undefined,\n\t\t): Record<string, SerializedTask[]> => {\n\t\t\tif (!columns) return {};\n\t\t\treturn columns.reduce(\n\t\t\t\t(acc, column) => {\n\t\t\t\t\tacc[column.id] = column.tasks || [];\n\t\t\t\t\treturn acc;\n\t\t\t\t},\n\t\t\t\t{} as Record<string, SerializedTask[]>,\n\t\t\t);\n\t\t},\n\t\t[],\n\t);\n\n\t// Initialize kanbanState with data from board to avoid flash of empty state\n\t// Using lazy initializer ensures we have the correct state on first render\n\tconst [kanbanState, setKanbanState] = useState<\n\t\tRecord<string, SerializedTask[]>\n\t>(() => computeKanbanData(board?.columns));\n\n\t// Keep kanbanState in sync when server data changes (e.g., after refetch)\n\tconst serverKanbanData = useMemo(\n\t\t() => computeKanbanData(board?.columns),\n\t\t[board?.columns, computeKanbanData],\n\t);\n\n\tuseEffect(() => {\n\t\tsetKanbanState(serverKanbanData);\n\t}, [serverKanbanData]);\n\n\tconst closeModal = useCallback(() => {\n\t\tsetModalState({ type: \"none\" });\n\t}, []);\n\n\tconst handleDeleteBoard = useCallback(async () => {\n\t\ttry {\n\t\t\tawait deleteBoard(boardId);\n\t\t\tcloseModal();\n\t\t\t// Use both navigate and a fallback to ensure navigation works\n\t\t\t// Some frameworks may have issues with router.push after mutations\n\t\t\tnavigate(\"/pages/kanban\");\n\t\t\t// Fallback: if navigate doesn't work, use window.location\n\t\t\tif (typeof window !== \"undefined\") {\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t// Only redirect if we're still on the same page after 100ms\n\t\t\t\t\tif (window.location.pathname.includes(boardId)) {\n\t\t\t\t\t\twindow.location.href = \"/pages/kanban\";\n\t\t\t\t\t}\n\t\t\t\t}, 100);\n\t\t\t}\n\t\t} catch (error) {\n\t\t\tconst message =\n\t\t\t\terror instanceof Error\n\t\t\t\t\t? error.message\n\t\t\t\t\t: (localization?.deleteBoardError ??\n\t\t\t\t\t\tt(\"kanban.common.deleteBoardError\", \"Failed to delete board\"));\n\t\t\tnotify.error(message);\n\t\t}\n\t}, [\n\t\tdeleteBoard,\n\t\tboardId,\n\t\tnavigate,\n\t\tcloseModal,\n\t\tlocalization?.deleteBoardError,\n\t\tnotify,\n\t\tt,\n\t]);\n\n\tconst handleKanbanChange = useCallback(\n\t\tasync (newData: Record<string, SerializedTask[]>) => {\n\t\t\tif (!board) return;\n\n\t\t\t// Capture current state for change detection\n\t\t\t// Note: We use a functional update to get the actual current state,\n\t\t\t// avoiding stale closure issues with rapid successive operations\n\t\t\tlet previousState: Record<string, SerializedTask[]> = {};\n\t\t\tsetKanbanState((current) => {\n\t\t\t\tpreviousState = current;\n\t\t\t\treturn newData;\n\t\t\t});\n\n\t\t\ttry {\n\t\t\t\t// Detect column reorder\n\t\t\t\tconst oldKeys = Object.keys(previousState);\n\t\t\t\tconst newKeys = Object.keys(newData);\n\t\t\t\tconst isColumnMove =\n\t\t\t\t\toldKeys.length === newKeys.length &&\n\t\t\t\t\toldKeys.join(\"\") !== newKeys.join(\"\");\n\n\t\t\t\tif (isColumnMove) {\n\t\t\t\t\t// Column reorder - use atomic batch endpoint with transaction support\n\t\t\t\t\tawait reorderColumns(board.id, newKeys);\n\t\t\t\t} else {\n\t\t\t\t\t// Task changes - detect cross-column moves and within-column reorders\n\t\t\t\t\tconst crossColumnMoves: Array<{\n\t\t\t\t\t\ttaskId: string;\n\t\t\t\t\t\ttargetColumnId: string;\n\t\t\t\t\t\ttargetOrder: number;\n\t\t\t\t\t}> = [];\n\t\t\t\t\tconst columnsToReorder: Map<string, string[]> = new Map();\n\t\t\t\t\tconst targetColumnsOfCrossMove = new Set<string>();\n\n\t\t\t\t\tfor (const [columnId, tasks] of Object.entries(newData)) {\n\t\t\t\t\t\tconst oldTasks = previousState[columnId] || [];\n\t\t\t\t\t\tlet hasOrderChanges = false;\n\n\t\t\t\t\t\tfor (let i = 0; i < tasks.length; i++) {\n\t\t\t\t\t\t\tconst task = tasks[i];\n\t\t\t\t\t\t\tif (!task) continue;\n\n\t\t\t\t\t\t\tif (task.columnId !== columnId) {\n\t\t\t\t\t\t\t\t// Task moved from another column - needs cross-column move\n\t\t\t\t\t\t\t\tcrossColumnMoves.push({\n\t\t\t\t\t\t\t\t\ttaskId: task.id,\n\t\t\t\t\t\t\t\t\ttargetColumnId: columnId,\n\t\t\t\t\t\t\t\t\ttargetOrder: i,\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\ttargetColumnsOfCrossMove.add(columnId);\n\t\t\t\t\t\t\t} else if (task.order !== i) {\n\t\t\t\t\t\t\t\t// Task order changed within same column\n\t\t\t\t\t\t\t\thasOrderChanges = true;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Check if tasks were removed from this column (moved elsewhere)\n\t\t\t\t\t\tconst newTaskIds = new Set(tasks.map((t) => t.id));\n\t\t\t\t\t\tconst tasksRemoved = oldTasks.some((t) => !newTaskIds.has(t.id));\n\n\t\t\t\t\t\t// If order changes within column (not a target of cross-column move),\n\t\t\t\t\t\t// use atomic reorder\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\thasOrderChanges &&\n\t\t\t\t\t\t\t!targetColumnsOfCrossMove.has(columnId) &&\n\t\t\t\t\t\t\t!tasksRemoved\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tcolumnsToReorder.set(\n\t\t\t\t\t\t\t\tcolumnId,\n\t\t\t\t\t\t\t\ttasks.map((t) => t.id),\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// Handle cross-column moves first (these need individual moveTask calls)\n\t\t\t\t\tfor (const move of crossColumnMoves) {\n\t\t\t\t\t\tawait moveTask(move.taskId, move.targetColumnId, move.targetOrder);\n\t\t\t\t\t}\n\n\t\t\t\t\t// Then handle within-column reorders atomically\n\t\t\t\t\tfor (const [columnId, taskIds] of columnsToReorder) {\n\t\t\t\t\t\tawait reorderTasks(columnId, taskIds);\n\t\t\t\t\t}\n\n\t\t\t\t\t// Reorder target columns of cross-column moves to fix order collisions\n\t\t\t\t\t// The moveTask only sets the moved task's order, so other tasks need reordering\n\t\t\t\t\tfor (const targetColumnId of targetColumnsOfCrossMove) {\n\t\t\t\t\t\tconst tasks = newData[targetColumnId];\n\t\t\t\t\t\tif (tasks) {\n\t\t\t\t\t\t\tawait reorderTasks(\n\t\t\t\t\t\t\t\ttargetColumnId,\n\t\t\t\t\t\t\t\ttasks.map((t) => t.id),\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// Sync with server after successful mutations\n\t\t\t\trefetch();\n\t\t\t} catch (error) {\n\t\t\t\t// On error, refetch from server to get the authoritative state.\n\t\t\t\t// We avoid manual rollback to previousState because with rapid successive\n\t\t\t\t// operations, the captured previousState may be stale - a later operation\n\t\t\t\t// may have already updated the state, and reverting would incorrectly\n\t\t\t\t// undo that operation too. The server is the source of truth.\n\t\t\t\trefetch();\n\t\t\t\t// Re-throw so the caller's error handling can surface it\n\t\t\t\tthrow error;\n\t\t\t}\n\t\t},\n\t\t[board, reorderColumns, moveTask, reorderTasks, refetch],\n\t);\n\n\tconst orderedColumns = useMemo(() => {\n\t\tif (!board?.columns) return [];\n\t\tconst columnMap = new Map(board.columns.map((c) => [c.id, c]));\n\t\treturn Object.keys(kanbanState)\n\t\t\t.map((columnId) => {\n\t\t\t\tconst column = columnMap.get(columnId);\n\t\t\t\tif (!column) return null;\n\t\t\t\treturn {\n\t\t\t\t\t...column,\n\t\t\t\t\ttasks: kanbanState[columnId] || [],\n\t\t\t\t};\n\t\t\t})\n\t\t\t.filter(\n\t\t\t\t(c): c is SerializedColumn & { tasks: SerializedTask[] } => c !== null,\n\t\t\t);\n\t}, [board?.columns, kanbanState]);\n\n\t// Board not found - only shown after data has loaded (not during loading)\n\tif (!board) {\n\t\treturn (\n\t\t\t<EmptyState\n\t\t\t\ttitle={\n\t\t\t\t\tlocalization?.boardNotFound ??\n\t\t\t\t\tt(\"kanban.list.boardNotFound\", \"Board not found\")\n\t\t\t\t}\n\t\t\t\tdescription={\n\t\t\t\t\tlocalization?.boardNotFoundDescription ??\n\t\t\t\t\tt(\n\t\t\t\t\t\t\"kanban.list.boardNotFoundDescription\",\n\t\t\t\t\t\t\"The board you're looking for doesn't exist or you don't have access to it.\",\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t\taction={\n\t\t\t\t\t<Button onClick={() => navigate(\"/pages/kanban\")}>\n\t\t\t\t\t\t<ArrowLeft className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t{localization?.backToBoards ??\n\t\t\t\t\t\t\tt(\"kanban.common.backToBoards\", \"Back to Boards\")}\n\t\t\t\t\t</Button>\n\t\t\t\t}\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<PageWrapper\n\t\t\tdata-testid=\"board-page\"\n\t\t\tclassName=\"flex flex-col items-center\"\n\t\t>\n\t\t\t<div className=\"w-full flex items-center justify-between mb-8\">\n\t\t\t\t<div className=\"flex items-center gap-4\">\n\t\t\t\t\t<Link\n\t\t\t\t\t\thref=\"/pages/kanban\"\n\t\t\t\t\t\tclassName=\"text-muted-foreground hover:text-foreground\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<ArrowLeft className=\"h-5 w-5\" />\n\t\t\t\t\t</Link>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<h1 className=\"text-3xl font-bold\" data-testid=\"page-header\">\n\t\t\t\t\t\t\t{board.name}\n\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t{board.description && (\n\t\t\t\t\t\t\t<p className=\"text-muted-foreground mt-1\">{board.description}</p>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<DropdownMenu>\n\t\t\t\t\t<DropdownMenuTrigger asChild>\n\t\t\t\t\t\t<Button variant=\"outline\">\n\t\t\t\t\t\t\t<Settings className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t{localization?.actions ?? t(\"kanban.common.actions\", \"Actions\")}\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</DropdownMenuTrigger>\n\t\t\t\t\t<DropdownMenuContent align=\"end\">\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:column\"\n\t\t\t\t\t\t\taction=\"create\"\n\t\t\t\t\t\t\tparams={{ boardId }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\tonClick={() => setModalState({ type: \"addColumn\" })}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.addColumn ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.list.addColumn\", \"Add Column\")}\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:board\"\n\t\t\t\t\t\t\taction=\"update\"\n\t\t\t\t\t\t\tparams={{ id: boardId }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\tonClick={() => setModalState({ type: \"editBoard\" })}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Pencil className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.editBoard ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.list.editBoard\", \"Edit Board\")}\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t\t<DropdownMenuSeparator />\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:board\"\n\t\t\t\t\t\t\taction=\"delete\"\n\t\t\t\t\t\t\tparams={{ id: boardId }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\tonClick={() => setModalState({ type: \"deleteBoard\" })}\n\t\t\t\t\t\t\t\tclassName=\"text-red-600 focus:text-red-600\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Trash2 className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.deleteBoard ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.forms.deleteBoard\", \"Delete Board\")}\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t</DropdownMenuContent>\n\t\t\t\t</DropdownMenu>\n\t\t\t</div>\n\n\t\t\t{orderedColumns.length > 0 ? (\n\t\t\t\t<KanbanBoard\n\t\t\t\t\tboardId={boardId}\n\t\t\t\t\tcolumns={orderedColumns}\n\t\t\t\t\tkanbanState={kanbanState}\n\t\t\t\t\tcanMoveColumns={!isCheckingColumnMove && canMoveColumns}\n\t\t\t\t\tcanMoveTasks={!isCheckingTaskMove && canMoveTasks}\n\t\t\t\t\tonKanbanChange={handleKanbanChange}\n\t\t\t\t\tonAddTask={(columnId) => setModalState({ type: \"addTask\", columnId })}\n\t\t\t\t\tonEditTask={(columnId, taskId) =>\n\t\t\t\t\t\tsetModalState({ type: \"editTask\", columnId, taskId })\n\t\t\t\t\t}\n\t\t\t\t\tonEditColumn={(columnId) =>\n\t\t\t\t\t\tsetModalState({ type: \"editColumn\", columnId })\n\t\t\t\t\t}\n\t\t\t\t\tonDeleteColumn={(columnId) =>\n\t\t\t\t\t\tsetModalState({ type: \"deleteColumn\", columnId })\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<EmptyState\n\t\t\t\t\ttitle={\n\t\t\t\t\t\tlocalization?.noColumns ??\n\t\t\t\t\t\tt(\"kanban.common.noColumns\", \"No columns yet\")\n\t\t\t\t\t}\n\t\t\t\t\tdescription={\n\t\t\t\t\t\tlocalization?.noColumnsDescription ??\n\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\"kanban.list.noColumnsDescription\",\n\t\t\t\t\t\t\t\"Create your first column to start organizing tasks.\",\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\taction={\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:column\"\n\t\t\t\t\t\t\taction=\"create\"\n\t\t\t\t\t\t\tparams={{ boardId }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Button onClick={() => setModalState({ type: \"addColumn\" })}>\n\t\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.addColumn ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.list.addColumn\", \"Add Column\")}\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{/* Add Column Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"addColumn\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent>\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>\n\t\t\t\t\t\t\t{localization?.addColumn ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.addColumn\", \"Add Column\")}\n\t\t\t\t\t\t</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\t{localization?.addColumnDescription ??\n\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\"kanban.list.addColumnDescription\",\n\t\t\t\t\t\t\t\t\t\"Add a new column to this board.\",\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t<ColumnForm\n\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\tonSuccess={closeModal}\n\t\t\t\t\t/>\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Edit Column Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"editColumn\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent>\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>\n\t\t\t\t\t\t\t{localization?.editColumn ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.editColumn\", \"Edit Column\")}\n\t\t\t\t\t\t</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\t{localization?.editColumnDescription ??\n\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\"kanban.list.editColumnDescription\",\n\t\t\t\t\t\t\t\t\t\"Update the column details.\",\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t{modalState.type === \"editColumn\" && (\n\t\t\t\t\t\t<ColumnForm\n\t\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\t\tcolumnId={modalState.columnId}\n\t\t\t\t\t\t\tcolumn={board.columns?.find((c) => c.id === modalState.columnId)}\n\t\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\t\tonSuccess={closeModal}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Delete Column Modal */}\n\t\t\t<AlertDialog\n\t\t\t\topen={modalState.type === \"deleteColumn\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<AlertDialogContent>\n\t\t\t\t\t<AlertDialogHeader>\n\t\t\t\t\t\t<AlertDialogTitle>\n\t\t\t\t\t\t\t{localization?.deleteColumn ??\n\t\t\t\t\t\t\t\tt(\"kanban.forms.deleteColumn\", \"Delete Column\")}\n\t\t\t\t\t\t</AlertDialogTitle>\n\t\t\t\t\t\t<AlertDialogDescription>\n\t\t\t\t\t\t\t{localization?.deleteColumnConfirm ??\n\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\"kanban.forms.deleteColumnConfirm\",\n\t\t\t\t\t\t\t\t\t\"Are you sure you want to delete this column? All tasks in this column will be permanently removed.\",\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</AlertDialogDescription>\n\t\t\t\t\t</AlertDialogHeader>\n\t\t\t\t\t<AlertDialogFooter>\n\t\t\t\t\t\t<AlertDialogCancel>\n\t\t\t\t\t\t\t{localization?.cancel ?? t(\"kanban.common.cancel\", \"Cancel\")}\n\t\t\t\t\t\t</AlertDialogCancel>\n\t\t\t\t\t\t<AlertDialogAction\n\t\t\t\t\t\t\tonClick={async () => {\n\t\t\t\t\t\t\t\tif (modalState.type === \"deleteColumn\") {\n\t\t\t\t\t\t\t\t\ttry {\n\t\t\t\t\t\t\t\t\t\tawait deleteColumn(modalState.columnId);\n\t\t\t\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t\t\t\t} catch (error) {\n\t\t\t\t\t\t\t\t\t\tconst message =\n\t\t\t\t\t\t\t\t\t\t\terror instanceof Error\n\t\t\t\t\t\t\t\t\t\t\t\t? error.message\n\t\t\t\t\t\t\t\t\t\t\t\t: (localization?.deleteColumnError ??\n\t\t\t\t\t\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"kanban.common.deleteColumnError\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"Failed to delete column\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t));\n\t\t\t\t\t\t\t\t\t\tnotify.error(message);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tclassName=\"bg-red-600 hover:bg-red-700\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{localization?.delete ?? t(\"kanban.common.delete\", \"Delete\")}\n\t\t\t\t\t\t</AlertDialogAction>\n\t\t\t\t\t</AlertDialogFooter>\n\t\t\t\t</AlertDialogContent>\n\t\t\t</AlertDialog>\n\n\t\t\t{/* Edit Board Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"editBoard\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent>\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>\n\t\t\t\t\t\t\t{localization?.editBoard ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.editBoard\", \"Edit Board\")}\n\t\t\t\t\t\t</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\t{localization?.editBoardDescription ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.editBoardDescription\", \"Update board details.\")}\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t<BoardForm\n\t\t\t\t\t\tboard={board}\n\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\tonSuccess={closeModal}\n\t\t\t\t\t/>\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Delete Board Modal */}\n\t\t\t<AlertDialog\n\t\t\t\topen={modalState.type === \"deleteBoard\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<AlertDialogContent>\n\t\t\t\t\t<AlertDialogHeader>\n\t\t\t\t\t\t<AlertDialogTitle>\n\t\t\t\t\t\t\t{localization?.deleteBoard ??\n\t\t\t\t\t\t\t\tt(\"kanban.forms.deleteBoard\", \"Delete Board\")}\n\t\t\t\t\t\t</AlertDialogTitle>\n\t\t\t\t\t\t<AlertDialogDescription>\n\t\t\t\t\t\t\t{localization?.deleteBoardConfirm ??\n\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\"kanban.forms.deleteBoardConfirm\",\n\t\t\t\t\t\t\t\t\t\"Are you sure you want to delete this board? This action cannot be undone. All columns and tasks will be permanently removed.\",\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</AlertDialogDescription>\n\t\t\t\t\t</AlertDialogHeader>\n\t\t\t\t\t<AlertDialogFooter>\n\t\t\t\t\t\t<AlertDialogCancel>\n\t\t\t\t\t\t\t{localization?.cancel ?? t(\"kanban.common.cancel\", \"Cancel\")}\n\t\t\t\t\t\t</AlertDialogCancel>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tonClick={handleDeleteBoard}\n\t\t\t\t\t\t\tdisabled={isDeleting}\n\t\t\t\t\t\t\tclassName=\"bg-red-600 hover:bg-red-700\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{isDeleting\n\t\t\t\t\t\t\t\t? (localization?.deleting ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.common.deleting\", \"Deleting...\"))\n\t\t\t\t\t\t\t\t: (localization?.delete ?? t(\"kanban.common.delete\", \"Delete\"))}\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</AlertDialogFooter>\n\t\t\t\t</AlertDialogContent>\n\t\t\t</AlertDialog>\n\n\t\t\t{/* Add Task Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"addTask\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent className=\"max-w-3xl! max-h-screen overflow-y-auto\">\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>\n\t\t\t\t\t\t\t{localization?.addTask ?? t(\"kanban.list.addTask\", \"Add Task\")}\n\t\t\t\t\t\t</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\t{localization?.addTaskDescription ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.addTaskDescription\", \"Create a new task.\")}\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t{modalState.type === \"addTask\" && (\n\t\t\t\t\t\t<TaskForm\n\t\t\t\t\t\t\tcolumnId={modalState.columnId}\n\t\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\t\tcolumns={board.columns || []}\n\t\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\t\tonSuccess={closeModal}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Edit Task Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"editTask\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent className=\"max-w-3xl! max-h-screen overflow-y-auto\">\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>\n\t\t\t\t\t\t\t{localization?.editTask ?? t(\"kanban.list.editTask\", \"Edit Task\")}\n\t\t\t\t\t\t</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\t{localization?.editTaskDescription ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.editTaskDescription\", \"Update task details.\")}\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t{modalState.type === \"editTask\" && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<TaskForm\n\t\t\t\t\t\t\t\tcolumnId={modalState.columnId}\n\t\t\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\t\t\ttaskId={modalState.taskId}\n\t\t\t\t\t\t\t\ttask={board.columns\n\t\t\t\t\t\t\t\t\t?.find((c) => c.id === modalState.columnId)\n\t\t\t\t\t\t\t\t\t?.tasks?.find((t) => t.id === modalState.taskId)}\n\t\t\t\t\t\t\t\tcolumns={board.columns || []}\n\t\t\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\t\t\tonSuccess={closeModal}\n\t\t\t\t\t\t\t\tonDelete={async () => {\n\t\t\t\t\t\t\t\t\ttry {\n\t\t\t\t\t\t\t\t\t\tawait deleteTask(modalState.taskId);\n\t\t\t\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t\t\t\t} catch (error) {\n\t\t\t\t\t\t\t\t\t\tconst message =\n\t\t\t\t\t\t\t\t\t\t\terror instanceof Error\n\t\t\t\t\t\t\t\t\t\t\t\t? error.message\n\t\t\t\t\t\t\t\t\t\t\t\t: (localization?.deleteTaskError ??\n\t\t\t\t\t\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"kanban.common.deleteTaskError\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"Failed to delete task\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t));\n\t\t\t\t\t\t\t\t\t\tnotify.error(message);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{taskDetailBottomSlot &&\n\t\t\t\t\t\t\t\t(() => {\n\t\t\t\t\t\t\t\t\tconst task = board.columns\n\t\t\t\t\t\t\t\t\t\t?.find((c) => c.id === modalState.columnId)\n\t\t\t\t\t\t\t\t\t\t?.tasks?.find((t) => t.id === modalState.taskId);\n\t\t\t\t\t\t\t\t\treturn task ? (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"mt-4 pt-4 border-t\"\n\t\t\t\t\t\t\t\t\t\t\tdata-testid=\"task-detail-bottom-slot\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{taskDetailBottomSlot(task)}\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t) : null;\n\t\t\t\t\t\t\t\t})()}\n\t\t\t\t\t\t</>\n\t\t\t\t\t)}\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\t\t</PageWrapper>\n\t);\n}\n",
+      "content": "\"use client\";\n\nimport { useState, useCallback, useMemo, useEffect } from \"react\";\nimport { ArrowLeft, Plus, Settings, Trash2, Pencil } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n\tDropdownMenu,\n\tDropdownMenuContent,\n\tDropdownMenuItem,\n\tDropdownMenuSeparator,\n\tDropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport {\n\tDialog,\n\tDialogContent,\n\tDialogDescription,\n\tDialogHeader,\n\tDialogTitle,\n} from \"@/components/ui/dialog\";\nimport {\n\tAlertDialog,\n\tAlertDialogAction,\n\tAlertDialogCancel,\n\tAlertDialogContent,\n\tAlertDialogDescription,\n\tAlertDialogFooter,\n\tAlertDialogHeader,\n\tAlertDialogTitle,\n} from \"@/components/ui/alert-dialog\";\nimport {\n\tuseSuspenseBoard,\n\tuseBoardMutations,\n\tuseColumnMutations,\n\tuseTaskMutations,\n} from \"@btst/stack/plugins/kanban/client/hooks\";\nimport {\n\tCanAccess,\n\tuseCan,\n\tuseNotify,\n\tusePluginOverrides,\n\tuseTranslate,\n} from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\nimport { KanbanBoard } from \"../shared/kanban-board\";\nimport { ColumnForm } from \"../forms/column-form\";\nimport { BoardForm } from \"../forms/board-form\";\nimport { TaskForm } from \"../forms/task-form\";\nimport { PageWrapper } from \"../shared/page-wrapper\";\nimport { EmptyState } from \"../shared/empty-state\";\nimport type { SerializedTask, SerializedColumn } from \"../../../types\";\n\ninterface BoardPageProps {\n\tboardId: string;\n}\n\ntype ModalState =\n\t| { type: \"none\" }\n\t| { type: \"addColumn\" }\n\t| { type: \"editColumn\"; columnId: string }\n\t| { type: \"deleteColumn\"; columnId: string }\n\t| { type: \"editBoard\" }\n\t| { type: \"deleteBoard\" }\n\t| { type: \"addTask\"; columnId: string }\n\t| { type: \"editTask\"; columnId: string; taskId: string };\n\nexport function BoardPage({ boardId }: BoardPageProps) {\n\tconst t = useTranslate();\n\tconst notify = useNotify();\n\tconst { data: board, error, refetch, isFetching } = useSuspenseBoard(boardId);\n\n\t// Suspense hooks only throw on initial fetch, not refetch failures\n\tif (error && !isFetching) {\n\t\tthrow error;\n\t}\n\n\tconst {\n\t\tLink: OverrideLink,\n\t\tnavigate: overrideNavigate,\n\t\ttaskDetailBottomSlot,\n\t\tlocalization,\n\t} = usePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst navigate =\n\t\toverrideNavigate ||\n\t\t((path: string) => {\n\t\t\twindow.location.href = path;\n\t\t});\n\tconst Link = OverrideLink || \"a\";\n\n\tconst { deleteBoard, isDeleting } = useBoardMutations();\n\tconst { deleteColumn, reorderColumns } = useColumnMutations();\n\tconst { deleteTask, moveTask, reorderTasks } = useTaskMutations();\n\tconst { can: canMoveColumns, isPending: isCheckingColumnMove } = useCan({\n\t\tresource: \"kanban:column\",\n\t\taction: \"update\",\n\t\tparams: { boardId },\n\t});\n\tconst { can: canMoveTasks, isPending: isCheckingTaskMove } = useCan({\n\t\tresource: \"kanban:task\",\n\t\taction: \"update\",\n\t\tparams: { boardId },\n\t});\n\tconst { can: canCreateColumn, isPending: isCheckingCreateColumn } = useCan({\n\t\tresource: \"kanban:column\",\n\t\taction: \"create\",\n\t\tparams: { boardId },\n\t});\n\tconst { can: canUpdateBoard, isPending: isCheckingUpdateBoard } = useCan({\n\t\tresource: \"kanban:board\",\n\t\taction: \"update\",\n\t\tparams: { id: boardId },\n\t});\n\tconst { can: canDeleteBoard, isPending: isCheckingDeleteBoard } = useCan({\n\t\tresource: \"kanban:board\",\n\t\taction: \"delete\",\n\t\tparams: { id: boardId },\n\t});\n\tconst showCreateColumn = !isCheckingCreateColumn && canCreateColumn;\n\tconst showUpdateBoard = !isCheckingUpdateBoard && canUpdateBoard;\n\tconst showDeleteBoard = !isCheckingDeleteBoard && canDeleteBoard;\n\tconst hasBoardActions =\n\t\tshowCreateColumn || showUpdateBoard || showDeleteBoard;\n\n\tconst [modalState, setModalState] = useState<ModalState>({ type: \"none\" });\n\n\t// Helper function to convert board columns to kanban state format\n\tconst computeKanbanData = useCallback(\n\t\t(\n\t\t\tcolumns: SerializedColumn[] | undefined,\n\t\t): Record<string, SerializedTask[]> => {\n\t\t\tif (!columns) return {};\n\t\t\treturn columns.reduce(\n\t\t\t\t(acc, column) => {\n\t\t\t\t\tacc[column.id] = column.tasks || [];\n\t\t\t\t\treturn acc;\n\t\t\t\t},\n\t\t\t\t{} as Record<string, SerializedTask[]>,\n\t\t\t);\n\t\t},\n\t\t[],\n\t);\n\n\t// Initialize kanbanState with data from board to avoid flash of empty state\n\t// Using lazy initializer ensures we have the correct state on first render\n\tconst [kanbanState, setKanbanState] = useState<\n\t\tRecord<string, SerializedTask[]>\n\t>(() => computeKanbanData(board?.columns));\n\n\t// Keep kanbanState in sync when server data changes (e.g., after refetch)\n\tconst serverKanbanData = useMemo(\n\t\t() => computeKanbanData(board?.columns),\n\t\t[board?.columns, computeKanbanData],\n\t);\n\n\tuseEffect(() => {\n\t\tsetKanbanState(serverKanbanData);\n\t}, [serverKanbanData]);\n\n\tconst closeModal = useCallback(() => {\n\t\tsetModalState({ type: \"none\" });\n\t}, []);\n\n\tconst handleDeleteBoard = useCallback(async () => {\n\t\ttry {\n\t\t\tawait deleteBoard(boardId);\n\t\t\tcloseModal();\n\t\t\t// Use both navigate and a fallback to ensure navigation works\n\t\t\t// Some frameworks may have issues with router.push after mutations\n\t\t\tnavigate(\"/pages/kanban\");\n\t\t\t// Fallback: if navigate doesn't work, use window.location\n\t\t\tif (typeof window !== \"undefined\") {\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t// Only redirect if we're still on the same page after 100ms\n\t\t\t\t\tif (window.location.pathname.includes(boardId)) {\n\t\t\t\t\t\twindow.location.href = \"/pages/kanban\";\n\t\t\t\t\t}\n\t\t\t\t}, 100);\n\t\t\t}\n\t\t} catch (error) {\n\t\t\tconst message =\n\t\t\t\terror instanceof Error\n\t\t\t\t\t? error.message\n\t\t\t\t\t: (localization?.deleteBoardError ??\n\t\t\t\t\t\tt(\"kanban.common.deleteBoardError\", \"Failed to delete board\"));\n\t\t\tnotify.error(message);\n\t\t}\n\t}, [\n\t\tdeleteBoard,\n\t\tboardId,\n\t\tnavigate,\n\t\tcloseModal,\n\t\tlocalization?.deleteBoardError,\n\t\tnotify,\n\t\tt,\n\t]);\n\n\tconst handleKanbanChange = useCallback(\n\t\tasync (newData: Record<string, SerializedTask[]>) => {\n\t\t\tif (!board) return;\n\n\t\t\t// Capture current state for change detection\n\t\t\t// Note: We use a functional update to get the actual current state,\n\t\t\t// avoiding stale closure issues with rapid successive operations\n\t\t\tlet previousState: Record<string, SerializedTask[]> = {};\n\t\t\tsetKanbanState((current) => {\n\t\t\t\tpreviousState = current;\n\t\t\t\treturn newData;\n\t\t\t});\n\n\t\t\ttry {\n\t\t\t\t// Detect column reorder\n\t\t\t\tconst oldKeys = Object.keys(previousState);\n\t\t\t\tconst newKeys = Object.keys(newData);\n\t\t\t\tconst isColumnMove =\n\t\t\t\t\toldKeys.length === newKeys.length &&\n\t\t\t\t\toldKeys.join(\"\") !== newKeys.join(\"\");\n\n\t\t\t\tif (isColumnMove) {\n\t\t\t\t\t// Column reorder - use atomic batch endpoint with transaction support\n\t\t\t\t\tawait reorderColumns(board.id, newKeys);\n\t\t\t\t} else {\n\t\t\t\t\t// Task changes - detect cross-column moves and within-column reorders\n\t\t\t\t\tconst crossColumnMoves: Array<{\n\t\t\t\t\t\ttaskId: string;\n\t\t\t\t\t\ttargetColumnId: string;\n\t\t\t\t\t\ttargetOrder: number;\n\t\t\t\t\t}> = [];\n\t\t\t\t\tconst columnsToReorder: Map<string, string[]> = new Map();\n\t\t\t\t\tconst targetColumnsOfCrossMove = new Set<string>();\n\n\t\t\t\t\tfor (const [columnId, tasks] of Object.entries(newData)) {\n\t\t\t\t\t\tconst oldTasks = previousState[columnId] || [];\n\t\t\t\t\t\tlet hasOrderChanges = false;\n\n\t\t\t\t\t\tfor (let i = 0; i < tasks.length; i++) {\n\t\t\t\t\t\t\tconst task = tasks[i];\n\t\t\t\t\t\t\tif (!task) continue;\n\n\t\t\t\t\t\t\tif (task.columnId !== columnId) {\n\t\t\t\t\t\t\t\t// Task moved from another column - needs cross-column move\n\t\t\t\t\t\t\t\tcrossColumnMoves.push({\n\t\t\t\t\t\t\t\t\ttaskId: task.id,\n\t\t\t\t\t\t\t\t\ttargetColumnId: columnId,\n\t\t\t\t\t\t\t\t\ttargetOrder: i,\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\ttargetColumnsOfCrossMove.add(columnId);\n\t\t\t\t\t\t\t} else if (task.order !== i) {\n\t\t\t\t\t\t\t\t// Task order changed within same column\n\t\t\t\t\t\t\t\thasOrderChanges = true;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Check if tasks were removed from this column (moved elsewhere)\n\t\t\t\t\t\tconst newTaskIds = new Set(tasks.map((t) => t.id));\n\t\t\t\t\t\tconst tasksRemoved = oldTasks.some((t) => !newTaskIds.has(t.id));\n\n\t\t\t\t\t\t// If order changes within column (not a target of cross-column move),\n\t\t\t\t\t\t// use atomic reorder\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\thasOrderChanges &&\n\t\t\t\t\t\t\t!targetColumnsOfCrossMove.has(columnId) &&\n\t\t\t\t\t\t\t!tasksRemoved\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tcolumnsToReorder.set(\n\t\t\t\t\t\t\t\tcolumnId,\n\t\t\t\t\t\t\t\ttasks.map((t) => t.id),\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// Handle cross-column moves first (these need individual moveTask calls)\n\t\t\t\t\tfor (const move of crossColumnMoves) {\n\t\t\t\t\t\tawait moveTask(move.taskId, move.targetColumnId, move.targetOrder);\n\t\t\t\t\t}\n\n\t\t\t\t\t// Then handle within-column reorders atomically\n\t\t\t\t\tfor (const [columnId, taskIds] of columnsToReorder) {\n\t\t\t\t\t\tawait reorderTasks(columnId, taskIds);\n\t\t\t\t\t}\n\n\t\t\t\t\t// Reorder target columns of cross-column moves to fix order collisions\n\t\t\t\t\t// The moveTask only sets the moved task's order, so other tasks need reordering\n\t\t\t\t\tfor (const targetColumnId of targetColumnsOfCrossMove) {\n\t\t\t\t\t\tconst tasks = newData[targetColumnId];\n\t\t\t\t\t\tif (tasks) {\n\t\t\t\t\t\t\tawait reorderTasks(\n\t\t\t\t\t\t\t\ttargetColumnId,\n\t\t\t\t\t\t\t\ttasks.map((t) => t.id),\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// Sync with server after successful mutations\n\t\t\t\trefetch();\n\t\t\t} catch (error) {\n\t\t\t\t// On error, refetch from server to get the authoritative state.\n\t\t\t\t// We avoid manual rollback to previousState because with rapid successive\n\t\t\t\t// operations, the captured previousState may be stale - a later operation\n\t\t\t\t// may have already updated the state, and reverting would incorrectly\n\t\t\t\t// undo that operation too. The server is the source of truth.\n\t\t\t\trefetch();\n\t\t\t\t// Re-throw so the caller's error handling can surface it\n\t\t\t\tthrow error;\n\t\t\t}\n\t\t},\n\t\t[board, reorderColumns, moveTask, reorderTasks, refetch],\n\t);\n\n\tconst orderedColumns = useMemo(() => {\n\t\tif (!board?.columns) return [];\n\t\tconst columnMap = new Map(board.columns.map((c) => [c.id, c]));\n\t\treturn Object.keys(kanbanState)\n\t\t\t.map((columnId) => {\n\t\t\t\tconst column = columnMap.get(columnId);\n\t\t\t\tif (!column) return null;\n\t\t\t\treturn {\n\t\t\t\t\t...column,\n\t\t\t\t\ttasks: kanbanState[columnId] || [],\n\t\t\t\t};\n\t\t\t})\n\t\t\t.filter(\n\t\t\t\t(c): c is SerializedColumn & { tasks: SerializedTask[] } => c !== null,\n\t\t\t);\n\t}, [board?.columns, kanbanState]);\n\n\t// Board not found - only shown after data has loaded (not during loading)\n\tif (!board) {\n\t\treturn (\n\t\t\t<EmptyState\n\t\t\t\ttitle={\n\t\t\t\t\tlocalization?.boardNotFound ??\n\t\t\t\t\tt(\"kanban.list.boardNotFound\", \"Board not found\")\n\t\t\t\t}\n\t\t\t\tdescription={\n\t\t\t\t\tlocalization?.boardNotFoundDescription ??\n\t\t\t\t\tt(\n\t\t\t\t\t\t\"kanban.list.boardNotFoundDescription\",\n\t\t\t\t\t\t\"The board you're looking for doesn't exist or you don't have access to it.\",\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t\taction={\n\t\t\t\t\t<Button onClick={() => navigate(\"/pages/kanban\")}>\n\t\t\t\t\t\t<ArrowLeft className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t{localization?.backToBoards ??\n\t\t\t\t\t\t\tt(\"kanban.common.backToBoards\", \"Back to Boards\")}\n\t\t\t\t\t</Button>\n\t\t\t\t}\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<PageWrapper\n\t\t\tdata-testid=\"board-page\"\n\t\t\tclassName=\"flex flex-col items-center\"\n\t\t>\n\t\t\t<div className=\"w-full flex items-center justify-between mb-8\">\n\t\t\t\t<div className=\"flex items-center gap-4\">\n\t\t\t\t\t<Link\n\t\t\t\t\t\thref=\"/pages/kanban\"\n\t\t\t\t\t\tclassName=\"text-muted-foreground hover:text-foreground\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<ArrowLeft className=\"h-5 w-5\" />\n\t\t\t\t\t</Link>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<h1 className=\"text-3xl font-bold\" data-testid=\"page-header\">\n\t\t\t\t\t\t\t{board.name}\n\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t{board.description && (\n\t\t\t\t\t\t\t<p className=\"text-muted-foreground mt-1\">{board.description}</p>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t{hasBoardActions && (\n\t\t\t\t\t<DropdownMenu>\n\t\t\t\t\t\t<DropdownMenuTrigger asChild>\n\t\t\t\t\t\t\t<Button variant=\"outline\">\n\t\t\t\t\t\t\t\t<Settings className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.actions ?? t(\"kanban.common.actions\", \"Actions\")}\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</DropdownMenuTrigger>\n\t\t\t\t\t\t<DropdownMenuContent align=\"end\">\n\t\t\t\t\t\t\t{showCreateColumn && (\n\t\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\t\tonClick={() => setModalState({ type: \"addColumn\" })}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t\t{localization?.addColumn ??\n\t\t\t\t\t\t\t\t\t\tt(\"kanban.list.addColumn\", \"Add Column\")}\n\t\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{showUpdateBoard && (\n\t\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\t\tonClick={() => setModalState({ type: \"editBoard\" })}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<Pencil className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t\t{localization?.editBoard ??\n\t\t\t\t\t\t\t\t\t\tt(\"kanban.list.editBoard\", \"Edit Board\")}\n\t\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{showDeleteBoard && (showCreateColumn || showUpdateBoard) && (\n\t\t\t\t\t\t\t\t<DropdownMenuSeparator />\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{showDeleteBoard && (\n\t\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\t\tonClick={() => setModalState({ type: \"deleteBoard\" })}\n\t\t\t\t\t\t\t\t\tclassName=\"text-red-600 focus:text-red-600\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<Trash2 className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t\t{localization?.deleteBoard ??\n\t\t\t\t\t\t\t\t\t\tt(\"kanban.forms.deleteBoard\", \"Delete Board\")}\n\t\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</DropdownMenuContent>\n\t\t\t\t\t</DropdownMenu>\n\t\t\t\t)}\n\t\t\t</div>\n\n\t\t\t{orderedColumns.length > 0 ? (\n\t\t\t\t<KanbanBoard\n\t\t\t\t\tboardId={boardId}\n\t\t\t\t\tcolumns={orderedColumns}\n\t\t\t\t\tkanbanState={kanbanState}\n\t\t\t\t\tcanMoveColumns={!isCheckingColumnMove && canMoveColumns}\n\t\t\t\t\tcanMoveTasks={!isCheckingTaskMove && canMoveTasks}\n\t\t\t\t\tonKanbanChange={handleKanbanChange}\n\t\t\t\t\tonAddTask={(columnId) => setModalState({ type: \"addTask\", columnId })}\n\t\t\t\t\tonEditTask={(columnId, taskId) =>\n\t\t\t\t\t\tsetModalState({ type: \"editTask\", columnId, taskId })\n\t\t\t\t\t}\n\t\t\t\t\tonEditColumn={(columnId) =>\n\t\t\t\t\t\tsetModalState({ type: \"editColumn\", columnId })\n\t\t\t\t\t}\n\t\t\t\t\tonDeleteColumn={(columnId) =>\n\t\t\t\t\t\tsetModalState({ type: \"deleteColumn\", columnId })\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<EmptyState\n\t\t\t\t\ttitle={\n\t\t\t\t\t\tlocalization?.noColumns ??\n\t\t\t\t\t\tt(\"kanban.common.noColumns\", \"No columns yet\")\n\t\t\t\t\t}\n\t\t\t\t\tdescription={\n\t\t\t\t\t\tlocalization?.noColumnsDescription ??\n\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\"kanban.list.noColumnsDescription\",\n\t\t\t\t\t\t\t\"Create your first column to start organizing tasks.\",\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\taction={\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:column\"\n\t\t\t\t\t\t\taction=\"create\"\n\t\t\t\t\t\t\tparams={{ boardId }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Button onClick={() => setModalState({ type: \"addColumn\" })}>\n\t\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.addColumn ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.list.addColumn\", \"Add Column\")}\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{/* Add Column Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"addColumn\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent>\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>\n\t\t\t\t\t\t\t{localization?.addColumn ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.addColumn\", \"Add Column\")}\n\t\t\t\t\t\t</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\t{localization?.addColumnDescription ??\n\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\"kanban.list.addColumnDescription\",\n\t\t\t\t\t\t\t\t\t\"Add a new column to this board.\",\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t<ColumnForm\n\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\tonSuccess={closeModal}\n\t\t\t\t\t/>\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Edit Column Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"editColumn\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent>\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>\n\t\t\t\t\t\t\t{localization?.editColumn ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.editColumn\", \"Edit Column\")}\n\t\t\t\t\t\t</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\t{localization?.editColumnDescription ??\n\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\"kanban.list.editColumnDescription\",\n\t\t\t\t\t\t\t\t\t\"Update the column details.\",\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t{modalState.type === \"editColumn\" && (\n\t\t\t\t\t\t<ColumnForm\n\t\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\t\tcolumnId={modalState.columnId}\n\t\t\t\t\t\t\tcolumn={board.columns?.find((c) => c.id === modalState.columnId)}\n\t\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\t\tonSuccess={closeModal}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Delete Column Modal */}\n\t\t\t<AlertDialog\n\t\t\t\topen={modalState.type === \"deleteColumn\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<AlertDialogContent>\n\t\t\t\t\t<AlertDialogHeader>\n\t\t\t\t\t\t<AlertDialogTitle>\n\t\t\t\t\t\t\t{localization?.deleteColumn ??\n\t\t\t\t\t\t\t\tt(\"kanban.forms.deleteColumn\", \"Delete Column\")}\n\t\t\t\t\t\t</AlertDialogTitle>\n\t\t\t\t\t\t<AlertDialogDescription>\n\t\t\t\t\t\t\t{localization?.deleteColumnConfirm ??\n\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\"kanban.forms.deleteColumnConfirm\",\n\t\t\t\t\t\t\t\t\t\"Are you sure you want to delete this column? All tasks in this column will be permanently removed.\",\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</AlertDialogDescription>\n\t\t\t\t\t</AlertDialogHeader>\n\t\t\t\t\t<AlertDialogFooter>\n\t\t\t\t\t\t<AlertDialogCancel>\n\t\t\t\t\t\t\t{localization?.cancel ?? t(\"kanban.common.cancel\", \"Cancel\")}\n\t\t\t\t\t\t</AlertDialogCancel>\n\t\t\t\t\t\t<AlertDialogAction\n\t\t\t\t\t\t\tonClick={async () => {\n\t\t\t\t\t\t\t\tif (modalState.type === \"deleteColumn\") {\n\t\t\t\t\t\t\t\t\ttry {\n\t\t\t\t\t\t\t\t\t\tawait deleteColumn(modalState.columnId);\n\t\t\t\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t\t\t\t} catch (error) {\n\t\t\t\t\t\t\t\t\t\tconst message =\n\t\t\t\t\t\t\t\t\t\t\terror instanceof Error\n\t\t\t\t\t\t\t\t\t\t\t\t? error.message\n\t\t\t\t\t\t\t\t\t\t\t\t: (localization?.deleteColumnError ??\n\t\t\t\t\t\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"kanban.common.deleteColumnError\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"Failed to delete column\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t));\n\t\t\t\t\t\t\t\t\t\tnotify.error(message);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tclassName=\"bg-red-600 hover:bg-red-700\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{localization?.delete ?? t(\"kanban.common.delete\", \"Delete\")}\n\t\t\t\t\t\t</AlertDialogAction>\n\t\t\t\t\t</AlertDialogFooter>\n\t\t\t\t</AlertDialogContent>\n\t\t\t</AlertDialog>\n\n\t\t\t{/* Edit Board Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"editBoard\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent>\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>\n\t\t\t\t\t\t\t{localization?.editBoard ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.editBoard\", \"Edit Board\")}\n\t\t\t\t\t\t</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\t{localization?.editBoardDescription ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.editBoardDescription\", \"Update board details.\")}\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t<BoardForm\n\t\t\t\t\t\tboard={board}\n\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\tonSuccess={closeModal}\n\t\t\t\t\t/>\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Delete Board Modal */}\n\t\t\t<AlertDialog\n\t\t\t\topen={modalState.type === \"deleteBoard\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<AlertDialogContent>\n\t\t\t\t\t<AlertDialogHeader>\n\t\t\t\t\t\t<AlertDialogTitle>\n\t\t\t\t\t\t\t{localization?.deleteBoard ??\n\t\t\t\t\t\t\t\tt(\"kanban.forms.deleteBoard\", \"Delete Board\")}\n\t\t\t\t\t\t</AlertDialogTitle>\n\t\t\t\t\t\t<AlertDialogDescription>\n\t\t\t\t\t\t\t{localization?.deleteBoardConfirm ??\n\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\"kanban.forms.deleteBoardConfirm\",\n\t\t\t\t\t\t\t\t\t\"Are you sure you want to delete this board? This action cannot be undone. All columns and tasks will be permanently removed.\",\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</AlertDialogDescription>\n\t\t\t\t\t</AlertDialogHeader>\n\t\t\t\t\t<AlertDialogFooter>\n\t\t\t\t\t\t<AlertDialogCancel>\n\t\t\t\t\t\t\t{localization?.cancel ?? t(\"kanban.common.cancel\", \"Cancel\")}\n\t\t\t\t\t\t</AlertDialogCancel>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tonClick={handleDeleteBoard}\n\t\t\t\t\t\t\tdisabled={isDeleting}\n\t\t\t\t\t\t\tclassName=\"bg-red-600 hover:bg-red-700\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{isDeleting\n\t\t\t\t\t\t\t\t? (localization?.deleting ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.common.deleting\", \"Deleting...\"))\n\t\t\t\t\t\t\t\t: (localization?.delete ?? t(\"kanban.common.delete\", \"Delete\"))}\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</AlertDialogFooter>\n\t\t\t\t</AlertDialogContent>\n\t\t\t</AlertDialog>\n\n\t\t\t{/* Add Task Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"addTask\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent className=\"max-w-3xl! max-h-screen overflow-y-auto\">\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>\n\t\t\t\t\t\t\t{localization?.addTask ?? t(\"kanban.list.addTask\", \"Add Task\")}\n\t\t\t\t\t\t</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\t{localization?.addTaskDescription ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.addTaskDescription\", \"Create a new task.\")}\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t{modalState.type === \"addTask\" && (\n\t\t\t\t\t\t<TaskForm\n\t\t\t\t\t\t\tcolumnId={modalState.columnId}\n\t\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\t\tcolumns={board.columns || []}\n\t\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\t\tonSuccess={closeModal}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\n\t\t\t{/* Edit Task Modal */}\n\t\t\t<Dialog\n\t\t\t\topen={modalState.type === \"editTask\"}\n\t\t\t\tonOpenChange={(open: boolean) => !open && closeModal()}\n\t\t\t>\n\t\t\t\t<DialogContent className=\"max-w-3xl! max-h-screen overflow-y-auto\">\n\t\t\t\t\t<DialogHeader>\n\t\t\t\t\t\t<DialogTitle>\n\t\t\t\t\t\t\t{localization?.editTask ?? t(\"kanban.list.editTask\", \"Edit Task\")}\n\t\t\t\t\t\t</DialogTitle>\n\t\t\t\t\t\t<DialogDescription>\n\t\t\t\t\t\t\t{localization?.editTaskDescription ??\n\t\t\t\t\t\t\t\tt(\"kanban.list.editTaskDescription\", \"Update task details.\")}\n\t\t\t\t\t\t</DialogDescription>\n\t\t\t\t\t</DialogHeader>\n\t\t\t\t\t{modalState.type === \"editTask\" && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<TaskForm\n\t\t\t\t\t\t\t\tcolumnId={modalState.columnId}\n\t\t\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\t\t\ttaskId={modalState.taskId}\n\t\t\t\t\t\t\t\ttask={board.columns\n\t\t\t\t\t\t\t\t\t?.find((c) => c.id === modalState.columnId)\n\t\t\t\t\t\t\t\t\t?.tasks?.find((t) => t.id === modalState.taskId)}\n\t\t\t\t\t\t\t\tcolumns={board.columns || []}\n\t\t\t\t\t\t\t\tonClose={closeModal}\n\t\t\t\t\t\t\t\tonSuccess={closeModal}\n\t\t\t\t\t\t\t\tonDelete={async () => {\n\t\t\t\t\t\t\t\t\ttry {\n\t\t\t\t\t\t\t\t\t\tawait deleteTask(modalState.taskId);\n\t\t\t\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t\t\t\t} catch (error) {\n\t\t\t\t\t\t\t\t\t\tconst message =\n\t\t\t\t\t\t\t\t\t\t\terror instanceof Error\n\t\t\t\t\t\t\t\t\t\t\t\t? error.message\n\t\t\t\t\t\t\t\t\t\t\t\t: (localization?.deleteTaskError ??\n\t\t\t\t\t\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"kanban.common.deleteTaskError\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"Failed to delete task\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t));\n\t\t\t\t\t\t\t\t\t\tnotify.error(message);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{taskDetailBottomSlot &&\n\t\t\t\t\t\t\t\t(() => {\n\t\t\t\t\t\t\t\t\tconst task = board.columns\n\t\t\t\t\t\t\t\t\t\t?.find((c) => c.id === modalState.columnId)\n\t\t\t\t\t\t\t\t\t\t?.tasks?.find((t) => t.id === modalState.taskId);\n\t\t\t\t\t\t\t\t\treturn task ? (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"mt-4 pt-4 border-t\"\n\t\t\t\t\t\t\t\t\t\t\tdata-testid=\"task-detail-bottom-slot\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{taskDetailBottomSlot(task)}\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t) : null;\n\t\t\t\t\t\t\t\t})()}\n\t\t\t\t\t\t</>\n\t\t\t\t\t)}\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\t\t</PageWrapper>\n\t);\n}\n",
       "target": "src/components/btst/kanban/client/components/pages/board-page.internal.tsx"
     },
     {
@@ -127,7 +127,7 @@
     {
       "path": "btst/kanban/client/components/shared/column-content.tsx",
       "type": "registry:component",
-      "content": "\"use client\";\n\nimport { memo } from \"react\";\nimport { GripVertical, MoreVertical, Pencil, Plus, Trash2 } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Badge } from \"@/components/ui/badge\";\nimport * as Kanban from \"@/components/ui/kanban\";\nimport {\n\tCanAccess,\n\tusePluginOverrides,\n\tuseTranslate,\n} from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\nimport {\n\tDropdownMenu,\n\tDropdownMenuContent,\n\tDropdownMenuItem,\n\tDropdownMenuSeparator,\n\tDropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport { TaskCard } from \"./task-card\";\nimport type { SerializedColumn, SerializedTask } from \"../../../types\";\n\ninterface ColumnContentProps {\n\tboardId: string;\n\tcolumn: SerializedColumn & { tasks: SerializedTask[] };\n\tcanMoveColumn: boolean;\n\tcanMoveTasks: boolean;\n\tonAddTask: () => void;\n\tonEditTask: (taskId: string) => void;\n\tonEditColumn: () => void;\n\tonDeleteColumn: () => void;\n}\n\nfunction ColumnContentComponent({\n\tboardId,\n\tcolumn,\n\tcanMoveColumn,\n\tcanMoveTasks,\n\tonAddTask,\n\tonEditTask,\n\tonEditColumn,\n\tonDeleteColumn,\n}: ColumnContentProps) {\n\tconst t = useTranslate();\n\tconst { localization } = usePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst hasTasks = column.tasks && column.tasks.length > 0;\n\n\treturn (\n\t\t<Kanban.Column key={column.id} value={column.id}>\n\t\t\t<div className=\"flex items-center\">\n\t\t\t\t<Kanban.ColumnHandle asChild disabled={!canMoveColumn}>\n\t\t\t\t\t<Button variant=\"ghost\" size=\"icon\">\n\t\t\t\t\t\t<GripVertical className=\"h-4 w-4\" />\n\t\t\t\t\t</Button>\n\t\t\t\t</Kanban.ColumnHandle>\n\t\t\t\t<div className=\"flex items-center gap-2 flex-1\">\n\t\t\t\t\t<span className=\"font-bold text-lg line-clamp-1 flex-1 text-left\">\n\t\t\t\t\t\t{column.title}\n\t\t\t\t\t</span>\n\t\t\t\t\t<Badge variant=\"outline\" className=\"pointer-events-none rounded-sm\">\n\t\t\t\t\t\t{column.tasks?.length || 0}\n\t\t\t\t\t</Badge>\n\t\t\t\t</div>\n\t\t\t\t<DropdownMenu>\n\t\t\t\t\t<DropdownMenuTrigger asChild>\n\t\t\t\t\t\t<Button variant=\"ghost\" size=\"icon\">\n\t\t\t\t\t\t\t<MoreVertical className=\"h-4 w-4\" />\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</DropdownMenuTrigger>\n\t\t\t\t\t<DropdownMenuContent align=\"end\">\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:column\"\n\t\t\t\t\t\t\taction=\"update\"\n\t\t\t\t\t\t\tparams={{ id: column.id, boardId }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DropdownMenuItem onClick={onEditColumn}>\n\t\t\t\t\t\t\t\t<Pencil className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.editColumn ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.list.editColumn\", \"Edit Column\")}\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:task\"\n\t\t\t\t\t\t\taction=\"create\"\n\t\t\t\t\t\t\tparams={{ boardId, columnId: column.id }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DropdownMenuItem onClick={onAddTask}>\n\t\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.addTask ?? t(\"kanban.list.addTask\", \"Add Task\")}\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t\t<DropdownMenuSeparator />\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:column\"\n\t\t\t\t\t\t\taction=\"delete\"\n\t\t\t\t\t\t\tparams={{ id: column.id, boardId }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\tonClick={onDeleteColumn}\n\t\t\t\t\t\t\t\tclassName=\"text-red-600 focus:text-red-600\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Trash2 className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.deleteColumn ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.forms.deleteColumn\", \"Delete Column\")}\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t</DropdownMenuContent>\n\t\t\t\t</DropdownMenu>\n\t\t\t</div>\n\t\t\t<div className=\"p-0.5 space-y-2\">\n\t\t\t\t{hasTasks ? (\n\t\t\t\t\tcolumn.tasks.map((task) => (\n\t\t\t\t\t\t<TaskCard\n\t\t\t\t\t\t\tkey={task.id}\n\t\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\t\tcolumnId={column.id}\n\t\t\t\t\t\t\ttask={task}\n\t\t\t\t\t\t\tcanMove={canMoveTasks}\n\t\t\t\t\t\t\tonClick={() => onEditTask(task.id)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))\n\t\t\t\t) : (\n\t\t\t\t\t<div className=\"flex flex-col items-center justify-center py-1 md:py-8 text-center\">\n\t\t\t\t\t\t<div className=\"rounded-full bg-muted p-4 mb-3 hidden md:block\">\n\t\t\t\t\t\t\t<Plus className=\"h-5 w-5 text-muted-foreground\" />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div className=\"space-y-1 mb-2 md:space-y-2 md:mb-4\">\n\t\t\t\t\t\t\t<p className=\"text-sm text-muted-foreground\">\n\t\t\t\t\t\t\t\t{localization?.noTasks ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.common.noTasks\", \"No tasks yet\")}\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t<p className=\"text-xs text-muted-foreground\">\n\t\t\t\t\t\t\t\t{localization?.noTasksDescription ??\n\t\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\t\"kanban.list.noTasksDescription\",\n\t\t\t\t\t\t\t\t\t\t\"Add a task to get started\",\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:task\"\n\t\t\t\t\t\t\taction=\"create\"\n\t\t\t\t\t\t\tparams={{ boardId, columnId: column.id }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Button onClick={onAddTask} size=\"sm\">\n\t\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.addTask ?? t(\"kanban.list.addTask\", \"Add Task\")}\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</Kanban.Column>\n\t);\n}\n\nexport const ColumnContent = memo(ColumnContentComponent);\n",
+      "content": "\"use client\";\n\nimport { memo } from \"react\";\nimport { GripVertical, MoreVertical, Pencil, Plus, Trash2 } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Badge } from \"@/components/ui/badge\";\nimport * as Kanban from \"@/components/ui/kanban\";\nimport {\n\tCanAccess,\n\tuseCan,\n\tusePluginOverrides,\n\tuseTranslate,\n} from \"@btst/stack/context\";\nimport type { KanbanPluginOverrides } from \"../../overrides\";\nimport {\n\tDropdownMenu,\n\tDropdownMenuContent,\n\tDropdownMenuItem,\n\tDropdownMenuSeparator,\n\tDropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport { TaskCard } from \"./task-card\";\nimport type { SerializedColumn, SerializedTask } from \"../../../types\";\n\ninterface ColumnContentProps {\n\tboardId: string;\n\tcolumn: SerializedColumn & { tasks: SerializedTask[] };\n\tcanMoveColumn: boolean;\n\tcanMoveTasks: boolean;\n\tonAddTask: () => void;\n\tonEditTask: (taskId: string) => void;\n\tonEditColumn: () => void;\n\tonDeleteColumn: () => void;\n}\n\nfunction ColumnContentComponent({\n\tboardId,\n\tcolumn,\n\tcanMoveColumn,\n\tcanMoveTasks,\n\tonAddTask,\n\tonEditTask,\n\tonEditColumn,\n\tonDeleteColumn,\n}: ColumnContentProps) {\n\tconst t = useTranslate();\n\tconst { localization } = usePluginOverrides<KanbanPluginOverrides>(\"kanban\");\n\tconst hasTasks = column.tasks && column.tasks.length > 0;\n\tconst { can: canUpdateColumn, isPending: isCheckingUpdateColumn } = useCan({\n\t\tresource: \"kanban:column\",\n\t\taction: \"update\",\n\t\tparams: { id: column.id, boardId },\n\t});\n\tconst { can: canCreateTask, isPending: isCheckingCreateTask } = useCan({\n\t\tresource: \"kanban:task\",\n\t\taction: \"create\",\n\t\tparams: { boardId, columnId: column.id },\n\t});\n\tconst { can: canDeleteColumn, isPending: isCheckingDeleteColumn } = useCan({\n\t\tresource: \"kanban:column\",\n\t\taction: \"delete\",\n\t\tparams: { id: column.id, boardId },\n\t});\n\tconst showUpdateColumn = !isCheckingUpdateColumn && canUpdateColumn;\n\tconst showCreateTask = !isCheckingCreateTask && canCreateTask;\n\tconst showDeleteColumn = !isCheckingDeleteColumn && canDeleteColumn;\n\tconst hasColumnActions =\n\t\tshowUpdateColumn || showCreateTask || showDeleteColumn;\n\n\treturn (\n\t\t<Kanban.Column key={column.id} value={column.id}>\n\t\t\t<div className=\"flex items-center\">\n\t\t\t\t<Kanban.ColumnHandle asChild disabled={!canMoveColumn}>\n\t\t\t\t\t<Button variant=\"ghost\" size=\"icon\">\n\t\t\t\t\t\t<GripVertical className=\"h-4 w-4\" />\n\t\t\t\t\t</Button>\n\t\t\t\t</Kanban.ColumnHandle>\n\t\t\t\t<div className=\"flex items-center gap-2 flex-1\">\n\t\t\t\t\t<span className=\"font-bold text-lg line-clamp-1 flex-1 text-left\">\n\t\t\t\t\t\t{column.title}\n\t\t\t\t\t</span>\n\t\t\t\t\t<Badge variant=\"outline\" className=\"pointer-events-none rounded-sm\">\n\t\t\t\t\t\t{column.tasks?.length || 0}\n\t\t\t\t\t</Badge>\n\t\t\t\t</div>\n\t\t\t\t{hasColumnActions && (\n\t\t\t\t\t<DropdownMenu>\n\t\t\t\t\t\t<DropdownMenuTrigger asChild>\n\t\t\t\t\t\t\t<Button variant=\"ghost\" size=\"icon\">\n\t\t\t\t\t\t\t\t<MoreVertical className=\"h-4 w-4\" />\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</DropdownMenuTrigger>\n\t\t\t\t\t\t<DropdownMenuContent align=\"end\">\n\t\t\t\t\t\t\t{showUpdateColumn && (\n\t\t\t\t\t\t\t\t<DropdownMenuItem onClick={onEditColumn}>\n\t\t\t\t\t\t\t\t\t<Pencil className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t\t{localization?.editColumn ??\n\t\t\t\t\t\t\t\t\t\tt(\"kanban.list.editColumn\", \"Edit Column\")}\n\t\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{showCreateTask && (\n\t\t\t\t\t\t\t\t<DropdownMenuItem onClick={onAddTask}>\n\t\t\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t\t{localization?.addTask ??\n\t\t\t\t\t\t\t\t\t\tt(\"kanban.list.addTask\", \"Add Task\")}\n\t\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{showDeleteColumn && (showUpdateColumn || showCreateTask) && (\n\t\t\t\t\t\t\t\t<DropdownMenuSeparator />\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{showDeleteColumn && (\n\t\t\t\t\t\t\t\t<DropdownMenuItem\n\t\t\t\t\t\t\t\t\tonClick={onDeleteColumn}\n\t\t\t\t\t\t\t\t\tclassName=\"text-red-600 focus:text-red-600\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<Trash2 className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t\t{localization?.deleteColumn ??\n\t\t\t\t\t\t\t\t\t\tt(\"kanban.forms.deleteColumn\", \"Delete Column\")}\n\t\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</DropdownMenuContent>\n\t\t\t\t\t</DropdownMenu>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t\t<div className=\"p-0.5 space-y-2\">\n\t\t\t\t{hasTasks ? (\n\t\t\t\t\tcolumn.tasks.map((task) => (\n\t\t\t\t\t\t<TaskCard\n\t\t\t\t\t\t\tkey={task.id}\n\t\t\t\t\t\t\tboardId={boardId}\n\t\t\t\t\t\t\tcolumnId={column.id}\n\t\t\t\t\t\t\ttask={task}\n\t\t\t\t\t\t\tcanMove={canMoveTasks}\n\t\t\t\t\t\t\tonClick={() => onEditTask(task.id)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))\n\t\t\t\t) : (\n\t\t\t\t\t<div className=\"flex flex-col items-center justify-center py-1 md:py-8 text-center\">\n\t\t\t\t\t\t<div className=\"rounded-full bg-muted p-4 mb-3 hidden md:block\">\n\t\t\t\t\t\t\t<Plus className=\"h-5 w-5 text-muted-foreground\" />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div className=\"space-y-1 mb-2 md:space-y-2 md:mb-4\">\n\t\t\t\t\t\t\t<p className=\"text-sm text-muted-foreground\">\n\t\t\t\t\t\t\t\t{localization?.noTasks ??\n\t\t\t\t\t\t\t\t\tt(\"kanban.common.noTasks\", \"No tasks yet\")}\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t<p className=\"text-xs text-muted-foreground\">\n\t\t\t\t\t\t\t\t{localization?.noTasksDescription ??\n\t\t\t\t\t\t\t\t\tt(\n\t\t\t\t\t\t\t\t\t\t\"kanban.list.noTasksDescription\",\n\t\t\t\t\t\t\t\t\t\t\"Add a task to get started\",\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<CanAccess\n\t\t\t\t\t\t\tresource=\"kanban:task\"\n\t\t\t\t\t\t\taction=\"create\"\n\t\t\t\t\t\t\tparams={{ boardId, columnId: column.id }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Button onClick={onAddTask} size=\"sm\">\n\t\t\t\t\t\t\t\t<Plus className=\"mr-2 h-4 w-4\" />\n\t\t\t\t\t\t\t\t{localization?.addTask ?? t(\"kanban.list.addTask\", \"Add Task\")}\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</CanAccess>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</Kanban.Column>\n\t);\n}\n\nexport const ColumnContent = memo(ColumnContentComponent);\n",
       "target": "src/components/btst/kanban/client/components/shared/column-content.tsx"
     },
     {
diff --git a/packages/stack/src/plugins/kanban/__tests__/client-sweep.test.tsx b/packages/stack/src/plugins/kanban/__tests__/client-sweep.test.tsx
index 515ed578..98ba6a49 100644
--- a/packages/stack/src/plugins/kanban/__tests__/client-sweep.test.tsx
+++ b/packages/stack/src/plugins/kanban/__tests__/client-sweep.test.tsx
@@ -10,6 +10,7 @@ import {
 import { BoardForm } from "../client/components/forms/board-form";
 import { ColumnForm } from "../client/components/forms/column-form";
 import { TaskForm } from "../client/components/forms/task-form";
+import { BoardPage } from "../client/components/pages/board-page.internal";
 import { BoardsListPage } from "../client/components/pages/boards-list-page.internal";
 import type {
 	SerializedBoard,
@@ -21,9 +22,12 @@ import type {
 
 const hooks = vi.hoisted(() => ({
 	useSuspenseBoards: vi.fn(),
+	useSuspenseBoard: vi.fn(),
 	useBoardForm: vi.fn(),
 	useColumnForm: vi.fn(),
 	useTaskForm: vi.fn(),
+	useBoardMutations: vi.fn(),
+	useColumnMutations: vi.fn(),
 	useTaskMutations: vi.fn(),
 	useSearchUsers: vi.fn(),
 }));
@@ -103,11 +107,27 @@ beforeEach(() => {
 		error: null,
 		isFetching: false,
 	});
+	hooks.useSuspenseBoard.mockReturnValue({
+		data: { ...board, columns: [] },
+		error: null,
+		isFetching: false,
+		refetch: vi.fn(),
+	});
 	hooks.useBoardForm.mockReturnValue({ ...formResult });
 	hooks.useColumnForm.mockReturnValue({ ...formResult });
 	hooks.useTaskForm.mockReturnValue({ ...formResult });
+	hooks.useBoardMutations.mockReturnValue({
+		deleteBoard: vi.fn(),
+		isDeleting: false,
+	});
+	hooks.useColumnMutations.mockReturnValue({
+		deleteColumn: vi.fn(),
+		reorderColumns: vi.fn(),
+	});
 	hooks.useTaskMutations.mockReturnValue({
+		deleteTask: vi.fn(),
 		moveTask: vi.fn().mockResolvedValue(task),
+		reorderTasks: vi.fn(),
 		isMoving: false,
 	});
 	hooks.useSearchUsers.mockReturnValue({ data: [] });
@@ -190,6 +210,27 @@ describe("Kanban permissions", () => {
 			}),
 		);
 	});
+
+	it("hides an empty board actions menu when every action is denied", async () => {
+		const can = vi.fn(
+			(_request: { resource: string; action: string }) => false,
+		);
+		const auth: StackAuthProvider = {
+			getIdentity: () => ({ id: "user-1" }),
+			can,
+		};
+
+		await render(<BoardPage boardId={board.id} />, { auth });
+		await waitFor(() =>
+			can.mock.calls.some(
+				([request]) =>
+					request.resource === "kanban:board" && request.action === "delete",
+			),
+		);
+
+		expect(texts()).not.toContain("Actions");
+		expect(texts()).not.toContain("Add Column");
+	});
 });
 
 describe("Kanban resource forms", () => {
diff --git a/packages/stack/src/plugins/kanban/client/components/pages/board-page.internal.tsx b/packages/stack/src/plugins/kanban/client/components/pages/board-page.internal.tsx
index 2a31e7bd..5a9e5332 100644
--- a/packages/stack/src/plugins/kanban/client/components/pages/board-page.internal.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/pages/board-page.internal.tsx
@@ -99,6 +99,26 @@ export function BoardPage({ boardId }: BoardPageProps) {
 		action: "update",
 		params: { boardId },
 	});
+	const { can: canCreateColumn, isPending: isCheckingCreateColumn } = useCan({
+		resource: "kanban:column",
+		action: "create",
+		params: { boardId },
+	});
+	const { can: canUpdateBoard, isPending: isCheckingUpdateBoard } = useCan({
+		resource: "kanban:board",
+		action: "update",
+		params: { id: boardId },
+	});
+	const { can: canDeleteBoard, isPending: isCheckingDeleteBoard } = useCan({
+		resource: "kanban:board",
+		action: "delete",
+		params: { id: boardId },
+	});
+	const showCreateColumn = !isCheckingCreateColumn && canCreateColumn;
+	const showUpdateBoard = !isCheckingUpdateBoard && canUpdateBoard;
+	const showDeleteBoard = !isCheckingDeleteBoard && canDeleteBoard;
+	const hasBoardActions =
+		showCreateColumn || showUpdateBoard || showDeleteBoard;
 
 	const [modalState, setModalState] = useState<ModalState>({ type: "none" });
 
@@ -351,57 +371,49 @@ export function BoardPage({ boardId }: BoardPageProps) {
 						)}
 					</div>
 				</div>
-				<DropdownMenu>
-					<DropdownMenuTrigger asChild>
-						<Button variant="outline">
-							<Settings className="mr-2 h-4 w-4" />
-							{localization?.actions ?? t("kanban.common.actions", "Actions")}
-						</Button>
-					</DropdownMenuTrigger>
-					<DropdownMenuContent align="end">
-						<CanAccess
-							resource="kanban:column"
-							action="create"
-							params={{ boardId }}
-						>
-							<DropdownMenuItem
-								onClick={() => setModalState({ type: "addColumn" })}
-							>
-								<Plus className="mr-2 h-4 w-4" />
-								{localization?.addColumn ??
-									t("kanban.list.addColumn", "Add Column")}
-							</DropdownMenuItem>
-						</CanAccess>
-						<CanAccess
-							resource="kanban:board"
-							action="update"
-							params={{ id: boardId }}
-						>
-							<DropdownMenuItem
-								onClick={() => setModalState({ type: "editBoard" })}
-							>
-								<Pencil className="mr-2 h-4 w-4" />
-								{localization?.editBoard ??
-									t("kanban.list.editBoard", "Edit Board")}
-							</DropdownMenuItem>
-						</CanAccess>
-						<DropdownMenuSeparator />
-						<CanAccess
-							resource="kanban:board"
-							action="delete"
-							params={{ id: boardId }}
-						>
-							<DropdownMenuItem
-								onClick={() => setModalState({ type: "deleteBoard" })}
-								className="text-red-600 focus:text-red-600"
-							>
-								<Trash2 className="mr-2 h-4 w-4" />
-								{localization?.deleteBoard ??
-									t("kanban.forms.deleteBoard", "Delete Board")}
-							</DropdownMenuItem>
-						</CanAccess>
-					</DropdownMenuContent>
-				</DropdownMenu>
+				{hasBoardActions && (
+					<DropdownMenu>
+						<DropdownMenuTrigger asChild>
+							<Button variant="outline">
+								<Settings className="mr-2 h-4 w-4" />
+								{localization?.actions ?? t("kanban.common.actions", "Actions")}
+							</Button>
+						</DropdownMenuTrigger>
+						<DropdownMenuContent align="end">
+							{showCreateColumn && (
+								<DropdownMenuItem
+									onClick={() => setModalState({ type: "addColumn" })}
+								>
+									<Plus className="mr-2 h-4 w-4" />
+									{localization?.addColumn ??
+										t("kanban.list.addColumn", "Add Column")}
+								</DropdownMenuItem>
+							)}
+							{showUpdateBoard && (
+								<DropdownMenuItem
+									onClick={() => setModalState({ type: "editBoard" })}
+								>
+									<Pencil className="mr-2 h-4 w-4" />
+									{localization?.editBoard ??
+										t("kanban.list.editBoard", "Edit Board")}
+								</DropdownMenuItem>
+							)}
+							{showDeleteBoard && (showCreateColumn || showUpdateBoard) && (
+								<DropdownMenuSeparator />
+							)}
+							{showDeleteBoard && (
+								<DropdownMenuItem
+									onClick={() => setModalState({ type: "deleteBoard" })}
+									className="text-red-600 focus:text-red-600"
+								>
+									<Trash2 className="mr-2 h-4 w-4" />
+									{localization?.deleteBoard ??
+										t("kanban.forms.deleteBoard", "Delete Board")}
+								</DropdownMenuItem>
+							)}
+						</DropdownMenuContent>
+					</DropdownMenu>
+				)}
 			</div>
 
 			{orderedColumns.length > 0 ? (
diff --git a/packages/stack/src/plugins/kanban/client/components/shared/column-content.tsx b/packages/stack/src/plugins/kanban/client/components/shared/column-content.tsx
index a2db039a..5d4ca07c 100644
--- a/packages/stack/src/plugins/kanban/client/components/shared/column-content.tsx
+++ b/packages/stack/src/plugins/kanban/client/components/shared/column-content.tsx
@@ -7,6 +7,7 @@ import { Badge } from "@workspace/ui/components/badge";
 import * as Kanban from "@workspace/ui/components/kanban";
 import {
 	CanAccess,
+	useCan,
 	usePluginOverrides,
 	useTranslate,
 } from "@btst/stack/context";
@@ -45,6 +46,26 @@ function ColumnContentComponent({
 	const t = useTranslate();
 	const { localization } = usePluginOverrides<KanbanPluginOverrides>("kanban");
 	const hasTasks = column.tasks && column.tasks.length > 0;
+	const { can: canUpdateColumn, isPending: isCheckingUpdateColumn } = useCan({
+		resource: "kanban:column",
+		action: "update",
+		params: { id: column.id, boardId },
+	});
+	const { can: canCreateTask, isPending: isCheckingCreateTask } = useCan({
+		resource: "kanban:task",
+		action: "create",
+		params: { boardId, columnId: column.id },
+	});
+	const { can: canDeleteColumn, isPending: isCheckingDeleteColumn } = useCan({
+		resource: "kanban:column",
+		action: "delete",
+		params: { id: column.id, boardId },
+	});
+	const showUpdateColumn = !isCheckingUpdateColumn && canUpdateColumn;
+	const showCreateTask = !isCheckingCreateTask && canCreateTask;
+	const showDeleteColumn = !isCheckingDeleteColumn && canDeleteColumn;
+	const hasColumnActions =
+		showUpdateColumn || showCreateTask || showDeleteColumn;
 
 	return (
 		<Kanban.Column key={column.id} value={column.id}>
@@ -62,51 +83,44 @@ function ColumnContentComponent({
 						{column.tasks?.length || 0}
 					</Badge>
 				</div>
-				<DropdownMenu>
-					<DropdownMenuTrigger asChild>
-						<Button variant="ghost" size="icon">
-							<MoreVertical className="h-4 w-4" />
-						</Button>
-					</DropdownMenuTrigger>
-					<DropdownMenuContent align="end">
-						<CanAccess
-							resource="kanban:column"
-							action="update"
-							params={{ id: column.id, boardId }}
-						>
-							<DropdownMenuItem onClick={onEditColumn}>
-								<Pencil className="mr-2 h-4 w-4" />
-								{localization?.editColumn ??
-									t("kanban.list.editColumn", "Edit Column")}
-							</DropdownMenuItem>
-						</CanAccess>
-						<CanAccess
-							resource="kanban:task"
-							action="create"
-							params={{ boardId, columnId: column.id }}
-						>
-							<DropdownMenuItem onClick={onAddTask}>
-								<Plus className="mr-2 h-4 w-4" />
-								{localization?.addTask ?? t("kanban.list.addTask", "Add Task")}
-							</DropdownMenuItem>
-						</CanAccess>
-						<DropdownMenuSeparator />
-						<CanAccess
-							resource="kanban:column"
-							action="delete"
-							params={{ id: column.id, boardId }}
-						>
-							<DropdownMenuItem
-								onClick={onDeleteColumn}
-								className="text-red-600 focus:text-red-600"
-							>
-								<Trash2 className="mr-2 h-4 w-4" />
-								{localization?.deleteColumn ??
-									t("kanban.forms.deleteColumn", "Delete Column")}
-							</DropdownMenuItem>
-						</CanAccess>
-					</DropdownMenuContent>
-				</DropdownMenu>
+				{hasColumnActions && (
+					<DropdownMenu>
+						<DropdownMenuTrigger asChild>
+							<Button variant="ghost" size="icon">
+								<MoreVertical className="h-4 w-4" />
+							</Button>
+						</DropdownMenuTrigger>
+						<DropdownMenuContent align="end">
+							{showUpdateColumn && (
+								<DropdownMenuItem onClick={onEditColumn}>
+									<Pencil className="mr-2 h-4 w-4" />
+									{localization?.editColumn ??
+										t("kanban.list.editColumn", "Edit Column")}
+								</DropdownMenuItem>
+							)}
+							{showCreateTask && (
+								<DropdownMenuItem onClick={onAddTask}>
+									<Plus className="mr-2 h-4 w-4" />
+									{localization?.addTask ??
+										t("kanban.list.addTask", "Add Task")}
+								</DropdownMenuItem>
+							)}
+							{showDeleteColumn && (showUpdateColumn || showCreateTask) && (
+								<DropdownMenuSeparator />
+							)}
+							{showDeleteColumn && (
+								<DropdownMenuItem
+									onClick={onDeleteColumn}
+									className="text-red-600 focus:text-red-600"
+								>
+									<Trash2 className="mr-2 h-4 w-4" />
+									{localization?.deleteColumn ??
+										t("kanban.forms.deleteColumn", "Delete Column")}
+								</DropdownMenuItem>
+							)}
+						</DropdownMenuContent>
+					</DropdownMenu>
+				)}
 			</div>
 			<div className="p-0.5 space-y-2">
 				{hasTasks ? (

From 9c175348ed601b30384c9731056a5b8f24fdfe83 Mon Sep 17 00:00:00 2001
From: olliethedev <5933733+olliethedev@users.noreply.github.com>
Date: Wed, 19 Aug 2026 22:26:54 +0000
Subject: [PATCH 3/3] docs(kanban): clarify server authorization

---
 docs/content/docs/plugins/kanban.mdx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/docs/content/docs/plugins/kanban.mdx b/docs/content/docs/plugins/kanban.mdx
index 0244021a..539ac813 100644
--- a/docs/content/docs/plugins/kanban.mdx
+++ b/docs/content/docs/plugins/kanban.mdx
@@ -315,6 +315,10 @@ The kanban plugin automatically creates the following pages (mounted at your con
 
 Pass an [`auth` provider](/auth) to `StackProvider` to gate Kanban routes and controls. Without an auth provider (or without `auth.can`), every check is allowed, preserving the default behavior.
 
+<Callout type="warning">
+These client checks control presentation and navigation only. Enforce the same authorization policy on your server endpoints; users can still invoke Kanban API mutations directly without the gated controls.
+</Callout>
+
 | UI | Resource | Action | Params |
 |---|---|---|---|
 | Boards route | `kanban:board` | `read` | — |