synapse-storage 3.0.7 → 3.0.8

package/dist/react.js

@@ -1,2 +1,238 @@
-export * from "./hooks";
-export * from "./utils";
+// src/react/hooks/useSelector.ts
+import { useEffect, useRef, useState } from "react";
+var SELECTOR_REGISTRY = /* @__PURE__ */ new Map();
+function useSelector(selector, options) {
+  const [state, setState] = useState(options?.initialValue);
+  const [isLoading, setIsLoading] = useState(!!options?.withLoading);
+  const prevValueRef = useRef(options?.initialValue);
+  const equalsRef = useRef(options?.equals || ((a, b) => a === b));
+  const selectorId = selector.getId();
+  const updateComponentState = (newValue) => {
+    if (prevValueRef.current === void 0 || !equalsRef.current(newValue, prevValueRef.current)) {
+      prevValueRef.current = newValue;
+      setState(newValue);
+    }
+  };
+  useEffect(() => {
+    if (!SELECTOR_REGISTRY.has(selectorId)) {
+      SELECTOR_REGISTRY.set(selectorId, {
+        lastValue: void 0,
+        listeners: /* @__PURE__ */ new Set(),
+        unsubscribe: null
+      });
+    }
+    const registry = SELECTOR_REGISTRY.get(selectorId);
+    registry.listeners.add(updateComponentState);
+    if (registry.lastValue !== void 0) {
+      updateComponentState(registry.lastValue);
+      if (options?.withLoading) {
+        setIsLoading(false);
+      }
+    } else {
+      if (options?.withLoading) setIsLoading(true);
+      selector.select().then((initialValue) => {
+        registry.lastValue = initialValue;
+        registry.listeners.forEach((listener) => listener(initialValue));
+        if (options?.withLoading) setIsLoading(false);
+      }).catch((error) => {
+        console.error(`useSelector: \u041E\u0448\u0438\u0431\u043A\u0430 \u043F\u0440\u0438 \u043F\u043E\u043B\u0443\u0447\u0435\u043D\u0438\u0438 \u043D\u0430\u0447\u0430\u043B\u044C\u043D\u043E\u0433\u043E \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u044F \u0434\u043B\u044F ${selectorId}`, error);
+        if (options?.withLoading) setIsLoading(false);
+      });
+    }
+    if (!registry.unsubscribe) {
+      registry.unsubscribe = selector.subscribe({
+        notify: (newValue) => {
+          registry.lastValue = newValue;
+          registry.listeners.forEach((listener) => {
+            try {
+              listener(newValue);
+            } catch (error) {
+              console.error(`useSelector: \u041E\u0448\u0438\u0431\u043A\u0430 \u043F\u0440\u0438 \u0443\u0432\u0435\u0434\u043E\u043C\u043B\u0435\u043D\u0438\u0438 \u0441\u043B\u0443\u0448\u0430\u0442\u0435\u043B\u044F \u0434\u043B\u044F ${selectorId}`, error);
+            }
+          });
+        }
+      });
+    }
+    return () => {
+      const registry2 = SELECTOR_REGISTRY.get(selectorId);
+      if (registry2) {
+        registry2.listeners.delete(updateComponentState);
+        if (registry2.listeners.size === 0) {
+          if (registry2.unsubscribe) {
+            registry2.unsubscribe();
+          }
+          SELECTOR_REGISTRY.delete(selectorId);
+        }
+      }
+    };
+  }, [selector, selectorId]);
+  if (options?.withLoading) {
+    return { data: state, isLoading };
+  }
+  return state;
+}
+
+// src/react/hooks/useStorageSubscribe.ts
+import { useEffect as useEffect2, useState as useState2 } from "react";
+var useStorageSubscribe = (storage, selector) => {
+  const [value, setValue] = useState2(void 0);
+  useEffect2(() => {
+    let isMounted = true;
+    const initializeValue = async () => {
+      try {
+        const state = await storage.getState();
+        const selectedValue = selector(state);
+        if (isMounted) {
+          setValue(selectedValue);
+        }
+      } catch (error) {
+        console.error("Failed to initialize storage value:", error);
+      }
+    };
+    initializeValue();
+    let unsubscribe;
+    try {
+      unsubscribe = storage.subscribe(selector, (newValue) => {
+        if (isMounted) {
+          setValue(newValue);
+        }
+      });
+    } catch (error) {
+      console.error("Failed to subscribe to storage:", error);
+      unsubscribe = () => {
+      };
+    }
+    return () => {
+      isMounted = false;
+      unsubscribe();
+    };
+  }, [storage, selector]);
+  return value;
+};
+
+// src/react/utils/createSynapseCtx.tsx
+import { createContext, useContext, useEffect as useEffect3, useRef as useRef2, useState as useState3 } from "react";
+
+// src/_utils/deepMerge.util.ts
+var deepMerge = (target, source) => {
+  for (const key in source) {
+    if (Object.prototype.hasOwnProperty.call(source, key)) {
+      if (typeof source[key] === "object" && source[key] !== null && !Array.isArray(source[key])) {
+        if (!target[key] || typeof target[key] !== "object") {
+          target[key] = {};
+        }
+        deepMerge(target[key], source[key]);
+      } else {
+        target[key] = source[key];
+      }
+    }
+  }
+};
+
+// src/react/utils/createSynapseCtx.tsx
+import { jsx } from "react/jsx-runtime";
+var ERROR_HOOK_MESSAGE = "useSynapseActions \u043D\u0435\u043E\u0431\u0445\u043E\u0434\u0438\u043C\u043E \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u044C \u0432\u043D\u0443\u0442\u0440\u0438 \u043A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442\u0430 contextSynapse";
+var ERROR_CONTEXT_INIT = "\u041E\u0448\u0438\u0431\u043A\u0430 \u043F\u0440\u0438 \u0438\u043D\u0438\u0446\u0438\u0430\u043B\u0438\u0437\u0430\u0446\u0438\u0438 \u043A\u043E\u043D\u0442\u0435\u043A\u0441\u0442\u0430:";
+function createSynapseCtx(synapseStorePromise, options) {
+  const { loadingComponent = null, mergeFn = deepMerge } = options || {};
+  let synapseStore = null;
+  let storeReady = false;
+  const initPromise = (async () => {
+    try {
+      synapseStore = await (synapseStorePromise instanceof Promise ? synapseStorePromise : Promise.resolve(synapseStorePromise));
+      storeReady = true;
+    } catch (error) {
+      console.error("\u041E\u0448\u0438\u0431\u043A\u0430 \u0438\u043D\u0438\u0446\u0438\u0430\u043B\u0438\u0437\u0430\u0446\u0438\u0438 \u0445\u0440\u0430\u043D\u0438\u043B\u0438\u0449\u0430 Synapse:", error);
+    }
+  })();
+  const SynapseContext = createContext(null);
+  const useSynapseStorage = () => {
+    const context = useContext(SynapseContext);
+    if (!context) throw new Error(ERROR_HOOK_MESSAGE);
+    return context.storage;
+  };
+  const useSynapseSelectors = () => {
+    const context = useContext(SynapseContext);
+    if (!context) throw new Error(ERROR_HOOK_MESSAGE);
+    return context.selectors;
+  };
+  const useSynapseActions = () => {
+    const context = useContext(SynapseContext);
+    if (!context) throw new Error(ERROR_HOOK_MESSAGE);
+    if ("actions" in context) {
+      return context.actions;
+    }
+    throw new Error("useSynapseActions: actions \u043D\u0435\u0434\u043E\u0441\u0442\u0443\u043F\u043D\u044B \u0434\u043B\u044F \u044D\u0442\u043E\u0433\u043E \u0442\u0438\u043F\u0430 \u0445\u0440\u0430\u043D\u0438\u043B\u0438\u0449\u0430. \u0423\u0431\u0435\u0434\u0438\u0442\u0435\u0441\u044C, \u0447\u0442\u043E \u043F\u0435\u0440\u0435\u0434\u0430\u043D\u0430 \u0444\u0443\u043D\u043A\u0446\u0438\u044F createDispatcherFn \u043F\u0440\u0438 \u0441\u043E\u0437\u0434\u0430\u043D\u0438\u0438 \u0445\u0440\u0430\u043D\u0438\u043B\u0438\u0449\u0430.");
+  };
+  const useSynapseState$ = () => {
+    const context = useContext(SynapseContext);
+    if (!context) throw new Error(ERROR_HOOK_MESSAGE);
+    if ("state$" in context) {
+      return context.state$;
+    }
+    throw new Error("useSynapseState$: state$ \u043D\u0435\u0434\u043E\u0441\u0442\u0443\u043F\u0435\u043D \u0434\u043B\u044F \u044D\u0442\u043E\u0433\u043E \u0442\u0438\u043F\u0430 \u0445\u0440\u0430\u043D\u0438\u043B\u0438\u0449\u0430. \u0423\u0431\u0435\u0434\u0438\u0442\u0435\u0441\u044C, \u0447\u0442\u043E \u043F\u0435\u0440\u0435\u0434\u0430\u043D\u044B \u0444\u0443\u043D\u043A\u0446\u0438\u0438 createDispatcherFn \u0438 createEffectConfig \u043F\u0440\u0438 \u0441\u043E\u0437\u0434\u0430\u043D\u0438\u0438 \u0445\u0440\u0430\u043D\u0438\u043B\u0438\u0449\u0430.");
+  };
+  function contextSynapse(Component) {
+    function WrappedComponent({ contextProps, ...props }) {
+      const [initialized, setInitialized] = useState3(false);
+      const [storeInitialized, setStoreInitialized] = useState3(storeReady);
+      const debugIdRef = useRef2(`synapse-${synapseStore?.storage.name || "initializing"}`);
+      useEffect3(() => {
+        if (!storeReady) {
+          initPromise.then(() => {
+            setStoreInitialized(true);
+          });
+        }
+      }, []);
+      useEffect3(() => {
+        if (!storeInitialized) return;
+        let mounted = true;
+        const initializeContext = async () => {
+          try {
+            if (synapseStore && contextProps && Object.keys(contextProps).length > 0) {
+              await synapseStore.storage.update((state) => {
+                mergeFn(state, contextProps);
+              });
+            }
+            if (mounted) {
+              setInitialized(true);
+            }
+          } catch (error) {
+            console.error(`[${debugIdRef.current}] ${ERROR_CONTEXT_INIT}`, error);
+          }
+        };
+        initializeContext();
+        return () => {
+          mounted = false;
+        };
+      }, [contextProps, storeInitialized]);
+      if (!storeInitialized) {
+        return loadingComponent || /* @__PURE__ */ jsx("div", { children: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430 \u0445\u0440\u0430\u043D\u0438\u043B\u0438\u0449\u0430..." });
+      }
+      if (!initialized) {
+        return loadingComponent || /* @__PURE__ */ jsx("div", { children: "\u0418\u043D\u0438\u0446\u0438\u0430\u043B\u0438\u0437\u0430\u0446\u0438\u044F \u043A\u043E\u043D\u0442\u0435\u043A\u0441\u0442\u0430..." });
+      }
+      return /* @__PURE__ */ jsx(SynapseContext.Provider, { value: synapseStore, children: /* @__PURE__ */ jsx(Component, { ...props }) });
+    }
+    const componentName = Component.displayName || Component.name || "Component";
+    WrappedComponent.displayName = `SynapseContext(${componentName})`;
+    return WrappedComponent;
+  }
+  const cleanupSynapse = async () => {
+    await initPromise;
+    return synapseStore?.destroy() || Promise.resolve();
+  };
+  return {
+    contextSynapse,
+    useSynapseStorage,
+    useSynapseSelectors,
+    useSynapseActions,
+    useSynapseState$,
+    cleanupSynapse
+  };
+}
+export {
+  createSynapseCtx,
+  useSelector,
+  useStorageSubscribe
+};