@livequery/react 1.0.105 → 1.0.107

package/build/hooks/useSyncMemo.d.ts

@@ -0,0 +1 @@
+export declare const useSyncMemo: <T>(fn: () => [value: T, cleaner: () => void], deps: any[]) => T;

package/build/hooks/useSyncMemo.js

@@ -0,0 +1,14 @@
+import { useEffect, useRef } from "react";
+export const useSyncMemo = (fn, deps) => {
+    const ref = useRef({ value: undefined, deps: [], n: 0 });
+    const outdated = ref.current.n == 0 || deps.some((e, i) => e != ref.current.deps[i]);
+    const [value, cleaner] = outdated ? fn() : [
+        ref.current.value,
+        () => { }
+    ];
+    ref.current = { deps, value, n: ref.current.n + 1 };
+    useEffect(() => {
+        return cleaner;
+    }, [ref.current.value]);
+    return value;
+};

package/build/useCollectionData.d.ts

@@ -10,4 +10,6 @@ export type CollectionData<T extends LivequeryBaseEntity> = (CollectionStream<T>
     loaded: boolean;
 });
 export type CollectionRef = string | undefined | '' | null | false;
-export declare const useCollectionData: <T extends LivequeryBaseEntity>(ref: CollectionRef, collection_options?: Partial<useCollectionDataOptions<T>>) => CollectionData<T>;
+export declare const useCollectionData: <T extends LivequeryBaseEntity>(ref: CollectionRef, collection_options?: Partial<useCollectionDataOptions<T>> & {
+    vkl?: any;
+}) => CollectionData<T>;

package/build/useCollectionData.js

@@ -1,41 +1,46 @@
 "use client";
-import { useEffect, useRef, useState } from "react";
+import { useRef, useState } from "react";
 import { useLiveQueryContext } from "./LiveQueryContext.js";
 import { CollectionObservable } from "@livequery/client";
 import { Subject } from 'rxjs';
+import { useSyncMemo } from "./hooks/useSyncMemo.js";
 function assert(fn, thiss) {
     return (fn || (() => { })).bind(thiss);
 }
 export const useCollectionData = (ref, collection_options = {}) => {
     const { transporter } = useLiveQueryContext();
-    const [stream, ss] = useState({
+    const n = useRef(0);
+    const lazy = collection_options.lazy;
+    const [stream, set_stream] = useState({
         filters: {},
-        items: [],
         has_more: false,
-        loading: collection_options.lazy ? false : !!ref,
-        error: undefined
+        items: [],
+        loaded: false,
+        n: 0
     });
-    const [n, sn] = useState(0);
-    const collection_ref = useRef();
-    useEffect(() => {
-        if (!ref || typeof window == 'undefined')
-            return;
-        const collection = collection_ref.current = new CollectionObservable(ref, { transporter, ...collection_options });
-        const subscription = collection.subscribe(data => {
-            collection_options.load_all && data.loading == false && data.has_more && collection?.fetch_more();
-            ss(data);
-            sn(Math.random());
+    const DEBUG = ref?.includes('webhooks');
+    const client = useSyncMemo(() => {
+        const client = new CollectionObservable(ref, { transporter, ...collection_options });
+        n.current = 0;
+        const subscription = client.subscribe(data => {
+            if (collection_options.load_all && data.has_more) {
+                client.fetch_more();
+            }
+            else {
+                n.current++;
+                set_stream({ ...data, loaded: true, n: n.current });
+            }
         });
-        !collection_options?.lazy && collection?.fetch_more();
-        return () => subscription.unsubscribe();
-    }, [ref, collection_options?.lazy]);
-    const client = collection_ref.current;
-    const loaded = n > 0;
-    const empty = loaded && !stream.loading && stream.items.length == 0;
+        if (!lazy) {
+            client.fetch_more();
+        }
+        return [client, () => subscription.unsubscribe()];
+    }, [ref]);
+    const empty = !client.value.loading && client.value.items.length == 0 && stream.loaded;
     const result = {
         ...stream,
         error: stream.error,
-        loading: !!stream.loading,
+        loading: !!stream.loading || (!collection_options?.lazy && !!ref && n.current == 0),
         empty,
         add: assert(client?.add, client),
         fetch_more: assert(client?.fetch_more, client),
@@ -45,7 +50,6 @@ export const useCollectionData = (ref, collection_options = {}) => {
         trigger: assert(client?.trigger, client),
         update: assert(client?.update, client),
         $changes: client?.$changes || new Subject(),
-        loaded
     };
     return result;
 };

package/build/useDocumentData.d.ts

@@ -9,6 +9,5 @@ export declare const useDocumentData: <T extends {
     item: import("@livequery/client").SmartQueryItem<T>;
     loading: boolean | undefined;
     error: import("@livequery/types").ErrorInfo | undefined;
-    reload: () => void;
     $changes: import("rxjs").Subject<import("@livequery/types").UpdatedData<T>>;
 };

package/build/useDocumentData.js

@@ -1,12 +1,11 @@
 "use client";
 import { useCollectionData } from "./useCollectionData.js";
 export const useDocumentData = (ref, options) => {
-    const { items, loading, error, reload, $changes } = useCollectionData(ref, options);
+    const { items, loading, error, $changes } = useCollectionData(ref, options);
     return {
         item: items[0],
         loading,
         error,
-        reload,
         $changes
     };
 };

package/package.json

@@ -4,7 +4,7 @@
         "url": "https://github.com/livequery/react"
     },
     "type": "module",
-    "version": "1.0.105",
+    "version": "1.0.107",
     "description": "",
     "main": "build/index.js",
     "types": "build/index.d.ts",