@wavemaker-ai/react-runtime 1.0.0-next.27766

package/higherOrder/BaseApp.js

@@ -0,0 +1,440 @@
+"use client";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { jsx, jsxs } from "react/jsx-runtime";
+var _a;
+import { useState, useEffect, useRef, useCallback } from "react";
+import cloneDeep from "lodash-es/cloneDeep";
+import get from "lodash-es/get";
+import { wmSetDependency } from "@wavemaker-ai/variables";
+import { useAppDispatch, useAppSelector } from "../store";
+import { useAuth } from "../hooks/useAuth";
+import { setSelectedLocaleAndLoadBundle } from "../store/slices/i18nSlice";
+import appstore from "../core/appstore";
+import { getAppVariablesInstance } from "../core/appVariablesStore";
+import AppContext from "../context/AppContext";
+import EventNotifier from "../core/event-notifier";
+import DialogService from "../core/dialog.service";
+import { handle401 } from "../core/app.service";
+import { createStateProxy } from "../core/proxy-service";
+import { BaseAppInitialState, importModule } from "./helper";
+import { defaultUserState } from "../store/slices/authSlice";
+import AppSpinnerProvider from "../context/AppSpinnerProvider";
+import LayoutProvider from "../context/LayoutProvider";
+import formatters from "../core/formatter";
+import { hasOwnObjectProperty, setMode, teardownAppModes } from "../core/util/utils";
+import { metadataService } from "../variables/metadata.service";
+import { i18nService as i18nServiceActions } from "../store/bindActions/i18nActions";
+import { WmContainer } from "../components/container";
+import WmPartialContainer from "../components/page/partial-container";
+import RoleAuthGuard from "../components/auth/RoleAuthGuard";
+(_a = global.wm) != null ? _a : global.wm = {};
+const BaseApp = (WrappedComponent, addAppScript, getAppVariables, appInfo = {}) => {
+  const AppContextComponent = (props) => {
+    var _a2;
+    const dispatch = useAppDispatch();
+    const authContext = useAuth();
+    const i18n = useAppSelector((state) => state.i18n);
+    const info = useAppSelector((state) => state.info);
+    const i18nService = appstore.I18nService.get();
+    const [appContext, setAppContext] = useState(__spreadValues(__spreadValues(__spreadValues(__spreadProps(__spreadValues({}, BaseAppInitialState), {
+      updateActivePage,
+      changeLocale,
+      selectedLocale: i18n.selectedLocale || "en",
+      localeFormats: {
+        date: i18n.dateFormat,
+        time: i18n.timeFormat,
+        currency: i18n.currencyCode
+      },
+      baseUrl: ((_a2 = info == null ? void 0 : info.appConfig) == null ? void 0 : _a2.url) || "",
+      appConfig: __spreadProps(__spreadValues({}, info == null ? void 0 : info.appConfig), {
+        SecurityService: authContext,
+        loggedInUser: cloneDeep(authContext == null ? void 0 : authContext.loggedInUser) || defaultUserState
+      }),
+      serviceDefinitions: cloneDeep((info == null ? void 0 : info.serviceDefs) || {}),
+      notifyApp,
+      notify,
+      eval: evaluateExpression,
+      openActionDialog,
+      executeStartAppOperations,
+      importModule,
+      Widgets: {},
+      subscribe,
+      targetPlatform: "WEB",
+      hasOwnObjectProperty,
+      formatters
+    }), appInfo), i18nServiceActions), i18nService));
+    const appProxyRef = useRef(null);
+    const sessionFailureRequestsRef = useRef([]);
+    const isInitializedRef = useRef(false);
+    const serviceErrorSubscriptionRef = useRef(null);
+    const isVariablesExecutedRef = useRef(false);
+    const registrationTimeoutRef = useRef(null);
+    const pendingWidgetRegistrations = useRef({});
+    const subscribersRef = useRef(/* @__PURE__ */ new Map());
+    useEffect(() => {
+      const definitions = cloneDeep((info == null ? void 0 : info.serviceDefs) || {});
+      if (appProxyRef.current) {
+        appProxyRef.current.serviceDefinitions = definitions;
+      }
+      setAppContext((prev) => __spreadProps(__spreadValues({}, prev), {
+        serviceDefinitions: definitions
+      }));
+    }, [info == null ? void 0 : info.serviceDefs]);
+    const authLoggedInUser = useAppSelector((state) => state.auth.loggedInUser);
+    useEffect(() => {
+      var _a3, _b, _c, _d;
+      const loggedInUser = cloneDeep(authContext == null ? void 0 : authContext.loggedInUser) || defaultUserState;
+      const newAppConfig = __spreadProps(__spreadValues({}, (_c = (_b = (_a3 = appProxyRef.current) == null ? void 0 : _a3.appConfig) != null ? _b : info == null ? void 0 : info.appConfig) != null ? _c : {}), {
+        SecurityService: authContext,
+        loggedInUser
+      });
+      if (appProxyRef.current) {
+        appProxyRef.current.appConfig = newAppConfig;
+        const loggedInUserVar = (_d = appProxyRef.current.Variables) == null ? void 0 : _d.loggedInUser;
+        if (loggedInUserVar == null ? void 0 : loggedInUserVar.invokeOnParamChange) {
+          loggedInUserVar.invokeOnParamChange();
+        }
+      }
+      setAppContext((prev) => __spreadProps(__spreadValues({}, prev), {
+        appConfig: __spreadProps(__spreadValues({}, prev.appConfig), {
+          SecurityService: authContext,
+          loggedInUser
+        })
+      }));
+    }, [authLoggedInUser]);
+    const { securityConfig } = useAuth();
+    useEffect(() => {
+      const securityService = __spreadProps(__spreadValues({}, authContext), {
+        securityConfig,
+        get: () => {
+          return securityConfig;
+        }
+      });
+      wmSetDependency("security", securityService);
+    }, [authContext, securityConfig]);
+    useEffect(() => {
+      const localeFormats = {
+        date: i18n.dateFormat,
+        time: i18n.timeFormat,
+        currency: i18n.currencyCode
+      };
+      if (appProxyRef.current) {
+        appProxyRef.current.localeFormats = localeFormats;
+      }
+      setAppContext((prev) => __spreadProps(__spreadValues({}, prev), {
+        localeFormats
+      }));
+    }, [i18n.dateFormat, i18n.timeFormat, i18n.currencyCode]);
+    useEffect(() => {
+      const unsubscribe = EventNotifier.ROOT.subscribe(
+        "SERVICE_ERROR",
+        (variable, error, options) => {
+          var _a3, _b;
+          if (((_a3 = options == null ? void 0 : options.xhrObj) == null ? void 0 : _a3.status) === 401) {
+            handle401();
+          }
+          if (((_b = options == null ? void 0 : options.xhrObj) == null ? void 0 : _b.code) === "ERR_CANCELED") {
+            return;
+          }
+          notifyApp(error, "error", false);
+        }
+      );
+      serviceErrorSubscriptionRef.current = unsubscribe;
+      return () => {
+        if (serviceErrorSubscriptionRef.current) {
+          serviceErrorSubscriptionRef.current();
+        }
+        if (registrationTimeoutRef.current) {
+          clearTimeout(registrationTimeoutRef.current);
+          registrationTimeoutRef.current = null;
+        }
+      };
+    }, []);
+    useEffect(() => {
+      if (!(info == null ? void 0 : info.serviceDefs)) return;
+      if (isInitializedRef.current) return;
+      isInitializedRef.current = true;
+      initializeApp();
+      return () => {
+        teardownAppModes();
+        if (serviceErrorSubscriptionRef.current) {
+          serviceErrorSubscriptionRef.current();
+        }
+        if (registrationTimeoutRef.current) {
+          clearTimeout(registrationTimeoutRef.current);
+          registrationTimeoutRef.current = null;
+        }
+      };
+    }, [info == null ? void 0 : info.serviceDefs]);
+    function openActionDialog(notification, title) {
+      setAppContext((prev) => {
+        var _a3, _b, _c;
+        if (title) {
+          (_c = (_b = (_a3 = prev == null ? void 0 : prev.Widgets) == null ? void 0 : _a3[title]) == null ? void 0 : _b.open) == null ? void 0 : _c.call(_b);
+        }
+        return __spreadProps(__spreadValues({}, prev), {
+          notification
+        });
+      });
+    }
+    async function executeStartAppOperations() {
+      if (isVariablesExecutedRef.current) return;
+      isVariablesExecutedRef.current = true;
+      const startUpVariables = appInfo.startUpVariables || [];
+      const appVariables = appProxyRef.current.Variables;
+      const variablePromises = startUpVariables.map(async (varName) => {
+        const variable = appVariables[varName];
+        if (variable && variable.invoke && typeof variable.invoke === "function") {
+          try {
+            return await variable.invoke();
+          } catch (error) {
+            console.warn(`Error invoking startup variable ${varName}:`, error);
+            return null;
+          }
+        }
+        return Promise.resolve();
+      });
+      try {
+        await Promise.allSettled(variablePromises);
+        if (appProxyRef.current.onAppVariablesReady && typeof appProxyRef.current.onAppVariablesReady === "function") {
+          await appProxyRef.current.onAppVariablesReady();
+        }
+        setTimeout(() => {
+          var _a3;
+          notify("app-variables-data-loaded", { pageName: (_a3 = appProxyRef.current) == null ? void 0 : _a3.activePageName });
+        }, 0);
+      } catch (error) {
+        console.error("Error during app startup operations:", error);
+      }
+    }
+    const initializeApp = async () => {
+      var _a3;
+      try {
+        const appProxy = createStateProxy(appContext, [], setAppContext);
+        appProxy.serviceDefinitions = cloneDeep((info == null ? void 0 : info.serviceDefs) || {});
+        appProxyRef.current = appProxy;
+        appProxy.setMode = setMode;
+        let appVariables = {
+          Variables: {},
+          Actions: {}
+        };
+        if (getAppVariables && typeof getAppVariables === "function") {
+          appVariables = getAppVariables(appProxy);
+        } else {
+          const APP_VARIABLES = (_a3 = appstore.get("AppConfig")) == null ? void 0 : _a3.appVariables;
+          if (APP_VARIABLES) {
+            appVariables = getAppVariablesInstance(appProxy, APP_VARIABLES);
+          }
+        }
+        appProxy.Variables = appVariables.Variables;
+        appProxy.Actions = appVariables.Actions;
+        if (addAppScript && typeof addAppScript === "function") {
+          addAppScript(appProxy);
+        }
+        const executeAppStartup = async () => {
+          const startUpActions = appInfo.startUpActions || [];
+          for (const actionName of startUpActions) {
+            const action = appVariables.Actions[actionName];
+            if (action && action.invoke && typeof action.invoke === "function") {
+              try {
+                action.invoke();
+              } catch (error) {
+                console.warn(`Error invoking startup action ${actionName}:`, error);
+              }
+            }
+          }
+        };
+        const executeAppBeforeStartup = async () => {
+          appProxy.hasOwnProperty("onBeforeAppReady") && await appProxy.onBeforeAppReady();
+          return Promise.resolve();
+        };
+        await executeAppBeforeStartup();
+        await executeAppStartup();
+        appstore.DialogService.set(DialogService);
+        setAppContext((prev) => __spreadProps(__spreadValues({}, prev), {
+          Variables: appVariables.Variables,
+          Actions: appVariables.Actions,
+          appProxy,
+          isAppReady: true
+        }));
+      } catch (error) {
+        console.error("Error initializing app:", error);
+        setAppContext((prev) => __spreadProps(__spreadValues({}, prev), { isAppReady: true }));
+      }
+    };
+    function evaluateExpression(fn, failOnError = false) {
+      try {
+        return fn.call(appContext);
+      } catch (e) {
+        if (failOnError) {
+          throw e;
+        } else {
+          return null;
+        }
+      }
+    }
+    function updateActivePage(pageName) {
+      var _a3;
+      if (appProxyRef.current) {
+        appProxyRef.current.lastActivePage = (_a3 = appProxyRef.current) == null ? void 0 : _a3.activePageName;
+        appProxyRef.current.activePageName = pageName;
+      }
+    }
+    function subscribe(eventName, callback) {
+      if (!eventName || typeof callback !== "function") {
+        return () => {
+        };
+      }
+      if (!subscribersRef.current.has(eventName)) {
+        subscribersRef.current.set(eventName, /* @__PURE__ */ new Set());
+      }
+      const subscribers = subscribersRef.current.get(eventName);
+      subscribers.add(callback);
+      return () => {
+        const subs = subscribersRef.current.get(eventName);
+        if (subs) {
+          subs.delete(callback);
+          if (subs.size === 0) {
+            subscribersRef.current.delete(eventName);
+          }
+        }
+      };
+    }
+    function notify(eventName, value) {
+      if (!eventName) {
+        return;
+      }
+      const subscribers = subscribersRef.current.get(eventName);
+      if (subscribers && subscribers.size > 0) {
+        subscribers.forEach((callback) => {
+          try {
+            callback(value);
+          } catch (error) {
+            console.error(`Error in subscriber callback for ${eventName}:`, error);
+          }
+        });
+      }
+    }
+    function changeLocale(locale) {
+      dispatch(
+        setSelectedLocaleAndLoadBundle({
+          locale
+        })
+      );
+    }
+    function notifyApp(message, type, showTypeLabel) {
+      const notificationAction = get(appProxyRef.current, "Actions.appNotification");
+      if (notificationAction) {
+        const appNotification = notificationAction.config.paramProvider();
+        const newParams = () => ({
+          text: message || "Success",
+          content: "inline",
+          class: type || "Success",
+          duration: appNotification.duration || 3e3,
+          toasterPosition: appNotification.toasterPosition || "bottom right",
+          showTypeLabel: showTypeLabel != null ? showTypeLabel : false
+        });
+        notificationAction.config.paramProvider = newParams;
+        notificationAction.invoke();
+      } else {
+        console.warn(
+          `The default Action "appNotification" doesn't exist in the app.  App notified following error:
+ `,
+          message
+        );
+      }
+    }
+    const renderCommonComponents = () => {
+      return /* @__PURE__ */ jsx(
+        WmContainer,
+        {
+          hidden: true,
+          content: "Common",
+          "data-widget-id": "common-container",
+          className: "app-container-default",
+          renderPartial: (props2, onLoad) => /* @__PURE__ */ jsx(
+            WmPartialContainer,
+            {
+              onLoad,
+              "data-widget-id": "common-partial-container",
+              content: props2.content,
+              partialName: "commonPartialContainer"
+            }
+          )
+        }
+      );
+    };
+    const pushToSessionFailureRequests = useCallback((callback) => {
+      sessionFailureRequestsRef.current.push(callback);
+    }, []);
+    const executeSessionFailureRequests = useCallback(async () => {
+      const sessionFailureRequestPromises = sessionFailureRequestsRef.current.map(
+        async (callback) => {
+          try {
+            return await callback();
+          } catch (error) {
+            console.warn(`Error invoking session failure request:`, error);
+            return null;
+          }
+        }
+      );
+      await Promise.allSettled(sessionFailureRequestPromises);
+      sessionFailureRequestsRef.current = [];
+    }, []);
+    if (appProxyRef.current && !appProxyRef.current.executeSessionFailureRequests) {
+      appProxyRef.current.executeSessionFailureRequests = executeSessionFailureRequests;
+    }
+    if (appProxyRef.current && !appProxyRef.current.pushToSessionFailureRequests) {
+      appProxyRef.current.pushToSessionFailureRequests = pushToSessionFailureRequests;
+    }
+    useEffect(() => {
+      metadataService.setMetadata(appContext == null ? void 0 : appContext.serviceDefinitions);
+      wmSetDependency("metadata", metadataService);
+      wmSetDependency("appManager", {
+        notify,
+        notifyApp,
+        pushToSessionFailureRequests,
+        executeSessionFailureRequests,
+        handle401
+      });
+    }, [appContext == null ? void 0 : appContext.serviceDefinitions]);
+    return /* @__PURE__ */ jsx(
+      AppContext.Provider,
+      {
+        value: {
+          state: appContext,
+          proxy: appProxyRef.current
+        },
+        children: /* @__PURE__ */ jsx(AppSpinnerProvider, { children: /* @__PURE__ */ jsx(LayoutProvider, { children: /* @__PURE__ */ jsxs(RoleAuthGuard, { children: [
+          /* @__PURE__ */ jsx(WrappedComponent, __spreadValues({}, props)),
+          renderCommonComponents()
+        ] }) }) })
+      }
+    );
+  };
+  AppContextComponent.displayName = `BaseApp(${WrappedComponent.displayName || WrappedComponent.name || "Component"})`;
+  return AppContextComponent;
+};
+var BaseApp_default = BaseApp;
+export {
+  BaseApp,
+  BaseApp_default as default
+};

