@nocobase/app-template-default 0.0.0-stage → 1.0.0-beta.58

package/client/layouts/settings-layout.tsx

@@ -0,0 +1,172 @@
+import { useTranslation } from '@nocobase/i18n/client';
+import type { AppClientRegisteredRoute } from '@nocobase/app-client/plugins';
+import { ArrowLeft } from 'lucide-react';
+import { useMemo, type ReactElement } from 'react';
+import { Link, Navigate, Routes, useLocation, useNavigate } from 'react-router';
+
+import { PageBreadcrumbProvider } from '@nocobase/app-client';
+
+import { Breadcrumbs } from '#components/breadcrumbs';
+import { Loading } from '#components/loading';
+import { EMPTY_ARRAY } from '#lib/constants';
+
+import { renderRouteTree } from '../routing/route-tree.js';
+import { RouteTreeProvider } from '../routing/route-context.js';
+import {
+  routeKey,
+  matchRouteTree,
+  navigationPages,
+  selectedNavigationId,
+  useRouteNavigation,
+} from '../routing/route-navigation.js';
+import { NavigationMenu } from './components/navigation-menu.js';
+import { LayoutHeader } from './components/layout-header.js';
+import {
+  AppSidebar,
+  AppSidebarProvider,
+  AppSidebarToggle,
+} from './components/app-sidebar.js';
+import { SurfaceEmpty, type SurfaceCopy } from './components/surface-empty.js';
+import { HeaderActions } from './components/header-actions.js';
+
+export interface SettingsLayoutProps {
+  readonly routeTree: readonly AppClientRegisteredRoute[];
+  readonly routes?: readonly AppClientRegisteredRoute[];
+}
+
+export function SettingsLayout({
+  routeTree,
+  routes = EMPTY_ARRAY,
+}: SettingsLayoutProps): ReactElement {
+  const location = useLocation();
+  const navigate = useNavigate();
+  const { t } = useTranslation();
+  const copy: SurfaceCopy = {
+    pathPrefix: '/settings',
+    title: t('settings.title', { defaultValue: 'Settings' }),
+    emptyTitle: t('settings.emptyTitle', {
+      defaultValue: 'No settings available',
+    }),
+    emptyDescription: t('settings.emptyDescription', {
+      defaultValue:
+        'No enabled plugin contributes a settings page you have access to.',
+    }),
+  };
+
+  const { items: navEntries, loading, denied } = useRouteNavigation(routeTree);
+  const selectedKey = selectedNavigationId(
+    routeTree,
+    location.pathname,
+    denied,
+  );
+  const visible = navigationPages(navEntries);
+  // The match below and every consumer of the route tree key off this, so it keeps its identity.
+  const allRoutes = useMemo(
+    () => [...routeTree, ...routes],
+    [routeTree, routes],
+  );
+  const matches = matchRouteTree(allRoutes, location.pathname);
+  if (loading)
+    return (
+      <Loading
+        className='min-h-svh'
+        label={t('surface.loading', {
+          title: copy.title,
+          defaultValue: `Loading ${copy.title}`,
+        })}
+      />
+    );
+  if (
+    matches
+      ?.filter(({ route }) => route.componentLoader)
+      .slice(0, 1)
+      .some(({ route }) => denied.has(routeKey(route))) ||
+    !matches?.some(({ route }) => route.componentLoader)
+  ) {
+    return visible[0] ? (
+      <Navigate to={visible[0].path} replace />
+    ) : (
+      <SurfaceEmpty copy={copy} />
+    );
+  }
+
+  return (
+    // The header's trail reads the same route tree as the pages, and the trail a page declares.
+    <RouteTreeProvider routes={allRoutes}>
+      <PageBreadcrumbProvider>
+        <AppSidebarProvider>
+          <AppSidebar
+            label={t('surface.navigation', {
+              title: copy.title,
+              defaultValue: `${copy.title} navigation`,
+            })}
+          >
+            <NavigationMenu
+              items={navEntries}
+              label={copy.title}
+              selectedKey={selectedKey}
+            />
+          </AppSidebar>
+          <div className='flex min-w-0 flex-1 flex-col'>
+            <LayoutHeader className='sticky top-0 z-40 justify-between'>
+              <div className='flex min-w-0 items-center gap-3'>
+                <AppSidebarToggle />
+                <div className='hidden h-5 w-px bg-border md:block' />
+                <Link
+                  className='inline-flex min-w-0 items-center gap-2 text-sm font-medium text-muted-foreground transition-colors hover:text-foreground'
+                  to='/'
+                >
+                  <ArrowLeft className='size-4 shrink-0' />
+                  <span className='truncate'>
+                    {t('surface.backToApp', { defaultValue: 'Back to app' })}
+                  </span>
+                </Link>
+                <div className='hidden h-5 w-px shrink-0 bg-border md:block' />
+                <Breadcrumbs className='hidden md:block' denied={denied} />
+              </div>
+              <HeaderActions
+                showSettings={navigationPages(navEntries).length > 0}
+              />
+            </LayoutHeader>
+            <main className='relative min-w-0 flex-1 overflow-hidden'>
+              {/* main only positions; the page scrolls in here, so a child page layer laid over main is neither
+            moved by the page's scrolling nor stretched by its height. */}
+              <div className='h-full overflow-y-auto'>
+                <label className='sr-only' htmlFor='surface-page'>
+                  {t('surface.page', {
+                    title: copy.title,
+                    defaultValue: `${copy.title} page`,
+                  })}
+                </label>
+                <select
+                  id='surface-page'
+                  className='m-3 h-9 w-[calc(100%-1.5rem)] min-w-0 rounded-xl border border-border/70 bg-background px-3 text-sm md:hidden'
+                  value={
+                    visible.find((route) => routeKey(route) === selectedKey)
+                      ?.path ?? ''
+                  }
+                  onChange={(event) => {
+                    void navigate(event.target.value);
+                  }}
+                >
+                  {visible.map((route) => (
+                    <option key={routeKey(route)} value={route.path}>
+                      {t(route.navigation!.title, {
+                        ns: route.packageName,
+                        defaultValue: route.navigation!.title,
+                      })}
+                    </option>
+                  ))}
+                </select>
+                <Routes>
+                  {renderRouteTree(routeTree, copy.pathPrefix)}
+                  {renderRouteTree(routes, copy.pathPrefix)}
+                </Routes>
+              </div>
+            </main>
+          </div>
+        </AppSidebarProvider>
+      </PageBreadcrumbProvider>
+    </RouteTreeProvider>
+  );
+}

