@wavemaker-ai/react-runtime 1.0.0-rc.312 → 1.0.0-rc.317

package/hooks/useDataSourceSubscription.d.ts

@@ -7,9 +7,9 @@ interface DataSourceSubscriptionOptions {
     widgetType?: "list" | "table";
 }
 /**
- * Hook to subscribe to 'toggle-variable-state' event
- * Handles state params for pagination when events are fired
- * Subscription happens only once when datasource and EventNotifier are available
+ * Subscribes to variable events so persisted list/table state is applied on first invoke.
+ * - check-state-persistence-options: before HTTP (Crud + ServiceVariable)
+ * - toggle-variable-state: Angular handleLoading fallback if check-state did not run yet
  */
 export declare const useDataSourceSubscription: ({ datasource, statehandler, name, onPageRestored, widgetType, }: DataSourceSubscriptionOptions) => void;
 export {};

package/hooks/useDataSourceSubscription.js

@@ -1,125 +1,115 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useDataSourceSubscription = void 0;
-var _react = require("react");
-var _listHelpers = require("../components/data/list/utils/list-helpers");
-var _tableHelpers = require("../components/data/table/utils/table-helpers");
-var _types = require("../components/data/types");
-var _eventNotifier = _interopRequireDefault(require("@wavemaker-ai/react-runtime/core/event-notifier"));
-var _variables = require("@wavemaker-ai/variables");
-// @ts-ignore - Using yalc linked local package
-
-// Create a singleton EventNotifier instance that all components will share
-var sharedEventNotifier = null;
-var getSharedEventNotifier = function getSharedEventNotifier() {
+import { useRef, useMemo } from "react";
+import { getListState } from "../components/data/list/utils/list-helpers";
+import {
+  convertFilterArrayToObject,
+  getTableState
+} from "../components/data/table/utils/table-helpers";
+import { DataSource } from "../components/data/types";
+import EventNotifier from "../core/event-notifier";
+import { wmSetDependency } from "@wavemaker-ai/variables";
+let sharedEventNotifier = null;
+const getSharedEventNotifier = () => {
   if (!sharedEventNotifier) {
-    // Create new EventNotifier only once
-    sharedEventNotifier = new _eventNotifier["default"]();
+    sharedEventNotifier = new EventNotifier();
     sharedEventNotifier.notify = sharedEventNotifier.notifyApp.bind(sharedEventNotifier);
-    // Set it in the external dependency store (from @wavemaker-ai/variables)
-    (0, _variables.wmSetDependency)("appManager", sharedEventNotifier);
+    wmSetDependency("appManager", sharedEventNotifier);
   }
   return sharedEventNotifier;
 };
-
-/**
- * This function accepts two data sources and will check if both are same by comparing the unique id and
- * context in which datasources are present
- * @returns {*} boolean true/ false
- */
-var isDataSourceEqual = function isDataSourceEqual(d1, d2) {
-  return d1.execute(_types.DataSource.Operation.GET_UNIQUE_IDENTIFIER) === d2.execute(_types.DataSource.Operation.GET_UNIQUE_IDENTIFIER);
-  // && isEqual(d1.execute(DataSource.Operation.GET_CONTEXT_IDENTIFIER), d2.execute(DataSource.Operation.GET_CONTEXT_IDENTIFIER));
+const applyPersistedState = (invokeOptions, ctx) => {
+  var _a, _b;
+  const { datasource, statehandler, name, onPageRestored, widgetType, pageLoadRef } = ctx;
+  if (!pageLoadRef.current || !statehandler || statehandler.toLowerCase() === "none") {
+    return;
+  }
+  pageLoadRef.current = false;
+  const widgetState = widgetType === "table" ? getTableState(name, statehandler) : getListState(name, statehandler);
+  if (!widgetState) {
+    return;
+  }
+  if (widgetState.pagination !== void 0 && invokeOptions.page === void 0) {
+    invokeOptions.page = widgetState.pagination;
+  }
+  if (widgetState.pagesize) {
+    datasource.maxResults = widgetState.pagesize;
+    if (invokeOptions.size === void 0) {
+      invokeOptions.size = widgetState.pagesize;
+    }
+    if (invokeOptions.pagesize === void 0) {
+      invokeOptions.pagesize = widgetState.pagesize;
+    }
+  }
+  if (widgetType === "table") {
+    const tableState = widgetState;
+    if ((_a = tableState.search) == null ? void 0 : _a.length) {
+      invokeOptions.filterFields = convertFilterArrayToObject(tableState.search);
+    }
+    if ((_b = tableState.sort) == null ? void 0 : _b.field) {
+      invokeOptions.orderBy = `${tableState.sort.field} ${tableState.sort.direction}`;
+    }
+  }
+  if (widgetState.pagination !== void 0) {
+    onPageRestored == null ? void 0 : onPageRestored(widgetState.pagination);
+  }
 };
-
-/**
- * Hook to subscribe to 'toggle-variable-state' event
- * Handles state params for pagination when events are fired
- * Subscription happens only once when datasource and EventNotifier are available
- */
-var useDataSourceSubscription = exports.useDataSourceSubscription = function useDataSourceSubscription(_ref) {
-  var datasource = _ref.datasource,
-    statehandler = _ref.statehandler,
-    name = _ref.name,
-    onPageRestored = _ref.onPageRestored,
-    _ref$widgetType = _ref.widgetType,
-    widgetType = _ref$widgetType === void 0 ? "list" : _ref$widgetType;
-  var pageLoadRef = (0, _react.useRef)(true); // Track if this is the first page load
-  var unsubscribeRef = (0, _react.useRef)(null);
-
-  // Get the shared EventNotifier instance
-  var eventNotifier = getSharedEventNotifier();
-
-  // Subscribe only once when datasource and EventNotifier become available
-  (0, _react.useMemo)(function () {
-    // Skip if prerequisites not met
+const matchesDatasource = (eventVariable, datasource) => {
+  return (eventVariable == null ? void 0 : eventVariable.execute(DataSource.Operation.GET_UNIQUE_IDENTIFIER)) === (datasource == null ? void 0 : datasource.execute(DataSource.Operation.GET_UNIQUE_IDENTIFIER));
+};
+const useDataSourceSubscription = ({
+  datasource,
+  statehandler,
+  name,
+  onPageRestored,
+  widgetType = "list"
+}) => {
+  const pageLoadRef = useRef(true);
+  const unsubscribeRefs = useRef([]);
+  const eventNotifier = getSharedEventNotifier();
+  useMemo(() => {
     if (!datasource || !eventNotifier) {
       return;
     }
-
-    // Clean up previous subscription if exists
-    if (unsubscribeRef.current) {
-      unsubscribeRef.current();
-      unsubscribeRef.current = null;
+    if (unsubscribeRefs.current.length > 0) {
+      unsubscribeRefs.current.forEach((unsub) => unsub());
+      unsubscribeRefs.current = [];
     }
-
-    // Handler for toggle-variable-state event
-    function handleLoading(data) {
-      if (!(data !== null && data !== void 0 && data.variable) && !data.active) {
+    const ctx = {
+      datasource,
+      statehandler,
+      name,
+      onPageRestored,
+      widgetType,
+      pageLoadRef
+    };
+    const onCheckState = (data) => {
+      if (!(data == null ? void 0 : data.variable) || !(data == null ? void 0 : data.options) || !matchesDatasource(data.variable, datasource)) {
         return;
       }
-      if (datasource && datasource.execute && datasource.execute(_types.DataSource.Operation.IS_API_AWARE) && isDataSourceEqual(data.variable, datasource)) {
-        // Handle state params only on page load (first time)
-        if (pageLoadRef.current && statehandler && statehandler.toLowerCase() !== "none") {
-          pageLoadRef.current = false; // Mark as handled
-
-          // Use appropriate state getter based on widget type
-          var widgetState = widgetType === "table" ? (0, _tableHelpers.getTableState)(name, statehandler) : (0, _listHelpers.getListState)(name, statehandler);
-          if (widgetState) {
-            // Ensure options object exists
-            data.options = data.options || {};
-
-            // Set page number for server-side pagination
-            data.options.page = widgetState.pagination;
-
-            // Set page size
-            if (widgetState.pagesize) {
-              datasource.maxResults = widgetState.pagesize;
-              data.options.pagesize = widgetState.pagesize;
-            }
-            if (widgetType === "table") {
-              var tableState = widgetState;
-              if (tableState.search && tableState.search.length > 0) {
-                data.options.filterFields = (0, _tableHelpers.convertFilterArrayToObject)(tableState.search);
-              }
-              if (tableState.sort && tableState.sort.field.length > 0) {
-                data.options.orderBy = "".concat(tableState.sort.field, " ").concat(tableState.sort.direction);
-              }
-            }
-
-            // Notify parent component about the restored page
-            if (onPageRestored) {
-              onPageRestored(widgetState.pagination);
-            }
-          }
-        }
+      applyPersistedState(data.options, ctx);
+    };
+    const onToggleState = (data) => {
+      if (!(data == null ? void 0 : data.variable) || !data.active || !matchesDatasource(data.variable, datasource)) {
+        return;
       }
-    }
-
-    // Subscribe to toggle-variable-state event
-    var unsubscribe = eventNotifier.subscribe("toggle-variable-state", handleLoading);
-    unsubscribeRef.current = unsubscribe;
-
-    // Return cleanup function
-    return function () {
-      if (unsubscribeRef.current) {
-        unsubscribeRef.current();
-        unsubscribeRef.current = null;
+      if (!pageLoadRef.current) {
+        return;
+      }
+      const invokeOptions = data.options || {};
+      applyPersistedState(invokeOptions, ctx);
+      if (data.options !== invokeOptions) {
+        data.options = invokeOptions;
       }
     };
+    unsubscribeRefs.current = [
+      eventNotifier.subscribe("check-state-persistence-options", onCheckState),
+      eventNotifier.subscribe("toggle-variable-state", onToggleState)
+    ];
+    return () => {
+      unsubscribeRefs.current.forEach((unsub) => unsub());
+      unsubscribeRefs.current = [];
+    };
   }, [datasource, statehandler, name, onPageRestored, widgetType, eventNotifier]);
-};
+};
+export {
+  useDataSourceSubscription
+};

package/hooks/useDebounce.js

@@ -1,71 +1,39 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useDebounceCallback = exports.debounce = void 0;
-var _react = require("react");
-/**
- * A hook that returns a debounced version of the provided callback function.
- * The callback will only be executed after the specified delay has passed since the last invocation.
- *
- * @param callback - The function to debounce
- * @param delay - The delay in milliseconds
- * @returns A debounced version of the callback function with a cancel method
- */
-var useDebounceCallback = exports.useDebounceCallback = function useDebounceCallback(callback, delay) {
-  var timeoutRef = (0, _react.useRef)(null);
-  var debouncedCallback = (0, _react.useCallback)(function () {
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    // Clear the previous timeout if it exists
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-    }
-
-    // Set a new timeout
-    timeoutRef.current = setTimeout(function () {
-      callback.apply(void 0, args);
-      timeoutRef.current = null;
-    }, delay);
-  }, [callback, delay]);
-
-  // Add cancel method to the debounced function
-  var cancel = (0, _react.useCallback)(function () {
+import { useRef, useCallback } from "react";
+const useDebounceCallback = (callback, delay) => {
+  const timeoutRef = useRef(null);
+  const debouncedCallback = useCallback(
+    ((...args) => {
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+      timeoutRef.current = setTimeout(() => {
+        callback(...args);
+        timeoutRef.current = null;
+      }, delay);
+    }),
+    [callback, delay]
+  );
+  const cancel = useCallback(() => {
     if (timeoutRef.current) {
       clearTimeout(timeoutRef.current);
       timeoutRef.current = null;
     }
   }, []);
-
-  // Attach cancel method to the debounced function
   debouncedCallback.cancel = cancel;
   return debouncedCallback;
 };
-
-/**
- * A simpler debounce utility function that can be used outside of React components
- *
- * @param func - The function to debounce
- * @param delay - The delay in milliseconds
- * @returns A debounced version of the function with a cancel method
- */
-var debounce = exports.debounce = function debounce(func, delay) {
-  var timeoutId = null;
-  var debouncedFunction = function debouncedFunction() {
-    for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
-      args[_key2] = arguments[_key2];
-    }
+const debounce = (func, delay) => {
+  let timeoutId = null;
+  const debouncedFunction = ((...args) => {
     if (timeoutId) {
       clearTimeout(timeoutId);
     }
-    timeoutId = setTimeout(function () {
-      func.apply(void 0, args);
+    timeoutId = setTimeout(() => {
+      func(...args);
       timeoutId = null;
     }, delay);
-  };
-  var cancel = function cancel() {
+  });
+  const cancel = () => {
     if (timeoutId) {
       clearTimeout(timeoutId);
       timeoutId = null;
@@ -73,4 +41,8 @@ var debounce = exports.debounce = function debounce(func, delay) {
   };
   debouncedFunction.cancel = cancel;
   return debouncedFunction;
-};
+};
+export {
+  debounce,
+  useDebounceCallback
+};

package/hooks/useDeviceVisibility.js

@@ -1,49 +1,40 @@
-"use strict";
 "use client";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useDeviceVisibility = void 0;
-var _react = require("react");
-var useDeviceVisibility = exports.useDeviceVisibility = function useDeviceVisibility(devices) {
-  var _useState = (0, _react.useState)(typeof window !== "undefined" ? window.innerWidth : undefined),
-    windowSize = _useState[0],
-    setWindowSize = _useState[1];
-  var checkIsHidden = function checkIsHidden() {
+import { useState, useEffect } from "react";
+const useDeviceVisibility = (devices) => {
+  const [windowSize, setWindowSize] = useState(
+    typeof window !== "undefined" ? window.innerWidth : void 0
+  );
+  const checkIsHidden = () => {
     if (!windowSize) return false;
     if (!devices || devices.length === 0 || devices.includes("all")) {
       return false;
     }
     if (windowSize <= 767) {
-      // Mobile
       return !devices.includes("xs");
     }
     if (windowSize >= 768 && windowSize <= 991) {
-      // Tablet
       return !devices.includes("sm");
     }
     if (windowSize >= 992 && windowSize <= 1199) {
-      // Small Desktop
       return !devices.includes("md");
     }
     if (windowSize >= 1200) {
-      // Large Desktop
       return !devices.includes("lg");
     }
     return false;
   };
-  (0, _react.useEffect)(function () {
-    var handleResize = function handleResize() {
+  useEffect(() => {
+    const handleResize = () => {
       setWindowSize(window.innerWidth);
     };
     window.addEventListener("resize", handleResize);
-    return function () {
-      return window.removeEventListener("resize", handleResize);
-    };
+    return () => window.removeEventListener("resize", handleResize);
   }, []);
   return {
     isHidden: checkIsHidden(),
-    windowSize: windowSize
+    windowSize
   };
-};
+};
+export {
+  useDeviceVisibility
+};

package/hooks/useHttp.d.ts

@@ -24,6 +24,7 @@ declare class ModernHttpService implements HttpClientService {
      */
     getContext(): any;
     getAppManager(): any;
+    private handleSessionFailure;
     private setupInterceptors;
     send(options: any, variable: any): Promise<any>;
     sendCall(requestParams: any, variable: any): Promise<any>;