package/higherOrder/BaseAppProps.d.ts

@@ -0,0 +1,38 @@
+import { ProxyTarget } from "@wavemaker-ai/react-runtime/types";
+/** Same shape as locale JSON `formats` for App/page proxies. */
+export type LocaleFormatsProxy = {
+    date: string;
+    time: string;
+    currency: string;
+};
+type notify = (message: string, type: string, title?: any) => void;
+export interface BaseAppProps {
+    Variables: Record<string, any>;
+    Actions: Record<string, any>;
+    isAppReady: boolean;
+    changeLocale: (locale: string) => void;
+    selectedLocale: string;
+    /** Locale bundle–style formats; synced from Redux `i18n`. */
+    localeFormats: LocaleFormatsProxy;
+    getDependency: (name: string) => any;
+    serviceDefinitions: Record<string, any>;
+    baseUrl: string;
+    appConfig: any;
+    reload: () => void;
+    notifyApp: notify;
+    notify: (id: string, data: Record<string, unknown>) => void;
+    notification: Record<string, any> | null;
+    Common: Record<string, any>;
+    onPageReady: (activePageName: string, activePageScrope: any, activePageEl: any) => void;
+    openActionDialog: (notification: any, title?: string) => void;
+    eval: (fn: Function, failOnError?: boolean) => any;
+    getCurrentMonth: () => string;
+    updateActivePage: (pageName: string) => void;
+    executeStartAppOperations: () => Promise<any>;
+    importModule?: (moduleName: string) => any;
+    Widgets?: Record<string, ProxyTarget>;
+    subscribe: (eventName: string, callback: Function) => () => void;
+    autoUpdateVariables: string[];
+    appLocale?: Record<string, any>;
+}
+export default BaseAppProps;