package/client/layouts/use-sidebar-preference.ts

@@ -0,0 +1,57 @@
+import { useSyncExternalStore, type SetStateAction } from 'react';
+
+// All applications and layout surfaces on this origin share this preference.
+const storageKey = 'nocobase:sidebar:collapsed';
+const changeEvent = 'nocobase:sidebar-preference-change';
+let memoryValue = false;
+let memoryOnly = false;
+
+function getSnapshot(): boolean {
+  if (memoryOnly) return memoryValue;
+  try {
+    memoryValue = localStorage.getItem(storageKey) === 'true';
+  } catch {
+    // Storage may be unavailable; keep the current session's preference.
+  }
+  return memoryValue;
+}
+
+function subscribe(notify: () => void): () => void {
+  const onStorage = (event: StorageEvent) => {
+    if (event.key === storageKey || event.key === null) notify();
+  };
+  window.addEventListener('storage', onStorage);
+  window.addEventListener(changeEvent, notify);
+  return () => {
+    window.removeEventListener('storage', onStorage);
+    window.removeEventListener(changeEvent, notify);
+  };
+}
+
+function setCollapsed(update: SetStateAction<boolean>): void {
+  const current = getSnapshot();
+  memoryValue = typeof update === 'function' ? update(current) : update;
+  try {
+    localStorage.setItem(storageKey, String(memoryValue));
+  } catch {
+    memoryOnly = true;
+    // The toggle remains usable when storage is blocked.
+  }
+  window.dispatchEvent(new Event(changeEvent));
+}
+
+function getServerSnapshot(): boolean {
+  return false;
+}
+
+export function useSidebarPreference(): readonly [
+  boolean,
+  (update: SetStateAction<boolean>) => void,
+] {
+  const collapsed = useSyncExternalStore(
+    subscribe,
+    getSnapshot,
+    getServerSnapshot,
+  );
+  return [collapsed, setCollapsed];
+}

package/client/lib/constants.ts

@@ -0,0 +1,5 @@
+/**
+ * Values shared across the client that must keep one identity for the whole life of the application.
+ */
+
+export const EMPTY_ARRAY: readonly never[] = Object.freeze([]);

