@btst/stack 2.12.2 → 3.0.0-rc.1

package/dist/packages/stack/src/plugins/kanban/client/components/pages/board-page.internal.mjs

@@ -2,13 +2,12 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useState, useCallback, useMemo, useEffect } from 'react';
 import { ArrowLeft, Settings, Plus, Pencil, Trash2 } from 'lucide-react';
-import { toast } from 'sonner';
 import { Button } from '../../../../../../../ui/src/components/button.mjs';
 import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator } from '../../../../../../../ui/src/components/dropdown-menu.mjs';
 import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription } from '../../../../../../../ui/src/components/dialog.mjs';
 import { AlertDialog, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogCancel, AlertDialogAction } from '../../../../../../../ui/src/components/alert-dialog.mjs';
 import { useSuspenseBoard, useBoardMutations, useColumnMutations, useTaskMutations } from '../../hooks/kanban-hooks.mjs';
-import { usePluginOverrides } from '@btst/stack/context';
+import { useTranslate, useNotify, usePluginOverrides, useStack, useCan, CanAccess } from '@btst/stack/context';
 import { KanbanBoard } from '../shared/kanban-board.mjs';
 import { ColumnForm } from '../forms/column-form.mjs';
 import { BoardForm } from '../forms/board-form.mjs';
