bs-unified-ui 1.0.917 → 1.0.920

package/components/Notification/useCurrentPath.d.ts

@@ -1,5 +1,6 @@
 /**
  * Custom hook to track current pathname changes in SPA
+ * Uses singleton PathTracker to prevent duplicate history API patches
  * Listens to:
  * - popstate (browser back/forward)
  * - history.pushState (programmatic navigation)

package/index.js

@@ -45588,22 +45588,37 @@ var filterIndicatorsByEnabledEvents = function (receivedIndicators, triggerEvent
 };
 
 /**
- * Custom hook to track current pathname changes in SPA
- * Listens to:
- * - popstate (browser back/forward)
- * - history.pushState (programmatic navigation)
- * - history.replaceState (programmatic navigation)
+ * Global singleton to track pathname changes across all hook instances
+ * This prevents multiple hooks from patching history APIs multiple times
  */
-var useCurrentPath = function () {
-    var _a = React.useState(typeof window !== 'undefined' ? window.location.pathname : ''), currentPath = _a[0], setCurrentPath = _a[1];
-    React.useEffect(function () {
-        var handleLocationChange = function () {
-            setCurrentPath(window.location.pathname);
+var PathTracker = /** @class */ (function () {
+    function PathTracker() {
+        this.listeners = new Set();
+        this.currentPath = '';
+        this.isPatched = false;
+        if (typeof window !== 'undefined') {
+            this.currentPath = window.location.pathname;
+            this.patchHistory();
+        }
+    }
+    PathTracker.getInstance = function () {
+        if (!PathTracker.instance) {
+            PathTracker.instance = new PathTracker();
+        }
+        return PathTracker.instance;
+    };
+    PathTracker.prototype.patchHistory = function () {
+        var _this = this;
+        if (this.isPatched)
+            return;
+        this.isPatched = true;
+        var handleChange = function () {
+            _this.currentPath = window.location.pathname;
+            _this.notifyListeners();
         };
         // Listen to popstate event (browser back/forward)
-        window.addEventListener('popstate', handleLocationChange);
-        // For SPAs, also listen to custom navigation events if needed
-        // This covers most routing libraries that update window.location
+        window.addEventListener('popstate', handleChange);
+        // Patch history.pushState and history.replaceState ONCE
         var originalPushState = window.history.pushState;
         var originalReplaceState = window.history.replaceState;
         window.history.pushState = function pushStateWrapper() {
@@ -45612,7 +45627,7 @@ var useCurrentPath = function () {
                 args[_i] = arguments[_i];
             }
             originalPushState.apply(this, args);
-            handleLocationChange();
+            handleChange();
         };
         window.history.replaceState = function replaceStateWrapper() {
             var args = [];
@@ -45620,14 +45635,45 @@ var useCurrentPath = function () {
                 args[_i] = arguments[_i];
             }
             originalReplaceState.apply(this, args);
-            handleLocationChange();
+            handleChange();
         };
+    };
+    PathTracker.prototype.subscribe = function (callback) {
+        var _this = this;
+        this.listeners.add(callback);
         return function () {
-            window.removeEventListener('popstate', handleLocationChange);
-            window.history.pushState = originalPushState;
-            window.history.replaceState = originalReplaceState;
+            _this.listeners.delete(callback);
         };
-    }, []);
+    };
+    PathTracker.prototype.notifyListeners = function () {
+        var _this = this;
+        this.listeners.forEach(function (callback) {
+            try {
+                callback(_this.currentPath);
+            }
+            catch (e) {
+                // Ignore errors in listeners
+            }
+        });
+    };
+    PathTracker.prototype.getCurrentPath = function () {
+        return this.currentPath;
+    };
+    PathTracker.instance = null;
+    return PathTracker;
+}());
+/**
+ * Custom hook to track current pathname changes in SPA
+ * Uses singleton PathTracker to prevent duplicate history API patches
+ * Listens to:
+ * - popstate (browser back/forward)
+ * - history.pushState (programmatic navigation)
+ * - history.replaceState (programmatic navigation)
+ */
+var useCurrentPath = function () {
+    var tracker = PathTracker.getInstance();
+    var _a = React.useState(tracker.getCurrentPath()), currentPath = _a[0], setCurrentPath = _a[1];
+    React.useEffect(function () { return tracker.subscribe(setCurrentPath); }, [tracker]);
     return currentPath;
 };
 
@@ -45724,10 +45770,12 @@ var ObservableSet = /** @class */ (function () {
     return ObservableSet;
 }());
 
+// Constant empty array to avoid recreating on each render
+var EMPTY_WAREHOUSES_CONFIG = [];
 var useNotificationsV2 = function (options) {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j;
     if (options === void 0) { options = {}; }
-    var onNotification = options.onNotification, onConnectionChange = options.onConnectionChange, onError = options.onError, _k = options.timezone, timezone = _k === void 0 ? 'America/Vancouver' : _k, navigate = options.navigate, bsOrgId = options.bsOrgId, cfWsId = options.cfWsId, soundConfig = options.soundConfig, triggerEvents = options.triggerEvents, _l = options.warehousesConfig, warehousesConfig = _l === void 0 ? [] : _l;
+    var onNotification = options.onNotification, onConnectionChange = options.onConnectionChange, onError = options.onError, _k = options.timezone, timezone = _k === void 0 ? 'America/Vancouver' : _k, navigate = options.navigate, bsOrgId = options.bsOrgId, cfWsId = options.cfWsId, soundConfig = options.soundConfig, triggerEvents = options.triggerEvents, _l = options.warehousesConfig, warehousesConfig = _l === void 0 ? EMPTY_WAREHOUSES_CONFIG : _l;
     var _m = React.useState([]), popoverNotifications = _m[0], setPopoverNotifications = _m[1];
     var _o = React.useState(true), popoverLoading = _o[0], setPopoverLoading = _o[1];
     var _p = React.useState(false), popoverHasNextPage = _p[0], setPopoverHasNextPage = _p[1];
@@ -45770,8 +45818,6 @@ var useNotificationsV2 = function (options) {
     // Single ObservableSet to track all items requiring audio reminders with composite key: `${subType}:${id}`
     var allRemindersRef = React.useRef(new ObservableSet());
     var handleNotificationEventRef = React.useRef(function () { });
-    // Refs to always have latest functions (prevents duplicate intervals)
-    var playAudioForGroupRef = React.useRef(function () { });
     // Ref to always have latest indicators state
     var indicatorsRef = React.useRef(indicators);
     // Track previous reminder events to detect when events are enabled (falsy -> true)
@@ -45792,9 +45838,12 @@ var useNotificationsV2 = function (options) {
     var prevPageIndicatorRef = React.useRef();
     // Timer for debouncing fetchAudioRepeat calls
     var fetchAudioRepeatTimerRef = React.useRef(null);
-    // Ref to always have latest updateIndicators function
-    var updateIndicatorsRef = React.useRef();
     // Use refs to store latest callbacks to avoid recreating functions unnecessarily
+    var updateIndicatorsRef = React.useRef();
+    var fetchIndicatorsRef = React.useRef();
+    var playAudioForGroupRef = React.useRef(function () { });
+    var fetchIndicatorsInFlightRef = React.useRef(false);
+    var fetchAudioRepeatInFlightRef = React.useRef(false);
     var onErrorRef = React.useRef(onError);
     var onNotificationRef = React.useRef(onNotification);
     var onConnectionChangeRef = React.useRef(onConnectionChange);
@@ -45879,6 +45928,8 @@ var useNotificationsV2 = function (options) {
         memoizedTriggerEvents === null || memoizedTriggerEvents === void 0 ? void 0 : memoizedTriggerEvents[DELIVERY_EVENTS.IMPORT_TASK],
         memoizedTriggerEvents === null || memoizedTriggerEvents === void 0 ? void 0 : memoizedTriggerEvents[DELIVERY_EVENTS.NEW_DRIVER],
     ]);
+    // Memoize warehousesConfig to prevent recreating when array content is the same
+    var memoizedWarehousesConfig = React.useMemo(function () { return warehousesConfig; }, [JSON.stringify(warehousesConfig)]);
     var markAsRead = React.useCallback(function (notificationId) { return __awaiter(void 0, void 0, void 0, function () {
         var err_1, errorMessage;
         var _a;
@@ -46018,16 +46069,6 @@ var useNotificationsV2 = function (options) {
         }
         return true;
     }, []);
-    // Update refs whenever callbacks change
-    React.useEffect(function () {
-        onErrorRef.current = onError;
-    }, [onError]);
-    React.useEffect(function () {
-        onNotificationRef.current = onNotification;
-    }, [onNotification]);
-    React.useEffect(function () {
-        onConnectionChangeRef.current = onConnectionChange;
-    }, [onConnectionChange]);
     var loadPopoverNotifications = React.useCallback(function (params) { return __awaiter(void 0, void 0, void 0, function () {
         var data_1, err_3, errorMessage;
         var _a;
@@ -46077,6 +46118,7 @@ var useNotificationsV2 = function (options) {
     var startRetryInterval = React.useCallback(function () {
         if (!bsOrgId)
             return;
+        // Clear any existing interval to prevent duplicates
         clearRetryInterval();
         retryIntervalRef.current = setInterval(function () {
             var createdAtGte = isoMinusDaysInTimeZone(timezone, 7);
@@ -46112,14 +46154,6 @@ var useNotificationsV2 = function (options) {
             audioElement.play().catch(function () { });
         }
     }, [memoizedSoundConfig]);
-    // Update ref whenever playAudioForGroup changes
-    React.useEffect(function () {
-        playAudioForGroupRef.current = playAudioForGroup;
-    }, [playAudioForGroup]);
-    // Update ref whenever indicators changes
-    React.useEffect(function () {
-        indicatorsRef.current = indicators;
-    }, [indicators]);
     // Start audio repeat for specific group
     var startAudioRepeatForGroup = React.useCallback(function (group) {
         var _a;
@@ -46173,12 +46207,17 @@ var useNotificationsV2 = function (options) {
                 case 0:
                     if (!serviceRef.current || !bsOrgId)
                         return [2 /*return*/];
+                    // Guard: Skip if already fetching to prevent duplicate calls
+                    if (fetchAudioRepeatInFlightRef.current) {
+                        return [2 /*return*/];
+                    }
                     // Clear old reminders first to avoid stale data
                     allRemindersRef.current.clear();
                     _a.label = 1;
                 case 1:
-                    _a.trys.push([1, 3, , 4]);
-                    return [4 /*yield*/, serviceRef.current.getAudioRepeat(bsOrgId, warehousesConfig)];
+                    _a.trys.push([1, 3, 4, 5]);
+                    fetchAudioRepeatInFlightRef.current = true;
+                    return [4 /*yield*/, serviceRef.current.getAudioRepeat(bsOrgId, memoizedWarehousesConfig)];
                 case 2:
                     response = _a.sent();
                     data = response === null || response === void 0 ? void 0 : response.data;
@@ -46209,15 +46248,19 @@ var useNotificationsV2 = function (options) {
                             startAudioRepeatForGroup(group);
                         });
                     }
-                    return [3 /*break*/, 4];
+                    return [3 /*break*/, 5];
                 case 3:
                     _a.sent();
-                    return [3 /*break*/, 4];
-                case 4: return [2 /*return*/];
+                    return [3 /*break*/, 5];
+                case 4:
+                    fetchAudioRepeatInFlightRef.current = false;
+                    return [7 /*endfinally*/];
+                case 5: return [2 /*return*/];
             }
         });
     }); }, [
         bsOrgId,
+        memoizedWarehousesConfig,
         memoizedTriggerEvents,
         playAudioForGroup,
         startAudioRepeatForGroup,
@@ -46230,6 +46273,10 @@ var useNotificationsV2 = function (options) {
                 case 0:
                     if (!serviceRef.current || !bsOrgId)
                         return [2 /*return*/];
+                    // Guard: Skip if already fetching to prevent duplicate calls
+                    if (fetchIndicatorsInFlightRef.current) {
+                        return [2 /*return*/];
+                    }
                     categories = {};
                     Object.entries(INDICATOR_MAPPING).forEach(function (_a) {
                         var category = _a[0], events = _a[1];
@@ -46242,14 +46289,22 @@ var useNotificationsV2 = function (options) {
                     if (Object.keys(categories).length === 0) {
                         return [2 /*return*/];
                     }
-                    return [4 /*yield*/, serviceRef.current.getIndicators(bsOrgId, categories)];
+                    _a.label = 1;
                 case 1:
+                    _a.trys.push([1, , 3, 4]);
+                    fetchIndicatorsInFlightRef.current = true;
+                    return [4 /*yield*/, serviceRef.current.getIndicators(bsOrgId, categories)];
+                case 2:
                     response = _a.sent();
                     receivedIndicators = response === null || response === void 0 ? void 0 : response.data;
                     if (receivedIndicators) {
                         setIndicators(receivedIndicators);
                     }
-                    return [2 /*return*/];
+                    return [3 /*break*/, 4];
+                case 3:
+                    fetchIndicatorsInFlightRef.current = false;
+                    return [7 /*endfinally*/];
+                case 4: return [2 /*return*/];
             }
         });
     }); }, [bsOrgId, memoizedTriggerEvents]);
@@ -46288,10 +46343,29 @@ var useNotificationsV2 = function (options) {
             }
         });
     }); }, [bsOrgId, onError, memoizedTriggerEvents]);