package/client/lib/toaster.ts

@@ -0,0 +1,56 @@
+import type { Toaster, ToastOptions } from '@nocobase/app-client';
+import type { ReactNode } from 'react';
+
+import { toast } from '#components/ui/toast';
+
+/**
+ * The application's toaster, registered under `toasterToken` in `client/service-provider.ts`. Plugins and pages
+ * report through `useToaster()`; this forwards what they report to the Base UI toast manager rendered by the
+ * `Toaster` that `client/react-providers.ts` mounts. How a toast is presented is decided here, not at each call site,
+ * so changing the toast UI changes this file and nothing that shows a toast.
+ *
+ * The manager reaches the `Toaster` once it has subscribed, in an effect that runs when the application first renders
+ * and before any page does, since pages are lazy routes. A toast shown earlier than that, from a component mounted
+ * together with the `Toaster`, would be dropped.
+ */
+export function createToaster(manager: typeof toast = toast): Toaster {
+  return {
+    show: (options: ToastOptions): string =>
+      manager.add({
+        id: options.id,
+        type: options.type,
+        title: options.title,
+        description: options.description,
+        timeout: options.duration,
+        priority: isUrgent(options) ? 'high' : 'low',
+        actionProps: options.action
+          ? { children: options.action.label, onClick: options.action.onClick }
+          : undefined,
+        onClose: options.onClose,
+      }),
+    // Base UI closes every toast when given no id; the contract closes one.
+    close: (id: string): void => {
+      if (id) manager.close(id);
+    },
+  };
+}
+
+/**
+ * Base UI announces a high-priority toast at once, but hides the toast itself from assistive technology until the
+ * toast viewport is focused, and repeats its title and description in a visually hidden alert. That suits an error
+ * written as plain text. Every other error keeps the default priority: one with an action, or whose title or
+ * description is an element rather than text, may hold a control — Hub's technical details toggle is one — which a
+ * high priority would hide and duplicate.
+ */
+function isUrgent({ type, title, description, action }: ToastOptions): boolean {
+  return (
+    type === 'error' &&
+    action === undefined &&
+    isText(title) &&
+    (description === undefined || isText(description))
+  );
+}
+
+function isText(node: ReactNode): boolean {
+  return typeof node === 'string' || typeof node === 'number';
+}

package/client/lib/utils.ts

@@ -0,0 +1 @@
+export { cn } from 'cn';

package/client/locales/en-US.ts

