@nocobase/portal-template-default 1.0.3 → 1.0.5

package/registry/nocobase-i18n/locales/zh-CN.ts

@@ -1,53 +1,4 @@
 const zhCN = {
-  starter: {
-    "shell.workspace": "AI 应用工作区",
-    "shell.footer.freedom": "AI 自由构建。",
-    "shell.footer.reliability": "NocoBase 保障可靠运行。",
-    "auth.signOut": "退出登录",
-    "auth.signingOut": "正在退出...",
-    "buttons.apply": "应用",
-    "buttons.clear": "清除",
-    "buttons.undo": "撤销",
-    "pages.error.title": "页面不存在",
-    "pages.error.description": "你访问的页面不存在。",
-    "pages.error.backHome": "返回首页",
-    "table.filter.text.placeholder": "输入筛选内容...",
-    "table.filter.numeric.placeholder": "输入筛选数值...",
-    "table.filter.combobox.placeholder": "请选择...",
-    "table.filter.combobox.search": "搜索...",
-    "table.filter.combobox.noResults": "没有找到结果。",
-    "table.filter.operator.placeholder": "搜索操作符...",
-    "table.filter.operator.noResults": "没有找到操作符。",
-    "table.filter.operator.eq": "等于",
-    "table.filter.operator.ne": "不等于",
-    "table.filter.operator.lt": "小于",
-    "table.filter.operator.gt": "大于",
-    "table.filter.operator.lte": "小于或等于",
-    "table.filter.operator.gte": "大于或等于",
-    "table.filter.operator.in": "包含于数组",
-    "table.filter.operator.nin": "不包含于数组",
-    "table.filter.operator.ina": "包含于数组（区分大小写）",
-    "table.filter.operator.nina": "不包含于数组（区分大小写）",
-    "table.filter.operator.contains": "包含",
-    "table.filter.operator.ncontains": "不包含",
-    "table.filter.operator.containss": "包含（区分大小写）",
-    "table.filter.operator.ncontainss": "不包含（区分大小写）",
-    "table.filter.operator.between": "介于",
-    "table.filter.operator.nbetween": "不介于",
-    "table.filter.operator.null": "为空",
-    "table.filter.operator.nnull": "不为空",
-    "table.filter.operator.startswith": "开头是",
-    "table.filter.operator.nstartswith": "开头不是",
-    "table.filter.operator.startswiths": "开头是（区分大小写）",
-    "table.filter.operator.nstartswiths": "开头不是（区分大小写）",
-    "table.filter.operator.endswith": "结尾是",
-    "table.filter.operator.nendswith": "结尾不是",
-    "table.filter.operator.endswiths": "结尾是（区分大小写）",
-    "table.filter.operator.nendswiths": "结尾不是（区分大小写）",
-    "table.filter.operator.eqs": "等于（区分大小写）",
-    "table.filter.operator.nes": "不等于（区分大小写）",
-  },
-  "nocobase-i18n": {
     "language.label": "语言",
     "language.current": "当前语言",
     "language.switchError": "无法切换语言。",
@@ -55,7 +6,7 @@ const zhCN = {
     "navigation.demo": "国际化",
     "demo.title": "国际化",
     "demo.description":
-      "结合前端 UI 资源和指定 NocoBase 动态 namespace 的可选混合语言运行时。",
+      "基于 Starter 国际化运行时的可选 NocoBase 服务端翻译与语言切换能力。",
     "demo.switcher.title": "语言切换器",
     "demo.switcher.description": "同一个可复用组件也会集成到登录用户菜单中。",
     "demo.switcher.unavailable.title": "当前仅启用一种语言",
@@ -63,7 +14,7 @@ const zhCN = {
       "请在 NocoBase 系统设置中启用其他语言，语言切换器才会显示。",
     "demo.frontend.title": "应用 UI 文案翻译",
     "demo.frontend.description":
-      "Starter 和 Registry 组件的界面文案保存在各自的本地语言资源中。",
+      "Starter 提供运行时，应用和 Registry 组件分别维护自己的本地语言资源。",
     "demo.frontend.actions": "常用操作",
     "demo.server.title": "NocoBase 元数据翻译",
     "demo.server.description":
@@ -79,7 +30,6 @@ const zhCN = {
     "demo.prompt.copyError": "无法访问剪贴板，请手动选中并复制提示词。",
     "demo.prompt.output": "生成的提示词",
     "demo.prompt.outputDescription": "修改场景和语言要求时会实时更新。",
-  },
 } as const;
 
 export default zhCN;

package/registry/nocobase-i18n/provider.tsx

@@ -1,18 +1,30 @@
 import { useEffect, useState, type PropsWithChildren } from "react";
 
 import { LoadingState } from "@/components/app-shell/loading-state";
-import { setTranslationResolver } from "@/lib/i18n";
+import { nocobaseClient } from "@/lib/nocobase/client";
+import { setLocalePersistence } from "@/providers/i18n";
+import { useSystemSettings } from "@/providers/system-settings";
 import { loadServerLocaleResources } from "./server-resources";
-import { translate } from "./runtime";
 
-export function LocalePreferenceProvider({ children }: PropsWithChildren) {
+export function NocoBaseI18nBootstrap({ children }: PropsWithChildren) {
+  const { settings } = useSystemSettings();
   const [ready, setReady] = useState(false);
 
-  useEffect(() => setTranslationResolver(translate), []);
+  useEffect(
+    () =>
+      setLocalePersistence(async (locale) => {
+        if (!nocobaseClient.getToken()) return;
+        await nocobaseClient.action("users", "updateLang", {
+          method: "POST",
+          body: { appLang: locale },
+        });
+      }),
+    []
+  );
 
   useEffect(() => {
     let active = true;
-    void loadServerLocaleResources()
+    void loadServerLocaleResources(settings)
       .catch((error) => {
         console.warn("Unable to load NocoBase locale resources", error);
       })
@@ -22,7 +34,7 @@ export function LocalePreferenceProvider({ children }: PropsWithChildren) {
     return () => {
       active = false;
     };
-  }, []);
+  }, [settings]);
 
   if (!ready) {
     return <LoadingState className="min-h-80" />;

package/registry/nocobase-i18n/server-resources.ts

@@ -1,20 +1,18 @@
 import { nocobaseClient } from "@/lib/nocobase/client";
 import {
-  getLocaleDefinitions,
+  type LocaleSystemSettings,
+  applyDocumentLocale,
+  getCurrentLocale,
+  i18n,
   registerLocale,
   setEnabledLocales,
-} from "./locale-store";
-import { applyDocumentLocale, getCurrentLocale, i18n } from "./runtime";
+} from "@/providers/i18n";
 
 type ServerLanguagePayload = {
   lang?: string;
   resources?: Record<string, Record<string, string>>;
 };
 
-type SystemSettingsPayload = {
-  enabledLanguages?: string[];
-};
-
 const serverResourceNamespaces = new Set(["lm-collections"]);
 const loadedServerResourceNamespaces = new Set<string>();
 const namespaceLoadPromises = new Map<string, Promise<void>>();
@@ -119,37 +117,23 @@ export function getServerResourceNamespaces() {
   return [...serverResourceNamespaces];
 }
 
-export function loadServerLocaleResources() {
+export function loadServerLocaleResources(settings?: LocaleSystemSettings) {
   if (serverResourcesPromise) return serverResourcesPromise;
 
   bootstrapStarted = true;
   const requestedLocale = nocobaseClient.getStoredLocale();
   const initialNamespaces = [...serverResourceNamespaces];
-  const systemSettingsPromise = nocobaseClient
-    .action<SystemSettingsPayload>("systemSettings", "get", {
-      method: "GET",
-      includeRole: false,
-      withAclMeta: false,
-    })
-    .catch((error) => {
-      console.warn("Unable to load enabled NocoBase languages", error);
-      return undefined;
-    })
-    .then((systemSettings) => {
-      const configuredLocales = Array.isArray(systemSettings?.enabledLanguages)
-        ? systemSettings.enabledLanguages
-        : [];
-      if (configuredLocales.length) setEnabledLocales(configuredLocales);
-      return systemSettings;
-    });
+  const configuredLocales = Array.isArray(settings?.enabledLanguages)
+    ? settings.enabledLanguages
+    : [];
+  if (configuredLocales.length) setEnabledLocales(configuredLocales);
   const languagePromise = requestServerResources(
     initialNamespaces,
     requestedLocale
   );
 
-  serverResourcesPromise = Promise.all([systemSettingsPromise, languagePromise])
-    .then(async ([systemSettings, payload]) => {
-      const configuredLocales = systemSettings?.enabledLanguages ?? [];
+  serverResourcesPromise = languagePromise
+    .then(async (payload) => {
       const serverLocale = payload.lang;
 
       if (!configuredLocales.length && serverLocale) {
@@ -173,9 +157,7 @@ export function loadServerLocaleResources() {
     })
     .catch((error) => {
       bootstrapComplete = true;
-      if (!getLocaleDefinitions().length) {
-        setEnabledLocales([getCurrentLocale()]);
-      }
+      if (!configuredLocales.length) setEnabledLocales([getCurrentLocale()]);
       serverResourcesPromise = undefined;
       throw error;
     });

package/registry/nocobase-i18n/tests/i18n-regression.mjs

@@ -9,13 +9,16 @@ const server = await createServer({
 
 try {
   await server.ssrLoadModule("/src/locales/index.ts");
-  const { i18n, registerLocaleResources, translate } =
-    await server.ssrLoadModule("/registry/nocobase-i18n/runtime.ts");
-  const { resolveTranslatableText, setTranslationResolver } =
+  const {
+    applySystemLocale,
+    getCurrentLocale,
+    i18n,
+    registerLocaleResources,
+    translate,
+  } = await server.ssrLoadModule("/src/providers/i18n/runtime.ts");
+  const { resolveTranslatableText } =
     await server.ssrLoadModule("/src/lib/i18n.ts");
 
-  setTranslationResolver(translate);
-
   await i18n.changeLanguage("en-US");
   assert.equal(translate("resources.users", { ns: "app" }, "Users"), "Users");
 
@@ -36,6 +39,12 @@ try {
     "示例"
   );
 
+  await applySystemLocale({
+    appLang: "en-US",
+    enabledLanguages: ["en-US", "zh-CN"],
+  });
+  assert.equal(getCurrentLocale(), "en-US");
+
   console.log("NocoBase i18n regression tests passed");
 } finally {
   await server.close();

package/registry/nocobase-route-surfaces/README.md

@@ -0,0 +1,21 @@
+# Route surfaces
+
+Route surfaces keep URL navigation separate from visual presentation. The same
+business content can be hosted by a routed drawer, dialog, or full page.
+
+The Registry also installs a lazy-loaded Demo route at `/route-surfaces` with
+live drawer, dialog, child-page, nested-drawer, and mixed page/drawer/dialog
+scenarios plus a Prompt generator.
+
+## Components
+
+- `RouteDrawer` supports URL-backed nested drawers and push-style stacking.
+- `RouteDialog` provides the same close contract for modal routes.
+- `RoutePage` provides the close context without an overlay.
+- `useRouteSurfaceClose` lets content request a close without knowing how it is
+  presented.
+- `useRefineUnsavedChangesGuard` adapts Refine's unsaved-change state to the
+  route surface close lifecycle and renders a shadcn Alert Dialog confirmation.
+
+Route definitions, ACL guards, resource data fetching, and application-specific
+paths remain application concerns.

package/registry/nocobase-route-surfaces/demo/index.tsx

@@ -0,0 +1,266 @@
+import { ArrowLeft, ArrowRight, Layers3 } from "lucide-react";
+import { useOutlet, useNavigate } from "react-router";
+
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import {
+  RouteDialog,
+  RouteDrawer,
+  RoutePage,
+  useRouteSurfaceClose,
+} from "../index";
+import { RouteSurfacePromptGenerator } from "./prompt-generator";
+import { routeSurfaceScenarios } from "./scenarios";
+
+const demoBase = "/route-surfaces";
+
+export function RouteSurfacesDemoHome() {
+  const navigate = useNavigate();
+  const overlay = useOutlet();
+
+  return (
+    <>
+      <div className="space-y-6">
+        <div className="space-y-2">
+          <Badge variant="secondary">Route surfaces</Badge>
+          <h1 className="font-heading text-3xl font-semibold tracking-tight">
+            URL-backed pages and overlays
+          </h1>
+          <p className="max-w-3xl text-muted-foreground">
+            Keep business content independent from whether it appears as a page,
+            drawer, dialog, or nested combination. Every preview below supports a
+            direct URL and browser history.
+          </p>
+        </div>
+
+        <div className="grid gap-4 lg:grid-cols-2 xl:grid-cols-3">
+          {routeSurfaceScenarios.map((scenario) => (
+            <Card key={scenario.id} className="flex flex-col">
+              <CardHeader>
+                <div className="flex items-center justify-between gap-3">
+                  <Badge variant="outline">Scenario {scenario.number}</Badge>
+                  <span className="text-xs text-muted-foreground">
+                    {scenario.routeShape}
+                  </span>
+                </div>
+                <CardTitle>{scenario.title}</CardTitle>
+                <CardDescription>{scenario.description}</CardDescription>
+              </CardHeader>
+              <CardContent className="mt-auto">
+                <Button
+                  type="button"
+                  variant="outline"
+                  className="w-full"
+                  onClick={() => navigate(scenario.path)}
+                >
+                  Open preview
+                  <ArrowRight />
+                </Button>
+              </CardContent>
+            </Card>
+          ))}
+        </div>
+
+        <RouteSurfacePromptGenerator />
+      </div>
+      {overlay}
+    </>
+  );
+}
+
+export function DemoDrawerRoute() {
+  const navigate = useNavigate();
+  const nested = useOutlet();
+
+  return (
+    <RouteDrawer
+      title="Customer details"
+      description="A routed drawer keeps the scenario page mounted behind it."
+      closeLabel="Close"
+      closeTo={demoBase}
+      nested={nested}
+    >
+      <DemoSurfaceBody
+        label="Drawer"
+        title="Northwind renewal"
+        description="Business content does not know that it is rendered inside a drawer."
+      >
+        <Button onClick={() => navigate("second")}>
+          Open second-level drawer
+          <ArrowRight />
+        </Button>
+      </DemoSurfaceBody>
+    </RouteDrawer>
+  );
+}
+
+export function DemoSecondDrawerRoute() {
+  return (
+    <RouteDrawer
+      title="Renewal activity"
+      description="The lower drawer is pushed outward and remains behind the layer mask."
+      closeLabel="Close"
+      closeTo={`${demoBase}/drawer`}
+    >
+      <DemoSurfaceBody
+        label="Second-level drawer"
+        title="Latest review"
+        description="Clicking this layer's backdrop closes only the top drawer."
+      />
+    </RouteDrawer>
+  );
+}
+
+export function DemoDialogRoute() {
+  return (
+    <RouteDialog
+      title="Approve renewal"
+      description="A modal route for a focused decision."
+      closeLabel="Close"
+      closeTo={demoBase}
+    >
+      <DemoSurfaceBody
+        label="Dialog"
+        title="Approval required"
+        description="The page stays mounted while the URL represents the active dialog."
+      />
+    </RouteDialog>
+  );
+}
+
+export function DemoPageRoute() {
+  const nested = useOutlet();
+
+  return (
+    <RoutePage closeTo={demoBase}>
+      <DemoPageContent nested={nested} />
+    </RoutePage>
+  );
+}
+
+function DemoPageContent({ nested }: { nested: React.ReactNode }) {
+  const close = useRouteSurfaceClose();
+  const navigate = useNavigate();
+
+  return (
+    <>
+      <div className="space-y-6">
+        <div className="flex flex-wrap items-start justify-between gap-4">
+          <div className="space-y-2">
+            <Badge variant="secondary">Child page</Badge>
+            <h1 className="font-heading text-3xl font-semibold tracking-tight">
+              Customer workspace
+            </h1>
+            <p className="text-muted-foreground">
+              This route replaces the Demo home instead of rendering inside its Outlet.
+            </p>
+          </div>
+          <Button variant="outline" onClick={() => void close()}>
+            <ArrowLeft />
+            Back to scenarios
+          </Button>
+        </div>
+
+        <Card>
+          <CardHeader>
+            <div className="flex items-center gap-2">
+              <Layers3 className="size-5 text-primary" />
+              <CardTitle>Page-owned workflow</CardTitle>
+            </div>
+            <CardDescription>
+              A page can still host routed overlays without becoming coupled to their content.
+            </CardDescription>
+          </CardHeader>
+          <CardContent>
+            <Button onClick={() => navigate("drawer")}>Open page drawer</Button>
+          </CardContent>
+        </Card>
+      </div>
+      {nested}
+    </>
+  );
+}
+
+export function DemoPageDrawerRoute() {
+  const navigate = useNavigate();
+  const nested = useOutlet();
+
+  return (
+    <RouteDrawer
+      title="Customer activity"
+      description="This drawer belongs to the child page route."
+      closeLabel="Close"
+      closeTo={`${demoBase}/page`}
+      nested={nested}
+    >
+      <DemoSurfaceBody
+        label="Page drawer"
+        title="Renewal conversation"
+        description="Open a dialog above this drawer to test mixed presentation types."
+      >
+        <Button onClick={() => navigate("dialog")}>
+          Open confirmation dialog
+          <ArrowRight />
+        </Button>
+      </DemoSurfaceBody>
+    </RouteDrawer>
+  );
+}
+
+export function DemoPageDrawerDialogRoute() {
+  return (
+    <RouteDialog
+      title="Confirm follow-up"
+      description="The dialog is nested in the drawer route subtree."
+      closeLabel="Close"
+      closeTo={`${demoBase}/page/drawer`}
+    >
+      <DemoSurfaceBody
+        label="Nested dialog"
+        title="Schedule a follow-up?"
+        description="Closing returns to the drawer; closing the drawer then returns to the page."
+      />
+    </RouteDialog>
+  );
+}
+
+function DemoSurfaceBody({
+  label,
+  title,
+  description,
+  children,
+}: {
+  label: string;
+  title: string;
+  description: string;
+  children?: React.ReactNode;
+}) {
+  return (
+    <div className="min-h-0 flex-1 overflow-y-auto px-5 py-5">
+      <div className="space-y-5">
+        <Badge variant="outline">{label}</Badge>
+        <div className="space-y-2">
+          <h2 className="text-xl font-semibold">{title}</h2>
+          <p className="text-muted-foreground">{description}</p>
+        </div>
+        <div className="grid gap-3 rounded-lg border bg-muted/30 p-4 sm:grid-cols-2">
+          <DemoField label="Owner" value="Ada Lovelace" />
+          <DemoField label="Status" value="In review" />
+          <DemoField label="Value" value="$48,000" />
+          <DemoField label="Renewal" value="September 30" />
+        </div>
+        {children ? <div>{children}</div> : null}
+      </div>
+    </div>
+  );
+}
+
+function DemoField({ label, value }: { label: string; value: string }) {
+  return (
+    <div className="space-y-1">
+      <div className="text-xs text-muted-foreground">{label}</div>
+      <div className="font-medium">{value}</div>
+    </div>
+  );
+}

package/{src/extensions/nocobase-acl → registry/nocobase-route-surfaces}/demo/lazy-route.tsx

@@ -1,7 +1,8 @@
 import { Suspense, type ReactNode } from "react";
+
 import { LoadingState } from "@/components/app-shell/loading-state";
 
-export function LazyAclRoute({ children }: { children: ReactNode }) {
+export function LazyRouteSurfaceDemo({ children }: { children: ReactNode }) {
   return (
     <Suspense fallback={<LoadingState className="min-h-80" />}>
       {children}

package/registry/nocobase-route-surfaces/demo/prompt-generator.tsx

@@ -0,0 +1,90 @@
+import { Check, Copy } from "lucide-react";
+import { useMemo, useState } from "react";
+
+import { Button } from "@/components/ui/button";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/components/ui/select";
+import { Textarea } from "@/components/ui/textarea";
+import {
+  getRouteSurfacePrompt,
+  routeSurfaceScenarios,
+  type RouteSurfaceScenarioId,
+} from "./scenarios";
+
+export function RouteSurfacePromptGenerator() {
+  const [scenarioId, setScenarioId] =
+    useState<RouteSurfaceScenarioId>("drawer");
+  const [target, setTarget] = useState("a customer detail workflow");
+  const [copied, setCopied] = useState(false);
+  const scenario =
+    routeSurfaceScenarios.find((item) => item.id === scenarioId) ??
+    routeSurfaceScenarios[0];
+  const prompt = useMemo(
+    () => getRouteSurfacePrompt(scenario, target),
+    [scenario, target]
+  );
+
+  const copyPrompt = async () => {
+    await navigator.clipboard.writeText(prompt);
+    setCopied(true);
+    window.setTimeout(() => setCopied(false), 1500);
+  };
+
+  return (
+    <Card>
+      <CardHeader>
+        <CardTitle>Prompt generator</CardTitle>
+        <CardDescription>
+          Generate a complete routing scenario, not just an isolated overlay component.
+        </CardDescription>
+      </CardHeader>
+      <CardContent className="space-y-4">
+        <div className="grid gap-4 md:grid-cols-2">
+          <div className="space-y-2">
+            <Label htmlFor="route-surface-scenario">Scenario</Label>
+            <Select
+              value={scenarioId}
+              onValueChange={(value) =>
+                setScenarioId(value as RouteSurfaceScenarioId)
+              }
+            >
+              <SelectTrigger id="route-surface-scenario" className="w-full">
+                <SelectValue />
+              </SelectTrigger>
+              <SelectContent>
+                {routeSurfaceScenarios.map((item) => (
+                  <SelectItem key={item.id} value={item.id}>
+                    {item.number}. {item.title}
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
+          </div>
+          <div className="space-y-2">
+            <Label htmlFor="route-surface-target">Business target</Label>
+            <Input
+              id="route-surface-target"
+              value={target}
+              onChange={(event) => setTarget(event.target.value)}
+            />
+          </div>
+        </div>
+        <Textarea value={prompt} readOnly className="min-h-80 font-mono text-xs" />
+        <div className="flex justify-end">
+          <Button type="button" onClick={() => void copyPrompt()}>
+            {copied ? <Check /> : <Copy />}
+            {copied ? "Copied" : "Copy prompt"}
+          </Button>
+        </div>
+      </CardContent>
+    </Card>
+  );
+}