-    // Update ref whenever updateIndicators changes
+    // Update function refs to avoid stale closures
+    React.useEffect(function () {
+        onErrorRef.current = onError;
+    }, [onError]);
+    React.useEffect(function () {
+        onNotificationRef.current = onNotification;
+    }, [onNotification]);
+    React.useEffect(function () {
+        onConnectionChangeRef.current = onConnectionChange;
+    }, [onConnectionChange]);
     React.useEffect(function () {
         updateIndicatorsRef.current = updateIndicators;
     }, [updateIndicators]);
+    React.useEffect(function () {
+        fetchIndicatorsRef.current = fetchIndicators;
+    }, [fetchIndicators]);
+    React.useEffect(function () {
+        playAudioForGroupRef.current = playAudioForGroup;
+    }, [playAudioForGroup]);
+    // Update state ref
+    React.useEffect(function () {
+        indicatorsRef.current = indicators;
+    }, [indicators]);
     // Queue indicator update to batch multiple updates together
     var queueUpdateIndicators = React.useCallback(function (indicator, value) {
         // Add to pending queue
@@ -46683,10 +46757,11 @@ var useNotificationsV2 = function (options) {
         if (!isInitialized || !bsOrgId)
             return undefined;
         var timeoutId = setTimeout(function () {
-            fetchIndicators();
-        }, 2000);
+            var _a;
+            (_a = fetchIndicatorsRef.current) === null || _a === void 0 ? void 0 : _a.call(fetchIndicatorsRef);
+        }, 3000);
         return function () { return clearTimeout(timeoutId); };
-    }, [isInitialized, bsOrgId, fetchIndicators]);
+    }, [isInitialized, bsOrgId]);
     React.useEffect(function () {
         if (isInitialized && isActiveNotificationPage && bsOrgId) {
             var apiParams = __assign({}, filter);
@@ -46817,7 +46892,7 @@ var useNotificationsV2 = function (options) {
             fetchAudioRepeatTimerRef.current = setTimeout(function () {
                 fetchAudioRepeat();
                 fetchAudioRepeatTimerRef.current = null;
-            }, 2000);
+            }, 3000);
         }
     }, [fetchAudioRepeat, memoizedSoundConfig, memoizedReminderEvents]);
     // Restart interval when repeatingInterval or mute changes per group
