@wavemaker-ai/react-runtime 1.0.0-rc.647499 → 1.0.0-rc.647565

package/higherOrder/BasePrefab.js

@@ -1,204 +1,173 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.BasePrefab = void 0;
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = _interopRequireWildcard(require("react"));
-var _store = require("@wavemaker-ai/react-runtime/store");
-var _merge = _interopRequireDefault(require("lodash-es/merge"));
-var _BasePage = _interopRequireDefault(require("@wavemaker-ai/react-runtime/higherOrder/BasePage"));
-var _appstore = _interopRequireDefault(require("@wavemaker-ai/react-runtime/core/appstore"));
-var _appConfigSlice = require("@wavemaker-ai/react-runtime/store/slices/appConfigSlice");
-var _PrefabContext = _interopRequireDefault(require("@wavemaker-ai/react-runtime/context/PrefabContext"));
-var _spinner = require("../components/basic/spinner");
-var _withBaseWrapper = _interopRequireDefault(require("./withBaseWrapper"));
-var _metadata = require("@wavemaker-ai/react-runtime/variables/metadata.service");
-var _formContext = require("@wavemaker-ai/react-runtime/components/data/form/form-context");
-var _excluded = ["pages", "partials", "componentType"];
-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 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; }
-var BasePrefab = exports.BasePrefab = function BasePrefab(WrappedComponent, addPageScript, getVariables, componentInfo) {
-  // Create a wrapper component to handle data fetching
-  var BasePrefabWrapper = /*#__PURE__*/(0, _react.memo)(function (props) {
-    var _i18n$prefabMessages;
-    var prefabname = props.prefabname;
-    var _ref = componentInfo || {},
-      pages = _ref.pages,
-      partials = _ref.partials,
-      componentType = _ref.componentType,
-      rest = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
-    /** When preview passes `prefabname=""` for app-context metadata, keep bundle identity from codegen. */
-    var bundleId = prefabname || (componentInfo === null || componentInfo === void 0 ? void 0 : componentInfo.componentName) || "";
-    var dispatch = (0, _store.useAppDispatch)();
-    var appConfig = (0, _store.useAppSelector)(function (state) {
-      return state.info.appConfig;
-    });
-    var i18n = (0, _store.useAppSelector)(function (state) {
-      return state.i18n;
-    });
-    var isServiceDefsLoading = (0, _react.useRef)(false);
-    // Cached payload from getPrefabDefinitions (stored under `info.prefabs[prefabName]`)
-    var prefabDefinitions = (0, _store.useAppSelector)(function (state) {
-      var _state$info, _prefabs$prefabname;
-      var prefabs = (_state$info = state.info) === null || _state$info === void 0 ? void 0 : _state$info.prefabs;
-      return (_prefabs$prefabname = prefabs === null || prefabs === void 0 ? void 0 : prefabs[prefabname]) !== null && _prefabs$prefabname !== void 0 ? _prefabs$prefabname : null;
-    });
-    var _useState = (0, _react.useState)(prefabDefinitions ? false : true),
-      loading = _useState[0],
-      setLoading = _useState[1];
-    var _useState2 = (0, _react.useState)(prefabDefinitions || {}),
-      serviceDefs = _useState2[0],
-      setServiceDefs = _useState2[1];
-    var baseUrl = (appConfig === null || appConfig === void 0 ? void 0 : appConfig.url) || "";
-    var fetchServiceDefs = /*#__PURE__*/function () {
-      var _ref2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee() {
-        var response;
-        return _regenerator["default"].wrap(function _callee$(_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              if (baseUrl) {
-                _context.next = 4;
-                break;
-              }
-              console.warn("Base URL is not available");
-              setLoading(false);
-              return _context.abrupt("return");
-            case 4:
-              _context.prev = 4;
-              isServiceDefsLoading.current = true;
-              // Dispatch Redux action to store in state
-              _context.next = 8;
-              return dispatch((0, _appConfigSlice.getPrefabDefinitions)({
-                prefabName: prefabname,
-                baseUrl: baseUrl,
-                pages: pages || []
-              })).unwrap();
-            case 8:
-              response = _context.sent;
-              setServiceDefs(response || {});
-              _metadata.metadataService.setMetadata((response === null || response === void 0 ? void 0 : response.serviceDefs) || {}, prefabname);
-              _appstore["default"].set("".concat(bundleId, "-partials"), {
-                partials: partials || []
-              });
-              // Call metadata service's load method to set metadata with correct base URL
-              // This is equivalent to Angular's this.$metadata.load(prefabName)
-              _context.next = 14;
-              return _metadata.metadataService.load(prefabname, baseUrl);
-            case 14:
-              _context.next = 19;
-              break;
-            case 16:
-              _context.prev = 16;
-              _context.t0 = _context["catch"](4);
-              console.error("Failed to fetch service definitions:", _context.t0);
-            case 19:
-              _context.prev = 19;
-              setLoading(false);
-              return _context.finish(19);
-            case 22:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee, null, [[4, 16, 19, 22]]);
-      }));
-      return function fetchServiceDefs() {
-        return _ref2.apply(this, arguments);
+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));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import { Fragment, jsx } from "react/jsx-runtime";
+import { useEffect, useState, memo, useMemo, Activity, useRef } from "react";
+import { useAppSelector, useAppDispatch } from "../store";
+import merge from "lodash-es/merge";
+import BasePage from "./BasePage";
+import appstore from "../core/appstore";
+import { getPrefabDefinitions } from "../store/slices/appConfigSlice";
+import PrefabProvider from "../context/PrefabContext";
+import { WmSpinner } from "../components/basic/spinner";
+import withBaseWrapper from "./withBaseWrapper";
+import { metadataService } from "../variables/metadata.service";
+import {
+  ParentFormDataContext,
+  useParentFormData
+} from "../components/data/form/form-context";
+const BasePrefab = (WrappedComponent, addPageScript, getVariables, componentInfo) => {
+  const BasePrefabWrapper = memo(
+    (props) => {
+      var _b;
+      const { prefabname } = props;
+      const _a = componentInfo || {}, { pages, partials, componentType } = _a, rest = __objRest(_a, ["pages", "partials", "componentType"]);
+      const bundleId = prefabname || (componentInfo == null ? void 0 : componentInfo.componentName) || "";
+      const dispatch = useAppDispatch();
+      const appConfig = useAppSelector((state) => state.info.appConfig);
+      const i18n = useAppSelector((state) => state.i18n);
+      const isServiceDefsLoading = useRef(false);
+      const prefabDefinitions = useAppSelector((state) => {
+        var _a2, _b2;
+        const prefabs = (_a2 = state.info) == null ? void 0 : _a2.prefabs;
+        return (_b2 = prefabs == null ? void 0 : prefabs[prefabname]) != null ? _b2 : null;
+      });
+      const [loading, setLoading] = useState(prefabDefinitions ? false : true);
+      const [serviceDefs, setServiceDefs] = useState(prefabDefinitions || {});
+      const baseUrl = (appConfig == null ? void 0 : appConfig.url) || "";
+      const fetchServiceDefs = async () => {
+        if (!baseUrl) {
+          console.warn("Base URL is not available");
+          setLoading(false);
+          return;
+        }
+        try {
+          isServiceDefsLoading.current = true;
+          const response = await dispatch(
+            getPrefabDefinitions({
+              prefabName: prefabname,
+              baseUrl,
+              pages: pages || []
+            })
+          ).unwrap();
+          setServiceDefs(response || {});
+          metadataService.setMetadata((response == null ? void 0 : response.serviceDefs) || {}, prefabname);
+          appstore.set(`${bundleId}-partials`, {
+            partials: partials || []
+          });
+          await metadataService.load(prefabname, baseUrl);
+        } catch (error) {
+          console.error("Failed to fetch service definitions:", error);
+        } finally {
+          setLoading(false);
+        }
       };
-    }();
-    // Fetch service definitions when component mounts only if not already in state
-    (0, _react.useEffect)(function () {
-      // Skip fetching if we already have the definitions in state
-      if (prefabDefinitions || !baseUrl) {
-        _metadata.metadataService.setMetadata(prefabDefinitions || {}, prefabname);
-        setLoading(false);
-        return;
+      useEffect(() => {
+        if (prefabDefinitions || !baseUrl) {
+          metadataService.setMetadata(prefabDefinitions || {}, prefabname);
+          setLoading(false);
+          return;
+        }
+        if (isServiceDefsLoading.current) {
+          return;
+        }
+        fetchServiceDefs();
+      }, [baseUrl, prefabname, dispatch, prefabDefinitions]);
+      if (prefabname == null) {
+        return null;
       }
-      if (isServiceDefsLoading.current) {
-        return;
+      if (loading) {
+        return /* @__PURE__ */ jsx(
+          WmSpinner,
+          {
+            show: true,
+            className: "baseprefab-spinner",
+            name: "baseprefab-spinner",
+            listener: {}
+          }
+        );
       }
-      fetchServiceDefs();
-    }, [baseUrl, prefabname, dispatch, prefabDefinitions]);
-    if (prefabname == null) {
-      return null;
-    }
-    if (loading) {
-      return __jsx(_spinner.WmSpinner, {
-        show: true,
-        className: "baseprefab-spinner",
-        name: "baseprefab-spinner",
-        listener: {}
-      });
-    }
-    var appLocale = (0, _merge["default"])({}, (i18n === null || i18n === void 0 ? void 0 : i18n.appLocale) || {}, (i18n === null || i18n === void 0 || (_i18n$prefabMessages = i18n.prefabMessages) === null || _i18n$prefabMessages === void 0 ? void 0 : _i18n$prefabMessages[bundleId]) || {});
-    var FragmentConsumer = function FragmentConsumer(fragmentProps) {
-      var combinedProps = _objectSpread(_objectSpread({}, props), fragmentProps);
-      return __jsx(WrappedComponent, combinedProps);
-    };
-
-    // Apply BasePage HOC to our FragmentConsumer
-    var EnhancedComponent = (0, _BasePage["default"])(FragmentConsumer, addPageScript, getVariables, // @ts-expect-error
-    _objectSpread(_objectSpread({}, rest), {}, {
-      componentName: bundleId,
-      componentType: componentType
-    }), _objectSpread({
-      serviceDefs: (serviceDefs === null || serviceDefs === void 0 ? void 0 : serviceDefs.serviceDefs) || {},
-      appLocale: appLocale,
-      prefab: true,
-      prefabName: bundleId,
-      name: props.name
-    }, props.outbound));
-    return __jsx(_react["default"].Fragment, null, __jsx(EnhancedComponent, props));
-  }, function (next, prev) {
-    return next.prefabname === prev.prefabname;
-  });
+      const appLocale = merge({}, (i18n == null ? void 0 : i18n.appLocale) || {}, ((_b = i18n == null ? void 0 : i18n.prefabMessages) == null ? void 0 : _b[bundleId]) || {});
+      const FragmentConsumer = (fragmentProps) => {
+        const combinedProps = __spreadValues(__spreadValues({}, props), fragmentProps);
+        return /* @__PURE__ */ jsx(WrappedComponent, __spreadValues({}, combinedProps));
+      };
+      const EnhancedComponent = BasePage(
+        FragmentConsumer,
+        addPageScript,
+        getVariables,
+        // @ts-expect-error
+        __spreadProps(__spreadValues({}, rest), { componentName: bundleId, componentType }),
+        __spreadValues({
+          serviceDefs: (serviceDefs == null ? void 0 : serviceDefs.serviceDefs) || {},
+          appLocale,
+          prefab: true,
+          prefabName: bundleId,
+          name: props.name
+        }, props.outbound)
+      );
+      return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(EnhancedComponent, __spreadValues({}, props)) });
+    },
+    (next, prev) => next.prefabname === prev.prefabname
+  );
   BasePrefabWrapper.displayName = "BasePrefabWrapper";