@@ -0,0 +1,178 @@
+import type { LocaleResource } from '@nocobase/i18n';
+import deviceApprovalEnUS from '#extensions/nocobase-device-approval/locales/en-US';
+import inboxEnUS from '#extensions/nocobase-inbox/locales/en-US';
+
+const enUS = {
+  // The UI Library block of the `/device` page; the keys below may reword it.
+  ...deviceApprovalEnUS,
+  // The UI Library block of the `/inbox` page; the keys below may reword it.
+  ...inboxEnUS,
+  // The UI Library component of the header's inbox button.
+  'inboxButton.title': 'Inbox',
+  'inboxButton.pending': 'Inbox, {{count}} waiting',
+  'inboxButton.unread': 'Inbox, {{count}} unread',
+  'inboxButton.pendingHint':
+    '{{count}} waiting for you; it goes down once they are handled.',
+  'inboxButton.unreadHint': '{{count}} unread; it goes down as you read them.',
+  'auth.welcome': 'Welcome back',
+  'auth.loginDescription': 'Sign in with your username or email and password.',
+  'auth.registerTitle': 'Create an account',
+  'auth.registerDescription': 'Create an account to get started.',
+  'auth.forgotTitle': 'Forgot password',
+  'auth.forgotDescription':
+    'Enter your email and we will send a reset link if the account exists.',
+  'auth.resetDescription': 'Choose a new password for your account.',
+  'auth.resetTitle': 'Reset password',
+  'auth.identifier': 'Username or email',
+  'auth.password': 'Password',
+  'auth.signIn': 'Sign in',
+  'auth.signingIn': 'Signing in…',
+  'auth.hidePassword': 'Hide password',
+  'auth.showPassword': 'Show password',
+  'auth.forgotLink': 'Forgot password?',
+  'auth.noAccount': "Don't have an account?",
+  'auth.signUp': 'Sign up',
+  'auth.createAccount': 'Create account',
+  'auth.creatingAccount': 'Creating account…',
+  'auth.name': 'Name',
+  'auth.username': 'Username',
+  'auth.email': 'Email',
+  'auth.confirmPassword': 'Confirm password',
+  'auth.existingAccount': 'Already have an account?',
+  'auth.passwordMismatch': "Passwords don't match.",
+  'auth.resetting': 'Resetting…',
+  'auth.newPassword': 'New password',
+  'auth.confirmNewPassword': 'Confirm new password',
+  'auth.invalidResetLink':
+    'This password reset link is invalid or has expired.',
+  'auth.backToSignIn': 'Back to sign in',
+  'auth.sendResetLink': 'Send reset link',
+  'auth.sending': 'Sending…',
+  'auth.resetSent': 'If the account exists, a reset link has been sent.',
+  'auth.rememberPassword': 'Remember your password?',
+  'auth.methods': 'Sign-in methods',
+  'auth.or': 'Or continue with',
+  'auth.continueWith': 'Continue with {provider}',
+  'auth.about': 'About this application',
+  'auth.platform': 'AI-native application platform',
+  'auth.marketingTitleFirst': 'Let AI build freely.',
+  'auth.marketingTitleSecond': 'NocoBase keeps it',
+  'auth.marketingTitleThird': 'reliable.',
+  'auth.marketingDescription':
+    'Give AI a flexible frontend framework to shape each experience, while NocoBase secures the data, permissions, workflows and governance underneath.',
+  'auth.frontend': 'AI-native frontend',
+  'auth.frontendDescription':
+    'Compose interfaces freely on a flexible framework.',
+  'auth.foundation': 'NocoBase foundation',
+  'auth.foundationDescription':
+    'Reliable data, access control, workflows and governance.',
+  'auth.marketingFooter': 'Freedom above. Confidence below.',
+  'status.loading': 'Loading',
+  'status.loadingPage': 'Loading page',
+  'status.loadingSettings': 'Loading settings',
+  'status.denied': 'Access denied',
+  'status.pageFailed': 'Unable to load page',
+  'status.retry': 'Retry',
+  'navigation.brandHome': 'NocoBase home',
+  'navigation.brandApps': 'NocoBase applications',
+  'routeOverlay.close': 'Close',
+  'status.deniedDescription': 'You do not have permission to access {{label}}.',
+  'status.routeFailedDescription':
+    'Route {{label}} from {{packageName}} could not be loaded.',
+  shell: {
+    buildFreely: 'AI builds freely.',
+    reliability: '<brand>NocoBase</brand> keeps it reliable.',
+  },
+  surface: {
+    backToApp: 'Back to app',
+    loading: 'Loading {{title}}',
+    navigation: '{{title}} navigation',
+    page: '{{title}} page',
+  },
+  settings: {
+    title: 'Settings',
+    emptyTitle: 'No settings available',
+    emptyDescription:
+      'No enabled plugin contributes a settings page you have access to.',
+  },
+  home: {
+    title: 'Start building your application',
+    description:
+      'Describe what you need to your AI Agent, then build pages, data models, and business workflows.',
+  },
+
+  appearance: {
+    title: 'Appearance',
+    mode: 'Color mode',
+    preset: 'Theme',
+    light: 'Light',
+    dark: 'Dark',
+    system: 'System',
+    themes: { default: 'Spacious', compact: 'Compact' },
+  },
+  app: {
+    title: 'NocoBase',
+  },
+  actions: {
+    close: 'Close',
+    save: 'Save',
+    cancel: 'Cancel',
+    confirm: 'Confirm',
+    language: 'Language',
+  },
+  notices: {
+    serverLocaleFallback:
+      'The server does not support this language, so server messages will use English.',
+    languageChangeFailed:
+      'Unable to complete the language change. Please try again.',
+  },
+  account: {
+    signOutFailed: 'Unable to sign out. Please try again.',
+    openMenu: 'Open account menu',
+    fallback: 'Account',
+    signOut: 'Sign out',
+    signingOut: 'Signing out…',
+  },
+  navigation: {
+    home: 'Home',
+    open: 'Open navigation',
+    close: 'Close navigation',
+    expand: 'Expand navigation',
+    collapse: 'Collapse navigation',
+    toggle: 'Expand or collapse navigation',
+    label: 'Application navigation',
+    description: 'Go to a page of this application.',
+    breadcrumb: 'Breadcrumb',
+    breadcrumbMore: 'Show the levels in between',
+    back: 'Back',
+  },
+  dataTable: {
+    noResults: 'No results.',
+    sortAscending: 'Asc',
+    sortDescending: 'Desc',
+    hideColumn: 'Hide',
+    view: 'View',
+    toggleColumns: 'Toggle columns',
+    selectedCount: '{{selected}} of {{total}} row(s) selected.',
+    rowsPerPage: 'Rows per page',
+    pageOf: 'Page {{page}} of {{pageCount}}',
+    firstPage: 'Go to first page',
+    previousPage: 'Go to previous page',
+    nextPage: 'Go to next page',
+    lastPage: 'Go to last page',
+  },
+  datePicker: {
+    placeholder: 'Pick a date',
+    rangePlaceholder: 'Pick a date range',
+  },
+};
+
+/**
+ * The shape every locale of this application follows, derived from the English wording above.
+ *
+ * Anything a plugin does not translate falls back to this namespace, so a term defined here is reused everywhere
+ * without each plugin repeating it.
+ */
+export type AppResource = LocaleResource<typeof enUS>;
+
+export default enUS;