@@ -47127,29 +47202,63 @@ var NotificationToast = React.forwardRef(function (props, ref) {
 var NotificationContext = React.createContext(null);
 var NotificationProviderBase = function (_a) {
     var children = _a.children, config = _a.config, useNotificationsHook = _a.useNotificationsHook;
-    // Memoize callbacks to prevent recreating on every render
+    // Use refs to store callbacks to avoid recreating them
+    var onNotificationRef = React.useRef(config.onNotification);
+    var onConnectionChangeRef = React.useRef(config.onConnectionChange);
+    var onErrorRef = React.useRef(config.onError);
+    // Update refs when callbacks change
+    onNotificationRef.current = config.onNotification;
+    onConnectionChangeRef.current = config.onConnectionChange;
+    onErrorRef.current = config.onError;
+    // Create stable callbacks that use refs
     var onNotificationCb = React.useCallback(function (notification) {
         var _a;
-        (_a = config.onNotification) === null || _a === void 0 ? void 0 : _a.call(config, notification);
-    }, [config.onNotification]);
+        (_a = onNotificationRef.current) === null || _a === void 0 ? void 0 : _a.call(onNotificationRef, notification);
+    }, []);
     var onConnectionChangeCb = React.useCallback(function (isConnected) {
         var _a;
-        (_a = config.onConnectionChange) === null || _a === void 0 ? void 0 : _a.call(config, isConnected);
-    }, [config.onConnectionChange]);
+        (_a = onConnectionChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onConnectionChangeRef, isConnected);
+    }, []);
     var onErrorCb = React.useCallback(function (error) {
         var _a;
-        (_a = config.onError) === null || _a === void 0 ? void 0 : _a.call(config, error);
-    }, [config.onError]);
-    var notificationState = useNotificationsHook(__assign(__assign({}, config), { onNotification: onNotificationCb, onConnectionChange: onConnectionChangeCb, onError: onErrorCb }));
-    return (React.createElement(SnackbarProvider, { maxSnack: (config === null || config === void 0 ? void 0 : config.maxVisibleToasts) || 5, autoHideDuration: (config === null || config === void 0 ? void 0 : config.autoRemoveDelay) || 5000, anchorOrigin: {
+        (_a = onErrorRef.current) === null || _a === void 0 ? void 0 : _a.call(onErrorRef, error);
+    }, []);
+    // Memoize the config object to prevent recreating it
+    var memoizedConfig = React.useMemo(function () { return (__assign(__assign({}, config), { onNotification: onNotificationCb, onConnectionChange: onConnectionChangeCb, onError: onErrorCb })); }, [
+        config.bsOrgId,
+        config.cfWsId,
+        config.timezone,
+        config.navigate,
+        config.soundConfig,
+        config.triggerEvents,
+        config.warehousesConfig,
+        config.maxVisibleToasts,
+        config.autoRemoveDelay,
+        onNotificationCb,
+        onConnectionChangeCb,
+        onErrorCb,
+    ]);
+    var notificationState = useNotificationsHook(memoizedConfig);
+    // Memoize SnackbarProvider props to prevent re-renders
+    var snackbarProps = React.useMemo(function () { return ({
+        maxSnack: (config === null || config === void 0 ? void 0 : config.maxVisibleToasts) || 5,
+        autoHideDuration: (config === null || config === void 0 ? void 0 : config.autoRemoveDelay) || 5000,
+        anchorOrigin: {
             vertical: 'top',
             horizontal: 'right',
-        }, dense: true, preventDuplicate: true, disableWindowBlurListener: true, classes: {
+        },
+        dense: true,
+        preventDuplicate: true,
+        disableWindowBlurListener: true,
+        classes: {
             containerRoot: 'snackbarStack',
             containerAnchorOriginTopRight: 'snackbarStack',
-        }, Components: {
+        },
+        Components: {
             notification: NotificationToast,
-        } },
+        },
+    }); }, [config === null || config === void 0 ? void 0 : config.maxVisibleToasts, config === null || config === void 0 ? void 0 : config.autoRemoveDelay]);
+    return (React.createElement(SnackbarProvider, __assign({}, snackbarProps),
         React.createElement(material.GlobalStyles, { styles: {
                 '.snackbarStack': {
                     display: 'flex !important',
@@ -47159,12 +47268,22 @@ var NotificationProviderBase = function (_a) {
             } }),
         React.createElement(NotificationContext.Provider, { value: notificationState }, children)));
 };
+// Default empty config to prevent creating new object on each render
+var EMPTY_CONFIG = {};
 var NotificationProvider = function (_a) {
-    var children = _a.children, _b = _a.config, config = _b === void 0 ? {} : _b;
-    var isV2 = config.isV2, restConfig = __rest(config, ["isV2"]);
-    if (isV2)
-        return (React.createElement(NotificationProviderBase, { config: restConfig, useNotificationsHook: useNotificationsV2 }, children));
-    return (React.createElement(NotificationProviderBase, { config: restConfig, useNotificationsHook: useNotifications }, children));
+    var children = _a.children, _b = _a.config, config = _b === void 0 ? EMPTY_CONFIG : _b;
+    // Extract isV2 flag
+    var isV2 = config === null || config === void 0 ? void 0 : config.isV2;
+    // Memoize the config without isV2 to prevent recreating object
+    var restConfig = React.useMemo(function () {
+        if (!config)
+            return {};
+        config.isV2; var rest = __rest(config, ["isV2"]);
+        return rest;
+    }, [config]);
+    // Memoize the hook selection
+    var useNotificationsHook = React.useMemo(function () { return (isV2 ? useNotificationsV2 : useNotifications); }, [isV2]);
+    return (React.createElement(NotificationProviderBase, { config: restConfig, useNotificationsHook: useNotificationsHook }, children));
 };
 var useNotificationContext = function () {
     var context = React.useContext(NotificationContext);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bs-unified-ui",
-  "version": "1.0.917",
+  "version": "1.0.920",
   "license": "MIT",
   "author": "Advesa",
   "description": "UI Components for Unified Breadstack UI",