@btst/stack 2.12.2 → 3.0.0-rc.1

package/dist/packages/stack/src/plugins/ai-chat/client/components/chat-sidebar.mjs

@@ -6,28 +6,44 @@ import { Input } from '../../../../../../ui/src/components/input.mjs';
 import { ScrollArea } from '../../../../../../ui/src/components/scroll-area.mjs';
 import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from '../../../../../../ui/src/components/dropdown-menu.mjs';
 import { AlertDialog, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogCancel, AlertDialogAction } from '../../../../../../ui/src/components/alert-dialog.mjs';
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from '../../../../../../ui/src/components/dialog.mjs';
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter } from '../../../../../../ui/src/components/dialog.mjs';
 import { MessageSquarePlus, MessageSquare, MoreHorizontal, Pencil, Trash2 } from 'lucide-react';
 import { cn } from '../../../../../../ui/src/lib/utils.mjs';
-import { usePluginOverrides, useBasePath } from '@btst/stack/context';
-import { useConversations, useRenameConversation, useDeleteConversation } from '../hooks/chat-hooks.mjs';
-import { AI_CHAT_LOCALIZATION } from '../localization/index.mjs';
+import { usePluginOverrides, useStack, useBasePath, useNotify, useCan, CanAccess } from '@btst/stack/context';
+import { useConversations, useDeleteConversation, useRenameConversationForm } from '../hooks/chat-hooks.mjs';
+import { useAiChatTranslation } from '../localization/index.mjs';
 
 function ChatSidebar({
   currentConversationId,
   onNewChat,
   className
 }) {
-  const { navigate, localization: customLocalization } = usePluginOverrides("ai-chat", {});
+  const { localization: customLocalization } = usePluginOverrides("ai-chat", {});
+  const { router } = useStack();
+  const navigate = router?.navigate;
   const basePath = useBasePath();
-  const localization = { ...AI_CHAT_LOCALIZATION, ...customLocalization };
-  const { conversations, isLoading } = useConversations();
-  const renameMutation = useRenameConversation();
+  const notify = useNotify();
+  const tr = useAiChatTranslation(customLocalization);
+  const { can: canRead, isPending: isReadPermissionPending } = useCan({
+    resource: "ai-chat:conversation",
+    action: "read"
+  });
+  const { conversations, isLoading } = useConversations({
+    enabled: !isReadPermissionPending && canRead
+  });
   const deleteMutation = useDeleteConversation();
   const [renameDialogOpen, setRenameDialogOpen] = useState(false);
   const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
   const [selectedConversation, setSelectedConversation] = useState(null);
   const [newTitle, setNewTitle] = useState("");
+  const renameForm = useRenameConversationForm({
+    conversation: selectedConversation,
+    onSuccess: () => {
+      setRenameDialogOpen(false);
+      setSelectedConversation(null);
+      setNewTitle("");
+    }
+  });
   const handleNewChat = () => {
     if (navigate) {
       navigate(`${basePath}/chat`);
@@ -42,6 +58,7 @@ function ChatSidebar({
     }
   };
   const handleRenameClick = (conversation) => {
+    renameForm.clearErrors();
     setSelectedConversation(conversation);
     setNewTitle(conversation.title);
     setRenameDialogOpen(true);
@@ -51,23 +68,34 @@ function ChatSidebar({
     setDeleteDialogOpen(true);
   };
   const handleRenameConfirm = async () => {
-    if (selectedConversation && newTitle.trim()) {
-      await renameMutation.mutateAsync({
-        id: selectedConversation.id,
-        title: newTitle.trim()
-      });
-      setRenameDialogOpen(false);
-      setSelectedConversation(null);
-      setNewTitle("");
+    if (selectedConversation) {
+      await renameForm.submit({ title: newTitle });
     }
   };
   const handleDeleteConfirm = async () => {
     if (selectedConversation) {
-      await deleteMutation.mutateAsync({ id: selectedConversation.id });
-      setDeleteDialogOpen(false);
-      setSelectedConversation(null);
-      if (selectedConversation.id === currentConversationId && navigate) {
-        navigate(`${basePath}/chat`);
+      try {
+        await deleteMutation.mutateAsync({ id: selectedConversation.id });
+        notify.success(
+          tr(
+            "CONVERSATION_DELETE_SUCCESS",
+            "aiChat.toasts.deleteSuccess",
+            "Conversation deleted"
+          )
+        );
+        setDeleteDialogOpen(false);
+        setSelectedConversation(null);
+        if (selectedConversation.id === currentConversationId && navigate) {
+          await navigate(`${basePath}/chat`);
+        }
+      } catch {
+        notify.error(
+          tr(
+            "CONVERSATION_DELETE_FAILURE",
+            "aiChat.toasts.deleteFailure",
+            "Failed to delete conversation"
+          )
+        );
       }
     }
   };
@@ -78,14 +106,28 @@ function ChatSidebar({
     const diffMins = Math.floor(diffMs / 6e4);
     const diffHours = Math.floor(diffMs / 36e5);
     const diffDays = Math.floor(diffMs / 864e5);
-    if (diffMins < 1) return localization.TIME_JUST_NOW;
+    if (diffMins < 1)
+      return tr("TIME_JUST_NOW", "aiChat.time.justNow", "Just now");
     if (diffMins < 60)
-      return localization.TIME_MINUTES_AGO.replace("{count}", String(diffMins));
+      return tr(
+        "TIME_MINUTES_AGO",
+        "aiChat.time.minutesAgo",
+        "{{count}} minutes ago",
+        { count: diffMins }
+      );
     if (diffHours < 24)
-      return localization.TIME_HOURS_AGO.replace("{count}", String(diffHours));
-    if (diffDays === 1) return localization.TIME_YESTERDAY;
+      return tr(
+        "TIME_HOURS_AGO",
+        "aiChat.time.hoursAgo",
+        "{{count}} hours ago",
+        { count: diffHours }
+      );
+    if (diffDays === 1)
+      return tr("TIME_YESTERDAY", "aiChat.time.yesterday", "Yesterday");
     if (diffDays < 7)
-      return localization.TIME_DAYS_AGO.replace("{count}", String(diffDays));
+      return tr("TIME_DAYS_AGO", "aiChat.time.daysAgo", "{{count}} days ago", {
+        count: diffDays
+      });
     return date.toLocaleDateString();
   };
   return /* @__PURE__ */ jsxs(
@@ -94,7 +136,7 @@ function ChatSidebar({
       "data-testid": "chat-sidebar",
       className: cn("flex flex-col h-full bg-muted/30 border-r", className),
       children: [
-        /* @__PURE__ */ jsx("div", { className: "p-4 border-b", children: /* @__PURE__ */ jsxs(
+        /* @__PURE__ */ jsx("div", { className: "p-4 border-b", children: /* @__PURE__ */ jsx(CanAccess, { resource: "ai-chat:conversation", action: "create", children: /* @__PURE__ */ jsxs(
           Button,
           {
             onClick: handleNewChat,
@@ -102,11 +144,15 @@ function ChatSidebar({
             variant: "outline",
             children: [
               /* @__PURE__ */ jsx(MessageSquarePlus, { className: "h-4 w-4" }),
-              localization.SIDEBAR_NEW_CHAT
+              tr("SIDEBAR_NEW_CHAT", "aiChat.sidebar.newChat", "New chat")
             ]
           }
-        ) }),
-        /* @__PURE__ */ jsx(ScrollArea, { className: "flex-1 [&_[data-slot=scroll-area-viewport]>div]:!block", children: /* @__PURE__ */ jsx("div", { className: "p-2", children: isLoading ? /* @__PURE__ */ jsx("div", { className: "p-4 text-center text-sm text-muted-foreground", children: localization.CHAT_LOADING }) : conversations.length === 0 ? /* @__PURE__ */ jsx("div", { className: "p-4 text-center text-sm text-muted-foreground", children: localization.SIDEBAR_NO_CONVERSATIONS }) : /* @__PURE__ */ jsx("div", { className: "space-y-1", children: conversations.map((conversation) => /* @__PURE__ */ jsxs(
+        ) }) }),
+        /* @__PURE__ */ jsx(ScrollArea, { className: "flex-1 [&_[data-slot=scroll-area-viewport]>div]:!block", children: /* @__PURE__ */ jsx("div", { className: "p-2", children: isLoading ? /* @__PURE__ */ jsx("div", { className: "p-4 text-center text-sm text-muted-foreground", children: tr("CHAT_LOADING", "aiChat.chat.loading", "Thinking...") }) : conversations.length === 0 ? /* @__PURE__ */ jsx("div", { className: "p-4 text-center text-sm text-muted-foreground", children: tr(
+          "SIDEBAR_NO_CONVERSATIONS",
+          "aiChat.sidebar.empty",
+          "No conversations yet"
+        ) }) : /* @__PURE__ */ jsx("div", { className: "space-y-1", children: conversations.map((conversation) => /* @__PURE__ */ jsxs(
           "div",
           {
             className: cn(
@@ -129,42 +175,71 @@ function ChatSidebar({
                   ]
                 }
               ),
-              /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+              /* @__PURE__ */ jsxs(DropdownMenu, { modal: false, children: [
                 /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
                   Button,
                   {
                     variant: "ghost",
                     size: "icon",
                     className: "h-8 w-8 opacity-0 group-hover:opacity-100 transition-opacity",
+                    "aria-label": tr(
+                      "A11Y_CONVERSATION_ACTIONS",
+                      "aiChat.a11y.conversationActions",
+                      "Conversation actions"
+                    ),
                     children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "h-4 w-4" })
                   }
                 ) }),
                 /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", children: [
-                  /* @__PURE__ */ jsxs(
-                    DropdownMenuItem,
+                  /* @__PURE__ */ jsx(
+                    CanAccess,
                     {
-                      onClick: (e) => {
-                        e.stopPropagation();
-                        handleRenameClick(conversation);
-                      },
-                      children: [
-                        /* @__PURE__ */ jsx(Pencil, { className: "h-4 w-4 mr-2" }),
-                        localization.CONVERSATION_RENAME
-                      ]
+                      resource: "ai-chat:conversation",
+                      action: "update",
+                      params: { id: conversation.id },
+                      children: /* @__PURE__ */ jsxs(
+                        DropdownMenuItem,
+                        {
+                          onClick: (e) => {
+                            e.stopPropagation();
+                            handleRenameClick(conversation);
+                          },
+                          children: [
+                            /* @__PURE__ */ jsx(Pencil, { className: "h-4 w-4 mr-2" }),
+                            tr(
+                              "CONVERSATION_RENAME",
+                              "aiChat.conversation.rename",
+                              "Rename"
+                            )
+                          ]
+                        }
+                      )
                     }
                   ),
-                  /* @__PURE__ */ jsxs(
-                    DropdownMenuItem,
+                  /* @__PURE__ */ jsx(
+                    CanAccess,
                     {
-                      onClick: (e) => {
-                        e.stopPropagation();
-                        handleDeleteClick(conversation);
-                      },
-                      className: "text-destructive focus:text-destructive",
-                      children: [
-                        /* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4 mr-2" }),
-                        localization.CONVERSATION_DELETE
-                      ]
+                      resource: "ai-chat:conversation",
+                      action: "delete",
+                      params: { id: conversation.id },
+                      children: /* @__PURE__ */ jsxs(
+                        DropdownMenuItem,
+                        {
+                          onClick: (e) => {
+                            e.stopPropagation();
+                            handleDeleteClick(conversation);
+                          },
+                          className: "text-destructive focus:text-destructive",
+                          children: [
+                            /* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4 mr-2" }),
+                            tr(
+                              "CONVERSATION_DELETE",
+                              "aiChat.conversation.delete",
+                              "Delete"
+                            )
+                          ]
+                        }
+                      )
                     }
                   )
                 ] })
@@ -173,53 +248,112 @@ function ChatSidebar({
           },
           conversation.id
         )) }) }) }),
-        /* @__PURE__ */ jsx(Dialog, { open: renameDialogOpen, onOpenChange: setRenameDialogOpen, children: /* @__PURE__ */ jsxs(DialogContent, { children: [
-          /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: localization.CONVERSATION_RENAME }) }),
-          /* @__PURE__ */ jsx(
-            Input,
-            {
-              value: newTitle,
-              onChange: (e) => setNewTitle(e.target.value),
-              placeholder: localization.CONVERSATION_RENAME_PLACEHOLDER,
-              onKeyDown: (e) => {
-                if (e.key === "Enter") {
-                  void handleRenameConfirm();
+        /* @__PURE__ */ jsx(
+          Dialog,
+          {
+            open: renameDialogOpen,
+            onOpenChange: (open) => {
+              setRenameDialogOpen(open);
+              if (!open) renameForm.clearErrors();
+            },
+            children: /* @__PURE__ */ jsxs(DialogContent, { children: [
+              /* @__PURE__ */ jsxs(DialogHeader, { children: [
+                /* @__PURE__ */ jsx(DialogTitle, { children: tr(
+                  "CONVERSATION_RENAME",
+                  "aiChat.conversation.rename",
+                  "Rename"
+                ) }),
+                /* @__PURE__ */ jsx(DialogDescription, { children: tr(
+                  "CONVERSATION_RENAME_DESCRIPTION",
+                  "aiChat.conversation.renameDescription",
+                  "Enter a new title for this conversation."
+                ) })
+              ] }),
+              /* @__PURE__ */ jsx(
+                Input,
+                {
+                  value: newTitle,
+                  onChange: (e) => setNewTitle(e.target.value),
+                  placeholder: tr(
+                    "CONVERSATION_RENAME_PLACEHOLDER",
+                    "aiChat.conversation.renamePlaceholder",
+                    "Enter conversation name"
+                  ),
+                  "aria-invalid": !!renameForm.fieldErrors.title,
+                  onKeyDown: (e) => {
+                    if (e.key === "Enter") {
+                      void handleRenameConfirm();
+                    }
+                  }
                 }
-              }
-            }
-          ),
-          /* @__PURE__ */ jsxs(DialogFooter, { children: [
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                variant: "outline",
-                onClick: () => setRenameDialogOpen(false),
-                children: localization.CONVERSATION_RENAME_CANCEL
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                onClick: handleRenameConfirm,
-                disabled: !newTitle.trim() || renameMutation.isPending,
-                children: localization.CONVERSATION_RENAME_SAVE
-              }
-            )
-          ] })
-        ] }) }),
+              ),
+              renameForm.fieldErrors.title && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", role: "alert", children: tr(
+                "CONVERSATION_TITLE_REQUIRED",
+                "aiChat.conversation.titleRequired",
+                "Title is required"
+              ) }),
+              /* @__PURE__ */ jsxs(DialogFooter, { children: [
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "outline",
+                    onClick: () => setRenameDialogOpen(false),
+                    children: tr(
+                      "CONVERSATION_RENAME_CANCEL",
+                      "aiChat.conversation.renameCancel",
+                      "Cancel"
+                    )
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    onClick: handleRenameConfirm,
+                    disabled: renameForm.isSubmitting,
+                    children: tr(
+                      "CONVERSATION_RENAME_SAVE",
+                      "aiChat.conversation.renameSave",
+                      "Save"
+                    )
+                  }
+                )
+              ] })
+            ] })
+          }
+        ),
         /* @__PURE__ */ jsx(AlertDialog, { open: deleteDialogOpen, onOpenChange: setDeleteDialogOpen, children: /* @__PURE__ */ jsxs(AlertDialogContent, { children: [
           /* @__PURE__ */ jsxs(AlertDialogHeader, { children: [
-            /* @__PURE__ */ jsx(AlertDialogTitle, { children: localization.CONVERSATION_DELETE_CONFIRM_TITLE }),
-            /* @__PURE__ */ jsx(AlertDialogDescription, { children: localization.CONVERSATION_DELETE_CONFIRM_DESCRIPTION })
+            /* @__PURE__ */ jsx(AlertDialogTitle, { children: tr(
+              "CONVERSATION_DELETE_CONFIRM_TITLE",
+              "aiChat.conversation.deleteConfirmTitle",
+              "Delete conversation"
+            ) }),
+            /* @__PURE__ */ jsx(AlertDialogDescription, { children: tr(
+              "CONVERSATION_DELETE_CONFIRM_DESCRIPTION",
+              "aiChat.conversation.deleteConfirmDescription",
+              "Are you sure you want to delete this conversation? This action cannot be undone."
+            ) })
           ] }),
           /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [
-            /* @__PURE__ */ jsx(AlertDialogCancel, { children: localization.CONVERSATION_DELETE_CANCEL }),
+            /* @__PURE__ */ jsx(AlertDialogCancel, { children: tr(
+              "CONVERSATION_DELETE_CANCEL",
+              "aiChat.conversation.deleteCancel",
+              "Cancel"
+            ) }),
             /* @__PURE__ */ jsx(
               AlertDialogAction,
               {
-                onClick: handleDeleteConfirm,
+                onClick: (event) => {
+                  event.preventDefault();
+                  void handleDeleteConfirm();
+                },
+                disabled: deleteMutation.isPending,
                 className: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
-                children: localization.CONVERSATION_DELETE_CONFIRM_BUTTON
+                children: tr(
+                  "CONVERSATION_DELETE_CONFIRM_BUTTON",
+                  "aiChat.conversation.deleteConfirmButton",
+                  "Delete"
+                )
               }
             )
           ] })

package/dist/packages/stack/src/plugins/ai-chat/client/components/pages/404-page.cjs

@@ -8,10 +8,19 @@ const index = require('../../localization/index.cjs');
 
 function NotFoundPage({ message }) {
   const { localization } = context.usePluginOverrides("ai-chat", {
-    localization: index.AI_CHAT_LOCALIZATION
+    localization: {}
   });
-  const title = localization?.CHAT_PAGE_NOT_FOUND_TITLE ?? index.AI_CHAT_LOCALIZATION.CHAT_PAGE_NOT_FOUND_TITLE;
-  const desc = message || (localization?.CHAT_PAGE_NOT_FOUND_DESCRIPTION ?? index.AI_CHAT_LOCALIZATION.CHAT_PAGE_NOT_FOUND_DESCRIPTION);
+  const tr = index.useAiChatTranslation(localization);
+  const title = tr(
+    "CHAT_PAGE_NOT_FOUND_TITLE",
+    "aiChat.errors.notFoundTitle",
+    "Chat not found"
+  );
+  const desc = message || tr(
+    "CHAT_PAGE_NOT_FOUND_DESCRIPTION",
+    "aiChat.errors.notFoundDescription",
+    "The conversation you're looking for doesn't exist or has been deleted."
+  );
   return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-testid": "404-page", className: "flex flex-col h-[calc(100vh-4rem)]", children: /* @__PURE__ */ jsxRuntime.jsx(errorPlaceholder.ErrorPlaceholder, { title, message: desc }) });
 }
 

package/dist/packages/stack/src/plugins/ai-chat/client/components/pages/404-page.mjs

@@ -2,14 +2,23 @@
 import { jsx } from 'react/jsx-runtime';
 import { usePluginOverrides } from '@btst/stack/context';
 import { ErrorPlaceholder } from '../shared/error-placeholder.mjs';
-import { AI_CHAT_LOCALIZATION } from '../../localization/index.mjs';
+import { useAiChatTranslation } from '../../localization/index.mjs';
 
 function NotFoundPage({ message }) {
   const { localization } = usePluginOverrides("ai-chat", {
-    localization: AI_CHAT_LOCALIZATION
+    localization: {}
   });
-  const title = localization?.CHAT_PAGE_NOT_FOUND_TITLE ?? AI_CHAT_LOCALIZATION.CHAT_PAGE_NOT_FOUND_TITLE;
-  const desc = message || (localization?.CHAT_PAGE_NOT_FOUND_DESCRIPTION ?? AI_CHAT_LOCALIZATION.CHAT_PAGE_NOT_FOUND_DESCRIPTION);
+  const tr = useAiChatTranslation(localization);
+  const title = tr(
+    "CHAT_PAGE_NOT_FOUND_TITLE",
+    "aiChat.errors.notFoundTitle",
+    "Chat not found"
+  );
+  const desc = message || tr(
+    "CHAT_PAGE_NOT_FOUND_DESCRIPTION",
+    "aiChat.errors.notFoundDescription",
+    "The conversation you're looking for doesn't exist or has been deleted."
+  );
   return /* @__PURE__ */ jsx("div", { "data-testid": "404-page", className: "flex flex-col h-[calc(100vh-4rem)]", children: /* @__PURE__ */ jsx(ErrorPlaceholder, { title, message: desc }) });
 }
 

package/dist/packages/stack/src/plugins/ai-chat/client/components/pages/chat-page.cjs

@@ -13,11 +13,16 @@ const ChatPage = React.lazy(
   () => import('./chat-page.internal.cjs').then((m) => ({ default: m.ChatPage }))
 );
 function ChatPageComponent({ conversationId }) {
-  const { onRouteError } = context.usePluginOverrides("ai-chat", {});
+  const { mode, onRouteError } = context.usePluginOverrides("ai-chat", {});
   return /* @__PURE__ */ jsxRuntime.jsx(
     components.ComposedRoute,
     {
       path: conversationId ? `/chat/${conversationId}` : "/chat",
+      permission: mode === "public" ? void 0 : {
+        resource: "ai-chat:conversation",
+        action: "read",
+        params: conversationId ? { id: conversationId } : void 0
+      },
       PageComponent: ChatPage,
       ErrorComponent: defaultError.DefaultError,
       LoadingComponent: index.ChatLoading,

package/dist/packages/stack/src/plugins/ai-chat/client/components/pages/chat-page.internal.cjs

@@ -2,21 +2,30 @@
 'use strict';
 
 const jsxRuntime = require('react/jsx-runtime');
+const React = require('react');
 const chatLayout = require('../chat-layout.cjs');
 const context = require('@btst/stack/context');
+const useRouteLifecycle = require('../../../../../../../ui/src/hooks/use-route-lifecycle.cjs');
 
 function ChatPage({ conversationId }) {
-  const { apiBaseURL, apiBasePath, mode } = context.usePluginOverrides("ai-chat", {});
-  const showSidebar = mode !== "public";
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    chatLayout.ChatLayout,
-    {
-      apiBaseURL: apiBaseURL ?? "",
-      apiBasePath: apiBasePath ?? "",
-      conversationId,
-      showSidebar
-    }
+  const overrides = context.usePluginOverrides("ai-chat", {});
+  const { mode } = overrides;
+  const routeName = conversationId ? "chatConversation" : "chat";
+  const context$1 = React.useMemo(
+    () => ({
+      path: conversationId ? `/chat/${conversationId}` : "/chat",
+      params: conversationId ? { id: conversationId } : void 0,
+      isSSR: typeof window === "undefined"
+    }),
+    [conversationId]
   );
+  useRouteLifecycle.useRouteLifecycle({
+    routeName,
+    context: context$1,
+    overrides
+  });
+  const showSidebar = mode !== "public";
+  return /* @__PURE__ */ jsxRuntime.jsx(chatLayout.ChatLayout, { conversationId, showSidebar });
 }
 
 exports.ChatPage = ChatPage;

package/dist/packages/stack/src/plugins/ai-chat/client/components/pages/chat-page.internal.mjs

@@ -1,20 +1,29 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
+import { useMemo } from 'react';
 import { ChatLayout } from '../chat-layout.mjs';
 import { usePluginOverrides } from '@btst/stack/context';
+import { useRouteLifecycle } from '../../../../../../../ui/src/hooks/use-route-lifecycle.mjs';
 
 function ChatPage({ conversationId }) {
-  const { apiBaseURL, apiBasePath, mode } = usePluginOverrides("ai-chat", {});
-  const showSidebar = mode !== "public";
-  return /* @__PURE__ */ jsx(
-    ChatLayout,
-    {
-      apiBaseURL: apiBaseURL ?? "",
-      apiBasePath: apiBasePath ?? "",
-      conversationId,
-      showSidebar
-    }
+  const overrides = usePluginOverrides("ai-chat", {});
+  const { mode } = overrides;
+  const routeName = conversationId ? "chatConversation" : "chat";
+  const context = useMemo(
+    () => ({
+      path: conversationId ? `/chat/${conversationId}` : "/chat",
+      params: conversationId ? { id: conversationId } : void 0,
+      isSSR: typeof window === "undefined"
+    }),
+    [conversationId]
   );
+  useRouteLifecycle({
+    routeName,
+    context,
+    overrides
+  });
+  const showSidebar = mode !== "public";
+  return /* @__PURE__ */ jsx(ChatLayout, { conversationId, showSidebar });
 }
 
 export { ChatPage };

package/dist/packages/stack/src/plugins/ai-chat/client/components/pages/chat-page.mjs

@@ -11,11 +11,16 @@ const ChatPage = lazy(
   () => import('./chat-page.internal.mjs').then((m) => ({ default: m.ChatPage }))
 );
 function ChatPageComponent({ conversationId }) {
-  const { onRouteError } = usePluginOverrides("ai-chat", {});
+  const { mode, onRouteError } = usePluginOverrides("ai-chat", {});
   return /* @__PURE__ */ jsx(
     ComposedRoute,
     {
       path: conversationId ? `/chat/${conversationId}` : "/chat",
+      permission: mode === "public" ? void 0 : {
+        resource: "ai-chat:conversation",
+        action: "read",
+        params: conversationId ? { id: conversationId } : void 0
+      },
       PageComponent: ChatPage,
       ErrorComponent: DefaultError,
       LoadingComponent: ChatLoading,

package/dist/packages/stack/src/plugins/ai-chat/client/components/shared/default-error.cjs

@@ -8,10 +8,23 @@ const index = require('../../localization/index.cjs');
 
 function DefaultError({ error }) {
   const { localization } = context.usePluginOverrides("ai-chat", {
-    localization: index.AI_CHAT_LOCALIZATION
+    localization: {}
   });
-  const title = localization?.CHAT_GENERIC_ERROR_TITLE ?? index.AI_CHAT_LOCALIZATION.CHAT_GENERIC_ERROR_TITLE;
-  const message = process.env.NODE_ENV === "production" ? localization?.CHAT_GENERIC_ERROR_MESSAGE ?? index.AI_CHAT_LOCALIZATION.CHAT_GENERIC_ERROR_MESSAGE : (error instanceof Error ? error.message : void 0) ?? localization?.CHAT_GENERIC_ERROR_MESSAGE ?? index.AI_CHAT_LOCALIZATION.CHAT_GENERIC_ERROR_MESSAGE;
+  const tr = index.useAiChatTranslation(localization);
+  const title = tr(
+    "CHAT_GENERIC_ERROR_TITLE",
+    "aiChat.errors.genericTitle",
+    "Something went wrong"
+  );
+  const message = process.env.NODE_ENV === "production" ? tr(
+    "CHAT_GENERIC_ERROR_MESSAGE",
+    "aiChat.errors.genericMessage",
+    "An error occurred while loading the chat. Please try again."
+  ) : (error instanceof Error ? error.message : void 0) ?? tr(
+    "CHAT_GENERIC_ERROR_MESSAGE",
+    "aiChat.errors.genericMessage",
+    "An error occurred while loading the chat. Please try again."
+  );
   return /* @__PURE__ */ jsxRuntime.jsx(errorPlaceholder.ErrorPlaceholder, { title, message });
 }
 

package/dist/packages/stack/src/plugins/ai-chat/client/components/shared/default-error.mjs

@@ -2,14 +2,27 @@
 import { jsx } from 'react/jsx-runtime';
 import { ErrorPlaceholder } from './error-placeholder.mjs';
 import { usePluginOverrides } from '@btst/stack/context';
-import { AI_CHAT_LOCALIZATION } from '../../localization/index.mjs';
+import { useAiChatTranslation } from '../../localization/index.mjs';
 
 function DefaultError({ error }) {
   const { localization } = usePluginOverrides("ai-chat", {
-    localization: AI_CHAT_LOCALIZATION
+    localization: {}
   });
-  const title = localization?.CHAT_GENERIC_ERROR_TITLE ?? AI_CHAT_LOCALIZATION.CHAT_GENERIC_ERROR_TITLE;
-  const message = process.env.NODE_ENV === "production" ? localization?.CHAT_GENERIC_ERROR_MESSAGE ?? AI_CHAT_LOCALIZATION.CHAT_GENERIC_ERROR_MESSAGE : (error instanceof Error ? error.message : void 0) ?? localization?.CHAT_GENERIC_ERROR_MESSAGE ?? AI_CHAT_LOCALIZATION.CHAT_GENERIC_ERROR_MESSAGE;
+  const tr = useAiChatTranslation(localization);
+  const title = tr(
+    "CHAT_GENERIC_ERROR_TITLE",
+    "aiChat.errors.genericTitle",
+    "Something went wrong"
+  );
+  const message = process.env.NODE_ENV === "production" ? tr(
+    "CHAT_GENERIC_ERROR_MESSAGE",
+    "aiChat.errors.genericMessage",
+    "An error occurred while loading the chat. Please try again."
+  ) : (error instanceof Error ? error.message : void 0) ?? tr(
+    "CHAT_GENERIC_ERROR_MESSAGE",
+    "aiChat.errors.genericMessage",
+    "An error occurred while loading the chat. Please try again."
+  );
   return /* @__PURE__ */ jsx(ErrorPlaceholder, { title, message });
 }