package/higherOrder/BaseDateTime.d.ts

@@ -0,0 +1,62 @@
+import React from "react";
+import { BaseProps } from "@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper";
+interface FormControl {
+    setValue: (value: any) => void;
+    value: any;
+    markAsTouched: () => void;
+    execute?: (operation: string) => boolean;
+    twoWayBinding?: boolean;
+    owner?: string;
+    registerOnChange: (fn: () => void) => void;
+    registerOnTouched: (fn: () => void) => void;
+    unregisterOnChange: (fn: () => void) => void;
+    unregisterOnTouched: (fn: () => void) => void;
+}
+export interface FormControlRegistry {
+    get: (name: string) => FormControl;
+}
+export interface DateTimeContext {
+    [key: string]: any;
+}
+interface ViewParent {
+    [key: string]: any;
+    containerWidget?: {
+        _isCustom: boolean;
+    };
+    App?: {
+        [key: string]: any;
+    };
+}
+export interface CustomProps {
+    formControlName?: string;
+    name?: string;
+    required?: boolean;
+    datavalue?: any;
+    outputformat?: string;
+    mindate?: string | Date;
+    maxdate?: string | Date;
+    excludedays?: number[];
+    excludedates?: string[] | Date[];
+    dataentrymode?: "date" | "time" | "datetime";
+    datepattern?: string;
+    timepattern?: string;
+    showweeks?: boolean;
+    selectfromothermonth?: boolean;
+    todaybutton?: boolean;
+    clearbutton?: boolean;
+    todaybuttonlabel?: string;
+    clearbuttonlabel?: string;
+    showcustompicker?: boolean;
+    adaptiveposition?: boolean;
+    widgetSubType?: string;
+    context?: DateTimeContext;
+    viewParent?: ViewParent;
+    invokeEventCallback?: (eventName: string, payload: any) => void;
+    formControlRegistry?: FormControlRegistry;
+}
+type WmDateTimeProps = BaseProps & CustomProps;
+declare const withBaseDateTime: <P extends WmDateTimeProps>(WrappedComponent: React.ComponentType<P>) => {
+    (props: WmDateTimeProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default withBaseDateTime;