@livequery/react 2.0.7 → 2.0.16

package/build/LiveQueryContext.d.ts

@@ -1,5 +1,9 @@
-import { Transporter } from '@livequery/types';
-export type LiveQueryContextOption = {
-    transporter: Transporter;
+import React, { PropsWithChildren } from 'react';
+import { Transporter, TransporterHook } from '@livequery/types';
+export type LivequeryContext = {
+    transporter?: Transporter;
+    hooks?: TransporterHook[];
 };
-export declare const useLiveQueryContext: () => LiveQueryContextOption, LiveQueryContextProvider: ({ children, ...props }: import("react").PropsWithChildren<LiveQueryContextOption>) => import("react").JSX.Element;
+export declare function mergeTransporterHooks(...hooks: TransporterHook[]): TransporterHook;
+export declare const useLivequeryContext: () => LivequeryContext;
+export declare const LiveQueryContextProvider: (props: PropsWithChildren<LivequeryContext>) => React.JSX.Element;

package/build/LiveQueryContext.js

@@ -1,3 +1,15 @@
 "use client";
-import { createContextFromHook } from './hooks/createContextFromHook.js';
-export const [useLiveQueryContext, LiveQueryContextProvider] = createContextFromHook((props) => props);
+import React from 'react';
+import { createContext, useContext } from "react";
+import { pipe } from 'rxjs';
+export function mergeTransporterHooks(...hooks) {
+    return hooks.reduce((p, c) => (next) => p(() => c(next)), (next) => pipe(next()));
+}
+const LivequeryContext = createContext({});
+export const useLivequeryContext = () => useContext(LivequeryContext);
+export const LiveQueryContextProvider = (props) => {
+    const ctx = useLivequeryContext();
+    const merged = mergeTransporterHooks(...props.hooks || []);
+    const transporter = ctx.transporter ? ctx.transporter.hook(merged) : props.transporter?.hook(merged);
+    return (React.createElement(LivequeryContext.Provider, { value: { transporter } }, props.children));
+};

package/build/tsconfig.tsbuildinfo

@@ -1 +1 @@
-{"root":["../src/index.ts","../src/livequerycontext.tsx","../src/usecollectiondata.ts","../src/usedocumentdata.ts","../src/usemonitor.ts","../src/hooks/createcontextfromhook.tsx","../src/hooks/createstaticcontext.tsx","../src/hooks/usesyncmemo.ts"],"version":"5.6.3"}
+{"root":["../src/index.ts","../src/livequerycontext.tsx","../src/usecollectiondata.ts","../src/usedocumentdata.ts","../src/usemonitor.ts","../src/hooks/createcontextfromhook.tsx","../src/hooks/createstaticcontext.tsx"],"version":"5.6.3"}

package/build/useCollectionData.d.ts

@@ -11,6 +11,7 @@ export type CollectionData<T extends LivequeryBaseEntity> = (CollectionStream<T>
     ref: CollectionRef;
     filters: CollectionStream<T>['options'];
 });