-  var BasePrefabWithProvider = function BasePrefabWithProvider(props) {
-    var _props$formArrayIndex2;
-    // Capture parent's form context BEFORE new WidgetProvider (via BasePage) breaks it
-    // This allows forms inside prefabs to communicate with parent forms
-    var parentFormContext = (0, _formContext.useParentFormData)();
-
-    // Build prefab-specific context that:
-    // 1. Passes through callbacks from parent for upward data flow
-    // 2. Uses prefab's name as the data path for the form inside
-    // 3. Extracts child data from parent's formdata at prefab name
-    // Extract the specific data for this prefab from parent's formdata
-    // For prefabs inside a list, use parentListName with array index
-    var prefabData = (0, _react.useMemo)(function () {
-      if (!(parentFormContext !== null && parentFormContext !== void 0 && parentFormContext.formdata)) return undefined;
+  const BasePrefabWithProvider = (props) => {
+    var _a;
+    const parentFormContext = useParentFormData();
+    const prefabData = useMemo(() => {
+      if (!(parentFormContext == null ? void 0 : parentFormContext.formdata)) return void 0;
       if (props.isParentList && props.parentListName) {
-        var listData = parentFormContext.formdata[props.parentListName];
-        if (Array.isArray(listData) && props.formArrayIndex !== undefined && props.formArrayIndex >= 0) {
+        const listData = parentFormContext.formdata[props.parentListName];
+        if (Array.isArray(listData) && props.formArrayIndex !== void 0 && props.formArrayIndex >= 0) {
           return listData[props.formArrayIndex];
         }
-        return undefined;
+        return void 0;
       }
-
-      // For non-list prefabs, use the prefab name as key
       return parentFormContext.formdata[props.name];
-    }, [parentFormContext === null || parentFormContext === void 0 ? void 0 : parentFormContext.formdata, props.isParentList, props.parentListName, props.formArrayIndex, props.name]);
-    var prefabFormContext = (0, _react.useMemo)(function () {
-      // Only create prefab context if there's a parent form relationship
+    }, [
+      parentFormContext == null ? void 0 : parentFormContext.formdata,
+      props.isParentList,
+      props.parentListName,
+      props.formArrayIndex,
+      props.name
+    ]);
+    const prefabFormContext = useMemo(() => {
+      var _a2;
       if (!parentFormContext || !props.parentForm) return null;
-
-      // Build the correct data path for this prefab
-      // If prefab is inside a list, use parentListName with array index
-      var currentPath = props.name;
+      let currentPath = props.name;
       if (props.isParentList && props.parentListName) {
-        var _props$formArrayIndex;
-        var idx = (_props$formArrayIndex = props.formArrayIndex) !== null && _props$formArrayIndex !== void 0 ? _props$formArrayIndex : -1;
-        currentPath = idx >= 0 ? "".concat(props.parentListName, "[").concat(idx, "]") : props.parentListName;
+        const idx = (_a2 = props.formArrayIndex) != null ? _a2 : -1;
+        currentPath = idx >= 0 ? `${props.parentListName}[${idx}]` : props.parentListName;
       }
-      var computedParentDataPath = parentFormContext.parentDataPath ? "".concat(parentFormContext.parentDataPath, ".").concat(currentPath) : currentPath;
+      const computedParentDataPath = parentFormContext.parentDataPath ? `${parentFormContext.parentDataPath}.${currentPath}` : currentPath;
       return {
         // Extract child data: parent.formdata.address -> prefab form's data
         formdata: prefabData,
@@ -211,24 +180,39 @@ var BasePrefab = exports.BasePrefab = function BasePrefab(WrappedComponent, addP
         onChildDataChange: parentFormContext.onChildDataChange,
         registerChildField: parentFormContext.registerChildField
       };
-    }, [parentFormContext === null || parentFormContext === void 0 ? void 0 : parentFormContext.rootParentForm, parentFormContext === null || parentFormContext === void 0 ? void 0 : parentFormContext.parentDataPath, parentFormContext === null || parentFormContext === void 0 ? void 0 : parentFormContext.onChildDataChange, parentFormContext === null || parentFormContext === void 0 ? void 0 : parentFormContext.registerChildField, prefabData, props.parentForm, props.name, props.isParentList, props.parentListName, props.formArrayIndex]);
-    return __jsx(_react.Activity, {
-      mode: props.hidden ? "hidden" : "visible"
-    }, __jsx(_PrefabContext["default"], {
-      value: {
-        inbound: props.inbound || {},
-        outbound: props.outbound || {},
-        prefabName: props.name,
-        parentForm: props.parentForm,
-        isParentList: props.isParentList,
-        formArrayIndex: (_props$formArrayIndex2 = props.formArrayIndex) !== null && _props$formArrayIndex2 !== void 0 ? _props$formArrayIndex2 : -1,
-        parentListName: props.parentListName
+    }, [
+      parentFormContext == null ? void 0 : parentFormContext.rootParentForm,
+      parentFormContext == null ? void 0 : parentFormContext.parentDataPath,
+      parentFormContext == null ? void 0 : parentFormContext.onChildDataChange,
+      parentFormContext == null ? void 0 : parentFormContext.registerChildField,
+      prefabData,
+      props.parentForm,
+      props.name,
+      props.isParentList,
+      props.parentListName,
+      props.formArrayIndex
+    ]);
+    return /* @__PURE__ */ jsx(Activity, { mode: props.hidden ? "hidden" : "visible", children: /* @__PURE__ */ jsx(
+      PrefabProvider,
+      {
+        value: {
+          inbound: props.inbound || {},
+          outbound: props.outbound || {},
+          prefabName: props.name,
+          parentForm: props.parentForm,
+          isParentList: props.isParentList,
+          formArrayIndex: (_a = props.formArrayIndex) != null ? _a : -1,
+          parentListName: props.parentListName
+        },
+        children: /* @__PURE__ */ jsx(ParentFormDataContext.Provider, { value: prefabFormContext, children: /* @__PURE__ */ jsx(BasePrefabWrapper, __spreadValues({}, props)) })
       }
-    }, __jsx(_formContext.ParentFormDataContext.Provider, {
-      value: prefabFormContext
-    }, __jsx(BasePrefabWrapper, props))));
+    ) });
   };
   BasePrefabWithProvider.displayName = "BasePrefabWithProvider";
-  return (0, _withBaseWrapper["default"])(BasePrefabWithProvider);
+  return withBaseWrapper(BasePrefabWithProvider);
+};
+var BasePrefab_default = BasePrefab;
+export {
+  BasePrefab,
+  BasePrefab_default as default
 };
-var _default = exports["default"] = BasePrefab;