@rindle/react 0.1.6 → 0.3.1

package/dist/index.js

@@ -1,12 +1,23 @@
 import { createContext, createElement, useCallback, useContext, useMemo, useRef, useSyncExternalStore, } from "react";
-import { stableKey } from "@rindle/client";
+import { createLocalFragmentRefForTable, fragmentAst, isFragment, isFragmentRelationship, localQueryReadAst, localFragmentReadAst, localRootFragmentRefsAst, queryFromAst, stableKey, tableMeta, } from "@rindle/client";
+export { fragmentKey } from "@rindle/client";
 const EMPTY_ARRAY = Object.freeze([]);
+// Keep just-released coverage alive briefly so a changed filter/limit can re-materialize from the
+// local base synchronously while the replacement server lease is still streaming its first answer.
+const REACT_CACHE_RELEASE_DELAY_MS = 2_000;
+function setReleaseTimeout(fn, ms) {
+    const timer = setTimeout(fn, ms);
+    timer.unref?.();
+    return timer;
+}
 class RindleContextValue {
     store;
     cache;
+    syncCache;
     constructor(store) {
         this.store = store;
-        this.cache = new QueryCache(store);
+        this.cache = new QueryCache(store, { releaseDelayMs: REACT_CACHE_RELEASE_DELAY_MS });
+        this.syncCache = new SyncQueryCache(store, { releaseDelayMs: REACT_CACHE_RELEASE_DELAY_MS });
     }
 }
 const RindleContext = createContext(null);
@@ -62,31 +73,490 @@ export function useQueryStatus(query) {
     const getServerSnapshot = useCallback(() => ctx.cache.serverResultType(descriptor.viewKey), [ctx.cache, descriptor.viewKey]);
     return useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
 }
