@okyrychenko-dev/react-action-guard 1.0.4 → 1.0.5

package/README.md

@@ -232,6 +232,10 @@ Wraps an async function with automatic blocking/unblocking.
 
 **Returns:** `(asyncFn: () => Promise<T>) => Promise<T>` - Function wrapper
 
+Each execution receives a unique blocker ID within the resolved store, including concurrent
+executions from different hook instances. Separate `UIBlockingProvider` stores allocate IDs
+independently.
+
 **Example:**
 
 ```jsx
@@ -355,6 +359,9 @@ Use it when blocking is driven by time windows rather than user-triggered async
   - `onScheduleEnd?: () => void` - Callback when blocking ends
   - Plus all `BlockerConfig` properties (scope, reason, priority)
 
+Changing `schedule.start`, `schedule.end`, or `schedule.duration` on rerender cancels the previous
+timers and schedules the blocker using the latest values.
+
 **Example:**
 
 ```jsx
@@ -390,10 +397,12 @@ Use this when polling is an acceptable tradeoff and the condition is not natural
 - `config: ConditionalBlockerConfig<TState>`
   - `scope: string | string[]` - Required scope(s) to block
   - `condition: (state?: TState) => boolean` - Function that determines if blocking should be active
-  - `checkInterval?: number` - How often to check the condition in ms (default: 1000)
+  - `checkInterval?: number` - How often to check the condition in ms (default: 1000; non-positive values use the default)
   - `state?: TState` - Optional state to pass to the condition function
   - Plus all other `BlockerConfig` properties (reason, priority)
 
+Changing `checkInterval` on rerender restarts condition checks using the latest interval.
+
 **Example:**
 
 ```jsx
@@ -626,6 +635,7 @@ configureMiddleware([
 #### Logger Middleware
 
 Log blocker lifecycle events to the console for debugging.
+The middleware is not disabled automatically in production; register it conditionally when needed.
 
 ```jsx
 import { configureMiddleware, loggerMiddleware } from "@okyrychenko-dev/react-action-guard";

package/dist/index.cjs

@@ -36,6 +36,16 @@ function createMiddlewareContext(action, blockerId, config, prevState) {
     ...prevState && { prevState }
   };
 }
