@nocobase/client-v2 2.0.0-alpha.20

package/lib/Application.js

@@ -0,0 +1,489 @@
+/**
+ * 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.
+ */
+
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
+var Application_exports = {};
+__export(Application_exports, {
+  Application: () => Application
+});
+module.exports = __toCommonJS(Application_exports);
+var import_reactive = require("@formily/reactive");
+var import_flow_engine = require("@nocobase/flow-engine");
+var import_sdk = require("@nocobase/sdk");
+var import_i18next = require("i18next");
+var import_lodash = __toESM(require("lodash"));
+var import_react = __toESM(require("react"));
+var import_client = require("react-dom/client");
+var import_react_i18next = require("react-i18next");
+var import_react_router_dom = require("react-router-dom");
+var import_PluginManager = require("./PluginManager");
+var import_PluginSettingsManager = require("./PluginSettingsManager");
+var import_RouterManager = require("./RouterManager");
+var import_WebSocketClient = require("./WebSocketClient");
+var import_components = require("./components");
+var import_utils = require("./utils");
+var import_requirejs = require("./utils/requirejs");
+var _providers, _router;
+const _Application = class _Application {
+  constructor(options = {}) {
+    this.options = options;
+    this.initRequireJs();
+    (0, import_reactive.define)(this, {
+      maintained: import_reactive.observable.ref,
+      maintaining: import_reactive.observable.ref,
+      error: import_reactive.observable.ref
+    });
+    this.devDynamicImport = options.devDynamicImport;
+    this.components = import_lodash.default.merge(this.components, options.components);
+    this.apiClient = new import_sdk.APIClient(options.apiClient);
+    this.i18n = options.i18n || (0, import_i18next.createInstance)();
+    this.router = new import_RouterManager.RouterManager(options.router, this);
+    this.pluginManager = new import_PluginManager.PluginManager(options.plugins, options.loadRemotePlugins, this);
+    this.flowEngine = new import_flow_engine.FlowEngine();
+    this.flowEngine.registerModels({ ApplicationModel });
+    this.model = this.flowEngine.createModel({
+      use: "ApplicationModel",
+      uid: "__app_model__"
+    });
+    this.context = this.flowEngine.context;
+    this.context.defineProperty("pluginManager", {
+      get: /* @__PURE__ */ __name(() => this.pluginManager, "get")
+    });
+    this.context.defineProperty("pluginSettingsRouter", {
+      get: /* @__PURE__ */ __name(() => this.pluginSettingsManager, "get")
+    });
+    this.addDefaultProviders();
+    this.addReactRouterComponents();
+    this.addProviders(options.providers || []);
+    this.ws = new import_WebSocketClient.WebSocketClient(options.ws);
+    this.ws.app = this;
+    this.pluginSettingsManager = new import_PluginSettingsManager.PluginSettingsManager(options.pluginSettings, this);
+    this.addRoutes();
+    this.name = this.options.name || (0, import_sdk.getSubAppName)(options.publicPath) || "main";
+    this.i18n.on("languageChanged", (lng) => {
+      this.apiClient.auth.locale = lng;
+    });
+    this.initListeners();
+  }
+  eventBus = new EventTarget();
+  providers = [];
+  router;
+  scopes = {};
+  i18n;
+  ws;
+  apiClient;
+  components = {
+    AppNotFound: /* @__PURE__ */ __name(() => /* @__PURE__ */ import_react.default.createElement("div", null, "Not Found"), "AppNotFound"),
+    AppError: /* @__PURE__ */ __name(() => {
+      var _a;
+      return /* @__PURE__ */ import_react.default.createElement("div", null, (_a = this.error) == null ? void 0 : _a.message);
+    }, "AppError"),
+    AppSpin: /* @__PURE__ */ __name(() => /* @__PURE__ */ import_react.default.createElement("div", null, "Loading"), "AppSpin"),
+    AppMaintaining: /* @__PURE__ */ __name(() => /* @__PURE__ */ import_react.default.createElement("div", null, "Maintaining"), "AppMaintaining"),
+    AppMaintainingDialog: /* @__PURE__ */ __name(() => /* @__PURE__ */ import_react.default.createElement("div", null, "Maintaining Dialog"), "AppMaintainingDialog")
+  };
+  pluginManager;
+  pluginSettingsManager;
+  devDynamicImport;
+  requirejs;
+  name;
+  favicon;
+  flowEngine;
+  context;
+  maintained = false;
+  maintaining = false;
+  error = null;
+  model;
+  wsAuthorized = false;
+  apps = {
+    Component: null
+  };
+  get pm() {
+    return this.pluginManager;
+  }
+  get disableAcl() {
+    return this.options.disableAcl;
+  }
+  get isWsAuthorized() {
+    return this.wsAuthorized;
+  }
+  updateFavicon(favicon) {
+    let faviconLinkElement = document.querySelector('link[rel="shortcut icon"]');
+    if (favicon) {
+      this.favicon = favicon;
+    }
+    if (!faviconLinkElement) {
+      faviconLinkElement = document.createElement("link");
+      faviconLinkElement.rel = "shortcut icon";
+      faviconLinkElement.href = this.favicon || "/favicon/favicon.ico";
+      document.head.appendChild(faviconLinkElement);
+    } else {
+      faviconLinkElement.href = this.favicon || "/favicon/favicon.ico";
+    }
+  }
+  setWsAuthorized(authorized) {
+    this.wsAuthorized = authorized;
+  }
+  initListeners() {
+    this.eventBus.addEventListener("auth:tokenChanged", (event) => {
+      this.setTokenInWebSocket(event.detail);
+    });
+    this.eventBus.addEventListener("maintaining:end", () => {
+      if (this.apiClient.auth.token) {
+        this.setTokenInWebSocket({
+          token: this.apiClient.auth.token,
+          authenticator: this.apiClient.auth.getAuthenticator()
+        });
+      }
+    });
+  }
+  setTokenInWebSocket(options) {
+    const { token, authenticator } = options;
+    if (this.maintaining) {
+      return;
+    }
+    this.ws.send(
+      JSON.stringify({
+        type: "auth:token",
+        payload: {
+          token,
+          authenticator
+        }
+      })
+    );
+  }
+  setMaintaining(maintaining) {
+    if (this.maintaining === maintaining) {
+      return;
+    }
+    this.maintaining = maintaining;
+    if (!maintaining) {
+      this.eventBus.dispatchEvent(new Event("maintaining:end"));
+    }
+  }
+  initRequireJs() {
+    if (typeof window === "undefined") {
+      return;
+    }
+    if (window["requirejs"]) {
+      this.requirejs = window["requirejs"];
+      return;
+    }
+    window["requirejs"] = this.requirejs = (0, import_requirejs.getRequireJs)();
+    window.define = this.requirejs.define;
+  }
+  addDefaultProviders() {
+    this.use(import_react_i18next.I18nextProvider, { i18n: this.i18n });
+    this.flowEngine.context.defineProperty("app", {
+      value: this
+    });
+    this.flowEngine.context.defineProperty("api", {
+      value: this.apiClient
+    });
+    this.flowEngine.context.defineProperty("i18n", {
+      value: this.i18n
+    });
+    this.flowEngine.context.defineProperty("router", {
+      get: /* @__PURE__ */ __name(() => this.router.router, "get"),
+      cache: false
+    });
+    this.flowEngine.context.defineProperty("documentTitle", {
+      get: /* @__PURE__ */ __name(() => document.title, "get")
+    });
+    this.flowEngine.context.defineProperty("route", {
+      get: /* @__PURE__ */ __name(() => {
+      }, "get"),
+      observable: true
+    });
+    this.flowEngine.context.defineProperty("location", {
+      get: /* @__PURE__ */ __name(() => location, "get"),
+      observable: true
+    });
+    this.use(import_flow_engine.FlowEngineProvider, { engine: this.flowEngine });
+    this.use(import_flow_engine.FlowEngineGlobalsContextProvider);
+  }
+  addReactRouterComponents() {
+    this.addComponents({
+      Link: import_react_router_dom.Link,
+      Navigate: import_react_router_dom.Navigate,
+      NavLink: import_react_router_dom.NavLink
+    });
+  }
+  addRoutes() {
+    this.router.add("not-found", {
+      path: "*",
+      Component: this.components["AppNotFound"]
+    });
+  }
+  getOptions() {
+    return this.options;
+  }
+  getName() {
+    return (0, import_sdk.getSubAppName)(this.getPublicPath()) || null;
+  }
+  getPublicPath() {
+    let publicPath = this.options.publicPath || "/";
+    if (!publicPath.endsWith("/")) {
+      publicPath += "/";
+    }
+    return publicPath;
+  }
+  getApiUrl(pathname = "") {
+    let baseURL = this.apiClient.axios["defaults"]["baseURL"];
+    if (!baseURL.startsWith("http://") && !baseURL.startsWith("https://")) {
+      const { protocol, host } = window.location;
+      baseURL = `${protocol}//${host}${baseURL}`;
+    }
+    return baseURL.replace(/\/$/g, "") + "/" + pathname.replace(/^\//g, "");
+  }
+  getRouteUrl(pathname) {
+    return this.getPublicPath() + pathname.replace(/^\//g, "");
+  }
+  getHref(pathname) {
+    const name = this.name;
+    if (name && name !== "main") {
+      return this.getPublicPath() + "apps/" + name + "/" + pathname.replace(/^\//g, "");
+    }
+    return this.getPublicPath() + pathname.replace(/^\//g, "");
+  }
+  /**
+   * @internal
+   */
+  getComposeProviders() {
+    const Providers = (0, import_utils.compose)(...this.providers)(import_components.BlankComponent);
+    Providers.displayName = "Providers";
+    return Providers;
+  }
+  use(component, props) {
+    return this.addProvider(component, props);
+  }
+  addProvider(component, props) {
+    return this.providers.push([component, props]);
+  }
+  addProviders(providers) {
+    providers.forEach((provider) => {
+      if (Array.isArray(provider)) {
+        this.addProvider(provider[0], provider[1]);
+      } else {
+        this.addProvider(provider);
+      }
+    });
+  }
+  async load() {
+    await this.loadWebSocket();
+    await this.pm.load();
+    await this.flowEngine.flowSettings.load();
+    this.updateFavicon();
+  }
+  async loadWebSocket() {
+    this.eventBus.addEventListener("ws:message:authorized", () => {
+      this.setWsAuthorized(true);
+    });
+    this.ws.on("message", (event) => {
+      var _a, _b, _c;
+      if (!event.data) {
+        return;
+      }
+      const data = JSON.parse(event.data);
+      if ((_a = data == null ? void 0 : data.payload) == null ? void 0 : _a.refresh) {
+        window.location.reload();
+        return;
+      }
+      if (data.type === "notification") {
+        this.context.notification[((_b = data.payload) == null ? void 0 : _b.type) || "info"]({ message: (_c = data.payload) == null ? void 0 : _c.message });
+        return;
+      }
+      if (this.error && data.payload.code === "APP_RUNNING") {
+        this.maintained = true;
+        this.setMaintaining(false);
+        this.error = null;
+        window.location.reload();
+        return;
+      }
+      const maintaining = data.type === "maintaining" && data.payload.code !== "APP_RUNNING";
+      console.log("ws:message", { maintaining, data });
+      if (maintaining) {
+        this.setMaintaining(true);
+        this.error = data.payload;
+      } else {
+        this.setMaintaining(false);
+        this.maintained = true;
+        this.error = null;
+        const type = data.type;
+        if (!type) {
+          return;
+        }
+        const eventName = `ws:message:${type}`;
+        this.eventBus.dispatchEvent(new CustomEvent(eventName, { detail: data.payload }));
+      }
+    });
+    this.ws.on("serverDown", () => {
+      this.maintaining = true;
+      this.maintained = false;
+    });
+    this.ws.on("open", () => {
+      const token = this.apiClient.auth.token;
+      if (token) {
+        this.setTokenInWebSocket({ token, authenticator: this.apiClient.auth.getAuthenticator() });
+      }
+    });
+    this.ws.connect();
+  }
+  getComponent(Component, isShowError = true) {
+    const showError = /* @__PURE__ */ __name((msg) => isShowError && console.error(msg), "showError");
+    if (!Component) {
+      showError(`getComponent called with ${Component}`);
+      return;
+    }
+    if (typeof Component === "function") return Component;
+    if (typeof Component === "string") {
+      const res = import_lodash.default.get(this.components, Component);
+      if (!res) {
+        showError(`Component ${Component} not found`);
+        return;
+      }
+      return res;
+    }
+    showError(`Component ${Component} should be a string or a React component`);
+    return;
+  }
+  renderComponent(Component, props, children) {
+    return import_react.default.createElement(this.getComponent(Component), props, children);
+  }
+  addComponent(component, name) {
+    const componentName = name || component.displayName || component.name;
+    if (!componentName) {
+      console.error("Component must have a displayName or pass name as second argument");
+      return;
+    }
+    import_lodash.default.set(this.components, componentName, component);
+  }
+  addComponents(components) {
+    Object.keys(components).forEach((name) => {
+      this.addComponent(components[name], name);
+    });
+  }
+  getRootComponent() {
+    const Root = /* @__PURE__ */ __name(() => /* @__PURE__ */ import_react.default.createElement(import_flow_engine.FlowEngineProvider, { engine: this.flowEngine }, /* @__PURE__ */ import_react.default.createElement(import_flow_engine.FlowModelRenderer, { fallback: this.renderComponent("AppSpin"), model: this.model })), "Root");
+    return Root;
+  }
+  mount(containerOrSelector) {
+    const container = (0, import_utils.normalizeContainer)(containerOrSelector);
+    if (!container) return;
+    const App = this.getRootComponent();
+    const root = (0, import_client.createRoot)(container);
+    root.render(/* @__PURE__ */ import_react.default.createElement(App, null));
+    return root;
+  }
+};
+__name(_Application, "Application");
+let Application = _Application;
+const _ApplicationModel = class _ApplicationModel extends import_flow_engine.FlowModel {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _providers);
+    __privateAdd(this, _router);
+  }
+  get app() {
+    return this.context.app;
+  }
+  getProviders() {
+    __privateSet(this, _providers, this.app.getComposeProviders());
+    return __privateGet(this, _providers);
+  }
+  getRouter() {
+    __privateSet(this, _router, this.app.router.getRouterComponent());
+    return __privateGet(this, _router);
+  }
+  render() {
+    console.log("render", {
+      maintaining: this.app.maintaining,
+      maintained: this.app.maintained,
+      error: this.app.error
+    });
+    if (this.app.maintaining) {
+      return this.renderMaintaining();
+    }
+    if (this.app.error) {
+      return this.renderError();
+    }
+    return this.renderContent();
+  }
+  renderMaintaining() {
+    if (!this.app.maintained) {
+      return this.app.renderComponent("AppMaintaining");
+    }
+    return this.app.renderComponent("AppMaintainingDialog");
+  }
+  renderError() {
+    return this.app.renderComponent("AppError");
+  }
+  renderContent() {
+    const Router = this.getRouter();
+    const Providers = this.getProviders();
+    return /* @__PURE__ */ import_react.default.createElement(Router, { BaseLayout: Providers });
+  }
+};
+_providers = new WeakMap();
+_router = new WeakMap();
+__name(_ApplicationModel, "ApplicationModel");
+let ApplicationModel = _ApplicationModel;
+ApplicationModel.registerFlow({
+  key: "appFlow",
+  steps: {
+    init: {
+      async handler(ctx, params) {
+        try {
+          await ctx.app.load();
+        } catch (err) {
+          ctx.model.app.error = err;
+          console.error(err);
+        }
+      }
+    }
+  }
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Application
+});

package/lib/MockApplication.d.ts

@@ -0,0 +1,16 @@
+/**
+ * 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 MockAdapter from 'axios-mock-adapter';
+import { Application, type ApplicationOptions } from './Application';
+declare class MockApplication extends Application {
+    apiMock: MockAdapter;
+    constructor(options?: ApplicationOptions);
+}
+export declare function createMockClient(options?: ApplicationOptions): MockApplication;
+export {};

package/lib/MockApplication.js

@@ -0,0 +1,96 @@
+/**
+ * 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.
+ */
+
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var MockApplication_exports = {};
+__export(MockApplication_exports, {
+  createMockClient: () => createMockClient
+});
+module.exports = __toCommonJS(MockApplication_exports);
+var import_axios_mock_adapter = __toESM(require("axios-mock-adapter"));
+var import_Application = require("./Application");
+var import_WebSocketClient = require("./WebSocketClient");
+const _MockApplication = class _MockApplication extends import_Application.Application {
+  apiMock;
+  constructor(options = {}) {
+    super({
+      router: { type: "memory", initialEntries: ["/"] },
+      ...options
+    });
+    this.apiMock = new import_axios_mock_adapter.default(this.apiClient.axios);
+    this.ws = new MockWebSocketClient(options.ws || {});
+  }
+};
+__name(_MockApplication, "MockApplication");
+let MockApplication = _MockApplication;
+const _MockWebSocketClient = class _MockWebSocketClient extends import_WebSocketClient.WebSocketClient {
+  eventBus = new EventTarget();
+  constructor(options) {
+    super(options);
+  }
+  connect() {
+  }
+  close() {
+  }
+  send() {
+  }
+  on(type, listener, options) {
+    this.eventBus.addEventListener(
+      type,
+      (event) => listener({ data: JSON.stringify(event.detail) }),
+      options
+    );
+  }
+  emit(type, data) {
+    this.eventBus.dispatchEvent(new CustomEvent(type, { detail: data }));
+  }
+  off(type, listener, options) {
+    this.eventBus.removeEventListener(type, listener, options);
+  }
+  removeAllListeners() {
+  }
+};
+__name(_MockWebSocketClient, "MockWebSocketClient");
+let MockWebSocketClient = _MockWebSocketClient;
+function createMockClient(options) {
+  const app = new MockApplication(options);
+  return app;
+}
+__name(createMockClient, "createMockClient");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createMockClient
+});