+export declare const CollectionMap: Map<string, CollectionData<any>>;
 export declare const useCollectionData: <T extends LivequeryBaseEntity>(ref: CollectionRef, collection_options?: Partial<useCollectionDataOptions<T>>) => CollectionStream<T> & Pick<CollectionObservable<T>, "add" | "reset" | "filter" | "update" | "fetch_more" | "fetch_prev" | "trigger" | "$changes"> & {
     empty: boolean;
     ref: CollectionRef;

package/build/useCollectionData.js

@@ -1,14 +1,20 @@
 "use client";
 import { useEffect, useMemo, useState } from "react";
-import { useLiveQueryContext } from "./LiveQueryContext.js";
+import { useLivequeryContext } from "./LiveQueryContext.js";
 import { CollectionObservable } from "@livequery/client";
 import { Subject } from 'rxjs';
 function assert(fn, thiss) {
     return (fn || (() => { })).bind(thiss);
 }
+export const CollectionMap = new Map();
 export const useCollectionData = (ref, collection_options = {}) => {
-    const { transporter } = useLiveQueryContext();
-    const client = useMemo(() => new CollectionObservable(ref, { transporter, ...collection_options }), [ref]);
+    const { transporter } = useLivequeryContext();
+    if (!transporter)
+        throw 'MISSING_LIVEQUERY_TRANSPORTER';
+    const client = useMemo(() => new CollectionObservable(ref, {
+        ...collection_options,
+        transporter
+    }), [ref]);
     const [$, set_$] = useState(client.getValue());
     const [state, set_state] = useState(0);
     // Sync stream effect
@@ -45,5 +51,9 @@ export const useCollectionData = (ref, collection_options = {}) => {
         $changes: client?.$changes || new Subject(),
         ref
     };
+    useEffect(() => {
+        ref && CollectionMap.set(ref, result);
+        return () => { ref && CollectionMap.delete(ref); };
+    }, [client]);
     return result;
 };

package/build/useDocumentData.d.ts

@@ -1,8 +1,14 @@
 import { useCollectionDataOptions } from "./useCollectionData.js";
 import { LivequeryBaseEntity } from "@livequery/types";
+import { SmartQueryItem } from "@livequery/client";
 export type useDocumentDataOptions<T extends LivequeryBaseEntity = LivequeryBaseEntity> = Partial<Omit<useCollectionDataOptions<T>, 'filters'>>;
 export declare const useDocumentData: <T extends LivequeryBaseEntity>(ref: string | undefined | "" | null | false, config?: useDocumentDataOptions<T>) => {
-    item: import("@livequery/client").SmartQueryItem<T>;
+    item: SmartQueryItem<T>;
+    error: null;
+    loading: boolean;
+    $changes: import("rxjs").Subject<import("@livequery/types").UpdatedData<T>>;
+} | {
+    item: SmartQueryItem<T>;
     loading: import("@livequery/client").LoadingIndicator | undefined;
     error: boolean | undefined;
     $changes: import("rxjs").Subject<import("@livequery/types").UpdatedData<T>>;

package/build/useDocumentData.js

@@ -1,7 +1,36 @@
 "use client";
-import { useCollectionData } from "./useCollectionData.js";
+import { useEffect, useState } from "react";
+import { CollectionMap, useCollectionData } from "./useCollectionData.js";
+import { filter, tap } from "rxjs";
 export const useDocumentData = (ref, config = {}) => {
-    const { items, loading, error, $changes } = useCollectionData(ref, config);
+    const [old, set_old] = useState((() => {
+        if (!ref)
+            return;
+        const id = ref.split('/').pop();
+        const collection_ref = ref.split('/').slice(0, -1).join('/');
+        const collection = CollectionMap.get(collection_ref);
+        if (!collection)
+            return;
+        const item = collection.items.find(item => item.id == id);
+        if (!item)
+            return;
+        return { collection, item };
+    })());
+    useEffect(() => {
+        if (!old || !old.item || !ref)
+            return;
+        const s = old.collection.$changes.pipe(filter(id => id.data.id == old.item.id), tap(d => set_old({ ...old, item: { ...old.item, ...d.data } }))).subscribe();
+        return () => s.unsubscribe();
+    }, [ref]);
+    const { items, loading, error, $changes } = useCollectionData(old ? null : ref, config);
+    if (old && old.item) {
+        return {
+            item: old.item,
+            error: null,
+            loading: false,
+            $changes: old.collection.$changes
+        };
+    }
     return {
         item: items[0],
         loading,

package/package.json

@@ -4,7 +4,7 @@
         "url": "https://github.com/livequery/react"
     },
     "type": "module",
-    "version": "2.0.7",
+    "version": "2.0.16",
     "description": "",
     "main": "build/index.js",
     "types": "build/index.d.ts",
@@ -12,11 +12,11 @@
         "build/**/*"
     ],
     "dependencies": {
-        "@livequery/client": "^2.0.7",
+        "@livequery/client": "^2.0.15",
         "rxjs": "^7.8.1"
     },
     "devDependencies": {
-        "@livequery/types": "^2.0.7",
+        "@livequery/types": "^2.0.15",
         "@types/react": "^17.0.11",
         "typescript": "5.6.3"
     },

package/build/hooks/useSyncMemo.d.ts

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

package/build/hooks/useSyncMemo.js

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