@nocobase/app-template-default 1.0.0-beta.86 → 1.0.0-beta.88

package/client/locales/system/settings-zh-CN.ts

@@ -1,4 +1,7 @@
 const settings = {
+  notificationManagementDescription: '查看已登记的通知模板和合成内容预览。',
+  notificationTemplates: '通知模板',
+  notificationManagement: '通知管理',
   listChanged: '列表已变化，请重试。',
   setup: {
     title: '功能前置配置',
@@ -101,6 +104,18 @@ const settings = {
 
   reload: '重新加载角色',
   title: '系统设置',
+  home: {
+    description: '账号、权限、业务配置和系统能力都在这里。',
+    empty: '暂时没有你可以管理的设置。',
+  },
+  categories: {
+    account: '账号与权限',
+    business: '业务配置',
+    ai: 'AI',
+    system: '系统',
+  },
+  permissionManagementDescription:
+    '设置每个角色能打开的页面、能做的操作和能看到的数据。',
   users: '用户管理',
   roles: '角色与权限',
   usersDescription: '管理用户账户、角色及登录会话。',

package/client/locales/system/zh-CN.ts

@@ -81,6 +81,9 @@ const systemZhCN: SystemResource = {
   'auth.loginDescription': '使用用户名或邮箱和密码登录',
   'auth.registerTitle': '创建账户',
   'auth.registerDescription': '创建账户以开始使用',
+  'auth.registrationAccepted': '注册请求已提交',
+  'auth.registrationGuidance':
+    '请尝试使用刚填写的用户名和密码登录。如果此邮箱已有账户，新填写的信息不会生效，请使用原账户登录或找回密码。如应用提供了验证指引，请先完成验证。',
   'auth.forgotTitle': '忘记密码',
   'auth.forgotDescription': '输入邮箱，如果账户存在，我们将发送重置链接',
   'auth.passwordResetUnavailable': '未开启自助找回，请联系管理员重置密码。',
@@ -120,9 +123,8 @@ const systemZhCN: SystemResource = {
   'auth.continueWith': '使用 {provider} 继续',
   'auth.about': '关于此应用',
   'auth.platform': 'AI 原生应用平台',
-  'auth.marketingTitleFirst': '让 AI 自由构建',
-  'auth.marketingTitleSecond': 'NocoBase 保障',
-  'auth.marketingTitleThird': '可靠运行',
+  'auth.marketingTitleFirst': 'AI + NocoBase',
+  'auth.marketingTitleSecond': 'Build reliable business systems',
   'auth.marketingDescription':
     '让 AI 在灵活的前端框架上构建体验，由 NocoBase 保障底层数据、权限与治理',
   'auth.frontend': 'AI 原生前端',
@@ -142,8 +144,8 @@ const systemZhCN: SystemResource = {
   'status.routeFailedDescription':
     '无法加载 {{packageName}} 的路由 {{label}}。',
   shell: {
-    buildFreely: 'AI 自由构建',
-    reliability: '<brand>NocoBase</brand> 保障可靠',
+    brandPartnership: 'AI + <brand>NocoBase</brand>',
+    buildReliableSystems: 'Build reliable business systems',
   },
   home: {
     platform: 'NocoBase · AI 原生应用平台',
@@ -344,7 +346,7 @@ const systemZhCN: SystemResource = {
   },
 
   appearance: {
-    title: '外观',
+    title: '主题',
     mode: '颜色模式',
     preset: '主题',
     light: '浅色',

package/client/pages/auth/register.tsx

@@ -5,6 +5,7 @@ import type { ReactElement } from 'react';
 import { Link, Navigate } from 'react-router';
 
 import { PasswordRegistrationForm } from '#extensions/nocobase-auth-forms/password-registration-form';
+import { AuthFormStatus } from '#extensions/nocobase-auth-forms/form-parts';
 
 import { AuthPage } from './shared.js';
 
@@ -17,30 +18,46 @@ export default function RegisterPage(): ReactElement {
 
   return (
     <AuthPage
-      description={t('auth.registerDescription')}
-      title={t('auth.registerTitle')}
+      description={registration.isSuccess ? '' : t('auth.registerDescription')}
+      title={t(
+        registration.isSuccess
+          ? 'auth.registrationAccepted'
+          : 'auth.registerTitle',
+      )}
     >
-      <PasswordRegistrationForm
-        error={registration.error?.message}
-        footer={
-          <>
-            {t('auth.existingAccount')}{' '}
+      {registration.isSuccess ? (
+        <div className='space-y-4'>
+          <AuthFormStatus type='success'>
+            {t('auth.registrationGuidance')}
+          </AuthFormStatus>
+          <p className='flex justify-center gap-4 text-sm'>
             <Link to='/login'>{t('auth.signIn')}</Link>
-          </>
-        }
-        labels={{
-          confirmPassword: t('auth.confirmPassword'),
-          email: t('auth.email'),
-          name: t('auth.name'),
-          password: t('auth.password'),
-          passwordMismatch: t('auth.passwordMismatch'),
-          submit: t('auth.createAccount'),
-          submitting: t('auth.creatingAccount'),
-          username: t('auth.username'),
-        }}
-        onSubmit={registration.submit}
-        submitting={registration.isPending}
-      />
+            <Link to='/forgot-password'>{t('auth.forgotLink')}</Link>
+          </p>
+        </div>
+      ) : (
+        <PasswordRegistrationForm
+          error={registration.error?.message}
+          footer={
+            <>
+              {t('auth.existingAccount')}{' '}
+              <Link to='/login'>{t('auth.signIn')}</Link>
+            </>
+          }
+          labels={{
+            confirmPassword: t('auth.confirmPassword'),
+            email: t('auth.email'),
+            name: t('auth.name'),
+            password: t('auth.password'),
+            passwordMismatch: t('auth.passwordMismatch'),
+            submit: t('auth.createAccount'),
+            submitting: t('auth.creatingAccount'),
+            username: t('auth.username'),
+          }}
+          onSubmit={registration.submit}
+          submitting={registration.isPending}
+        />
+      )}
     </AuthPage>
   );
 }

package/client/pages/auth/shared.tsx

@@ -78,12 +78,10 @@ function BrandPanel(): ReactElement {
         <p className='text-xs font-semibold tracking-[0.16em] text-(--auth-brand-highlight) uppercase'>
           {t('auth.platform')}
         </p>
-        <h2 className='mt-6 text-4xl leading-tight font-semibold tracking-tight'>
+        <h2 className='mt-6 text-3xl leading-tight font-semibold tracking-tight'>
           {t('auth.marketingTitleFirst')}
           <br />
           {t('auth.marketingTitleSecond')}
-          <br />
-          {t('auth.marketingTitleThird')}
         </h2>
         <p className='mt-6 text-sm leading-7 text-(--auth-brand-muted)'>
           {t('auth.marketingDescription')}

package/client/pages/settings/hooks.tsx

@@ -1,9 +1,4 @@
-import { useNavigationGuard } from '@nocobase/app-client';
 import { useCan } from '@nocobase/app-plugin-authorization/client';
-import { useTranslation } from '@nocobase/i18n/client';
-import { useEffect, useRef, useState } from 'react';
-import { useLocation } from 'react-router';
-import { ConfirmAction } from './shared.js';
 
 /** Compatibility entry for prepared settings pages and application-owned consumers. */
 export { useListData as useSettingsData } from '#hooks/use-list-data';
@@ -17,66 +12,6 @@ export function useRolePermission(action: string) {
     action,
   }).can;
 }
-/** The same decision covers overlay close, sidebar links, browser history and refresh. */
-export function useSettingsLeave(
-  dirty: boolean,
-  busy: boolean,
-  onDiscard?: () => void,
-) {
-  const { t } = useTranslation();
-  const location = useLocation();
-  const allowedRef = useRef(false);
-  useEffect(() => {
-    allowedRef.current = false;
-  }, [location.key]);
-  const pendingRef = useRef<
-    { promise: Promise<boolean>; resolve: (value: boolean) => void } | undefined
-  >(undefined);
-  const [open, setOpen] = useState(false);
-  const guard = () => {
-    if (allowedRef.current) return true;
-    if (busy) return false;
-    if (!dirty) return true;
-    if (pendingRef.current) return pendingRef.current.promise;
-    let resolve!: (value: boolean) => void;
-    const promise = new Promise<boolean>((done) => {
-      resolve = done;
-    });
-    pendingRef.current = { promise, resolve };
-    setOpen(true);
-    return promise;
-  };
-  useNavigationGuard(guard);
-  useEffect(() => {
-    if (!dirty) return;
-    const handler = (event: BeforeUnloadEvent) => {
-      event.preventDefault();
-      event.returnValue = '';
-    };
-    window.addEventListener('beforeunload', handler);
-    return () => window.removeEventListener('beforeunload', handler);
-  }, [dirty]);
-  const decide = (value: boolean) => {
-    if (value) onDiscard?.();
-    allowedRef.current = value;
-    pendingRef.current?.resolve(value);
-    pendingRef.current = undefined;
-    setOpen(false);
-  };
-  return {
-    guard,
-    allow: () => {
-      allowedRef.current = true;
-    },
-    dialog: (
-      <ConfirmAction
-        open={open}
-        title={t('settings.discardTitle')}
-        description={t('settings.discardHint')}
-        busy={false}
-        onCancel={() => decide(false)}
-        onConfirm={() => decide(true)}
-      />
-    ),
-  };
-}
+
+/** Leave protection is owned by the shell while page Effects are suspended. */
+export { usePageLeave as useSettingsLeave } from '../../routing/route-leave-boundary.js';

package/client/pages/settings/notification-routes.ts

@@ -0,0 +1,109 @@
+import { Bell, FileText, Settings } from 'lucide-react';
+import {
+  defineAppRoutes,
+  type AppClientRouteContribution,
+  type AppClientRouteDefinition,
+} from '@nocobase/app-client/plugins';
+
+/** Enable once notification business scenarios are used. Reuse this module for logs and other real views. */
+export const notificationTemplateRoute = {
+  name: 'notificationTemplates',
+  path: '/settings/notifications/templates',
+  auth: 'required' as const,
+  authz: {
+    resource: { type: 'page', id: 'notification.templates' },
+    action: 'access',
+  },
+  navigation: { title: 'settings.notificationTemplates', icon: FileText },
+  breadcrumb: { title: 'settings.notificationTemplates' },
+  componentLoader: () => import('./notification-templates.js'),
+};
+
+/** Add the template view once to the existing module, preserving logs, paths and grants. */
+export function includeNotificationTemplateRoutes(
+  contributions: readonly AppClientRouteContribution[],
+  invitationConfigured: boolean,
+): readonly AppClientRouteContribution[] {
+  const roots = contributions.flatMap((contribution) => contribution.routes);
+  const nodes = new Map<
+    string,
+    { route: AppClientRouteDefinition; parent?: string }
+  >();
+  const collect = (
+    items: readonly AppClientRouteDefinition[],
+    parent?: string,
+  ): void => {
+    for (const route of items) {
+      nodes.set(route.name, { route, parent: route.parent ?? parent });
+      collect(route.children ?? [], route.name);
+    }
+  };
+  collect(roots);
+  const pathOf = (name: string): string => {
+    const node = nodes.get(name);
+    if (!node) return '';
+    const base = node.parent ? pathOf(node.parent) : '';
+    return `${base}/${node.route.path ?? ''}`
+      .replace(/\/{2,}/g, '/')
+      .replace(/\/$/, '');
+  };
+  const templateUnder = (base: string) => ({
+    ...notificationTemplateRoute,
+    path:
+      base && notificationTemplateRoute.path.startsWith(`${base}/`)
+        ? notificationTemplateRoute.path.slice(base.length)
+        : notificationTemplateRoute.path,
+  });
+  if (nodes.has('notificationTemplates')) return contributions;
+  if (nodes.has('notificationManagement')) {
+    const add = (
+      items: readonly AppClientRouteDefinition[],
+    ): readonly AppClientRouteDefinition[] =>
+      items.map((route) => ({
+        ...route,
+        ...(route.name === 'notificationManagement'
+          ? {
+              children: [
+                ...(route.children ?? []),
+                templateUnder(pathOf('notificationManagement')),
+              ],
+            }
+          : route.children
+            ? { children: add(route.children) }
+            : {}),
+      }));
+    return contributions.map((contribution) =>
+      defineAppRoutes(add(contribution.routes)),
+    );
+  }
+  if (!invitationConfigured) return contributions;
+  const parent = nodes.has('settingsSystem') ? 'settingsSystem' : 'settings';
+  const module = {
+    name: 'notificationManagement',
+    navigation: {
+      title: 'settings.notificationManagement',
+      description: 'settings.notificationManagementDescription',
+      icon: Bell,
+    },
+    breadcrumb: { title: 'settings.notificationManagement' },
+    children: [templateUnder(pathOf(parent))],
+  };
+  if (nodes.has(parent))
+    return [
+      ...contributions.slice(0, 1),
+      defineAppRoutes([{ ...module, parent }]),
+      ...contributions.slice(1),
+    ];
+  // A configured built-in invitation is business use even before other settings pages are enabled.
+  return [
+    ...contributions,
+    defineAppRoutes([
+      {
+        name: 'settings',
+        navigation: { title: 'settings.title', icon: Settings, order: 100 },
+        breadcrumb: { title: 'settings.title' },
+        children: [module],
+      },
+    ]),
+  ];
+}

package/client/pages/settings/notification-templates.tsx

@@ -0,0 +1,26 @@
+import type { ReactElement } from 'react';
+import { useSearchParams } from 'react-router';
+import { useTranslation } from '@nocobase/i18n/client';
+import { NotificationTemplates } from '@nocobase/app-plugin-notification/client/templates';
+import { SettingsModulePage } from './settings-module-page.js';
+
+export default function NotificationTemplatesPage(): ReactElement {
+  const { t } = useTranslation('@nocobase/app-plugin-notification');
+  const [query, setQuery] = useSearchParams();
+  return (
+    // A view of the Notifications settings module: it gains tabs once the module has another view, such as logs.
+    <SettingsModulePage title={t('templates.title')}>
+      <NotificationTemplates
+        selectedId={query.get('template')}
+        onSelect={(id) =>
+          setQuery((previous) => {
+            const next = new URLSearchParams(previous);
+            if (id) next.set('template', id);
+            else next.delete('template');
+            return next;
+          })
+        }
+      />
+    </SettingsModulePage>
+  );
+}

package/client/pages/settings/permission-management-page.tsx

@@ -1,11 +1,9 @@
-import { useEffect, useRef, type ReactElement, type ReactNode } from 'react';
-import { useNavigate, useResolvedPath, useLocation } from 'react-router';
-import { useCan } from '@nocobase/app-plugin-authorization/client';
+import type { ReactElement, ReactNode } from 'react';
 import { useTranslation } from '@nocobase/i18n/client';
-import { PageContainer } from '#components/page-container';
-import { PageHeader } from '#components/page-header';
-import { Tabs, TabsList, TabsTrigger, TabsContent } from '#components/ui/tabs';
 
+import { SettingsModulePage } from './settings-module-page.js';
+
+/** Permission management: Roles and permissions and Default data scopes as tabs of one settings module. */
 export function PermissionManagementPage({
   tab,
   actions,
@@ -16,90 +14,17 @@ export function PermissionManagementPage({
   children: ReactNode;
 }): ReactElement {
   const { t } = useTranslation();
-  const navigate = useNavigate();
-  const location = useLocation();
-  const activeRef = useRef<HTMLButtonElement>(null);
-  const focusedRef = useRef(false);
-  const current = useResolvedPath('.').pathname;
-  const prefix = current.slice(0, current.lastIndexOf('/'));
-  const roles = useCan({
-    resource: { type: 'settings', id: 'authorization.permission-sets' },
-    action: 'read',
-  }).can;
-  const defaults = useCan({
-    resource: { type: 'settings', id: 'authorization.default-access' },
-    action: 'read',
-  }).can;
-  // Route changes remount each existing page; keep keyboard focus on the selected tab.
-  useEffect(() => {
-    if (
-      !focusedRef.current &&
-      location.state &&
-      typeof location.state === 'object' &&
-      Reflect.get(location.state, 'permissionTabNavigation') === true &&
-      activeRef.current
-    ) {
-      const frame = requestAnimationFrame(() => {
-        if (activeRef.current) {
-          const selected = activeRef.current;
-          if (
-            !selected
-              .closest('[role="tablist"]')
-              ?.contains(selected.ownerDocument.activeElement)
-          )
-            selected.focus();
-          focusedRef.current = true;
-        }
-      });
-      return () => cancelAnimationFrame(frame);
-    }
-  }, [location.state, roles, defaults]);
   return (
-    <PageContainer>
-      <PageHeader
-        title={t('settings.permissionManagement')}
-        description={t(
-          tab === 'roles'
-            ? 'settings.rolesDescription'
-            : 'settings.defaultAccess.description',
-        )}
-        actions={actions}
-      />
-      <Tabs
-        className='gap-6'
-        value={tab}
-        onValueChange={(value) => {
-          if (value === 'roles' || value === 'default-access')
-            void navigate(`${prefix}/${value}`, {
-              state: { permissionTabNavigation: true },
-            });
-        }}
-      >
-        <TabsList
-          variant='line'
-          aria-label={t('settings.permissionManagement')}
-        >
-          {roles && (
-            <TabsTrigger
-              ref={tab === 'roles' ? activeRef : undefined}
-              value='roles'
-            >
-              {t('settings.roles')}
-            </TabsTrigger>
-          )}
-          {defaults && (
-            <TabsTrigger
-              ref={tab === 'default-access' ? activeRef : undefined}
-              value='default-access'
-            >
-              {t('settings.defaultAccess.title')}
-            </TabsTrigger>
-          )}
-        </TabsList>
-        <TabsContent value={tab} className='space-y-6'>
-          {children}
-        </TabsContent>
-      </Tabs>
-    </PageContainer>
+    <SettingsModulePage
+      title={t('settings.permissionManagement')}
+      description={t(
+        tab === 'roles'
+          ? 'settings.rolesDescription'
+          : 'settings.defaultAccess.description',
+      )}
+      actions={actions}
+    >
+      {children}
+    </SettingsModulePage>
   );
 }