@spoosh/angular 0.1.3 → 0.1.4

package/dist/index.mjs

@@ -32,9 +32,10 @@ function createInjectRead(options) {
     let currentController = null;
     let currentQueryKey = null;
     let currentSubscription = null;
+    let currentResolvedTags = [];
     let prevContext = null;
-    let initialized = false;
     let isMounted = false;
+    const hookId = `angular-${Math.random().toString(36).slice(2)}`;
     const captureSelector = () => {
       const selectorResult = {
         call: null,
@@ -49,6 +50,43 @@ function createInjectRead(options) {
       readFn(selectorProxy);
       return selectorResult;
     };
+    const createController = (capturedCall, resolvedPath, resolvedTags, queryKey) => {
+      if (currentSubscription) {
+        currentSubscription();
+      }
+      const controller = createOperationController({
+        operationType: "read",
+        path: capturedCall.path,
+        method: capturedCall.method,
+        tags: resolvedTags,
+        requestOptions: capturedCall.options,
+        stateManager,
+        eventEmitter,
+        pluginExecutor,
+        hookId,
+        fetchFn: async (fetchOpts) => {
+          let current = api;
+          for (const segment of resolvedPath) {
+            current = current[segment];
+          }
+          const method = current[capturedCall.method];
+          return method(fetchOpts);
+        }
+      });
+      controller.setPluginOptions(pluginOpts);
+      currentSubscription = controller.subscribe(() => {
+        const state = controller.getState();
+        dataSignal.set(state.data);
+        errorSignal.set(state.error);
+        const entry = stateManager.getCache(queryKey);
+        const newMeta = entry?.pluginResult ? Object.fromEntries(entry.pluginResult) : {};
+        metaSignal.set(newMeta);
+      });
+      currentController = controller;
+      currentQueryKey = queryKey;
+      currentResolvedTags = resolvedTags;
+      return controller;
+    };
     const executeWithTracking = async (controller, force = false) => {
       const hasData = dataSignal() !== void 0;
       loadingSignal.set(!hasData);
@@ -72,6 +110,34 @@ function createInjectRead(options) {
         fetchingSignal.set(false);
       }
     };
+    const initialSelectorResult = captureSelector();
+    const initialCapturedCall = initialSelectorResult.call;
+    if (!initialCapturedCall) {
+      throw new Error(
+        "injectRead requires calling an HTTP method ($get). Example: injectRead((api) => api.posts.$get())"
+      );
+    }
+    const initialRequestOptions = initialCapturedCall.options;
+    const initialResolvedPath = resolvePath(
+      initialCapturedCall.path,
+      initialRequestOptions?.params
+    );
+    const initialResolvedTags = resolveTags(
+      { tags, additionalTags },
+      initialResolvedPath
+    );
+    const initialQueryKey = stateManager.createQueryKey({
+      path: initialCapturedCall.path,
+      method: initialCapturedCall.method,
+      options: initialCapturedCall.options
+    });
+    createController(
+      initialCapturedCall,
+      initialResolvedPath,
+      initialResolvedTags,
+      initialQueryKey
+    );
+    loadingSignal.set(false);
     let wasEnabled = false;
     effect(
       () => {
@@ -116,45 +182,20 @@ function createInjectRead(options) {
         const enabledChanged = isEnabled !== wasEnabled;
         wasEnabled = isEnabled;
         if (queryKeyChanged) {
-          if (currentController && initialized) {
+          if (currentController) {
             prevContext = currentController.getContext();
-          }
-          if (currentSubscription) {
-            currentSubscription();
-          }
-          const controller = createOperationController({
-            operationType: "read",
-            path: capturedCall.path,
-            method: capturedCall.method,
-            tags: resolvedTags,
-            requestOptions: capturedCall.options,
-            stateManager,
-            eventEmitter,
-            pluginExecutor,
-            hookId: `angular-${Math.random().toString(36).slice(2)}`,
-            fetchFn: async (fetchOpts) => {
-              let current = api;
-              for (const segment of resolvedPath) {
-                current = current[segment];
-              }
-              const method = current[capturedCall.method];
-              return method(fetchOpts);
+            if (isMounted) {
+              currentController.unmount();
+              isMounted = false;
             }
-          });
-          controller.setPluginOptions(pluginOpts);
-          currentSubscription = controller.subscribe(() => {
-            const state = controller.getState();
-            dataSignal.set(state.data);
-            errorSignal.set(state.error);
-            const entry = stateManager.getCache(queryKey);
-            const newMeta = entry?.pluginResult ? Object.fromEntries(entry.pluginResult) : {};
-            metaSignal.set(newMeta);
-          });
-          currentController = controller;
-          currentQueryKey = queryKey;
-          if (!initialized) {
-            initialized = true;
-          } else if (prevContext) {
+          }
+          const controller = createController(
+            capturedCall,
+            resolvedPath,
+            resolvedTags,
+            queryKey
+          );
+          if (prevContext) {
             controller.update(prevContext);
             prevContext = null;
           }
@@ -197,7 +238,7 @@ function createInjectRead(options) {
           "invalidate",
           (invalidatedTags) => {
             const hasMatch = invalidatedTags.some(
-              (tag) => resolvedTags.includes(tag)
+              (tag) => currentResolvedTags.includes(tag)
             );
             if (hasMatch && currentController) {
               untracked(() => {
@@ -226,6 +267,10 @@ function createInjectRead(options) {
     };
     const refetch = () => {
       if (currentController) {
+        if (!isMounted) {
+          currentController.mount();
+          isMounted = true;
+        }
         return executeWithTracking(currentController, true);
       }
       return Promise.resolve({ data: void 0, error: void 0 });
@@ -258,81 +303,104 @@ function createInjectWrite(options) {
   const { api, stateManager, pluginExecutor, eventEmitter } = options;
   return function injectWrite(writeFn) {
     const destroyRef = inject2(DestroyRef2);
-    const selectorResult = {
-      call: null,
-      selector: null
-    };
-    const selectorProxy = createSelectorProxy2(
-      (result2) => {
-        selectorResult.call = result2.call;
-        selectorResult.selector = result2.selector;
-      }
-    );
-    writeFn(selectorProxy);
-    const selectedEndpoint = selectorResult.selector;
-    if (!selectedEndpoint) {
-      throw new Error(
-        "injectWrite requires selecting an HTTP method ($post, $put, $patch, $delete). Example: injectWrite((api) => api.posts.$post)"
-      );
-    }
-    const queryKey = stateManager.createQueryKey({
-      path: selectedEndpoint.path,
-      method: selectedEndpoint.method,
-      options: void 0
-    });
-    const controller = createOperationController2({
-      operationType: "write",
-      path: selectedEndpoint.path,
-      method: selectedEndpoint.method,
-      tags: [],
-      stateManager,
-      eventEmitter,
-      pluginExecutor,
-      hookId: `angular-${Math.random().toString(36).slice(2)}`,
-      fetchFn: async (fetchOpts) => {
-        const params = fetchOpts?.params;
-        const resolvedPath = resolvePath2(selectedEndpoint.path, params);
-        let current = api;
-        for (const segment of resolvedPath) {
-          current = current[segment];
+    const captureSelector = () => {
+      const selectorResult = {
+        call: null,
+        selector: null
+      };
+      const selectorProxy = createSelectorProxy2(
+        (result2) => {
+          selectorResult.call = result2.call;
+          selectorResult.selector = result2.selector;
         }
-        const method = current[selectedEndpoint.method];
-        return method(fetchOpts);
+      );
+      writeFn(selectorProxy);
+      if (!selectorResult.selector) {
+        throw new Error(
+          "injectWrite requires selecting an HTTP method ($post, $put, $patch, $delete). Example: injectWrite((api) => api.posts.$post)"
+        );
       }
-    });
+      return selectorResult.selector;
+    };
+    const hookId = `angular-${Math.random().toString(36).slice(2)}`;
+    let currentQueryKey = null;
+    let currentController = null;
+    let currentSubscription = null;
     const dataSignal = signal2(void 0);
     const errorSignal = signal2(void 0);
     const loadingSignal = signal2(false);
     const lastTriggerOptionsSignal = signal2(void 0);
     const metaSignal = signal2({});
-    const subscription = controller.subscribe(() => {
-      const state = controller.getState();
-      dataSignal.set(state.data);
-      errorSignal.set(state.error);
-      const entry = stateManager.getCache(queryKey);
-      const newMeta = entry?.pluginResult ? Object.fromEntries(entry.pluginResult) : {};
-      metaSignal.set(newMeta);
-    });
     destroyRef.onDestroy(() => {
-      subscription();
+      if (currentSubscription) {
+        currentSubscription();
+      }
     });
     const reset = () => {
-      stateManager.deleteCache(queryKey);
+      if (currentQueryKey) {
+        stateManager.deleteCache(currentQueryKey);
+      }
+      dataSignal.set(void 0);
       errorSignal.set(void 0);
       loadingSignal.set(false);
     };
     const abort = () => {
-      controller.abort();
+      currentController?.abort();
     };
     const trigger = async (triggerOptions) => {
-      lastTriggerOptionsSignal.set(triggerOptions);
-      loadingSignal.set(true);
+      const selectedEndpoint = captureSelector();
       const params = triggerOptions?.params;
       const resolvedPath = resolvePath2(selectedEndpoint.path, params);
       const tags = resolveTags2(triggerOptions, resolvedPath);
-      controller.setPluginOptions({ ...triggerOptions, tags });
+      const queryKey = stateManager.createQueryKey({
+        path: selectedEndpoint.path,
+        method: selectedEndpoint.method,
+        options: triggerOptions
+      });
+      const needsNewController = !currentController || currentQueryKey !== queryKey;
+      if (needsNewController) {
+        if (currentSubscription) {
+          currentSubscription();
+        }
+        const controller = createOperationController2({
+          operationType: "write",
+          path: selectedEndpoint.path,
+          method: selectedEndpoint.method,
+          tags,
+          stateManager,
+          eventEmitter,
+          pluginExecutor,
+          hookId,
+          fetchFn: async (fetchOpts) => {
+            const fetchParams = fetchOpts?.params;
+            const fetchResolvedPath = resolvePath2(
+              selectedEndpoint.path,
+              fetchParams
+            );
+            let current = api;
+            for (const segment of fetchResolvedPath) {
+              current = current[segment];
+            }
+            const method = current[selectedEndpoint.method];
+            return method(fetchOpts);
+          }
+        });
+        currentSubscription = controller.subscribe(() => {
+          const state = controller.getState();
+          dataSignal.set(state.data);
+          errorSignal.set(state.error);
+          const entry = stateManager.getCache(queryKey);
+          const newMeta = entry?.pluginResult ? Object.fromEntries(entry.pluginResult) : {};
+          metaSignal.set(newMeta);
+        });
+        currentController = controller;
+        currentQueryKey = queryKey;
+      }
+      lastTriggerOptionsSignal.set(triggerOptions);
+      loadingSignal.set(true);
+      currentController.setPluginOptions({ ...triggerOptions, tags });
       try {
-        const response = await controller.execute(triggerOptions, {
+        const response = await currentController.execute(triggerOptions, {
           force: true
         });
         if (response.error) {
@@ -421,70 +489,26 @@ function createInjectInfiniteRead(options) {
       prevPageRequest,
       merger
     };
-    const selectorResult = {
-      call: null,
-      selector: null
-    };
-    const selectorProxy = createSelectorProxy3(
-      (result2) => {
-        selectorResult.call = result2.call;
-        selectorResult.selector = result2.selector;
-      }
-    );
-    readFn(selectorProxy);
-    const capturedCall = selectorResult.call;
-    if (!capturedCall) {
-      throw new Error(
-        "injectInfiniteRead requires calling an HTTP method ($get). Example: injectInfiniteRead((api) => api.posts.$get())"
-      );
-    }
-    const requestOptions = capturedCall.options;
-    const initialRequest = {
-      query: requestOptions?.query,
-      params: requestOptions?.params,
-      body: requestOptions?.body
-    };
-    const baseOptionsForKey = {
-      ...capturedCall.options,
-      query: void 0,
-      params: void 0,
-      body: void 0
-    };
-    const resolvedPath = resolvePath3(capturedCall.path, requestOptions?.params);
-    const resolvedTags = resolveTags3({ tags, additionalTags }, resolvedPath);
-    const controller = createInfiniteReadController({
-      path: capturedCall.path,
-      method: capturedCall.method,
-      tags: resolvedTags,
-      initialRequest,
-      baseOptionsForKey,
-      canFetchNext: (ctx) => callbackRefs.canFetchNext(ctx),
-      canFetchPrev: canFetchPrev ? (ctx) => callbackRefs.canFetchPrev?.(ctx) ?? false : void 0,
-      nextPageRequest: (ctx) => callbackRefs.nextPageRequest(ctx),
-      prevPageRequest: prevPageRequest ? (ctx) => callbackRefs.prevPageRequest?.(ctx) ?? {} : void 0,
-      merger: (responses) => callbackRefs.merger(responses),
-      stateManager,
-      eventEmitter,
-      pluginExecutor,
-      hookId: `angular-${Math.random().toString(36).slice(2)}`,
-      fetchFn: async (opts, abortSignal) => {
-        const fetchPath = resolvePath3(capturedCall.path, opts.params);
-        let current = api;
-        for (const segment of fetchPath) {
-          current = current[segment];
+    const captureSelector = () => {
+      const selectorResult = {
+        call: null,
+        selector: null
+      };
+      const selectorProxy = createSelectorProxy3(
+        (result2) => {
+          selectorResult.call = result2.call;
+          selectorResult.selector = result2.selector;
         }
-        const method = current[capturedCall.method];
-        const fetchOptions = {
-          ...capturedCall.options,
-          query: opts.query,
-          params: opts.params,
-          body: opts.body,
-          signal: abortSignal
-        };
-        return method(fetchOptions);
+      );
+      readFn(selectorProxy);
+      if (!selectorResult.call) {
+        throw new Error(
+          "injectInfiniteRead requires calling an HTTP method ($get). Example: injectInfiniteRead((api) => api.posts.$get())"
+        );
       }
-    });
-    controller.setPluginOptions(pluginOpts);
+      return selectorResult.call;
+    };
+    const hookId = `angular-${Math.random().toString(36).slice(2)}`;
     const dataSignal = signal3(void 0);
     const allResponsesSignal = signal3(void 0);
     const errorSignal = signal3(void 0);
@@ -492,29 +516,18 @@ function createInjectInfiniteRead(options) {
     const canFetchNextSignal = signal3(false);
     const canFetchPrevSignal = signal3(false);
     const metaSignal = signal3({});
-    const queryKey = stateManager.createQueryKey({
-      path: capturedCall.path,
-      method: capturedCall.method,
-      options: baseOptionsForKey
-    });
-    const subscription = controller.subscribe(() => {
-      const state = controller.getState();
-      dataSignal.set(state.data);
-      allResponsesSignal.set(state.allResponses);
-      errorSignal.set(state.error);
-      canFetchNextSignal.set(state.canFetchNext);
-      canFetchPrevSignal.set(state.canFetchPrev);
-      const entry = stateManager.getCache(queryKey);
-      const newMeta = entry?.pluginResult ? Object.fromEntries(entry.pluginResult) : {};
-      metaSignal.set(newMeta);
-    });
     const fetchingNextSignal = signal3(false);
     const fetchingPrevSignal = signal3(false);
+    let currentController = null;
+    let currentQueryKey = null;
+    let currentSubscription = null;
+    let currentResolvedTags = [];
     let prevContext = null;
-    let hasDoneInitialFetch = false;
     let isMounted = false;
+    let unsubInvalidate = null;
     const updateSignalsFromState = () => {
-      const state = controller.getState();
+      if (!currentController) return;
+      const state = currentController.getState();
       dataSignal.set(state.data);
       allResponsesSignal.set(state.allResponses);
       errorSignal.set(state.error);
@@ -522,14 +535,15 @@ function createInjectInfiniteRead(options) {
       canFetchPrevSignal.set(state.canFetchPrev);
     };
     const triggerFetch = () => {
-      const currentState = controller.getState();
+      if (!currentController) return;
+      const currentState = currentController.getState();
       const isFetching = untracked2(
         () => fetchingNextSignal() || fetchingPrevSignal()
       );
       if (currentState.data === void 0 && !isFetching) {
         loadingSignal.set(true);
         fetchingNextSignal.set(true);
-        controller.fetchNext().finally(() => {
+        currentController.fetchNext().finally(() => {
           updateSignalsFromState();
           loadingSignal.set(false);
           fetchingNextSignal.set(false);
@@ -538,92 +552,230 @@ function createInjectInfiniteRead(options) {
         updateSignalsFromState();
       }
     };
-    const unsubInvalidate = eventEmitter.on(
-      "invalidate",
-      (invalidatedTags) => {
-        if (!getEnabled()) return;
-        const hasMatch = invalidatedTags.some(
-          (tag) => resolvedTags.includes(tag)
-        );
-        if (hasMatch) {
-          loadingSignal.set(true);
-          controller.refetch().finally(() => {
-            updateSignalsFromState();
-            loadingSignal.set(false);
-          });
-        }
+    const createController = (capturedCall, resolvedTags, queryKey) => {
+      if (currentSubscription) {
+        currentSubscription();
+      }
+      if (unsubInvalidate) {
+        unsubInvalidate();
       }
+      const requestOptions = capturedCall.options;
+      const baseOptionsForKey = {
+        ...capturedCall.options,
+        query: void 0,
+        params: void 0,
+        body: void 0
+      };
+      const initialRequest = {
+        query: requestOptions?.query,
+        params: requestOptions?.params,
+        body: requestOptions?.body
+      };
+      const controller = createInfiniteReadController({
+        path: capturedCall.path,
+        method: capturedCall.method,
+        tags: resolvedTags,
+        initialRequest,
+        baseOptionsForKey,
+        canFetchNext: (ctx) => callbackRefs.canFetchNext(ctx),
+        canFetchPrev: canFetchPrev ? (ctx) => callbackRefs.canFetchPrev?.(ctx) ?? false : void 0,
+        nextPageRequest: (ctx) => callbackRefs.nextPageRequest(ctx),
+        prevPageRequest: prevPageRequest ? (ctx) => callbackRefs.prevPageRequest?.(ctx) ?? {} : void 0,
+        merger: (responses) => callbackRefs.merger(responses),
+        stateManager,
+        eventEmitter,
+        pluginExecutor,
+        hookId,
+        fetchFn: async (opts, abortSignal) => {
+          const fetchPath = resolvePath3(capturedCall.path, opts.params);
+          let current = api;
+          for (const segment of fetchPath) {
+            current = current[segment];
+          }
+          const method = current[capturedCall.method];
+          const fetchOptions = {
+            ...capturedCall.options,
+            query: opts.query,
+            params: opts.params,
+            body: opts.body,
+            signal: abortSignal
+          };
+          return method(fetchOptions);
+        }
+      });
+      controller.setPluginOptions(pluginOpts);
+      currentSubscription = controller.subscribe(() => {
+        const state = controller.getState();
+        dataSignal.set(state.data);
+        allResponsesSignal.set(state.allResponses);
+        errorSignal.set(state.error);
+        canFetchNextSignal.set(state.canFetchNext);
+        canFetchPrevSignal.set(state.canFetchPrev);
+        const entry = stateManager.getCache(queryKey);
+        const newMeta = entry?.pluginResult ? Object.fromEntries(entry.pluginResult) : {};
+        metaSignal.set(newMeta);
+      });
+      currentController = controller;
+      currentQueryKey = queryKey;
+      currentResolvedTags = resolvedTags;
+      unsubInvalidate = eventEmitter.on(
+        "invalidate",
+        (invalidatedTags) => {
+          if (!getEnabled() || !currentController) return;
+          const hasMatch = invalidatedTags.some(
+            (tag) => currentResolvedTags.includes(tag)
+          );
+          if (hasMatch) {
+            loadingSignal.set(true);
+            currentController.refetch().finally(() => {
+              updateSignalsFromState();
+              loadingSignal.set(false);
+            });
+          }
+        }
+      );
+      return controller;
+    };
+    const initialCapturedCall = captureSelector();
+    const initialRequestOptions = initialCapturedCall.options;
+    const initialResolvedPath = resolvePath3(
+      initialCapturedCall.path,
+      initialRequestOptions?.params
+    );
+    const initialResolvedTags = resolveTags3(
+      { tags, additionalTags },
+      initialResolvedPath
     );
+    const initialBaseOptionsForKey = {
+      ...initialCapturedCall.options,
+      query: void 0,
+      params: void 0,
+      body: void 0
+    };
+    const initialQueryKey = stateManager.createQueryKey({
+      path: initialCapturedCall.path,
+      method: initialCapturedCall.method,
+      options: initialBaseOptionsForKey
+    });
+    createController(initialCapturedCall, initialResolvedTags, initialQueryKey);
     effect3(
       () => {
         const isEnabled = getEnabled();
+        const capturedCall = captureSelector();
+        const requestOptions = capturedCall.options;
+        const resolvedPath = resolvePath3(
+          capturedCall.path,
+          requestOptions?.params
+        );
+        const resolvedTags = resolveTags3(
+          { tags, additionalTags },
+          resolvedPath
+        );
+        const baseOptionsForKey = {
+          ...capturedCall.options,
+          query: void 0,
+          params: void 0,
+          body: void 0
+        };
+        const queryKey = stateManager.createQueryKey({
+          path: capturedCall.path,
+          method: capturedCall.method,
+          options: baseOptionsForKey
+        });
+        const queryKeyChanged = queryKey !== currentQueryKey;
         if (!isEnabled) {
-          if (isMounted) {
-            controller.unmount();
+          if (isMounted && currentController) {
+            currentController.unmount();
             isMounted = false;
           }
+          loadingSignal.set(false);
           return;
         }
-        if (!isMounted) {
+        if (queryKeyChanged) {
+          if (currentController && isMounted) {
+            prevContext = currentController.getContext();
+            currentController.unmount();
+            isMounted = false;
+          }
+          const controller = createController(
+            capturedCall,
+            resolvedTags,
+            queryKey
+          );
+          if (prevContext) {
+            controller.update(prevContext);
+            prevContext = null;
+          }
           controller.mount();
           isMounted = true;
-        }
-        if (!hasDoneInitialFetch) {
-          hasDoneInitialFetch = true;
           untracked2(() => {
             triggerFetch();
           });
-        }
-        if (prevContext) {
+        } else if (!isMounted && currentController) {
+          currentController.mount();
+          isMounted = true;
           untracked2(() => {
-            controller.update(prevContext);
-            prevContext = null;
+            triggerFetch();
           });
         }
       },
       { allowSignalWrites: true }
     );
     destroyRef.onDestroy(() => {
-      unsubInvalidate();
-    });
-    destroyRef.onDestroy(() => {
-      subscription();
-      if (isMounted) {
-        controller.unmount();
+      if (unsubInvalidate) {
+        unsubInvalidate();
+      }
+      if (currentSubscription) {
+        currentSubscription();
+      }
+      if (currentController && isMounted) {
+        currentController.unmount();
       }
     });
     const fetchNext = async () => {
-      if (!getEnabled()) return;
+      if (!currentController) return;
+      if (!isMounted) {
+        currentController.mount();
+        isMounted = true;
+      }
       fetchingNextSignal.set(true);
       try {
-        await controller.fetchNext();
+        await currentController.fetchNext();
         updateSignalsFromState();
       } finally {
         fetchingNextSignal.set(false);
       }
     };
     const fetchPrev = async () => {
-      if (!getEnabled()) return;
+      if (!currentController) return;
+      if (!isMounted) {
+        currentController.mount();
+        isMounted = true;
+      }
       fetchingPrevSignal.set(true);
       try {
-        await controller.fetchPrev();
+        await currentController.fetchPrev();
         updateSignalsFromState();
       } finally {
         fetchingPrevSignal.set(false);
       }
     };
     const refetch = async () => {
-      if (!getEnabled()) return;
+      if (!currentController) return;
+      if (!isMounted) {
+        currentController.mount();
+        isMounted = true;
+      }
       loadingSignal.set(true);
       try {
-        await controller.refetch();
+        await currentController.refetch();
         updateSignalsFromState();
       } finally {
         loadingSignal.set(false);
       }
     };
     const abort = () => {
-      controller.abort();
+      currentController?.abort();
     };
     const fetchingSignal = computed(
       () => fetchingNextSignal() || fetchingPrevSignal()