package/lib/Plugin.d.ts

@@ -0,0 +1,33 @@
+/**
+ * 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 type { TFuncKey, TOptions } from 'i18next';
+import type { Application } from './Application';
+export declare class Plugin<T = any> {
+    options: T;
+    protected app: Application;
+    constructor(options: T, app: Application);
+    get pluginManager(): import("./PluginManager").PluginManager;
+    get context(): import("@nocobase/flow-engine").FlowEngineContext & {
+        pluginSettingsRouter: import("./PluginSettingsManager").PluginSettingsManager;
+        pluginManager: import("./PluginManager").PluginManager;
+    };
+    get flowEngine(): import("@nocobase/flow-engine").FlowEngine;
+    get engine(): import("@nocobase/flow-engine").FlowEngine;
+    get pm(): import("./PluginManager").PluginManager;
+    get router(): import("./RouterManager").RouterManager;
+    get pluginSettingsManager(): import("./PluginSettingsManager").PluginSettingsManager;
+    get pluginSettingsRouter(): import("./PluginSettingsManager").PluginSettingsManager;
+    get schemaInitializerManager(): any;
+    get schemaSettingsManager(): any;
+    get dataSourceManager(): any;
+    afterAdd(): Promise<void>;
+    beforeLoad(): Promise<void>;
+    load(): Promise<void>;
+    t(text: TFuncKey | TFuncKey[], options?: TOptions): import("i18next").TFunctionDetailedResult<object>;
+}