@nocobase/client-v2 2.1.0-alpha.22 → 2.1.0-alpha.24

package/src/flow-compat/zIndexContext.tsx

@@ -0,0 +1,28 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React from 'react';
+
+export const zIndexContext = React.createContext(100);
+
+export const useZIndexContext = () => {
+  return React.useContext(zIndexContext);
+};
+
+export const getZIndex = (type: 'page' | 'drawer' | 'modal', basicZIndex: number, level: number) => {
+  let result = basicZIndex;
+
+  if (type === 'page' && !window.location.pathname.includes('/embed/')) {
+    result = basicZIndex + level;
+    return result > 200 ? result - 200 : result;
+  }
+
+  result = basicZIndex + level;
+  return result < 200 ? result + 200 : result;
+};

package/src/hooks/useApp.ts

@@ -8,9 +8,11 @@
  */
 
 import { useFlowEngineContext } from '@nocobase/flow-engine';
-import type { Application } from '../Application';
+import type { BaseApplication } from '../BaseApplication';
 
-export const useApp = () => {
+type CompatibleApplication = BaseApplication<any> & Record<string, any>;
+
+export const useApp = <TApp extends CompatibleApplication = CompatibleApplication>() => {
   const ctx = useFlowEngineContext();
-  return ctx.app as Application;
+  return ctx.app as TApp;
 };

package/src/hooks/usePlugin.ts

@@ -6,10 +6,10 @@
  * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
-import { Plugin } from '../Plugin';
+import type { PluginClass } from '../PluginManager';
 import { useApp } from './useApp';
 
-export function usePlugin<T extends typeof Plugin = any>(plugin: T): InstanceType<T>;
+export function usePlugin<T extends PluginClass<any, any> = any>(plugin: T): InstanceType<T>;
 export function usePlugin<T extends {}>(name: string): T;
 export function usePlugin(name: any) {
   const app = useApp();

package/src/i18n.ts

@@ -0,0 +1,25 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+/**
+ * 提供字段接口模块初始化阶段所需的最小 i18n 能力。
+ *
+ * 这些接口类会在模块加载时注册校验规则，因此需要一个同步可用的 `t` 方法。
+ * 真正的运行时翻译仍由 schema 中的 `{{t(...)}}` 表达式和应用级 i18n 负责。
+ *
+ * @example
+ * ```typescript
+ * i18n.t('Max length');
+ * ```
+ */
+export const i18n = {
+  t(text: string) {
+    return text;
+  },
+};

package/src/index.ts

@@ -7,9 +7,29 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
+import 'antd/dist/reset.css';
+
+export * from './BaseApplication';
 export * from './Application';
+export * from './PinnedPluginListContext';
+export * from './RouteRepository';
+export * from './acl';
+export * from './ai';
+export * from './authRedirect';
 export * from './components';
 export * from './context';
+export * from './theme';
 export * from './MockApplication';
 export * from './Plugin';
 export * from './WebSocketClient';
+export * from './RouterManager';
+export * from './PluginManager';
+export * from './PluginSettingsManager';
+export * from './hooks';
+export { default as languageCodes } from './locale/languageCodes';
+export * from './nocobase-buildin-plugin';
+export * from './collection-field-interface/CollectionFieldInterface';
+export * from './collection-field-interface/CollectionFieldInterfaceManager';
+export * from './collection-manager/interfaces';
+export * from './flow';
+export { default as AntdAppProvider } from './theme/AntdAppProvider';

package/src/locale/languageCodes.ts

@@ -0,0 +1,83 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+export type LocaleOptions = {
+  label: string;
+};
+
+export const languageCodes: Record<string, LocaleOptions> = {
+  'ar-EG': { label: 'العربية' },
+  'az-AZ': { label: 'Azərbaycan dili' },
+  'bg-BG': { label: 'Български' },
+  'bn-BD': { label: 'Bengali' },
+  'by-BY': { label: 'Беларускі' },
+  'ca-ES': { label: 'Сatalà/Espanya' },
+  'cs-CZ': { label: 'Česky' },
+  'da-DK': { label: 'Dansk' },
+  'de-DE': { label: 'Deutsch' },
+  'el-GR': { label: 'Ελληνικά' },
+  'en-GB': { label: 'English(GB)' },
+  'en-US': { label: 'English' },
+  'es-ES': { label: 'Español' },
+  'et-EE': { label: 'Estonian (Eesti)' },
+  'fa-IR': { label: 'فارسی' },
+  'fi-FI': { label: 'Suomi' },
+  'fr-BE': { label: 'Français(BE)' },
+  'fr-CA': { label: 'Français(CA)' },
+  'fr-FR': { label: 'Français' },
+  'ga-IE': { label: 'Gaeilge' },
+  'gl-ES': { label: 'Galego' },
+  'he-IL': { label: 'עברית' },
+  'hi-IN': { label: 'हिन्दी' },
+  'hr-HR': { label: 'Hrvatski jezik' },
+  'hu-HU': { label: 'Magyar' },
+  'hy-AM': { label: 'Հայերեն' },
+  'id-ID': { label: 'Bahasa Indonesia' },
+  'is-IS': { label: 'Íslenska' },
+  'it-IT': { label: 'Italiano' },
+  'ja-JP': { label: '日本語' },
+  'ka-GE': { label: 'ქართული' },
+  'kk-KZ': { label: 'Қазақ тілі' },
+  'km-KH': { label: 'ភាសាខ្មែរ' },
+  'kn-IN': { label: 'ಕನ್ನಡ' },
+  'ko-KR': { label: '한국어' },
+  'ku-IQ': { label: 'کوردی' },
+  'lt-LT': { label: 'lietuvių' },
+  'lv-LV': { label: 'Latviešu valoda' },
+  'mk-MK': { label: 'македонски јазик' },
+  'ml-IN': { label: 'മലയാളം' },
+  'mn-MN': { label: 'Монгол хэл' },
+  'ms-MY': { label: 'بهاس ملايو' },
+  'nb-NO': { label: 'Norsk bokmål' },
+  'ne-NP': { label: 'नेपाली' },
+  'nl-BE': { label: 'Vlaams' },
+  'nl-NL': { label: 'Nederlands' },
+  'pl-PL': { label: 'Polski' },
+  'pt-BR': { label: 'Português brasileiro' },
+  'pt-PT': { label: 'Português' },
+  'ro-RO': { label: 'România' },
+  'ru-RU': { label: 'Русский' },
+  'si-LK': { label: 'සිංහල' },
+  'sk-SK': { label: 'Slovenčina' },
+  'sl-SI': { label: 'Slovenščina' },
+  'sr-RS': { label: 'српски језик' },
+  'sv-SE': { label: 'Svenska' },
+  'ta-IN': { label: 'Tamil' },
+  'th-TH': { label: 'ภาษาไทย' },
+  'tk-TK': { label: 'Turkmen' },
+  'tr-TR': { label: 'Türkçe' },
+  'uk-UA': { label: 'Українська' },
+  'ur-PK': { label: 'Oʻzbekcha' },
+  'vi-VN': { label: 'Tiếng Việt' },
+  'zh-CN': { label: '简体中文' },
+  'zh-HK': { label: '繁體中文（香港）' },
+  'zh-TW': { label: '繁體中文（台湾）' },
+};
+
+export default languageCodes;

package/src/nocobase-buildin-plugin/index.tsx

@@ -0,0 +1,318 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import { createCollectionContextMeta } from '@nocobase/flow-engine';
+import React, { createContext, type FC, useEffect, useRef, useState } from 'react';
+import { Navigate, Outlet, useLocation } from 'react-router-dom';
+import type { Application } from '../Application';
+import { getCurrentV2RedirectPath, getDefaultV2AdminRedirectPath, redirectToLegacySignin } from '../authRedirect';
+import { AppNotFound } from '../components';
+import { PluginFlowEngine } from '../flow';
+import { AdminLayoutMenuItemModel, AdminLayoutModel } from '../flow/admin-shell/admin-layout';
+import { useApp } from '../hooks/useApp';
+import { Plugin } from '../Plugin';
+import { AdminSettingsLayoutModel } from '../settings-center';
+import { LocalePlugin } from './plugins/LocalePlugin';
+
+type CurrentUserState = {
+  data?: {
+    data?: any;
+  };
+  loading: boolean;
+};
+
+const AUTH_ROUTE_PREFIXES = ['/signin', '/signup', '/forgot-password', '/reset-password'];
+
+function removeBasename(pathname: string, basename?: string) {
+  if (!basename) {
+    return pathname;
+  }
+  const escapedBasename = basename.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+  const regex = new RegExp(`^${escapedBasename.replace(/\/?$/, '')}(\\/|$)`);
+  return pathname.replace(regex, '/') || pathname;
+}
+
+function isBuiltinAuthRoute(pathname: string, basename?: string) {
+  const normalizedPathname = removeBasename(pathname, basename);
+  return AUTH_ROUTE_PREFIXES.some((route) => {
+    return normalizedPathname === route || normalizedPathname.startsWith(`${route}/`);
+  });
+}
+
+function isAdminRuntimeRoute(pathname: string, basename?: string) {
+  const normalizedPathname = removeBasename(pathname, basename);
+  return normalizedPathname === '/admin' || normalizedPathname.startsWith('/admin/');
+}
+
+const CurrentUserContext = createContext<CurrentUserState | null>(null);
+CurrentUserContext.displayName = 'CurrentUserContext';
+
+const DataSourceBootstrapProvider: FC = ({ children }) => {
+  const app = useApp();
+  const location = useLocation();
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<Error | null>(null);
+  const hasBootstrappedRef = useRef(false);
+
+  useEffect(() => {
+    let mounted = true;
+    const basename = app.router.getBasename();
+    const isSkippedAuthCheckRoute =
+      isBuiltinAuthRoute(location.pathname, basename) || app.router.isSkippedAuthCheckRoute(location.pathname);
+    const shouldBootstrap = isAdminRuntimeRoute(location.pathname, basename);
+
+    if (isSkippedAuthCheckRoute || !shouldBootstrap) {
+      setLoading(false);
+      setError(null);
+      return;
+    }
+
+    if (!hasBootstrappedRef.current) {
+      setLoading(true);
+    }
+    setError(null);
+
+    const run = async () => {
+      try {
+        await app.dataSourceManager.ensureLoaded();
+        hasBootstrappedRef.current = true;
+        if (mounted) {
+          setLoading(false);
+        }
+      } catch (err) {
+        if (!mounted) {
+          return;
+        }
+        setLoading(false);
+        setError(err instanceof Error ? err : new Error(String(err)));
+      }
+    };
+
+    void run();
+
+    return () => {
+      mounted = false;
+    };
+  }, [app, location.pathname]);
+
+  if (error) {
+    throw error;
+  }
+
+  if (loading) {
+    return app.renderComponent('AppSpin');
+  }
+
+  return <>{children}</>;
+};
+
+const CurrentUserProvider: FC = ({ children }) => {
+  const app = useApp();
+  const location = useLocation();
+  const [state, setState] = useState<CurrentUserState>({ loading: true });
+  const pathnameRef = useRef(location.pathname);
+  pathnameRef.current = location.pathname;
+  const locationRef = useRef(location);
+  locationRef.current = location;
+
+  useEffect(() => {
+    let mounted = true;
+    const isSkippedAuthCheckRoute =
+      isBuiltinAuthRoute(pathnameRef.current, app.router.getBasename()) ||
+      app.router.isSkippedAuthCheckRoute(pathnameRef.current);
+    const shouldCheckCurrentUser = isAdminRuntimeRoute(pathnameRef.current, app.router.getBasename());
+
+    if (isSkippedAuthCheckRoute || !shouldCheckCurrentUser) {
+      // 认证页等免鉴权路由不应再执行 `/auth:check`，否则未登录时会重复鉴权并触发重定向抖动。
+      setState({ loading: false });
+      return;
+    }
+
+    const run = async () => {
+      try {
+        const res = await app.apiClient.request({
+          url: '/auth:check',
+          skipNotify: true,
+          skipAuth: true,
+        });
+
+        const user = res?.data?.data;
+        if (user?.id == null) {
+          redirectToLegacySignin(app, getCurrentV2RedirectPath(app, locationRef.current), { replace: true });
+          return;
+        }
+
+        const userMeta = createCollectionContextMeta(
+          () => app.flowEngine.context.dataSourceManager?.getDataSource('main')?.getCollection('users') || null,
+          app.flowEngine.translate('Current user'),
+        );
+        userMeta.sort = 1000;
+
+        app.flowEngine.context.defineProperty('user', {
+          value: user,
+          resolveOnServer: true,
+          meta: userMeta,
+        });
+
+        if (mounted) {
+          setState({
+            data: res?.data,
+            loading: false,
+          });
+        }
+      } catch (error: any) {
+        const isAuthError = error?.response?.status === 401 || error?.status === 401;
+        if (isAuthError) {
+          redirectToLegacySignin(app, getCurrentV2RedirectPath(app, locationRef.current), { replace: true });
+          return;
+        }
+        if (mounted) {
+          setState({ loading: false });
+        }
+        throw error;
+      }
+    };
+
+    void run();
+
+    return () => {
+      mounted = false;
+    };
+  }, [app]);
+
+  if (state.loading) {
+    return app.renderComponent('AppSpin');
+  }
+
+  return <CurrentUserContext.Provider value={state}>{children}</CurrentUserContext.Provider>;
+};
+
+const RootRedirect: FC = () => {
+  const app = useApp();
+  const hasToken = !!app?.apiClient?.auth?.token;
+
+  useEffect(() => {
+    if (!hasToken) {
+      redirectToLegacySignin(app, getDefaultV2AdminRedirectPath(app), { replace: true });
+    }
+  }, [app, hasToken]);
+
+  if (!hasToken) {
+    return app.renderComponent('AppSpin');
+  }
+
+  return <Navigate replace to="/admin" />;
+};
+
+/**
+ * client-v2 使用的内建插件集合。
+ *
+ * 只迁移当前 v2 运行时仍然需要的部分，显式跳过 schemaInitializerManager
+ * 以及用户标注暂不迁移的旧插件注册逻辑。
+ */
+export class NocoBaseBuildInPlugin extends Plugin<any, Application> {
+  async afterAdd() {
+    await this.addPlugins();
+  }
+
+  async load() {
+    this.addComponents();
+    this.addRoutes();
+
+    this.app.use(DataSourceBootstrapProvider);
+    this.app.use(CurrentUserProvider);
+    this.app.flowEngine.registerModels({
+      AdminLayoutModel,
+      AdminLayoutMenuItemModel,
+      AdminSettingsLayoutModel,
+    });
+
+    this.app.pluginSettingsManager.addMenuItem({
+      key: 'plugin-manager',
+      title: this.app.i18n.t('Plugin manager'),
+      icon: 'ApiOutlined',
+      aclSnippet: 'pm',
+      sort: -200,
+    });
+    this.app.pluginSettingsManager.addPageTabItem({
+      menuKey: 'plugin-manager',
+      key: 'index',
+      title: this.app.i18n.t('Plugin manager'),
+      componentLoader: () => import('../settings-center/PluginManagerPage'),
+      aclSnippet: 'pm',
+      sort: -200,
+    });
+    this.app.pluginSettingsManager.addMenuItem({
+      key: 'system-settings',
+      title: this.app.i18n.t('System settings'),
+      icon: 'SettingOutlined',
+      aclSnippet: 'pm.system-settings.system-settings',
+      sort: -100,
+    });
+    this.app.pluginSettingsManager.addPageTabItem({
+      menuKey: 'system-settings',
+      key: 'index',
+      title: this.app.i18n.t('System settings'),
+      componentLoader: () => import('../settings-center/SystemSettingsPage'),
+      aclSnippet: 'pm.system-settings.system-settings',
+      sort: -100,
+    });
+  }
+
+  addRoutes() {
+    this.router.add('root', {
+      path: '/',
+      element: <RootRedirect />,
+    });
+
+    this.router.add('not-found', {
+      path: '*',
+      Component: AppNotFound,
+    });
+
+    this.router.add('admin', {
+      path: '/admin',
+      componentLoader: () => import('../flow/components/AdminLayout'),
+    });
+    this.router.add('admin.settings', {
+      path: '/admin/settings',
+      componentLoader: () => import('../settings-center/AdminSettingsLayout'),
+    });
+    this.router.add('admin.settings.route-empty', {
+      path: '*',
+      Component: Outlet,
+    });
+    this.router.add('admin.page', {
+      path: '/admin/:name',
+      componentLoader: () => import('../flow/components/FlowRoute'),
+    });
+
+    this.router.add('admin.page.tab', {
+      path: '/admin/:name/tab/:tabUid',
+      componentLoader: () => import('../flow/components/FlowRoute'),
+    });
+    this.router.add('admin.page.view', {
+      path: '/admin/:name/view/*',
+      componentLoader: () => import('../flow/components/FlowRoute'),
+    });
+    this.router.add('admin.page.tab.view', {
+      path: '/admin/:name/tab/:tabUid/view/*',
+      componentLoader: () => import('../flow/components/FlowRoute'),
+    });
+  }
+
+  addComponents() {}
+
+  async addPlugins() {
+    await this.app.pm.add(PluginFlowEngine);
+    await this.app.pm.add(LocalePlugin, { name: 'builtin-locale' });
+  }
+}
+
+export { NocoBaseBuildInPlugin as NocoBaseBuildInPluginV2 };

package/src/nocobase-buildin-plugin/plugins/LocalePlugin.ts

@@ -0,0 +1,61 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import { setValidateLanguage } from '@formily/validator';
+import dayjs from 'dayjs';
+import { App } from 'antd';
+import { Plugin } from '../../Plugin';
+import { dayjsLocale } from './dayjsLocale';
+import { loadConstrueLocale } from './loadConstrueLocale';
+
+/**
+ * 同步后端下发的语言资源到 client-v2 运行时。
+ */
+export class LocalePlugin extends Plugin {
+  async afterAdd() {
+    const api = this.app.apiClient;
+    const locale = api.auth.locale;
+
+    try {
+      const res = await api.request({
+        url: 'app:getLang',
+        params: {
+          locale,
+        },
+        headers: {
+          'X-Role': 'anonymous',
+        },
+      });
+      const data = res?.data?.data || {};
+
+      this.engine.context.defineProperty('locales', { value: data });
+      this.app.use(App, { component: false });
+
+      if (data.lang) {
+        api.auth.setLocale(data.lang);
+        this.app.i18n.changeLanguage(data.lang);
+      }
+
+      Object.keys(data.resources || {}).forEach((key) => {
+        this.app.i18n.addResources(data.lang, key, data.resources[key] || {});
+      });
+
+      setValidateLanguage(data.lang);
+      loadConstrueLocale(data);
+
+      const dayjsLang = dayjsLocale[data.lang] || 'en';
+      await import(`dayjs/locale/${dayjsLang}`);
+      dayjs.locale(dayjsLang);
+
+      window['cronLocale'] = data.cron;
+    } catch (error) {
+      throw error;
+    }
+  }
+}

package/src/nocobase-buildin-plugin/plugins/dayjsLocale.ts

@@ -0,0 +1,77 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+export const dayjsLocale = {
+  'ar-EG': 'ar',
+  'az-AZ': 'az',
+  'bg-BG': 'bg',
+  'bn-BD': 'bn-bd',
+  'by-BY': 'en',
+  'ca-ES': 'ca',
+  'cs-CZ': 'cs',
+  'da-DK': 'da',
+  'de-DE': 'de',
+  'el-GR': 'el',
+  'en-GB': 'en-gb',
+  'en-US': 'en',
+  'es-ES': 'es',
+  'et-EE': 'et',
+  'fa-IR': 'fa',
+  'fi-FI': 'fi',
+  'fr-BE': 'fr',
+  'fr-CA': 'fr',
+  'fr-FR': 'fr',
+  'ga-IE': 'ga',
+  'gl-ES': 'gl',
+  'he-IL': 'he',
+  'hi-IN': 'hi',
+  'hr-HR': 'hr',
+  'hu-HU': 'hu',
+  'hy-AM': 'hy-am',
+  'id-ID': 'id',
+  'is-IS': 'is',
+  'it-IT': 'it',
+  'ja-JP': 'ja',
+  'ka-GE': 'ka',
+  'kk-KZ': 'kk',
+  'km-KH': 'km',
+  'kn-IN': 'kn',
+  'ko-KR': 'ko',
+  'ku-IQ': 'ku',
+  'lt-LT': 'lt',
+  'lv-LV': 'lv',
+  'mk-MK': 'mk',
+  'ml-IN': 'ml',
+  'mn-MN': 'mn',
+  'ms-MY': 'ms',
+  'nb-NO': 'nb',
+  'ne-NP': 'ne',
+  'nl-BE': 'nl-be',
+  'nl-NL': 'nl',
+  'pl-PL': 'pl',
+  'pt-BR': 'pt-br',
+  'pt-PT': 'pt',
+  'ro-RO': 'ro',
+  'ru-RU': 'ru',
+  'si-LK': 'si',
+  'sk-SK': 'sk',
+  'sl-SI': 'sl',
+  'sr-RS': 'sr',
+  'sv-SE': 'sv',
+  'ta-IN': 'ta',
+  'th-TH': 'th',
+  'tk-TK': 'tk',
+  'tr-TR': 'tr',
+  'uk-UA': 'uk',
+  'ur-PK': 'ur',
+  'vi-VN': 'vi',
+  'zh-CN': 'zh-cn',
+  'zh-HK': 'zh-hk',
+  'zh-TW': 'zh-tw',
+} as const;