@@ -17,22 +16,50 @@ import { PageWrapper } from '../shared/page-wrapper.mjs';
 import { EmptyState } from '../shared/empty-state.mjs';
 
 function BoardPage({ boardId }) {
+  const t = useTranslate();
+  const notify = useNotify();
   const { data: board, error, refetch, isFetching } = useSuspenseBoard(boardId);
   if (error && !isFetching) {
     throw error;
   }
-  const {
-    Link: OverrideLink,
-    navigate: overrideNavigate,
-    taskDetailBottomSlot
-  } = usePluginOverrides("kanban");
-  const navigate = overrideNavigate || ((path) => {
+  const { taskDetailBottomSlot, localization } = usePluginOverrides("kanban");
+  const { router } = useStack();
+  const navigate = router?.navigate || ((path) => {
     window.location.href = path;
   });
-  const Link = OverrideLink || "a";
+  const Link = router?.Link ?? "a";
   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 { 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({ type: "none" });
   const computeKanbanData = useCallback(
     (columns) => {
@@ -71,10 +98,18 @@ function BoardPage({ boardId }) {
         }, 100);
       }
     } catch (error2) {
-      const message = error2 instanceof Error ? error2.message : "Failed to delete board";
-      toast.error(message);
+      const message = error2 instanceof Error ? error2.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) => {
       if (!board) return;
@@ -110,12 +145,12 @@ function BoardPage({ boardId }) {
                 hasOrderChanges = true;
               }
             }
-            const newTaskIds = new Set(tasks.map((t) => t.id));
-            const tasksRemoved = oldTasks.some((t) => !newTaskIds.has(t.id));
+            const newTaskIds = new Set(tasks.map((t2) => t2.id));
+            const tasksRemoved = oldTasks.some((t2) => !newTaskIds.has(t2.id));
             if (hasOrderChanges && !targetColumnsOfCrossMove.has(columnId) && !tasksRemoved) {
               columnsToReorder.set(
                 columnId,
-                tasks.map((t) => t.id)
+                tasks.map((t2) => t2.id)
               );
             }
           }
@@ -130,7 +165,7 @@ function BoardPage({ boardId }) {
             if (tasks) {
               await reorderTasks(
                 targetColumnId,
-                tasks.map((t) => t.id)
+                tasks.map((t2) => t2.id)
               );
             }
           }
@@ -161,11 +196,14 @@ function BoardPage({ boardId }) {
     return /* @__PURE__ */ jsx(
       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: /* @__PURE__ */ jsxs(Button, { onClick: () => navigate("/pages/kanban"), children: [
           /* @__PURE__ */ jsx(ArrowLeft, { className: "mr-2 h-4 w-4" }),
-          "Back to Boards"
+          localization?.backToBoards ?? t("kanban.common.backToBoards", "Back to Boards")
         ] })
       }
     );
@@ -191,41 +229,41 @@ function BoardPage({ boardId }) {
               board.description && /* @__PURE__ */ jsx("p", { className: "text-muted-foreground mt-1", children: board.description })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+          hasBoardActions && /* @__PURE__ */ jsxs(DropdownMenu, { children: [
             /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "outline", children: [
               /* @__PURE__ */ jsx(Settings, { className: "mr-2 h-4 w-4" }),
-              "Actions"
+              localization?.actions ?? t("kanban.common.actions", "Actions")
             ] }) }),
             /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", children: [
-              /* @__PURE__ */ jsxs(
+              showCreateColumn && /* @__PURE__ */ jsxs(
                 DropdownMenuItem,
                 {
                   onClick: () => setModalState({ type: "addColumn" }),
                   children: [
                     /* @__PURE__ */ jsx(Plus, { className: "mr-2 h-4 w-4" }),
-                    "Add Column"
+                    localization?.addColumn ?? t("kanban.list.addColumn", "Add Column")
                   ]
                 }
               ),
-              /* @__PURE__ */ jsxs(
+              showUpdateBoard && /* @__PURE__ */ jsxs(
                 DropdownMenuItem,
                 {
                   onClick: () => setModalState({ type: "editBoard" }),
                   children: [
                     /* @__PURE__ */ jsx(Pencil, { className: "mr-2 h-4 w-4" }),
-                    "Edit Board"
+                    localization?.editBoard ?? t("kanban.list.editBoard", "Edit Board")
                   ]
                 }
               ),
-              /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
-              /* @__PURE__ */ jsxs(
+              showDeleteBoard && (showCreateColumn || showUpdateBoard) && /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+              showDeleteBoard && /* @__PURE__ */ jsxs(
                 DropdownMenuItem,
                 {
                   onClick: () => setModalState({ type: "deleteBoard" }),
                   className: "text-red-600 focus:text-red-600",
                   children: [
                     /* @__PURE__ */ jsx(Trash2, { className: "mr-2 h-4 w-4" }),
-                    "Delete Board"
+                    localization?.deleteBoard ?? t("kanban.forms.deleteBoard", "Delete Board")
                   ]
                 }
               )
@@ -235,8 +273,11 @@ function BoardPage({ boardId }) {
         orderedColumns.length > 0 ? /* @__PURE__ */ jsx(
           KanbanBoard,
           {
+            boardId,
             columns: orderedColumns,
             kanbanState,
+            canMoveColumns: !isCheckingColumnMove && canMoveColumns,
+            canMoveTasks: !isCheckingTaskMove && canMoveTasks,
             onKanbanChange: handleKanbanChange,
             onAddTask: (columnId) => setModalState({ type: "addTask", columnId }),
             onEditTask: (columnId, taskId) => setModalState({ type: "editTask", columnId, taskId }),
@@ -246,12 +287,23 @@ function BoardPage({ boardId }) {
         ) : /* @__PURE__ */ jsx(
           EmptyState,
           {
-            title: "No columns yet",
-            description: "Create your first column to start organizing tasks.",
-            action: /* @__PURE__ */ jsxs(Button, { onClick: () => setModalState({ type: "addColumn" }), children: [
-              /* @__PURE__ */ jsx(Plus, { className: "mr-2 h-4 w-4" }),
-              "Add Column"
-            ] })
+            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: /* @__PURE__ */ jsx(
+              CanAccess,
+              {
+                resource: "kanban:column",
+                action: "create",
+                params: { boardId },
+                children: /* @__PURE__ */ jsxs(Button, { onClick: () => setModalState({ type: "addColumn" }), children: [
+                  /* @__PURE__ */ jsx(Plus, { className: "mr-2 h-4 w-4" }),
+                  localization?.addColumn ?? t("kanban.list.addColumn", "Add Column")
+                ] })
+              }
+            )
           }
         ),
         /* @__PURE__ */ jsx(
@@ -261,18 +313,18 @@ function BoardPage({ boardId }) {
             onOpenChange: (open) => !open && closeModal(),
             children: /* @__PURE__ */ jsxs(DialogContent, { children: [
               /* @__PURE__ */ jsxs(DialogHeader, { children: [
-                /* @__PURE__ */ jsx(DialogTitle, { children: "Add Column" }),
-                /* @__PURE__ */ jsx(DialogDescription, { children: "Add a new column to this board." })
+                /* @__PURE__ */ jsx(DialogTitle, { children: localization?.addColumn ?? t("kanban.list.addColumn", "Add Column") }),
+                /* @__PURE__ */ jsx(DialogDescription, { children: localization?.addColumnDescription ?? t(
+                  "kanban.list.addColumnDescription",
+                  "Add a new column to this board."
+                ) })
               ] }),
               /* @__PURE__ */ jsx(
                 ColumnForm,
                 {
                   boardId,
                   onClose: closeModal,
-                  onSuccess: () => {
-                    closeModal();
-                    refetch();
-                  }
+                  onSuccess: closeModal
                 }
               )
             ] })
@@ -285,8 +337,11 @@ function BoardPage({ boardId }) {
             onOpenChange: (open) => !open && closeModal(),
             children: /* @__PURE__ */ jsxs(DialogContent, { children: [
               /* @__PURE__ */ jsxs(DialogHeader, { children: [
-                /* @__PURE__ */ jsx(DialogTitle, { children: "Edit Column" }),
-                /* @__PURE__ */ jsx(DialogDescription, { children: "Update the column details." })
+                /* @__PURE__ */ jsx(DialogTitle, { children: localization?.editColumn ?? t("kanban.list.editColumn", "Edit Column") }),
+                /* @__PURE__ */ jsx(DialogDescription, { children: localization?.editColumnDescription ?? t(
+                  "kanban.list.editColumnDescription",
+                  "Update the column details."
+                ) })
               ] }),
               modalState.type === "editColumn" && /* @__PURE__ */ jsx(
                 ColumnForm,
@@ -295,10 +350,7 @@ function BoardPage({ boardId }) {
                   columnId: modalState.columnId,
                   column: board.columns?.find((c) => c.id === modalState.columnId),
                   onClose: closeModal,
-                  onSuccess: () => {
-                    closeModal();
-                    refetch();
-                  }
+                  onSuccess: closeModal
                 }
               )
             ] })
@@ -311,11 +363,14 @@ function BoardPage({ boardId }) {
             onOpenChange: (open) => !open && closeModal(),
             children: /* @__PURE__ */ jsxs(AlertDialogContent, { children: [
               /* @__PURE__ */ jsxs(AlertDialogHeader, { children: [
-                /* @__PURE__ */ jsx(AlertDialogTitle, { children: "Delete Column" }),
-                /* @__PURE__ */ jsx(AlertDialogDescription, { children: "Are you sure you want to delete this column? All tasks in this column will be permanently removed." })
+                /* @__PURE__ */ jsx(AlertDialogTitle, { children: localization?.deleteColumn ?? t("kanban.forms.deleteColumn", "Delete Column") }),
+                /* @__PURE__ */ jsx(AlertDialogDescription, { children: localization?.deleteColumnConfirm ?? t(
+                  "kanban.forms.deleteColumnConfirm",
+                  "Are you sure you want to delete this column? All tasks in this column will be permanently removed."
+                ) })
               ] }),
               /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [
-                /* @__PURE__ */ jsx(AlertDialogCancel, { children: "Cancel" }),
+                /* @__PURE__ */ jsx(AlertDialogCancel, { children: localization?.cancel ?? t("kanban.common.cancel", "Cancel") }),
                 /* @__PURE__ */ jsx(
                   AlertDialogAction,
                   {
@@ -324,15 +379,17 @@ function BoardPage({ boardId }) {
                         try {
                           await deleteColumn(modalState.columnId);
                           closeModal();
-                          refetch();
                         } catch (error2) {
-                          const message = error2 instanceof Error ? error2.message : "Failed to delete column";
-                          toast.error(message);
+                          const message = error2 instanceof Error ? error2.message : localization?.deleteColumnError ?? t(
+                            "kanban.common.deleteColumnError",
+                            "Failed to delete column"
+                          );
+                          notify.error(message);
                         }
                       }
                     },
                     className: "bg-red-600 hover:bg-red-700",
-                    children: "Delete"
+                    children: localization?.delete ?? t("kanban.common.delete", "Delete")
                   }
                 )
               ] })
@@ -346,18 +403,15 @@ function BoardPage({ boardId }) {
             onOpenChange: (open) => !open && closeModal(),
             children: /* @__PURE__ */ jsxs(DialogContent, { children: [
               /* @__PURE__ */ jsxs(DialogHeader, { children: [
-                /* @__PURE__ */ jsx(DialogTitle, { children: "Edit Board" }),
-                /* @__PURE__ */ jsx(DialogDescription, { children: "Update board details." })
+                /* @__PURE__ */ jsx(DialogTitle, { children: localization?.editBoard ?? t("kanban.list.editBoard", "Edit Board") }),
+                /* @__PURE__ */ jsx(DialogDescription, { children: localization?.editBoardDescription ?? t("kanban.list.editBoardDescription", "Update board details.") })
               ] }),
               /* @__PURE__ */ jsx(
                 BoardForm,
                 {
                   board,
                   onClose: closeModal,
-                  onSuccess: () => {
-                    closeModal();
-                    refetch();
-                  }
+                  onSuccess: closeModal
                 }
               )
             ] })
@@ -370,18 +424,21 @@ function BoardPage({ boardId }) {
             onOpenChange: (open) => !open && closeModal(),
             children: /* @__PURE__ */ jsxs(AlertDialogContent, { children: [
               /* @__PURE__ */ jsxs(AlertDialogHeader, { children: [
-                /* @__PURE__ */ jsx(AlertDialogTitle, { children: "Delete Board" }),
-                /* @__PURE__ */ jsx(AlertDialogDescription, { children: "Are you sure you want to delete this board? This action cannot be undone. All columns and tasks will be permanently removed." })
+                /* @__PURE__ */ jsx(AlertDialogTitle, { children: localization?.deleteBoard ?? t("kanban.forms.deleteBoard", "Delete Board") }),
+                /* @__PURE__ */ jsx(AlertDialogDescription, { children: 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."
+                ) })
               ] }),
               /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [
-                /* @__PURE__ */ jsx(AlertDialogCancel, { children: "Cancel" }),
+                /* @__PURE__ */ jsx(AlertDialogCancel, { children: localization?.cancel ?? t("kanban.common.cancel", "Cancel") }),
                 /* @__PURE__ */ jsx(
                   Button,
                   {
                     onClick: handleDeleteBoard,
                     disabled: isDeleting,
                     className: "bg-red-600 hover:bg-red-700",
-                    children: isDeleting ? "Deleting..." : "Delete"
+                    children: isDeleting ? localization?.deleting ?? t("kanban.common.deleting", "Deleting...") : localization?.delete ?? t("kanban.common.delete", "Delete")
                   }
                 )
               ] })
@@ -395,8 +452,8 @@ function BoardPage({ boardId }) {
             onOpenChange: (open) => !open && closeModal(),
             children: /* @__PURE__ */ jsxs(DialogContent, { className: "max-w-3xl! max-h-screen overflow-y-auto", children: [
               /* @__PURE__ */ jsxs(DialogHeader, { children: [
-                /* @__PURE__ */ jsx(DialogTitle, { children: "Add Task" }),
-                /* @__PURE__ */ jsx(DialogDescription, { children: "Create a new task." })
+                /* @__PURE__ */ jsx(DialogTitle, { children: localization?.addTask ?? t("kanban.list.addTask", "Add Task") }),
+                /* @__PURE__ */ jsx(DialogDescription, { children: localization?.addTaskDescription ?? t("kanban.list.addTaskDescription", "Create a new task.") })
               ] }),
               modalState.type === "addTask" && /* @__PURE__ */ jsx(
                 TaskForm,
@@ -405,10 +462,7 @@ function BoardPage({ boardId }) {
                   boardId,
                   columns: board.columns || [],
                   onClose: closeModal,
-                  onSuccess: () => {
-                    closeModal();
-                    refetch();
-                  }
+                  onSuccess: closeModal
                 }
               )
             ] })
@@ -421,8 +475,8 @@ function BoardPage({ boardId }) {
             onOpenChange: (open) => !open && closeModal(),
             children: /* @__PURE__ */ jsxs(DialogContent, { className: "max-w-3xl! max-h-screen overflow-y-auto", children: [
               /* @__PURE__ */ jsxs(DialogHeader, { children: [
-                /* @__PURE__ */ jsx(DialogTitle, { children: "Edit Task" }),
-                /* @__PURE__ */ jsx(DialogDescription, { children: "Update task details." })
+                /* @__PURE__ */ jsx(DialogTitle, { children: localization?.editTask ?? t("kanban.list.editTask", "Edit Task") }),
+                /* @__PURE__ */ jsx(DialogDescription, { children: localization?.editTaskDescription ?? t("kanban.list.editTaskDescription", "Update task details.") })
               ] }),
               modalState.type === "editTask" && /* @__PURE__ */ jsxs(Fragment, { children: [
                 /* @__PURE__ */ jsx(
@@ -431,27 +485,26 @@ function BoardPage({ boardId }) {
                     columnId: modalState.columnId,
                     boardId,
                     taskId: modalState.taskId,
-                    task: board.columns?.find((c) => c.id === modalState.columnId)?.tasks?.find((t) => t.id === modalState.taskId),
+                    task: board.columns?.find((c) => c.id === modalState.columnId)?.tasks?.find((t2) => t2.id === modalState.taskId),
                     columns: board.columns || [],
                     onClose: closeModal,
-                    onSuccess: () => {
-                      closeModal();
-                      refetch();
-                    },
+                    onSuccess: closeModal,
                     onDelete: async () => {
                       try {
                         await deleteTask(modalState.taskId);
                         closeModal();
-                        refetch();
                       } catch (error2) {
-                        const message = error2 instanceof Error ? error2.message : "Failed to delete task";
-                        toast.error(message);
+                        const message = error2 instanceof Error ? error2.message : localization?.deleteTaskError ?? t(
+                          "kanban.common.deleteTaskError",
+                          "Failed to delete task"
+                        );
+                        notify.error(message);
                       }
                     }
                   }
                 ),
                 taskDetailBottomSlot && (() => {
-                  const task = board.columns?.find((c) => c.id === modalState.columnId)?.tasks?.find((t) => t.id === modalState.taskId);
+                  const task = board.columns?.find((c) => c.id === modalState.columnId)?.tasks?.find((t2) => t2.id === modalState.taskId);
                   return task ? /* @__PURE__ */ jsx(
                     "div",
                     {

package/dist/packages/stack/src/plugins/kanban/client/components/pages/board-page.mjs

@@ -16,6 +16,11 @@ function BoardPageComponent({ boardId }) {
     ComposedRoute,
     {
       path: `/kanban/${boardId}`,
+      permission: {
+        resource: "kanban:board",
+        action: "read",
+        params: { id: boardId }
+      },
       PageComponent: BoardPage,
       ErrorComponent: DefaultError,
       LoadingComponent: BoardSkeleton,

package/dist/packages/stack/src/plugins/kanban/client/components/pages/boards-list-page.cjs

@@ -18,6 +18,7 @@ function BoardsListPageComponent() {
     components.ComposedRoute,
     {
       path: "/kanban",
+      permission: { resource: "kanban:board", action: "read" },
       PageComponent: BoardsListPage,
       ErrorComponent: defaultError.DefaultError,
       LoadingComponent: boardsListSkeleton.BoardsListSkeleton,

package/dist/packages/stack/src/plugins/kanban/client/components/pages/boards-list-page.internal.cjs

@@ -12,13 +12,15 @@ const pageWrapper = require('../shared/page-wrapper.cjs');
 const dateFns = require('date-fns');
 
 function BoardsListPage() {
+  const t = context.useTranslate();
   const { data: boards, error, isFetching } = kanbanHooks.useSuspenseBoards();
   if (error && !isFetching) {
     throw error;
   }
-  const { Link: OverrideLink, navigate: overrideNavigate } = context.usePluginOverrides("kanban");
-  const Link = OverrideLink || "a";
-  const navigate = overrideNavigate || ((path) => {
+  const { localization } = context.usePluginOverrides("kanban");
+  const { router } = context.useStack();
+  const Link = router?.Link ?? "a";
+  const navigate = router?.navigate || ((path) => {
     window.location.href = path;
   });
   const handleNewBoard = () => {
@@ -27,13 +29,13 @@ function BoardsListPage() {
   return /* @__PURE__ */ jsxRuntime.jsxs(pageWrapper.PageWrapper, { "data-testid": "boards-list-page", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full flex items-center justify-between mb-8", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-        /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-3xl font-bold", "data-testid": "page-header", children: "Kanban Boards" }),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground mt-1", children: "Manage your projects and tasks" })
+        /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-3xl font-bold", "data-testid": "page-header", children: localization?.kanbanBoards ?? t("kanban.list.kanbanBoards", "Kanban Boards") }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground mt-1", children: localization?.manageProjects ?? t("kanban.list.manageProjects", "Manage your projects and tasks") })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs(button.Button, { onClick: handleNewBoard, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(context.CanAccess, { resource: "kanban:board", action: "create", children: /* @__PURE__ */ jsxRuntime.jsxs(button.Button, { onClick: handleNewBoard, children: [
         /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Plus, { className: "mr-2 h-4 w-4" }),
-        "New Board"
-      ] })
+        localization?.newBoard ?? t("kanban.list.newBoard", "New Board")
+      ] }) })
     ] }),
     boards.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid gap-4 md:grid-cols-2 lg:grid-cols-3", children: boards.map((board) => /* @__PURE__ */ jsxRuntime.jsx(
       Link,
@@ -46,10 +48,9 @@ function BoardsListPage() {
             board.description && /* @__PURE__ */ jsxRuntime.jsx(card.CardDescription, { className: "line-clamp-2", children: board.description })
           ] }),
           /* @__PURE__ */ jsxRuntime.jsx(card.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between text-sm text-muted-foreground", children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
-              board.columns?.length || 0,
-              " columns"
-            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { children: localization?.columnsCount ? `${board.columns?.length || 0} ${localization.columnsCount}` : t("kanban.list.columnsCount", "{{count}} columns", {
+              count: board.columns?.length || 0
+            }) }),
             /* @__PURE__ */ jsxRuntime.jsx("span", { children: dateFns.format(new Date(board.createdAt), "MMM d, yyyy") })
           ] }) })
         ] })
@@ -58,12 +59,15 @@ function BoardsListPage() {
     )) }) : /* @__PURE__ */ jsxRuntime.jsx(
       emptyState.EmptyState,
       {
-        title: "No boards yet",
-        description: "Create your first kanban board to start organizing your tasks.",
-        action: /* @__PURE__ */ jsxRuntime.jsxs(button.Button, { onClick: handleNewBoard, children: [
+        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: /* @__PURE__ */ jsxRuntime.jsx(context.CanAccess, { resource: "kanban:board", action: "create", children: /* @__PURE__ */ jsxRuntime.jsxs(button.Button, { onClick: handleNewBoard, children: [
           /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Plus, { className: "mr-2 h-4 w-4" }),
-          "Create Board"
-        ] })
+          localization?.createBoard ?? t("kanban.forms.createBoard", "Create Board")
+        ] }) })
       }
     )
   ] });

package/dist/packages/stack/src/plugins/kanban/client/components/pages/boards-list-page.internal.mjs

@@ -4,19 +4,21 @@ import { Plus } from 'lucide-react';
 import { Button } from '../../../../../../../ui/src/components/button.mjs';
 import { Card, CardHeader, CardTitle, CardDescription, CardContent } from '../../../../../../../ui/src/components/card.mjs';
 import { useSuspenseBoards } from '../../hooks/kanban-hooks.mjs';
-import { usePluginOverrides } from '@btst/stack/context';
+import { useTranslate, usePluginOverrides, useStack, CanAccess } from '@btst/stack/context';
 import { EmptyState } from '../shared/empty-state.mjs';
 import { PageWrapper } from '../shared/page-wrapper.mjs';
 import { format } from 'date-fns';
 
 function BoardsListPage() {
+  const t = useTranslate();
   const { data: boards, error, isFetching } = useSuspenseBoards();
   if (error && !isFetching) {
     throw error;
   }
-  const { Link: OverrideLink, navigate: overrideNavigate } = usePluginOverrides("kanban");
-  const Link = OverrideLink || "a";
-  const navigate = overrideNavigate || ((path) => {
+  const { localization } = usePluginOverrides("kanban");
+  const { router } = useStack();
+  const Link = router?.Link ?? "a";
+  const navigate = router?.navigate || ((path) => {
     window.location.href = path;
   });
   const handleNewBoard = () => {
@@ -25,13 +27,13 @@ function BoardsListPage() {
   return /* @__PURE__ */ jsxs(PageWrapper, { "data-testid": "boards-list-page", children: [
     /* @__PURE__ */ jsxs("div", { className: "w-full flex items-center justify-between mb-8", children: [
       /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold", "data-testid": "page-header", children: "Kanban Boards" }),
-        /* @__PURE__ */ jsx("p", { className: "text-muted-foreground mt-1", children: "Manage your projects and tasks" })
+        /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold", "data-testid": "page-header", children: localization?.kanbanBoards ?? t("kanban.list.kanbanBoards", "Kanban Boards") }),
+        /* @__PURE__ */ jsx("p", { className: "text-muted-foreground mt-1", children: localization?.manageProjects ?? t("kanban.list.manageProjects", "Manage your projects and tasks") })
       ] }),
-      /* @__PURE__ */ jsxs(Button, { onClick: handleNewBoard, children: [
+      /* @__PURE__ */ jsx(CanAccess, { resource: "kanban:board", action: "create", children: /* @__PURE__ */ jsxs(Button, { onClick: handleNewBoard, children: [
         /* @__PURE__ */ jsx(Plus, { className: "mr-2 h-4 w-4" }),
-        "New Board"
-      ] })
+        localization?.newBoard ?? t("kanban.list.newBoard", "New Board")
+      ] }) })
     ] }),
     boards.length > 0 ? /* @__PURE__ */ jsx("div", { className: "grid gap-4 md:grid-cols-2 lg:grid-cols-3", children: boards.map((board) => /* @__PURE__ */ jsx(
       Link,
@@ -44,10 +46,9 @@ function BoardsListPage() {
             board.description && /* @__PURE__ */ jsx(CardDescription, { className: "line-clamp-2", children: board.description })
           ] }),
           /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-sm text-muted-foreground", children: [
-            /* @__PURE__ */ jsxs("span", { children: [
-              board.columns?.length || 0,
-              " columns"
-            ] }),
+            /* @__PURE__ */ jsx("span", { children: localization?.columnsCount ? `${board.columns?.length || 0} ${localization.columnsCount}` : t("kanban.list.columnsCount", "{{count}} columns", {
+              count: board.columns?.length || 0
+            }) }),
             /* @__PURE__ */ jsx("span", { children: format(new Date(board.createdAt), "MMM d, yyyy") })
           ] }) })
         ] })
@@ -56,12 +57,15 @@ function BoardsListPage() {
     )) }) : /* @__PURE__ */ jsx(
       EmptyState,
       {
-        title: "No boards yet",
-        description: "Create your first kanban board to start organizing your tasks.",
-        action: /* @__PURE__ */ jsxs(Button, { onClick: handleNewBoard, children: [
+        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: /* @__PURE__ */ jsx(CanAccess, { resource: "kanban:board", action: "create", children: /* @__PURE__ */ jsxs(Button, { onClick: handleNewBoard, children: [
           /* @__PURE__ */ jsx(Plus, { className: "mr-2 h-4 w-4" }),
-          "Create Board"
-        ] })
+          localization?.createBoard ?? t("kanban.forms.createBoard", "Create Board")
+        ] }) })
       }
     )
   ] });

package/dist/packages/stack/src/plugins/kanban/client/components/pages/boards-list-page.mjs

@@ -16,6 +16,7 @@ function BoardsListPageComponent() {
     ComposedRoute,
     {
       path: "/kanban",
+      permission: { resource: "kanban:board", action: "read" },
       PageComponent: BoardsListPage,
       ErrorComponent: DefaultError,
       LoadingComponent: BoardsListSkeleton,

package/dist/packages/stack/src/plugins/kanban/client/components/pages/new-board-page.cjs

@@ -18,6 +18,7 @@ function NewBoardPageComponent() {
     components.ComposedRoute,
     {
       path: "/kanban/new",
+      permission: { resource: "kanban:board", action: "create" },
       PageComponent: NewBoardPage,
       ErrorComponent: defaultError.DefaultError,
       LoadingComponent: boardsListSkeleton.BoardsListSkeleton,