@okyrychenko-dev/react-action-guard 0.4.0 → 0.6.0

package/dist/index.js

@@ -1,8 +1,11 @@
-import { createContext, useRef, useMemo, useContext, useCallback, useEffect, useState } from 'react';
-import { createStore, useStore } from 'zustand';
-import { devtools } from 'zustand/middleware';
-import { useShallow } from 'zustand/shallow';
+import { useRef, useCallback, useEffect, useMemo, useState } from 'react';
+import { createStoreProvider, createShallowStore } from '@okyrychenko-dev/react-zustand-toolkit';
+export { createShallowStore } from '@okyrychenko-dev/react-zustand-toolkit';
+import { useStore } from 'zustand';
+import 'zustand/react/shallow';
 import { jsx } from 'react/jsx-runtime';
+import { useShallow } from 'zustand/shallow';
+import { devtools } from 'zustand/middleware';
 
 // src/hooks/useAsyncAction/useAsyncAction.ts
 
@@ -12,13 +15,6 @@ var DEFAULT_REASON = "Unknown";
 var DEFAULT_PRIORITY = 0;
 var ASYNC_ACTION_PRIORITY = 20;
 var DEVTOOLS_NAME = "UIBlocking";
-function createShallowStore(storeCreator) {
-  const storeApi = createStore(storeCreator);
-  const useScopedStore = (selector) => {
-    return useStore(storeApi, useShallow(selector));
-  };
-  return { useStore: useScopedStore, useStoreApi: storeApi };
-}
 function normalizeScopeToArray(scope) {
   if (typeof scope === "string") {
     return [scope];
@@ -27,6 +23,16 @@ function normalizeScopeToArray(scope) {
 }
 
 // src/store/uiBlockingStore.actions.ts
+var normalizePriority = (priority, fallback = DEFAULT_PRIORITY) => {
+  return priority !== void 0 ? Math.max(0, priority) : fallback;
+};
+var createMiddlewareContext = (action, blockerId, config, prevState) => ({
+  action,
+  blockerId,
+  config,
+  timestamp: Date.now(),
+  ...prevState && { prevState }
+});
 var createUIBlockingActions = (set, get) => ({
   // State
   activeBlockers: /* @__PURE__ */ new Map(),
@@ -37,7 +43,6 @@ var createUIBlockingActions = (set, get) => ({
       newMiddlewares.set(name, middleware);
       return { middlewares: newMiddlewares };
     });
-    console.log(`[UIBlocking] Registered middleware: ${name}`);
   },
   unregisterMiddleware: (name) => {
     set((state) => {
@@ -45,7 +50,6 @@ var createUIBlockingActions = (set, get) => ({
       newMiddlewares.delete(name);
       return { middlewares: newMiddlewares };
     });
-    console.log(`[UIBlocking] Unregistered middleware: ${name}`);
   },
   runMiddlewares: async (context) => {
     const { middlewares } = get();
@@ -75,17 +79,14 @@ var createUIBlockingActions = (set, get) => ({
       timeoutId = setTimeout(() => {
         if (get().activeBlockers.has(id)) {
           config.onTimeout?.(id);
-          void get().runMiddlewares({
-            action: "timeout",
-            blockerId: id,
-            config: {
+          void get().runMiddlewares(
+            createMiddlewareContext("timeout", id, {
               scope: config.scope,
               reason: config.reason,
               priority: config.priority,
               timeout: config.timeout
-            },
-            timestamp: Date.now()
-          });
+            })
+          );
           get().removeBlocker(id);
         }
       }, config.timeout);
@@ -95,7 +96,7 @@ var createUIBlockingActions = (set, get) => ({
       const storedBlocker = {
         scope: config.scope ?? DEFAULT_SCOPE,
         reason: config.reason ?? DEFAULT_REASON,
-        priority: config.priority ?? DEFAULT_PRIORITY,
+        priority: normalizePriority(config.priority),
         timestamp: config.timestamp ?? Date.now(),
         timeout: config.timeout,
         timeoutId,
@@ -104,17 +105,92 @@ var createUIBlockingActions = (set, get) => ({
       newBlockers.set(id, storedBlocker);
       return { activeBlockers: newBlockers };
     });
-    void get().runMiddlewares({
-      action: "add",
-      blockerId: id,
-      config: {
+    void get().runMiddlewares(
+      createMiddlewareContext("add", id, {
         scope: config.scope,
         reason: config.reason,
         priority: config.priority,
         timeout: config.timeout
-      },
-      timestamp: Date.now()
+      })
+    );
+  },
+  /**
+   * Update blocker metadata. If timeout is updated, the timer will be restarted.
+   *
+   * @param id - Unique blocker identifier
+   * @param config - Partial blocker configuration to merge
+   *
+   */
+  updateBlocker: (id, config = {}) => {
+    const existingBlocker = get().activeBlockers.get(id);
+    if (!existingBlocker) {
+      get().addBlocker(id, config);
+      return;
+    }
+    let timeoutId = existingBlocker.timeoutId;
+    const timeoutChanged = config.timeout !== void 0 && config.timeout !== existingBlocker.timeout;
+    if (timeoutChanged) {
+      if (existingBlocker.timeoutId) {
+        clearTimeout(existingBlocker.timeoutId);
+      }
+      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);
+            void get().runMiddlewares(
+              createMiddlewareContext("timeout", id, {
+                scope: config.scope ?? existingBlocker.scope,
+                reason: config.reason ?? existingBlocker.reason,
+                priority: config.priority ?? existingBlocker.priority,
+                timeout: newTimeout
+              })
+            );
+            get().removeBlocker(id);
+          }
+        }, newTimeout);
+      } else {
+        timeoutId = void 0;
+      }
+    }
+    const updatedBlocker = {
+      ...existingBlocker,
+      scope: config.scope ?? existingBlocker.scope,
+      reason: config.reason ?? existingBlocker.reason,
+      priority: normalizePriority(config.priority, existingBlocker.priority),
+      timestamp: config.timestamp ?? existingBlocker.timestamp,
+      timeout: config.timeout ?? existingBlocker.timeout,
+      timeoutId,
+      onTimeout: config.onTimeout ?? existingBlocker.onTimeout
+    };
+    set((state) => {
+      const newBlockers = new Map(state.activeBlockers);
+      newBlockers.set(id, updatedBlocker);
+      return { activeBlockers: newBlockers };
     });
+    void get().runMiddlewares(
+      createMiddlewareContext(
+        "update",
+        id,
+        {
+          scope: updatedBlocker.scope,
+          reason: updatedBlocker.reason,
+          priority: updatedBlocker.priority,
+          timeout: updatedBlocker.timeout,
+          onTimeout: updatedBlocker.onTimeout,
+          timestamp: updatedBlocker.timestamp
+        },
+        {
+          scope: existingBlocker.scope,
+          reason: existingBlocker.reason,
+          priority: existingBlocker.priority,
+          timeout: existingBlocker.timeout,
+          onTimeout: existingBlocker.onTimeout,
+          timestamp: existingBlocker.timestamp
+        }
+      )
+    );
   },
   /**
    * Remove a blocker from the store
@@ -133,13 +209,7 @@ var createUIBlockingActions = (set, get) => ({
       return { activeBlockers: newBlockers };
     });
     if (prevBlocker) {
-      void get().runMiddlewares({
-        action: "remove",
-        blockerId: id,
-        config: prevBlocker,
-        timestamp: Date.now(),
-        prevState: prevBlocker
-      });
+      void get().runMiddlewares(createMiddlewareContext("remove", id, prevBlocker, prevBlocker));
     }
   },
   /**
@@ -186,12 +256,21 @@ var createUIBlockingActions = (set, get) => ({
    */
   clearAllBlockers: () => {
     const { activeBlockers } = get();
+    const count = activeBlockers.size;
     for (const [, blocker] of activeBlockers) {
       if (blocker.timeoutId) {
         clearTimeout(blocker.timeoutId);
       }
     }
     set({ activeBlockers: /* @__PURE__ */ new Map() });
+    if (count > 0) {
+      void get().runMiddlewares({
+        action: "clear",
+        blockerId: "*",
+        timestamp: Date.now(),
+        count
+      });
+    }
   },
   /**
    * Clear all blockers for a specific scope
@@ -201,10 +280,14 @@ var createUIBlockingActions = (set, get) => ({
    */
   clearBlockersForScope: (scope) => {
     const { activeBlockers } = get();
+    let count = 0;
     for (const [, blocker] of activeBlockers) {
       const blockerScopes = normalizeScopeToArray(blocker.scope);
-      if (blockerScopes.includes(scope) && blocker.timeoutId) {
-        clearTimeout(blocker.timeoutId);
+      if (blockerScopes.includes(scope)) {
+        if (blocker.timeoutId) {
+          clearTimeout(blocker.timeoutId);
+        }
+        count++;
       }
     }
     set((state) => {
@@ -217,46 +300,44 @@ var createUIBlockingActions = (set, get) => ({
       }
       return { activeBlockers: newBlockers };
     });
+    if (count > 0) {
+      void get().runMiddlewares({
+        action: "clear_scope",
+        blockerId: "*",
+        timestamp: Date.now(),
+        scope,
+        count
+      });
+    }
   }
 });
-var UIBlockingContext = createContext(null);
+var {
+  Provider: BaseUIBlockingProvider,
+  useContext: useUIBlockingContext,
+  useContextStore: useUIBlockingStoreFromContext,
+  useIsInsideProvider: useIsInsideUIBlockingProvider,
+  useOptionalContext
+} = createStoreProvider(createUIBlockingActions, "UIBlocking");
 function UIBlockingProvider({
   children,
   enableDevtools = process.env.NODE_ENV === "development",
   devtoolsName = "UIBlocking",
   middlewares = []
 }) {
-  const middlewaresRef = useRef(middlewares);
-  const store = useMemo(() => {
-    const baseStore = enableDevtools ? createStore(
-      devtools(createUIBlockingActions, {
-        name: devtoolsName,
-        enabled: enableDevtools
-      })
-    ) : createStore(createUIBlockingActions);
-    middlewaresRef.current.forEach((mw, index) => {
-      baseStore.getState().registerMiddleware(`provider-middleware-${index.toString()}`, mw);
+  const handleStoreCreate = (store) => {
+    middlewares.forEach((mw, index) => {
+      store.getState().registerMiddleware(`provider-middleware-${index.toString()}`, mw);
     });
-    return baseStore;
-  }, [enableDevtools, devtoolsName]);
-  return /* @__PURE__ */ jsx(UIBlockingContext.Provider, { value: store, children });
-}
-function useUIBlockingContext() {
-  const store = useContext(UIBlockingContext);
-  if (!store) {
-    throw new Error(
-      "useUIBlockingContext must be used within UIBlockingProvider. Either wrap your app in <UIBlockingProvider> or use the global store via useUIBlockingStore."
-    );
-  }
-  return store;
-}
-function useIsInsideUIBlockingProvider() {
-  const store = useContext(UIBlockingContext);
-  return store !== null;
-}
-function useUIBlockingStoreFromContext(selector) {
-  const store = useUIBlockingContext();
-  return useStore(store, useShallow(selector));
+  };
+  return /* @__PURE__ */ jsx(
+    BaseUIBlockingProvider,
+    {
+      enableDevtools,
+      devtoolsName,
+      onStoreCreate: handleStoreCreate,
+      children
+    }
+  );
 }
 
 // src/store/uiBlockingStore.config.ts
@@ -269,8 +350,11 @@ var devtoolsConfig = {
 var { useStore: useUIBlockingStore, useStoreApi: uiBlockingStoreApi } = createShallowStore(devtools(createUIBlockingActions, devtoolsConfig));
 
 // src/context/useResolvedStore.ts
+function useOptionalContextStore() {
+  return useOptionalContext();
+}
 function useResolvedStore() {
-  const contextStore = useContext(UIBlockingContext);
+  const contextStore = useOptionalContextStore();
   return contextStore ?? uiBlockingStoreApi;
 }
 function useResolvedStoreWithSelector(selector) {
@@ -284,9 +368,11 @@ var useAsyncAction = (actionId, scope, options) => {
     addBlocker: state.addBlocker,
     removeBlocker: state.removeBlocker
   }));
+  const counterRef = useRef(0);
   const executeWithBlocking = useCallback(
     async (asyncFn) => {
-      const blockerId = `${actionId}-${Date.now().toString()}`;
+      counterRef.current += 1;
+      const blockerId = `${actionId}-${String(counterRef.current)}`;
       try {
         addBlocker(blockerId, {
           scope,
@@ -621,14 +707,16 @@ var getActionEmoji = (action) => {
   switch (action) {
     case "add":
       return "\u2795";
-    case "remove":
-      return "\u2796";
     case "update":
       return "\u{1F504}";
-    case "cancel":
-      return "\u274C";
+    case "remove":
+      return "\u2796";
     case "timeout":
       return "\u23F1\uFE0F";
+    case "clear":
+      return "\u{1F9F9}";
+    case "clear_scope":
+      return "\u{1F3AF}";
     default:
       return "\u2753";
   }
@@ -649,13 +737,23 @@ var extractConfigDetails = (config) => {
 };
 var formatLogData = (context) => {
   const configDetails = extractConfigDetails(context.config);
+  const logData = {};
+  if (context.scope !== void 0) {
+    logData.scope = context.scope;
+  }
+  if (context.count !== void 0) {
+    logData.count = context.count;
+  }
+  if (Object.keys(configDetails).length > 0) {
+    logData.config = configDetails;
+  }
   if (context.prevState) {
-    return {
-      config: configDetails,
-      prevState: extractConfigDetails(context.prevState)
-    };
+    logData.prevState = extractConfigDetails(context.prevState);
+  }
+  if (Object.keys(logData).length === 0) {
+    return configDetails;
   }
-  return configDetails;
+  return Object.keys(logData).length === 1 && logData.config ? configDetails : logData;
 };
 
 // src/middleware/loggerMiddleware.ts