fix: properly cleanup useQueries* on unmount

With React 18 and strict mode enabled, each component ist rendered twice
This caused the hooks to unsubscribe but not resubscribe.

src/internal/useMultiListen.spec.ts

@@ -104,7 +104,7 @@ describe("changing size", () => {
         ]);
     });
 
-    it("decreate", () => {
+    it("decrease", () => {
         const { result, rerender } = renderHook(({ refs }) => useMultiListen(refs, onChange, isEqual), {
             initialProps: { refs: [refA1, refB1] },
         });
@@ -119,6 +119,7 @@ describe("changing size", () => {
         ]);
 
         rerender({ refs: [refA1] });
+        expect(onChangeUnsubscribe).toHaveBeenCalledTimes(1);
         expect(result.current).toStrictEqual([[result1, false, undefined]]);
 
         act(() => setValue1(result3));
@@ -183,3 +184,11 @@ it("should return emitted error", () => {
         [undefined, false, error2],
     ]);
 });
+
+it("unmount", () => {
+    const { unmount } = renderHook(() => useMultiListen([refA1, refB1], onChange, isEqual));
+
+    unmount();
+
+    expect(onChangeUnsubscribe).toHaveBeenCalledTimes(2);
+});

src/internal/useMultiListen.ts

@@ -50,8 +50,16 @@ export function useMultiListen<Value, Error, Reference>(
         }
     }, [references]);
 
-    // // unsubscribe on unmount
-    useEffect(() => () => subscriptions.current.forEach((unsubscribe) => unsubscribe()), []);
+    // unsubscribe and cleanup on unmount
+    useEffect(
+        () => () => {
+            subscriptions.current.forEach((unsubscribe) => unsubscribe());
+            subscriptions.current = [];
+
+            prevReferences.current = [];
+        },
+        []
+    );
 
     return useMemo(
         () => states.map((state) => [state.value, state.loading, state.error] as ValueHookResult<Value, Error>),