@wavemaker-ai/react-runtime 1.0.0-rc.309

package/higherOrder/BaseApp.js

@@ -0,0 +1,614 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.BaseApp = void 0;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireWildcard(require("react"));
+var _cloneDeep = _interopRequireDefault(require("lodash-es/cloneDeep"));
+var _get2 = _interopRequireDefault(require("lodash-es/get"));
+var _variables = require("@wavemaker-ai/variables");
+var _store = require("../store");
+var _useAuth2 = require("../hooks/useAuth");
+var _i18nSlice = require("../store/slices/i18nSlice");
+var _appstore = _interopRequireDefault(require("../core/appstore"));
+var _appVariablesStore = require("../core/appVariablesStore");
+var _AppContext = _interopRequireDefault(require("../context/AppContext"));
+var _eventNotifier = _interopRequireDefault(require("../core/event-notifier"));
+var _dialog = _interopRequireDefault(require("../core/dialog.service"));
+var _app = require("../core/app.service");
+var _proxyService = require("../core/proxy-service");
+var _helper = require("./helper");
+var _authSlice = require("../store/slices/authSlice");
+var _AppSpinnerProvider = _interopRequireDefault(require("../context/AppSpinnerProvider"));
+var _LayoutProvider = _interopRequireDefault(require("../context/LayoutProvider"));
+var _formatter = _interopRequireDefault(require("../core/formatter"));
+var _utils = require("../core/util/utils");
+var _metadata = require("../variables/metadata.service");
+var _i18nActions = require("../store/bindActions/i18nActions");
+var _container = require("../components/container");
+var _partialContainer = _interopRequireDefault(require("../components/page/partial-container"));
+var _ref, _ref$wm; // @ts-ignore
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
+var __jsx = _react["default"].createElement;
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+// Add global declaration for wm property
+
+(_ref$wm = (_ref = global).wm) !== null && _ref$wm !== void 0 ? _ref$wm : _ref.wm = {};
+
+// HOC function that wraps the app component
+var BaseApp = exports.BaseApp = function BaseApp(WrappedComponent, addAppScript, getAppVariables) {
+  var appInfo = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
+  var AppContextComponent = function AppContextComponent(props) {
+    var _info$appConfig;
+    var dispatch = (0, _store.useAppDispatch)();
+    var authContext = (0, _useAuth2.useAuth)();
+    var i18n = (0, _store.useAppSelector)(function (state) {
+      return state.i18n;
+    });
+    var info = (0, _store.useAppSelector)(function (state) {
+      return state.info;
+    });
+    var i18nService = _appstore["default"].I18nService.get();
+    var _useState = (0, _react.useState)(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, _helper.BaseAppInitialState), {}, {
+        updateActivePage: updateActivePage,
+        changeLocale: changeLocale,
+        selectedLocale: i18n.selectedLocale || "en",
+        localeFormats: {
+          date: i18n.dateFormat,
+          time: i18n.timeFormat,
+          currency: i18n.currencyCode
+        },
+        baseUrl: (info === null || info === void 0 || (_info$appConfig = info.appConfig) === null || _info$appConfig === void 0 ? void 0 : _info$appConfig.url) || "",
+        appConfig: _objectSpread(_objectSpread({}, info === null || info === void 0 ? void 0 : info.appConfig), {}, {
+          SecurityService: authContext,
+          loggedInUser: (0, _cloneDeep["default"])(authContext === null || authContext === void 0 ? void 0 : authContext.loggedInUser) || _authSlice.defaultUserState
+        }),
+        serviceDefinitions: (0, _cloneDeep["default"])((info === null || info === void 0 ? void 0 : info.serviceDefs) || {}),
+        notifyApp: notifyApp,
+        notify: notify,
+        eval: evaluateExpression,
+        openActionDialog: openActionDialog,
+        executeStartAppOperations: executeStartAppOperations,
+        importModule: _helper.importModule,
+        Widgets: {},
+        subscribe: subscribe,
+        targetPlatform: "WEB",
+        hasOwnObjectProperty: _utils.hasOwnObjectProperty,
+        formatters: _formatter["default"]
+      }, appInfo), _i18nActions.i18nService), i18nService)),
+      appContext = _useState[0],
+      setAppContext = _useState[1];
+    var appProxyRef = (0, _react.useRef)(null);
+    var isInitializedRef = (0, _react.useRef)(false);
+    var serviceErrorSubscriptionRef = (0, _react.useRef)(null);
+    var isVariablesExecutedRef = (0, _react.useRef)(false);
+    var registrationTimeoutRef = (0, _react.useRef)(null);
+    var pendingWidgetRegistrations = (0, _react.useRef)({});
+    var subscribersRef = (0, _react.useRef)(new Map());
+    (0, _react.useEffect)(function () {
+      var definitions = (0, _cloneDeep["default"])((info === null || info === void 0 ? void 0 : info.serviceDefs) || {});
+      if (appProxyRef.current) {
+        appProxyRef.current.serviceDefinitions = definitions;
+      }
+      setAppContext(function (prev) {
+        return _objectSpread(_objectSpread({}, prev), {}, {
+          serviceDefinitions: definitions
+        });
+      });
+    }, [info === null || info === void 0 ? void 0 : info.serviceDefs]);
+
+    // Sync appConfig.loggedInUser and SecurityService when auth state changes
+    var authLoggedInUser = (0, _store.useAppSelector)(function (state) {
+      return state.auth.loggedInUser;
+    });
+    (0, _react.useEffect)(function () {
+      var _ref2, _appProxyRef$current$, _appProxyRef$current;
+      var loggedInUser = (0, _cloneDeep["default"])(authContext === null || authContext === void 0 ? void 0 : authContext.loggedInUser) || _authSlice.defaultUserState;
+      var newAppConfig = _objectSpread(_objectSpread({}, (_ref2 = (_appProxyRef$current$ = (_appProxyRef$current = appProxyRef.current) === null || _appProxyRef$current === void 0 ? void 0 : _appProxyRef$current.appConfig) !== null && _appProxyRef$current$ !== void 0 ? _appProxyRef$current$ : info === null || info === void 0 ? void 0 : info.appConfig) !== null && _ref2 !== void 0 ? _ref2 : {}), {}, {
+        SecurityService: authContext,
+        loggedInUser: loggedInUser
+      });
+      if (appProxyRef.current) {
+        var _appProxyRef$current$2;
+        appProxyRef.current.appConfig = newAppConfig;
+        // Refresh app-level loggedInUser variable
+        var loggedInUserVar = (_appProxyRef$current$2 = appProxyRef.current.Variables) === null || _appProxyRef$current$2 === void 0 ? void 0 : _appProxyRef$current$2.loggedInUser;
+        if (loggedInUserVar !== null && loggedInUserVar !== void 0 && loggedInUserVar.invokeOnParamChange) {
+          loggedInUserVar.invokeOnParamChange();
+        }
+      }
+      setAppContext(function (prev) {
+        return _objectSpread(_objectSpread({}, prev), {}, {
+          appConfig: _objectSpread(_objectSpread({}, prev.appConfig), {}, {
+            SecurityService: authContext,
+            loggedInUser: loggedInUser
+          })
+        });
+      });
+    }, [authLoggedInUser]);
+    var _useAuth = (0, _useAuth2.useAuth)(),
+      securityConfig = _useAuth.securityConfig;
+    (0, _react.useEffect)(function () {
+      var securityService = _objectSpread(_objectSpread({}, authContext), {}, {
+        securityConfig: securityConfig,
+        get: function get() {
+          return securityConfig;
+        }
+      });
+      (0, _variables.wmSetDependency)("security", securityService);
+    }, [authContext, securityConfig]);
+    (0, _react.useEffect)(function () {
+      var localeFormats = {
+        date: i18n.dateFormat,
+        time: i18n.timeFormat,
+        currency: i18n.currencyCode
+      };
+      if (appProxyRef.current) {
+        appProxyRef.current.localeFormats = localeFormats;
+      }
+      setAppContext(function (prev) {
+        return _objectSpread(_objectSpread({}, prev), {}, {
+          localeFormats: localeFormats
+        });
+      });
+    }, [i18n.dateFormat, i18n.timeFormat, i18n.currencyCode]);
+
+    // Set up service error listener using EventNotifier (outside useEffect)
+    (0, _react.useEffect)(function () {
+      var unsubscribe = _eventNotifier["default"].ROOT.subscribe("SERVICE_ERROR", function (variable, error, options) {
+        var _options$xhrObj, _options$xhrObj2;
+        // if error is 401, show login dialog
+        if ((options === null || options === void 0 || (_options$xhrObj = options.xhrObj) === null || _options$xhrObj === void 0 ? void 0 : _options$xhrObj.status) === 401) {
+          (0, _app.handle401)();
+        }
+        if ((options === null || options === void 0 || (_options$xhrObj2 = options.xhrObj) === null || _options$xhrObj2 === void 0 ? void 0 : _options$xhrObj2.code) === "ERR_CANCELED") {
+          return;
+        }
+        notifyApp(error, "error", false);
+      });
+      serviceErrorSubscriptionRef.current = unsubscribe;
+      // Cleanup function
+      return function () {
+        if (serviceErrorSubscriptionRef.current) {
+          serviceErrorSubscriptionRef.current();
+        }
+        // Clear any pending widget registration timeout
+        if (registrationTimeoutRef.current) {
+          clearTimeout(registrationTimeoutRef.current);
+          registrationTimeoutRef.current = null;
+        }
+      };
+    }, []);
+
+    // Initialize app once
+    (0, _react.useEffect)(function () {
+      if (!(info !== null && info !== void 0 && info.serviceDefs)) return;
+      if (isInitializedRef.current) return;
+      isInitializedRef.current = true;
+
+      // initialize app
+      initializeApp();
+      // Cleanup function
+      return function () {
+        // Clean up service error subscription
+        if (serviceErrorSubscriptionRef.current) {
+          serviceErrorSubscriptionRef.current();
+        }
+        // Clear any pending widget registration timeout
+        if (registrationTimeoutRef.current) {
+          clearTimeout(registrationTimeoutRef.current);
+          registrationTimeoutRef.current = null;
+        }
+      };
+    }, [info === null || info === void 0 ? void 0 : info.serviceDefs]);
+    function openActionDialog(notification, title) {
+      setAppContext(function (prev) {
+        if (title) {
+          var _prev$Widgets, _prev$Widgets$open;
+          prev === null || prev === void 0 || (_prev$Widgets = prev.Widgets) === null || _prev$Widgets === void 0 || (_prev$Widgets = _prev$Widgets[title]) === null || _prev$Widgets === void 0 || (_prev$Widgets$open = _prev$Widgets.open) === null || _prev$Widgets$open === void 0 || _prev$Widgets$open.call(_prev$Widgets);
+        }
+        return _objectSpread(_objectSpread({}, prev), {}, {
+          notification: notification
+        });
+      });
+    }
+    function executeStartAppOperations() {
+      return _executeStartAppOperations.apply(this, arguments);
+    }
+    function _executeStartAppOperations() {
+      _executeStartAppOperations = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee7() {
+        var startUpVariables, appVariables, variablePromises;
+        return _regenerator["default"].wrap(function _callee7$(_context7) {
+          while (1) switch (_context7.prev = _context7.next) {
+            case 0:
+              if (!isVariablesExecutedRef.current) {
+                _context7.next = 2;
+                break;
+              }
+              return _context7.abrupt("return");
+            case 2:
+              isVariablesExecutedRef.current = true;
+              startUpVariables = appInfo.startUpVariables || [];
+              appVariables = appProxyRef.current.Variables; // Execute startup variables
+              variablePromises = startUpVariables.map(/*#__PURE__*/function () {
+                var _ref8 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee6(varName) {
+                  var variable;
+                  return _regenerator["default"].wrap(function _callee6$(_context6) {
+                    while (1) switch (_context6.prev = _context6.next) {
+                      case 0:
+                        variable = appVariables[varName];
+                        if (!(variable && variable.invoke && typeof variable.invoke === "function")) {
+                          _context6.next = 12;
+                          break;
+                        }
+                        _context6.prev = 2;
+                        _context6.next = 5;
+                        return variable.invoke();
+                      case 5:
+                        return _context6.abrupt("return", _context6.sent);
+                      case 8:
+                        _context6.prev = 8;
+                        _context6.t0 = _context6["catch"](2);
+                        console.warn("Error invoking startup variable ".concat(varName, ":"), _context6.t0);
+                        return _context6.abrupt("return", null);
+                      case 12:
+                        return _context6.abrupt("return", Promise.resolve());
+                      case 13:
+                      case "end":
+                        return _context6.stop();
+                    }
+                  }, _callee6, null, [[2, 8]]);
+                }));
+                return function (_x2) {
+                  return _ref8.apply(this, arguments);
+                };
+              }());
+              _context7.prev = 6;
+              _context7.next = 9;
+              return Promise.allSettled(variablePromises);
+            case 9:
+              if (!(appProxyRef.current.onAppVariablesReady && typeof appProxyRef.current.onAppVariablesReady === "function")) {
+                _context7.next = 12;
+                break;
+              }
+              _context7.next = 12;
+              return appProxyRef.current.onAppVariablesReady();
+            case 12:
+              setTimeout(function () {
+                var _appProxyRef$current3;
+                notify("app-variables-data-loaded", {
+                  pageName: (_appProxyRef$current3 = appProxyRef.current) === null || _appProxyRef$current3 === void 0 ? void 0 : _appProxyRef$current3.activePageName
+                });
+              }, 0);
+              _context7.next = 18;
+              break;
+            case 15:
+              _context7.prev = 15;
+              _context7.t0 = _context7["catch"](6);
+              console.error("Error during app startup operations:", _context7.t0);
+            case 18:
+            case "end":
+              return _context7.stop();
+          }
+        }, _callee7, null, [[6, 15]]);
+      }));
+      return _executeStartAppOperations.apply(this, arguments);
+    }
+    var initializeApp = /*#__PURE__*/function () {
+      var _ref3 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee3() {
+        var appProxy, appVariables, _get, APP_VARIABLES, executeAppStartup, executeAppBeforeStartup;
+        return _regenerator["default"].wrap(function _callee3$(_context3) {
+          while (1) switch (_context3.prev = _context3.next) {
+            case 0:
+              _context3.prev = 0;
+              appProxy = (0, _proxyService.createStateProxy)(appContext, [], setAppContext);
+              appProxy.serviceDefinitions = (0, _cloneDeep["default"])((info === null || info === void 0 ? void 0 : info.serviceDefs) || {});
+              appProxyRef.current = appProxy;
+
+              // Get app variables
+              appVariables = {
+                Variables: {},
+                Actions: {}
+              };
+              if (getAppVariables && typeof getAppVariables === "function") {
+                appVariables = getAppVariables(appProxy);
+              } else {
+                // Fallback to appstore
+                APP_VARIABLES = (_get = _appstore["default"].get("AppConfig")) === null || _get === void 0 ? void 0 : _get.appVariables;
+                if (APP_VARIABLES) {
+                  appVariables = (0, _appVariablesStore.getAppVariablesInstance)(appProxy, APP_VARIABLES);
+                }
+              }
+
+              // Set variables and actions in app proxy
+              appProxy.Variables = appVariables.Variables;
+              appProxy.Actions = appVariables.Actions;
+
+              // Initialize app script and register callbacks
+              if (addAppScript && typeof addAppScript === "function") {
+                addAppScript(appProxy);
+              }
+
+              // Execute app startup operations
+              executeAppStartup = /*#__PURE__*/function () {
+                var _ref4 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee() {
+                  var startUpActions, _iterator, _step, actionName, action;
+                  return _regenerator["default"].wrap(function _callee$(_context) {
+                    while (1) switch (_context.prev = _context.next) {
+                      case 0:
+                        startUpActions = appInfo.startUpActions || []; // Execute startup actions
+                        _iterator = _createForOfIteratorHelper(startUpActions);
+                        try {
+                          for (_iterator.s(); !(_step = _iterator.n()).done;) {
+                            actionName = _step.value;
+                            action = appVariables.Actions[actionName];
+                            if (action && action.invoke && typeof action.invoke === "function") {
+                              try {
+                                action.invoke();
+                              } catch (error) {
+                                console.warn("Error invoking startup action ".concat(actionName, ":"), error);
+                              }
+                            }
+                          }
+                        } catch (err) {
+                          _iterator.e(err);
+                        } finally {
+                          _iterator.f();
+                        }
+                      case 3:
+                      case "end":
+                        return _context.stop();
+                    }
+                  }, _callee);
+                }));
+                return function executeAppStartup() {
+                  return _ref4.apply(this, arguments);
+                };
+              }();
+              executeAppBeforeStartup = /*#__PURE__*/function () {
+                var _ref5 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee2() {
+                  return _regenerator["default"].wrap(function _callee2$(_context2) {
+                    while (1) switch (_context2.prev = _context2.next) {
+                      case 0:
+                        _context2.t0 = appProxy.hasOwnProperty("onBeforeAppReady");
+                        if (!_context2.t0) {
+                          _context2.next = 4;
+                          break;
+                        }
+                        _context2.next = 4;
+                        return appProxy.onBeforeAppReady();
+                      case 4:
+                        return _context2.abrupt("return", Promise.resolve());
+                      case 5:
+                      case "end":
+                        return _context2.stop();
+                    }
+                  }, _callee2);
+                }));
+                return function executeAppBeforeStartup() {
+                  return _ref5.apply(this, arguments);
+                };
+              }(); // onBeforeAppReady should call before calling anything
+              _context3.next = 13;
+              return executeAppBeforeStartup();
+            case 13:
+              _context3.next = 15;
+              return executeAppStartup();
+            case 15:
+              // Initialize DialogService in appstore
+              _appstore["default"].DialogService.set(_dialog["default"]);
+
+              // Set app as ready and update context
+              setAppContext(function (prev) {
+                return _objectSpread(_objectSpread({}, prev), {}, {
+                  Variables: appVariables.Variables,
+                  Actions: appVariables.Actions,
+                  appProxy: appProxy,
+                  isAppReady: true
+                });
+              });
+              _context3.next = 23;
+              break;
+            case 19:
+              _context3.prev = 19;
+              _context3.t0 = _context3["catch"](0);
+              console.error("Error initializing app:", _context3.t0);
+              setAppContext(function (prev) {
+                return _objectSpread(_objectSpread({}, prev), {}, {
+                  isAppReady: true
+                });
+              });
+            case 23:
+            case "end":
+              return _context3.stop();
+          }
+        }, _callee3, null, [[0, 19]]);
+      }));
+      return function initializeApp() {
+        return _ref3.apply(this, arguments);
+      };
+    }();
+    function evaluateExpression(fn) {
+      var failOnError = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+      try {
+        return fn.call(appContext);
+      } catch (e) {
+        if (failOnError) {
+          throw e;
+        } else {
+          return null;
+        }
+      }
+    }
+    function updateActivePage(pageName) {
+      if (appProxyRef.current) {
+        var _appProxyRef$current2;
+        appProxyRef.current.lastActivePage = (_appProxyRef$current2 = appProxyRef.current) === null || _appProxyRef$current2 === void 0 ? void 0 : _appProxyRef$current2.activePageName;
+        appProxyRef.current.activePageName = pageName;
+      }
+    }
+    function subscribe(eventName, callback) {
+      if (!eventName || typeof callback !== "function") {
+        return function () {};
+      }
+      if (!subscribersRef.current.has(eventName)) {
+        subscribersRef.current.set(eventName, new Set());
+      }
+      var subscribers = subscribersRef.current.get(eventName);
+      subscribers.add(callback);
+      return function () {
+        var 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;
+      }
+      var subscribers = subscribersRef.current.get(eventName);
+      if (subscribers && subscribers.size > 0) {
+        subscribers.forEach(function (callback) {
+          try {
+            callback(value);
+          } catch (error) {
+            console.error("Error in subscriber callback for ".concat(eventName, ":"), error);
+          }
+        });
+      }
+    }
+    // Change locale function
+    function changeLocale(locale) {
+      dispatch((0, _i18nSlice.setSelectedLocaleAndLoadBundle)({
+        locale: locale
+      }));
+    }
+    function notifyApp(message, type, showTypeLabel) {
+      // App-level notification
+      var notificationAction = (0, _get2["default"])(appContext, "Actions.appNotification");
+      if (notificationAction) {
+        var appNotification = notificationAction.config.paramProvider();
+        var newParams = function newParams() {
+          return {
+            text: message || "Success",
+            content: "inline",
+            "class": type || "Success",
+            duration: appNotification.duration || 3000,
+            toasterPosition: appNotification.toasterPosition || "bottom right",
+            showTypeLabel: showTypeLabel !== null && showTypeLabel !== void 0 ? 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:\n ', message);
+      }
+    }
+    var renderCommonComponents = function renderCommonComponents() {
+      return __jsx(_container.WmContainer, {
+        hidden: true,
+        content: "Common",
+        "data-widget-id": "common-container",
+        className: "app-container-default",
+        renderPartial: function renderPartial(props, onLoad) {
+          return __jsx(_partialContainer["default"], {
+            onRender: function onRender(commonComponent) {
+              appProxyRef.current.Common = commonComponent;
+            },
+            onLoad: onLoad,
+            "data-widget-id": "common-partial-container",
+            content: props.content,
+            partialName: "commonPartialContainer",
+            listener: props.listener
+          });
+        }
+      });
+    };
+    var _useState2 = (0, _react.useState)([]),
+      sessionFailureRequests = _useState2[0],
+      setSessionFailureRequests = _useState2[1];
+    var pushToSessionFailureRequests = function pushToSessionFailureRequests(callback) {
+      setSessionFailureRequests(function (prev) {
+        return [].concat((0, _toConsumableArray2["default"])(prev), [callback]);
+      });
+    };
+    var executeSessionFailureRequests = (0, _react.useCallback)(/*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee5() {
+      var sessionFailureRequestPromises;
+      return _regenerator["default"].wrap(function _callee5$(_context5) {
+        while (1) switch (_context5.prev = _context5.next) {
+          case 0:
+            sessionFailureRequestPromises = sessionFailureRequests.map(/*#__PURE__*/function () {
+              var _ref7 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee4(callback) {
+                return _regenerator["default"].wrap(function _callee4$(_context4) {
+                  while (1) switch (_context4.prev = _context4.next) {
+                    case 0:
+                      _context4.prev = 0;
+                      _context4.next = 3;
+                      return callback();
+                    case 3:
+                      return _context4.abrupt("return", _context4.sent);
+                    case 6:
+                      _context4.prev = 6;
+                      _context4.t0 = _context4["catch"](0);
+                      console.warn("Error invoking session failure request:", _context4.t0);
+                      return _context4.abrupt("return", null);
+                    case 10:
+                    case "end":
+                      return _context4.stop();
+                  }
+                }, _callee4, null, [[0, 6]]);
+              }));
+              return function (_x) {
+                return _ref7.apply(this, arguments);
+              };
+            }());
+            _context5.next = 3;
+            return Promise.allSettled(sessionFailureRequestPromises);
+          case 3:
+            setSessionFailureRequests([]);
+          case 4:
+          case "end":
+            return _context5.stop();
+        }
+      }, _callee5);
+    })), [sessionFailureRequests]);
+    if (appProxyRef.current) {
+      appProxyRef.current.executeSessionFailureRequests = executeSessionFailureRequests;
+    }
+    (0, _react.useEffect)(function () {
+      _metadata.metadataService.setMetadata(appContext === null || appContext === void 0 ? void 0 : appContext.serviceDefinitions);
+      (0, _variables.wmSetDependency)("metadata", _metadata.metadataService);
+      (0, _variables.wmSetDependency)("appManager", {
+        notify: notify,
+        pushToSessionFailureRequests: pushToSessionFailureRequests,
+        executeSessionFailureRequests: executeSessionFailureRequests,
+        handle401: _app.handle401
+      });
+    }, [appContext === null || appContext === void 0 ? void 0 : appContext.serviceDefinitions]);
+    return __jsx(_AppContext["default"].Provider, {
+      value: {
+        state: appContext,
+        proxy: appProxyRef.current
+      }
+    }, __jsx(_AppSpinnerProvider["default"], null, __jsx(_LayoutProvider["default"], null, __jsx(WrappedComponent, props), renderCommonComponents())));
+  };
+  AppContextComponent.displayName = "BaseApp(".concat(WrappedComponent.displayName || WrappedComponent.name || "Component", ")");
+  return AppContextComponent;
+};
+var _default = exports["default"] = BaseApp;

package/higherOrder/BaseAppProps.d.ts

@@ -0,0 +1,37 @@
+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[];
+}
+export default BaseAppProps;

package/higherOrder/BaseAppProps.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});