package/client/locales/index.ts

@@ -0,0 +1,9 @@
+import type { LocaleLoaders } from '@nocobase/i18n';
+
+// One dynamic import per locale, so the browser downloads only the language it is showing.
+const locales: LocaleLoaders = {
+  'en-US': () => import('./en-US.js'),
+  'zh-CN': () => import('./zh-CN.js'),
+};
+
+export default locales;

package/client/locales/zh-CN.ts

@@ -0,0 +1,161 @@
+import type { AppResource } from './en-US.js';
+import deviceApprovalZhCN from '#extensions/nocobase-device-approval/locales/zh-CN';
+import inboxZhCN from '#extensions/nocobase-inbox/locales/zh-CN';
+
+const zhCN: AppResource = {
+  // The UI Library block of the `/device` page; the keys below may reword it.
+  ...deviceApprovalZhCN,
+  // The UI Library block of the `/inbox` page; the keys below may reword it.
+  ...inboxZhCN,
+  // The UI Library component of the header's inbox button.
+  'inboxButton.title': '收件箱',
+  'inboxButton.pending': '收件箱，{{count}} 项待处理',
+  'inboxButton.unread': '收件箱，{{count}} 条未读',
+  'inboxButton.pendingHint': '{{count}} 项等你处理，处理后减少。',
+  'inboxButton.unreadHint': '{{count}} 条未读，阅读后减少。',
+  'auth.welcome': '欢迎回来',
+  'auth.loginDescription': '使用用户名或邮箱和密码登录。',
+  'auth.registerTitle': '创建账户',
+  'auth.registerDescription': '创建账户以开始使用。',
+  'auth.forgotTitle': '忘记密码',
+  'auth.forgotDescription': '输入邮箱，如果账户存在，我们将发送重置链接。',
+  'auth.resetDescription': '为账户设置新密码。',
+  'auth.resetTitle': '重置密码',
+  'auth.identifier': '用户名或邮箱',
+  'auth.password': '密码',
+  'auth.signIn': '登录',
+  'auth.signingIn': '正在登录…',
+  'auth.hidePassword': '隐藏密码',
+  'auth.showPassword': '显示密码',
+  'auth.forgotLink': '忘记密码？',
+  'auth.noAccount': '还没有账户？',
+  'auth.signUp': '注册',
+  'auth.createAccount': '创建账户',
+  'auth.creatingAccount': '正在创建账户…',
+  'auth.name': '姓名',
+  'auth.username': '用户名',
+  'auth.email': '邮箱',
+  'auth.confirmPassword': '确认密码',
+  'auth.existingAccount': '已有账户？',
+  'auth.passwordMismatch': '两次输入的密码不一致。',
+  'auth.resetting': '正在重置…',
+  'auth.newPassword': '新密码',
+  'auth.confirmNewPassword': '确认新密码',
+  'auth.invalidResetLink': '此密码重置链接无效或已过期。',
+  'auth.backToSignIn': '返回登录',
+  'auth.sendResetLink': '发送重置链接',
+  'auth.sending': '正在发送…',
+  'auth.resetSent': '如果账户存在，重置链接已发送。',
+  'auth.rememberPassword': '记得密码？',
+  'auth.methods': '登录方式',
+  'auth.or': '或使用以下方式继续',
+  'auth.continueWith': '使用 {provider} 继续',
+  'auth.about': '关于此应用',
+  'auth.platform': 'AI 原生应用平台',
+  'auth.marketingTitleFirst': '让 AI 自由构建。',
+  'auth.marketingTitleSecond': 'NocoBase 保障',
+  'auth.marketingTitleThird': '可靠运行。',
+  'auth.marketingDescription':
+    '让 AI 在灵活的前端框架上构建体验，由 NocoBase 保障底层数据、权限、工作流与治理。',
+  'auth.frontend': 'AI 原生前端',
+  'auth.frontendDescription': '在灵活的框架上自由构建界面。',
+  'auth.foundation': 'NocoBase 基础能力',
+  'auth.foundationDescription': '可靠的数据、访问控制、工作流与治理。',
+  'auth.marketingFooter': '自由构建，可靠支撑。',
+  'status.loading': '加载中',
+  'status.loadingPage': '正在加载页面',
+  'status.loadingSettings': '正在加载设置',
+  'status.denied': '无权访问',
+  'status.pageFailed': '无法加载页面',
+  'status.retry': '重试',
+  'navigation.brandHome': 'NocoBase 首页',
+  'navigation.brandApps': 'NocoBase 应用',
+  'routeOverlay.close': '关闭',
+  'status.deniedDescription': '你没有访问 {{label}} 的权限。',
+  'status.routeFailedDescription':
+    '无法加载 {{packageName}} 的路由 {{label}}。',
+  shell: {
+    buildFreely: 'AI 自由构建。',
+    reliability: '<brand>NocoBase</brand> 保障可靠。',
+  },
+  surface: {
+    backToApp: '返回应用',
+    loading: '正在加载{{title}}',
+    navigation: '{{title}}导航',
+    page: '{{title}}页面',
+  },
+  settings: {
+    title: '设置',
+    emptyTitle: '暂无可用设置',
+    emptyDescription: '没有已启用的插件提供你有权访问的设置页面。',
+  },
+  home: {
+    title: '开始构建你的应用',
+    description: '向 AI 助手描述你的需求，逐步构建页面、数据模型和业务流程。',
+  },
+
+  appearance: {
+    title: '外观',
+    mode: '颜色模式',
+    preset: '主题',
+    light: '浅色',
+    dark: '深色',
+    system: '跟随系统',
+    themes: { default: '宽松', compact: '紧凑' },
+  },
+  app: {
+    title: 'NocoBase',
+  },
+  actions: {
+    close: '关闭',
+    save: '保存',
+    cancel: '取消',
+    confirm: '确认',
+    language: '语言',
+  },
+  notices: {
+    serverLocaleFallback: '服务端不支持该语言，服务端内容已回落为英文。',
+    languageChangeFailed: '未能完成语言切换，请重试。',
+  },
+  account: {
+    signOutFailed: '退出登录失败，请重试。',
+    openMenu: '打开账户菜单',
+    fallback: '账户',
+    signOut: '退出登录',
+    signingOut: '正在退出…',
+  },
+  navigation: {
+    home: '首页',
+    open: '打开导航',
+    close: '关闭导航',
+    expand: '展开导航',
+    collapse: '收起导航',
+    toggle: '展开或收起导航',
+    label: '应用导航',
+    description: '前往本应用的页面。',
+    breadcrumb: '面包屑',
+    breadcrumbMore: '显示中间层级',
+    back: '返回',
+  },
+  dataTable: {
+    noResults: '暂无数据。',
+    sortAscending: '升序',
+    sortDescending: '降序',
+    hideColumn: '隐藏',
+    view: '视图',
+    toggleColumns: '显示列',
+    selectedCount: '已选择 {{selected}} / {{total}} 行。',
+    rowsPerPage: '每页行数',
+    pageOf: '第 {{page}} 页，共 {{pageCount}} 页',
+    firstPage: '第一页',
+    previousPage: '上一页',
+    nextPage: '下一页',
+    lastPage: '最后一页',
+  },
+  datePicker: {
+    placeholder: '选择日期',
+    rangePlaceholder: '选择日期范围',
+  },
+};
+
+export default zhCN;