+function toPublicBlockerConfig(blocker) {
+  return {
+    scope: blocker.scope,
+    reason: blocker.reason,
+    priority: blocker.priority,
+    timestamp: blocker.timestamp,
+    timeout: blocker.timeout,
+    onTimeout: blocker.onTimeout
+  };
+}
 var createUIBlockingActions = (set, get) => ({
   // State
   activeBlockers: /* @__PURE__ */ new Map(),
@@ -106,14 +116,15 @@ var createUIBlockingActions = (set, get) => ({
     let timeoutId;
     if (config.timeout && config.timeout > 0) {
       timeoutId = setTimeout(() => {
-        if (get().activeBlockers.has(id)) {
-          config.onTimeout?.(id);
+        const blocker = get().activeBlockers.get(id);
+        if (blocker) {
+          blocker.onTimeout?.(id);
           void get().runMiddlewares(
             createMiddlewareContext("timeout", id, {
-              scope: config.scope,
-              reason: config.reason,
-              priority: config.priority,
-              timeout: config.timeout
+              scope: blocker.scope,
+              reason: blocker.reason,
+              priority: blocker.priority,
+              timeout: blocker.timeout
             })
           );
           get().removeBlocker(id);
@@ -184,16 +195,16 @@ var createUIBlockingActions = (set, get) => ({
       }
       if (config.timeout && config.timeout > 0) {
         const newTimeout = config.timeout;
-        const newOnTimeout = config.onTimeout ?? existingBlocker.onTimeout;
         timeoutId = setTimeout(() => {
-          if (get().activeBlockers.has(id)) {
-            newOnTimeout?.(id);
+          const blocker = get().activeBlockers.get(id);
+          if (blocker) {
+            blocker.onTimeout?.(id);
             void get().runMiddlewares(
               createMiddlewareContext("timeout", id, {
-                scope: config.scope ?? existingBlocker.scope,
-                reason: config.reason ?? existingBlocker.reason,
-                priority: config.priority ?? existingBlocker.priority,
-                timeout: newTimeout
+                scope: blocker.scope,
+                reason: blocker.reason,
+                priority: blocker.priority,
+                timeout: blocker.timeout
               })
             );
             get().removeBlocker(id);
@@ -271,7 +282,8 @@ var createUIBlockingActions = (set, get) => ({
       return { activeBlockers: newBlockers };
     });
     if (prevBlocker) {
-      void get().runMiddlewares(createMiddlewareContext("remove", id, prevBlocker, prevBlocker));
+      const publicConfig = toPublicBlockerConfig(prevBlocker);
+      void get().runMiddlewares(createMiddlewareContext("remove", id, publicConfig, publicConfig));
     }
   },
   /**
@@ -503,16 +515,36 @@ function useResolvedValue(selector) {
   const store = useResolvedStoreApi();
   return zustand.useStore(store, shallow.useShallow(selector));
 }
+
+// src/store/blockerId.utils.ts
+var storeSequences = /* @__PURE__ */ new WeakMap();
+function allocateBlockerId(store, prefix) {
+  let sequence = storeSequences.get(store) ?? 0;
+  let blockerId;
+  do {
+    sequence += 1;
+    blockerId = `${prefix}-${String(sequence)}`;
+  } while (store.getState().activeBlockers.has(blockerId));
+  storeSequences.set(store, sequence);
+  return blockerId;
+}
+
+// src/hooks/useBlockerIdAllocator/useBlockerIdAllocator.ts
+function useBlockerIdAllocator() {
+  const store = useResolvedStoreApi();
+  return react.useCallback((prefix) => allocateBlockerId(store, prefix), [store]);
+}
+
+// src/hooks/useAsyncAction/useAsyncAction.ts
 function useAsyncAction(actionId, scope, options) {
+  const allocateBlockerId2 = useBlockerIdAllocator();
   const { addBlocker, removeBlocker } = useResolvedValue((state) => ({
     addBlocker: state.addBlocker,
     removeBlocker: state.removeBlocker
   }));
-  const counterRef = react.useRef(0);
   const executeWithBlocking = react.useCallback(
     async (asyncFn) => {
-      counterRef.current += 1;
-      const blockerId = `${actionId}-${String(counterRef.current)}`;
+      const blockerId = allocateBlockerId2(actionId);
       try {
         addBlocker(blockerId, {
           scope,
@@ -526,7 +558,15 @@ function useAsyncAction(actionId, scope, options) {
         removeBlocker(blockerId);
       }
     },
-    [actionId, scope, options?.timeout, options?.onTimeout, addBlocker, removeBlocker]
+    [
+      actionId,
+      scope,
+      options?.timeout,
+      options?.onTimeout,
+      allocateBlockerId2,
+      addBlocker,
+      removeBlocker
+    ]
   );
   return executeWithBlocking;
 }
@@ -571,12 +611,24 @@ function useBlocker(blockerId, config, isActive = true) {
     updateBlocker: state.updateBlocker
   }));
   const lastConfigRef = react.useRef(null);
+  const onTimeoutRef = react.useRef(config.onTimeout);
+  onTimeoutRef.current = config.onTimeout;
+  const handleTimeout = react.useCallback((id) => {
+    onTimeoutRef.current?.(id);
+  }, []);
+  const storeConfig = react.useMemo(
+    () => ({
+      ...config,
+      onTimeout: config.onTimeout ? handleTimeout : void 0
+    }),
+    [config, handleTimeout]
+  );
   react.useEffect(() => {
     if (!isActive || !blockerId) {
       return;
     }
-    addBlocker(blockerId, config);
-    lastConfigRef.current = config;
+    addBlocker(blockerId, storeConfig);
+    lastConfigRef.current = storeConfig;
     return () => {
       lastConfigRef.current = null;
       removeBlocker(blockerId);
@@ -586,12 +638,12 @@ function useBlocker(blockerId, config, isActive = true) {
     if (!isActive || !blockerId) {
       return;
     }
-    if (lastConfigRef.current !== null && areBlockerConfigsEqual(lastConfigRef.current, config)) {
+    if (lastConfigRef.current !== null && areBlockerConfigsEqual(lastConfigRef.current, storeConfig)) {
       return;
     }
-    updateBlocker(blockerId, config);
-    lastConfigRef.current = config;
-  }, [blockerId, config, isActive, updateBlocker]);
+    updateBlocker(blockerId, storeConfig);
+    lastConfigRef.current = storeConfig;
+  }, [blockerId, storeConfig, isActive, updateBlocker]);
 }
 function useBlockingInfo(scope = DEFAULT_SCOPE) {
   const store = useResolvedStoreApi();
@@ -609,6 +661,7 @@ function useConfigRef(config) {
 }
 
 // src/hooks/useConditionalBlocker/useConditionalBlocker.ts
+var DEFAULT_CHECK_INTERVAL = 1e3;
 function useConditionalBlocker(blockerId, config) {
   const { addBlocker, removeBlocker } = useResolvedValue((state) => ({
     addBlocker: state.addBlocker,
@@ -617,6 +670,7 @@ function useConditionalBlocker(blockerId, config) {
   const intervalRef = react.useRef(null);
   const isBlockedRef = react.useRef(false);
   const configRef = useConfigRef(config);
+  const checkInterval = config.checkInterval !== void 0 && config.checkInterval > 0 ? config.checkInterval : DEFAULT_CHECK_INTERVAL;
   const checkCondition = react.useCallback(() => {
     const currentConfig = configRef.current;
     const shouldBlock = currentConfig.condition(currentConfig.state);
@@ -632,8 +686,7 @@ function useConditionalBlocker(blockerId, config) {
   }, [blockerId, addBlocker, removeBlocker, configRef]);
   react.useEffect(() => {
     checkCondition();
-    const interval = configRef.current.checkInterval ?? 1e3;
-    intervalRef.current = setInterval(checkCondition, interval);
+    intervalRef.current = setInterval(checkCondition, checkInterval);
     return () => {
       if (intervalRef.current) {
         clearInterval(intervalRef.current);
@@ -644,7 +697,7 @@ function useConditionalBlocker(blockerId, config) {
         isBlockedRef.current = false;
       }
     };
-  }, [checkCondition, blockerId, removeBlocker]);
+  }, [checkCondition, blockerId, removeBlocker, checkInterval]);
 }
 function useConfirmableBlocker(blockerId, config) {
   const [isDialogOpen, setIsDialogOpen] = react.useState(false);
@@ -738,6 +791,9 @@ function useScheduledBlocker(blockerId, config) {
   }));
   const timeoutsRef = react.useRef({});
   const configRef = useConfigRef(config);
+  const scheduleStart = parseDate(config.schedule.start);
+  const scheduleEnd = config.schedule.end === void 0 ? void 0 : parseDate(config.schedule.end);
+  const scheduleDuration = config.schedule.duration;
   const cleanup = react.useCallback(() => {
     if (timeoutsRef.current.start) {
       clearTimeout(timeoutsRef.current.start);
@@ -755,7 +811,7 @@ function useScheduledBlocker(blockerId, config) {
     if (!isValidTimestamp(startTime)) {
       return;
     }
-    const scheduleEnd = () => {
+    const scheduleEnd2 = () => {
       const endTime = calculateEndTime(currentConfig.schedule, startTime);
       if (!endTime) {
         return;
@@ -772,7 +828,7 @@ function useScheduledBlocker(blockerId, config) {
       const cfg = configRef.current;
       addBlocker(blockerId, createBlockerConfig(cfg));
       cfg.onScheduleStart?.();
-      scheduleEnd();
+      scheduleEnd2();
     };
     if (startTime > now) {
       const delay = startTime - now;
@@ -792,7 +848,16 @@ function useScheduledBlocker(blockerId, config) {
       cleanup();
       removeBlocker(blockerId);
     };
-  }, [blockerId, addBlocker, removeBlocker, cleanup]);
+  }, [
+    blockerId,
+    addBlocker,
+    removeBlocker,
+    cleanup,
+    scheduleStart,
+    scheduleEnd,
+    scheduleDuration,
+    configRef
+  ]);
 }
 
 // src/middleware/analyticsMiddleware.utils.ts