+/** Retain a named server query for normalized/local-first sync coverage without subscribing React
+ *  to that query's broad result tree. The returned value is lifecycle state only; it is `unknown`
+ *  until the backend reports that the retained coverage has hydrated. */
+export function useSyncQuery(query) {
+    const ctx = useRindleContext();
+    const descriptor = useMemo(() => describeQuery(query), [query]);
+    const queryRef = useRef(query);
+    queryRef.current = query;
+    const subscribe = useCallback((onStoreChange) => {
+        const lease = ctx.syncCache.retain(descriptor.leaseKey, queryRef.current);
+        const unsubscribe = ctx.syncCache.subscribe(descriptor.leaseKey, onStoreChange);
+        return () => {
+            unsubscribe();
+            ctx.syncCache.release(lease);
+        };
+    }, [ctx.syncCache, descriptor.leaseKey]);
+    const getSnapshot = useCallback(() => {
+        const live = ctx.syncCache.resultType(descriptor.leaseKey);
+        return live === "unknown" && ctx.cache.serverResultType(descriptor.viewKey) === "complete" ? "complete" : live;
+    }, [ctx.cache, ctx.syncCache, descriptor.leaseKey, descriptor.viewKey]);
+    const getServerSnapshot = useCallback(() => ctx.cache.serverResultType(descriptor.viewKey), [ctx.cache, descriptor.viewKey]);
+    return useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+}
+export function useRoot(queryOrNamed, ...args) {
+    const { query, fragment } = resolveRootQueryInput(queryOrNamed, args, "useRoot");
+    const stableQuery = useStableQuery(query);
+    const status = useSyncQuery(stableQuery);
+    const data = fragment === undefined
+        ? useLocalRootQueryData(stableQuery)
+        : useRootRefData(stableQuery, fragment);
+    const details = useMemo(() => ({ status }), [status]);
+    return useMemo(() => [data, details], [data, details]);
+}
+function resolveRootQueryInput(queryOrNamed, args, hookName) {
+    const last = args[args.length - 1];
+    const fragment = isFragment(last) ? last : undefined;
+    const queryArgs = fragment === undefined ? args : args.slice(0, -1);
+    if (isNamedQuery(queryOrNamed)) {
+        const query = queryArgs.length === 0
+            ? queryOrNamed()
+            : queryOrNamed(queryArgs[0], ...queryArgs.slice(1));
+        return { query, fragment };
+    }
+    if (queryArgs.length !== 0)
+        throw new Error(`${hookName}(): expected (query) or (query, fragment).`);
+    return { query: queryOrNamed, fragment };
+}
+function isNamedQuery(v) {
+    return typeof v === "function"
+        && typeof v.queryName === "string"
+        && typeof v.resolve === "function";
+}
+function useStableQuery(query) {
+    const descriptor = describeQuery(query);
+    const ref = useRef(undefined);
+    if (ref.current === undefined || ref.current.leaseKey !== descriptor.leaseKey) {
+        ref.current = { leaseKey: descriptor.leaseKey, query };
+    }
+    return ref.current.query;
+}
+function useLocalRootQueryData(query) {
+    const ctx = useRindleContext();
+    const descriptor = useMemo(() => describeQuery(query), [query]);
+    const ast = useMemo(() => localQueryReadAst(query, (table) => ctx.store.primaryKeyFor(table)), [ctx.store, query]);
+    const localQuery = useMemo(() => queryFromAst(ast), [ast]);
+    const localDescriptor = useMemo(() => describeQuery(localQuery), [localQuery]);
+    const projection = useMemo(() => new LocalFragmentProjection(ast, { key: descriptor.leaseKey, query }, (table) => ctx.store.primaryKeyFor(table)), [ctx.store, ast, descriptor.leaseKey, query]);
+    const subscribe = useCallback((onStoreChange) => {
+        const localLease = ctx.cache.retain(localDescriptor.viewKey, localQuery);
+        const unsubscribeLocal = ctx.cache.subscribe(localDescriptor.viewKey, onStoreChange);
+        return () => {
+            unsubscribeLocal();
+            ctx.cache.release(localLease);
+        };
+    }, [ctx.cache, localDescriptor.viewKey, localQuery]);
+    // Stale-while-revalidate: render whatever the local IVM view already holds (synced rows,
+    // optimistic writes, partially-covered rows) rather than blanking to empty until the server
+    // confirms coverage. `status` (from useSyncQuery) stays a SEPARATE signal callers can gate on;
+    // the data itself never waits on the round-trip, so navigating to a view that's locally warm
+    // shows rows immediately instead of flashing a loading state. (Eviction-on-release still drops
+    // a cold view; a release TTL to keep views warm across nav is future work.)
+    const getSnapshot = useCallback(() => {
+        if (ctx.cache.serverResultType(descriptor.viewKey) === "complete") {
+            return projectLocalRootSnapshot(ctx.cache.serverSnapshot(descriptor.viewKey, descriptor.one), descriptor.one, projection);
+        }
+        return projectLocalRootSnapshot(ctx.cache.snapshot(localDescriptor.viewKey, descriptor.one), descriptor.one, projection);
+    }, [ctx.cache, descriptor.one, descriptor.viewKey, localDescriptor.viewKey, projection]);
+    const getServerSnapshot = useCallback(() => projectLocalRootSnapshot(ctx.cache.serverSnapshot(descriptor.viewKey, descriptor.one), descriptor.one, projection), [ctx.cache, descriptor.one, descriptor.viewKey, projection]);
+    return useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+}
+function useRootRefData(query, fragment) {
+    const ctx = useRindleContext();
+    const descriptor = useMemo(() => describeQuery(query), [query]);
+    const ast = useMemo(() => localRootFragmentRefsAst(fragment, query, (table) => ctx.store.primaryKeyFor(table)), [ctx.store, fragment, query]);
+    const localQuery = useMemo(() => queryFromAst(ast), [ast]);
+    const localDescriptor = useMemo(() => describeQuery(localQuery), [localQuery]);
+    const projection = useMemo(() => new RootRefProjection(fragment, { key: descriptor.leaseKey, query }, (table) => ctx.store.primaryKeyFor(table)), [ctx.store, descriptor.leaseKey, fragment, query]);
+    const subscribe = useCallback((onStoreChange) => {
+        const localLease = ctx.cache.retain(localDescriptor.viewKey, localQuery);
+        const unsubscribeLocal = ctx.cache.subscribe(localDescriptor.viewKey, onStoreChange);
+        return () => {
+            unsubscribeLocal();
+            ctx.cache.release(localLease);
+        };
+    }, [ctx.cache, localDescriptor.viewKey, localQuery]);
+    // Stale-while-revalidate (see useLocalRootQueryData): the root rows render from the live local
+    // view as soon as it holds anything; `status` is the separate axis for "server-authoritative yet".
+    const getSnapshot = useCallback(() => {
+        if (ctx.cache.serverResultType(descriptor.viewKey) === "complete") {
+            return projectRootRefSnapshot(ctx.cache.serverSnapshot(descriptor.viewKey, descriptor.one), descriptor.one, projection);
+        }
+        const raw = ctx.cache.snapshot(localDescriptor.viewKey, descriptor.one);
+        return descriptor.one ? projection.projectOne(raw) : projection.projectMany(raw);
+    }, [ctx.cache, descriptor.one, descriptor.viewKey, localDescriptor.viewKey, projection]);
+    const getServerSnapshot = useCallback(() => projectRootRefSnapshot(ctx.cache.serverSnapshot(descriptor.viewKey, descriptor.one), descriptor.one, projection), [ctx.cache, descriptor.one, descriptor.viewKey, projection]);
+    return useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+}
 /**
- * Read a {@link Fragment}'s slice off the shared root view (FRAGMENT-COMPOSITION-DESIGN.md §7).
+ * Read a {@link Fragment}'s local data from an opaque ref.
  *
- * The waterfall-free contract: the ROOT component `useQuery`s the composed query (every child
- * fragment spread into it), and every descendant calls `useFragment` — a PURE READ of the
- * already-projected node at this fragment's alias — instead of opening its own `useQuery`. So a
- * whole component tree resolves through the ONE query the root opened, with no request waterfall;
- * a descendant that opens its own `useQuery` reintroduces the waterfall at that boundary.
+ * The query boundary calls {@link useRoot} with a fragment argument to retain the full named
+ * coverage query and receive root refs. Descendants call `useFragment` with those refs (or child
+ * refs returned by a parent fragment read) to open narrow local-only reads for the fields their
+ * fragment owns.
  *
- * Phase 0 is a typed pass-through: `ref` already IS the projected node (the parent got it from
- * `useQuery` and handed the slice down), so this returns it typed as the fragment's
- * {@link FragmentRef}. `fragment` declares *which* selection this component reads (co-location +
- * the seam masking plugs into); masking (Phase 2) narrows the returned shape with no call-site
- * change. Not a subscription — it adds no lease and never re-renders on its own.
+ * `ref` is an opaque token created by {@link useRoot} or returned from another local fragment read.
+ * The hook opens a narrow local-only query for this exact fragment and keeps the root coverage
+ * lease retained while mounted. Passing a legacy projected data object is unsupported.
  */
 export function useFragment(fragment, ref) {
-    void fragment;
-    return ref;
+    return useLocalFragment(fragment, ref);
+}
+/**
+ * Render-prop sugar over {@link useFragment}: does the `null` check once. `from` is a fragment ref
+ * (or null/undefined — an absent to-one relationship, an emptied `.one()`, or a row deleted out from
+ * under a live read); when the row is present `children(data)` renders, otherwise `fallback` (default
+ * nothing). Keeps the per-row subscription isolation — a child-only edit re-renders just this read.
+ */
+export function Frag({ of, from, fallback = null, children }) {
+    const data = useFragment(of, from);
+    return data == null ? fallback : children(data);
+}
+function useLocalFragment(fragment, ref) {
+    const ctx = useRindleContext();
+    const coverage = ref?.coverage;
+    const coverageDescriptor = useMemo(() => (coverage ? describeQuery(coverage.query) : undefined), [coverage]);
+    const ast = useMemo(() => (ref ? localFragmentReadAst(fragment, ref, (table) => ctx.store.primaryKeyFor(table)) : undefined), [ctx.store, fragment, ref]);
+    const query = useMemo(() => (ast ? queryFromAst(ast) : undefined), [ast]);
+    const descriptor = useMemo(() => (query ? describeQuery(query) : undefined), [query]);
+    const projection = useMemo(() => (coverage ? new LocalFragmentProjection(fragmentAst(fragment), coverage, (table) => ctx.store.primaryKeyFor(table)) : undefined), [ctx.store, coverage, fragment]);
+    const subscribe = useCallback((onStoreChange) => {
+        if (!coverage || !descriptor || !query)
+            return () => { };
+        const syncLease = ctx.syncCache.retain(coverage.key, coverage.query);
+        const localLease = ctx.cache.retain(descriptor.viewKey, query);
+        const unsubscribeSync = ctx.syncCache.subscribe(coverage.key, onStoreChange);
+        const unsubscribeLocal = ctx.cache.subscribe(descriptor.viewKey, onStoreChange);
+        return () => {
+            unsubscribeLocal();
+            unsubscribeSync();
+            ctx.cache.release(localLease);
+            ctx.syncCache.release(syncLease);
+        };
+    }, [ctx.cache, ctx.syncCache, coverage, descriptor, query]);
+    // Stale-while-revalidate (see useLocalRootQueryData): project the fragment's local view as soon
+    // as the row exists locally instead of returning null until its coverage is server-complete —
+    // otherwise every nested fragment (UserBadge, TagChip, CommentCard, …) flashes empty for a
+    // round-trip on each navigation. A field not yet synced simply reads absent, not "loading".
+    const getSnapshot = useCallback(() => {
+        if (!coverage || !descriptor || !projection)
+            return null;
+        if (coverageDescriptor && ctx.cache.serverResultType(coverageDescriptor.viewKey) === "complete") {
+            return projectFragmentSeed(ctx, coverage.query.ast(), coverageDescriptor, ref, projection);
+        }
+        const data = projection.project(ctx.cache.snapshot(descriptor.viewKey, true));
+        return data;
+    }, [ctx, coverage, coverageDescriptor, descriptor, projection, ref]);
+    const getServerSnapshot = useCallback(() => projectFragmentSeed(ctx, coverage?.query.ast(), coverageDescriptor, ref, projection), [ctx, coverage, coverageDescriptor, projection, ref]);
+    return useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+}
+function projectRootRefSnapshot(raw, one, projection) {
+    return one ? projection.projectOne(raw) : projection.projectMany(raw);
+}
+function projectLocalRootSnapshot(raw, one, projection) {
+    return one ? projection.projectOne(raw) : projection.projectMany(raw);
+}
+function projectFragmentSeed(ctx, coverageAst, coverageDescriptor, ref, projection) {
+    if (!coverageAst || !coverageDescriptor || !ref || !projection)
+        return null;
+    const raw = ctx.cache.serverSnapshot(coverageDescriptor.viewKey, coverageDescriptor.one);
+    const row = findFragmentSeedRow(coverageAst, raw, ref.table, ref.pk, (table) => ctx.store.primaryKeyFor(table));
+    return projection.project(row);
+}
+function findFragmentSeedRow(ast, raw, table, pk, primaryKeyFor) {
+    if (Array.isArray(raw)) {
+        for (const row of raw) {
+            const found = findFragmentSeedRowInObject(ast, row, table, pk, primaryKeyFor);
+            if (found !== null)
+                return found;
+        }
+        return null;
+    }
+    return findFragmentSeedRowInObject(ast, raw, table, pk, primaryKeyFor);
+}
+function findFragmentSeedRowInObject(ast, raw, table, pk, primaryKeyFor) {
+    if (raw === null || raw === undefined || typeof raw !== "object")
+        return null;
+    const row = raw;
+    if (ast.table === table && rowMatchesPk(row, pk, primaryKeyFor(table)))
+        return row;
+    for (const rel of ast.related ?? []) {
+        if (rel.subquery.aggregate !== undefined)
+            continue;
+        const alias = rel.subquery.alias;
+        if (alias === undefined)
+            continue;
+        const found = findFragmentSeedRow(rel.subquery, row[alias], table, pk, primaryKeyFor);
+        if (found !== null)
+            return found;
+    }
+    return null;
+}
+function rowMatchesPk(row, pk, primaryKey) {
+    for (const col of primaryKey) {
+        if (!Object.prototype.hasOwnProperty.call(row, col))
+            return false;
+        if (stableKey(row[col]) !== stableKey(pk[col]))
+            return false;
+    }
+    return true;
+}
+class LocalFragmentProjection {
+    manyCache = new WeakMap();
+    cache = new WeakMap();
+    refCache = new Map();
+    ast;
+    coverage;
+    primaryKeyFor;
+    constructor(ast, coverage, primaryKeyFor) {
+        this.ast = ast;
+        this.coverage = coverage;
+        this.primaryKeyFor = primaryKeyFor;
+    }
+    projectOne(raw) {
+        return this.project(raw);
+    }
+    projectMany(raw) {
+        if (!Array.isArray(raw))
+            return EMPTY_ARRAY;
+        const cached = this.manyCache.get(raw);
+        if (cached)
+            return cached;
+        const out = raw.map((row) => this.project(row));
+        this.manyCache.set(raw, out);
+        return out;
+    }
+    project(raw) {
+        if (raw === null || raw === undefined || typeof raw !== "object")
+            return null;
+        const cached = this.cache.get(raw);
+        if (cached !== undefined)
+            return cached;
+        const out = this.projectRow(this.ast, raw);
+        this.cache.set(raw, out);
+        return out;
+    }
+    projectRow(ast, raw) {
+        if (raw === null || raw === undefined || typeof raw !== "object")
+            return null;
+        const row = raw;
+        const out = {};
+        const relationshipAliases = new Set((ast.related ?? []).map((rel) => rel.subquery.alias).filter((a) => a !== undefined));
+        if (ast.select === undefined) {
+            for (const [key, value] of Object.entries(row)) {
+                if (!relationshipAliases.has(key))
+                    out[key] = value;
+            }
+        }
+        else {
+            for (const col of ast.select) {
+                if (Object.prototype.hasOwnProperty.call(row, col))
+                    out[col] = row[col];
+            }
+        }
+        for (const rel of ast.related ?? []) {
+            const alias = rel.subquery.alias;
+            if (alias === undefined)
+                continue;
+            const value = row[alias];
+            if (rel.subquery.aggregate !== undefined) {
+                out[alias] = value;
+                continue;
+            }
+            out[alias] = isFragmentRelationship(rel) ? this.projectRelatedRefs(rel.subquery, value) : this.projectInline(rel.subquery, value);
+        }
+        return out;
+    }
+    projectInline(childAst, value) {
+        if (Array.isArray(value))
+            return value.map((row) => this.projectRow(childAst, row));
+        if (value === null || value === undefined)
+            return value ?? null;
+        return this.projectRow(childAst, value);
+    }
+    projectRelatedRefs(childAst, value) {
+        if (Array.isArray(value))
+            return value.map((row) => this.refForRow(childAst.table, row));
+        if (value === null || value === undefined)
+            return value ?? null;
+        return this.refForRow(childAst.table, value);
+    }
+    refForRow(table, value) {
+        if (value === null || typeof value !== "object") {
+            throw new Error(`useFragment(): cannot build a local fragment ref for "${table}" from a non-object row.`);
+        }
+        const row = value;
+        const pk = {};
+        for (const col of this.primaryKeyFor(table)) {
+            if (!Object.prototype.hasOwnProperty.call(row, col)) {
+                throw new Error(`useFragment(): local relationship row for "${table}" is missing primary key column "${col}".`);
+            }
+            pk[col] = row[col];
+        }
+        const key = stableKey({ table, pk });
+        const cached = this.refCache.get(key);
+        if (cached)
+            return cached;
+        const ref = createLocalFragmentRefForTable(table, pk, this.coverage);
+        this.refCache.set(key, ref);
+        return ref;
+    }
+}
+class RootRefProjection {
+    cache = new WeakMap();
+    rowCache = new WeakMap();
+    keyCache = new Map();
+    table;
+    coverage;
+    primaryKeyFor;
+    constructor(fragment, coverage, primaryKeyFor) {
+        this.table = tableMeta(fragment.table).name;
+        this.coverage = coverage;
+        this.primaryKeyFor = primaryKeyFor;
+    }
+    projectOne(raw) {
+        if (raw === null || raw === undefined)
+            return null;
+        return this.refForRow(raw);
+    }
+    projectMany(raw) {
+        if (!Array.isArray(raw))
+            return EMPTY_ARRAY;
+        const cached = this.cache.get(raw);
+        if (cached)
+            return cached;
+        const refs = raw.map((row) => this.refForRow(row));
+        this.cache.set(raw, refs);
+        return refs;
+    }
+    refForRow(value) {
+        if (value === null || typeof value !== "object") {
+            throw new Error(`useRoot(): cannot build a fragment ref for "${this.table}" from a non-object row.`);
+        }
+        const cached = this.rowCache.get(value);
+        if (cached)
+            return cached;
+        const row = value;
+        const pk = {};
+        for (const col of this.primaryKeyFor(this.table)) {
+            if (!Object.prototype.hasOwnProperty.call(row, col)) {
+                throw new Error(`useRoot(): local root row for "${this.table}" is missing primary key column "${col}".`);
+            }
+            pk[col] = row[col];
+        }
+        const key = stableKey({ table: this.table, pk });
+        const existing = this.keyCache.get(key);
+        if (existing) {
+            this.rowCache.set(value, existing);
+            return existing;
+        }
+        const ref = createLocalFragmentRefForTable(this.table, pk, this.coverage);
+        this.keyCache.set(key, ref);
+        this.rowCache.set(value, ref);
+        return ref;
+    }
+}
+export class SyncQueryCache {
+    entries = new Map();
+    nextLeaseId = 1;
+    store;
+    releaseDelayMs;
+    constructor(store, opts = {}) {
+        this.store = store;
+        this.releaseDelayMs = opts.releaseDelayMs ?? 0;
+    }
+    retain(coverageKey, query) {
+        let entry = this.entries.get(coverageKey);
+        if (!entry) {
+            const handle = this.createHandle(query);
+            entry = {
+                handle,
+                leases: [],
+                listeners: new Set(),
+                unsubscribe: () => { },
+                releaseTimer: undefined,
+            };
+            entry.unsubscribe = handle.subscribe(() => {
+                for (const listener of entry.listeners)
+                    listener();
+            });
+            this.entries.set(coverageKey, entry);
+        }
+        else if (entry.releaseTimer !== undefined) {
+            clearTimeout(entry.releaseTimer);
+            entry.releaseTimer = undefined;
+        }
+        const lease = { id: this.nextLeaseId++, coverageKey };
+        entry.leases.push(lease);
+        return lease;
+    }
+    release(lease) {
+        const entry = this.entries.get(lease.coverageKey);
+        if (!entry)
+            return;
+        const index = entry.leases.findIndex((l) => l.id === lease.id);
+        if (index < 0)
+            return;
+        entry.leases.splice(index, 1);
+        if (entry.leases.length > 0)
+            return;
+        this.scheduleRelease(lease.coverageKey, entry);
+    }
+    subscribe(coverageKey, listener) {
+        const entry = this.entries.get(coverageKey);
+        if (!entry)
+            return () => { };
+        entry.listeners.add(listener);
+        listener();
+        return () => {
+            entry.listeners.delete(listener);
+        };
+    }
+    resultType(coverageKey) {
+        return this.entries.get(coverageKey)?.handle.resultType ?? "unknown";
+    }
+    size() {
+        return this.entries.size;
+    }
+    createHandle(query) {
+        if (this.store.canRetainRemoteQueries())
+            return this.store.retainSyncQuery(query);
+        const view = this.store.materialize(query);
+        return {
+            get resultType() {
+                return view.resultType;
+            },
+            subscribe: (listener) => view.subscribe(listener),
+            release: () => view.destroy(),
+        };
+    }
+    scheduleRelease(coverageKey, entry) {
+        if (this.releaseDelayMs <= 0) {
+            this.finalizeRelease(coverageKey, entry);
+            return;
+        }
+        entry.releaseTimer = setReleaseTimeout(() => this.finalizeRelease(coverageKey, entry), this.releaseDelayMs);
+    }
+    finalizeRelease(coverageKey, entry) {
+        if (this.entries.get(coverageKey) !== entry || entry.leases.length > 0)
+            return;
+        entry.releaseTimer = undefined;
+        entry.unsubscribe();
+        entry.handle.release();
+        this.entries.delete(coverageKey);
+    }
 }
 export class QueryCache {
     entries = new Map();
     nextLeaseId = 1;
     store;
-    constructor(store) {
+    releaseDelayMs;
+    constructor(store, opts = {}) {
         this.store = store;
+        this.releaseDelayMs = opts.releaseDelayMs ?? 0;
     }
     retain(viewKey, query) {
         let entry = this.entries.get(viewKey);
@@ -118,12 +588,20 @@ export class QueryCache {
             return;
         if (entry.mode === "split") {
             const [released] = entry.leases.splice(index, 1);
-            released.releaseRemote();
+            if (entry.leases.length > 0 || this.releaseDelayMs <= 0) {
+                released.releaseRemote();
+            }
+            else {
+                entry.pendingReleases.push(released);
+                this.scheduleSplitRelease(lease.viewKey, entry);
+            }
             if (entry.leases.length > 0)
                 return;
-            entry.canonicalUnsubscribe();
-            entry.handle.destroy();
-            this.entries.delete(lease.viewKey);
+            if (this.releaseDelayMs <= 0) {
+                entry.canonicalUnsubscribe();
+                entry.handle.destroy();
+                this.entries.delete(lease.viewKey);
+            }
             return;
         }
         const [released] = entry.leases.splice(index, 1);
@@ -144,6 +622,7 @@ export class QueryCache {
         if (!entry)
             return () => { };
         entry.listeners.add(listener);
+        listener();
         return () => {
             entry.listeners.delete(listener);
         };
@@ -184,6 +663,8 @@ export class QueryCache {
             mode: "split",
             handle,
             leases: [],
+            pendingReleases: [],
+            releaseTimer: undefined,
             canonicalUnsubscribe: () => { },
             listeners: new Set(),
         };
@@ -228,6 +709,24 @@ export class QueryCache {
                 listener();
         });
     }
+    scheduleSplitRelease(viewKey, entry) {
+        if (entry.releaseTimer !== undefined)
+            clearTimeout(entry.releaseTimer);
+        entry.releaseTimer = setReleaseTimeout(() => this.finalizeSplitRelease(viewKey, entry), this.releaseDelayMs);
+    }
+    finalizeSplitRelease(viewKey, entry) {
+        if (this.entries.get(viewKey) !== entry)
+            return;
+        entry.releaseTimer = undefined;
+        const pending = entry.pendingReleases.splice(0);
+        for (const lease of pending)
+            lease.releaseRemote();
+        if (entry.leases.length > 0)
+            return;
+        entry.canonicalUnsubscribe();
+        entry.handle.destroy();
+        this.entries.delete(viewKey);
+    }
 }
 export function queryCacheKey(query) {
     return describeQuery(query).viewKey;