@choksheak/react-utils 0.2.7 → 0.2.8

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@choksheak/react-utils",
   "license": "The Unlicense",
-  "version": "0.2.7",
+  "version": "0.2.8",
   "description": "Miscellaneous React+TypeScript utilities with support for full tree-shaking.",
   "private": false,
   "files": [

package/sharedQuery.cjs

@@ -214,7 +214,9 @@ var SharedState = class {
       options,
       SharedStateDefaults.storeExpiryMs
     );
-    this.setValueBounded = (arg) => this.setValue(arg);
+    this.setValueBounded = (next) => {
+      this.setValue(next);
+    };
     pubSubStore.setNoNotify(this.pubSubKey, defaultValue);
     const lazyLoad = options?.lazyLoad;
     const lazy = lazyLoad !== void 0 ? lazyLoad : SharedStateDefaults.lazyLoad;
@@ -319,19 +321,19 @@ function useDeepMemo(value) {
 
 // src/sharedQuery.ts
 var SharedQueryDefaults = {
-  // Refetch on every page load.
+  /** Refetch on every page load. */
   staleMs: 0,
-  // Keep in cache for a long time.
+  /** Keep in cache for a long time. */
   expiryMs: 30 * import_timeConstants2.MS_PER_DAY,
-  // Always refetch automatically if the data is stale.
+  /** Always refetch automatically if the data is stale. */
   refetchOnStale: true,
-  // No default persistence configured.
+  /** No default persistence configured. */
   persistTo: void 0,
-  // 100 is not too large, but please tweak accordingly.
+  /** 100 is not too large, but please tweak accordingly. */
   maxSize: 100,
-  // 100kb limit before discarding old records.
+  /** 100kb limit before discarding old records. */
   maxBytes: 1e5,
-  // Default to log to console.
+  /** Default to log to console. */
   log: (...args) => console.log("[sharedQuery]", ...args)
 };
 var SharedQuery = class {
@@ -350,6 +352,7 @@ var SharedQuery = class {
   refetchOnStale;
   maxSize;
   maxBytes;
+  keepLastNonEmptyData;
   log;
   constructor(options) {
     this.queryName = options.queryName;
@@ -367,6 +370,7 @@ var SharedQuery = class {
     }
     this.maxSize = options?.maxSize ?? SharedQueryDefaults.maxSize;
     this.maxBytes = options?.maxBytes ?? SharedQueryDefaults.maxBytes;
+    this.keepLastNonEmptyData = Boolean(options?.keepLastNonEmptyData);
     this.log = options?.log ?? SharedQueryDefaults.log;
     this.queryState = sharedState(
       {},
@@ -556,70 +560,48 @@ var SharedQuery = class {
       return;
     }
     const oldByteSize = (0, import_object_sizeof.default)(oldState);
-    let newState = oldState;
+    let numToCut = this.maxSize ? oldSize - this.maxSize : 0;
+    let bytesToCut = this.maxBytes ? oldByteSize - this.maxBytes : 0;
+    if (numToCut <= 0 && bytesToCut <= 0) {
+      this.log(
+        `No need to trim data for ${this.queryName}: size=${oldSize} (limit=${this.maxSize}), byteSize=${oldByteSize.toLocaleString()} (limit=${this.maxBytes.toLocaleString()})`
+      );
+      return;
+    }
+    this.log(
+      `Need to trim ${this.queryName}: numToCut=${numToCut}, bytesToCut=${bytesToCut}`
+    );
+    const newState = { ...oldState };
     let needUpdate = false;
-    if (this.maxSize) {
-      let numToCut = oldSize - this.maxSize;
-      if (numToCut > 0) {
-        this.log(
-          `enforceSizeLimit for ${this.queryName} needed due to size ${oldSize} > ${this.maxSize}`
-        );
-        newState = { ...newState };
-        needUpdate = true;
-        const entriesByTimeAscending = Object.entries(newState).sort(
-          (entry1, entry2) => (
-            // Sort descending.
-            entry1[1].lastUpdatedMs - entry2[1].lastUpdatedMs
-          )
-        );
-        for (let i = 0; i < entriesByTimeAscending.length && numToCut > 0; i++) {
-          const key = entriesByTimeAscending[i][0];
-          if (this.mountedKeys.has(key)) {
-            this.log(`Cannot clean up ${key} as it is mounted`);
-          } else {
-            this.log(`Cleaning up unmounted ${key}`);
-            delete newState[key];
-            numToCut--;
-          }
-        }
+    const entriesByTimeAscending = Object.entries(newState).sort(
+      (entry1, entry2) => entry1[1].lastUpdatedMs - entry2[1].lastUpdatedMs
+    );
+    for (const [key] of entriesByTimeAscending) {
+      if (this.mountedKeys.has(key)) {
+        this.log(`Cannot clean up ${key} as it is mounted`);
+        continue;
       }
-    }
-    if (this.maxBytes && Object.keys(newState).length > 1) {
-      const currentByteSize = needUpdate ? (0, import_object_sizeof.default)(newState) : oldByteSize;
-      let bytesToCut = currentByteSize - this.maxBytes;
-      if (bytesToCut > 0) {
-        this.log(
-          `enforceSizeLimit for ${this.queryName} needed due to byte size ${currentByteSize.toLocaleString()} > ${this.maxBytes.toLocaleString()}`
-        );
-        if (!needUpdate) {
-          newState = { ...newState };
-          needUpdate = true;
-        }
-        const entriesByTimeAscending = Object.entries(newState).sort(
-          (entry1, entry2) => entry1[1].lastUpdatedMs - entry2[1].lastUpdatedMs
-        );
-        for (let i = 0; i < entriesByTimeAscending.length && bytesToCut > 0; i++) {
-          const key = entriesByTimeAscending[i][0];
-          if (this.mountedKeys.has(key)) {
-            this.log(`Cannot clean up ${key} as it is mounted`);
-          } else {
-            this.log(`Cleaning up unmounted ${key}`);
-            const thisSize = (0, import_object_sizeof.default)(key) + (0, import_object_sizeof.default)(newState[key]);
-            delete newState[key];
-            bytesToCut -= thisSize;
-          }
-        }
+      const byteSize = (0, import_object_sizeof.default)(key) + (0, import_object_sizeof.default)(newState[key]);
+      this.log(
+        `Cleaning up unmounted ${key} (byteSize=${byteSize.toLocaleString()})`
+      );
+      numToCut--;
+      bytesToCut -= byteSize;
+      delete newState[key];
+      needUpdate = true;
+      if (numToCut <= 0 && bytesToCut <= 0) {
+        break;
       }
     }
-    if (needUpdate) {
-      this.queryState.setValue(newState);
+    if (!needUpdate) {
       this.log(
-        `Trimmed data for ${this.queryName}: size=(${oldSize} -> ${Object.keys(newState).length}) (limit=${this.maxSize}), byteSize=(${oldByteSize.toLocaleString()} -> ${(0, import_object_sizeof.default)(newState).toLocaleString()}) (limit=${this.maxBytes.toLocaleString()})`
+        `No trimmable entries found for ${this.queryName}: size=${oldSize} (limit=${this.maxSize}), byteSize=${oldByteSize.toLocaleString()} (limit=${this.maxBytes.toLocaleString()})`
       );
       return;
     }
+    this.queryState.setValue(newState);
     this.log(
-      `No need to trim data for ${this.queryName}: size=${oldSize} (limit=${this.maxSize}), byteSize=${oldByteSize.toLocaleString()} (limit=${this.maxBytes.toLocaleString()})`
+      `Trimmed data for ${this.queryName}: size=[${oldSize} -> ${Object.keys(newState).length}] (limit=${this.maxSize}), byteSize=[${oldByteSize.toLocaleString()} -> ${(0, import_object_sizeof.default)(newState).toLocaleString()}] (limit=${this.maxBytes.toLocaleString()})`
     );
   }
 };
@@ -643,23 +625,29 @@ function useSharedQuery(query, args = []) {
     () => query.getQueryKey(stableArgs),
     [query, stableArgs]
   );
-  const queryStateValue = queryState[queryKey];
+  const queryStateValue = queryState[queryKey] ?? DEFAULT_QUERY_STATE_ENTRY;
   const setQueryStateValue = (0, import_react3.useCallback)(
-    (arg) => {
+    (next) => {
       setQueryState((prev) => {
         const clone = { ...prev };
-        clone[queryKey] = typeof arg === "function" ? arg(clone[queryKey]) : arg;
+        clone[queryKey] = typeof next === "function" ? next(clone[queryKey] ?? DEFAULT_QUERY_STATE_ENTRY) : next;
         return clone;
       });
     },
     [queryKey, setQueryState]
   );
+  const [lastNonEmptyData, setLastNonEmptyData] = (0, import_react3.useState)();
+  (0, import_react3.useEffect)(() => {
+    if (query.keepLastNonEmptyData && queryStateValue.data !== void 0) {
+      setLastNonEmptyData(queryStateValue.data);
+    }
+  }, [query.keepLastNonEmptyData, queryStateValue.data]);
   const execute = (0, import_react3.useCallback)(
     async (forceRefresh) => {
       query.log(`Begin executing shared query ${queryKey}`);
       setQueryStateValue((prev) => ({
         // Keep old data and error.
-        ...prev ?? {},
+        ...prev,
         lastUpdatedMs: Date.now(),
         loading: true
       }));
@@ -680,7 +668,7 @@ function useSharedQuery(query, args = []) {
           const now = Date.now();
           setQueryStateValue((prev) => ({
             // Keep old data.
-            ...prev ?? {},
+            ...prev,
             lastUpdatedMs: now,
             loading: false,
             error: e,
@@ -701,9 +689,9 @@ function useSharedQuery(query, args = []) {
     };
   }, [execute, query, queryKey]);
   return (0, import_react3.useMemo)(() => {
-    const state = queryStateValue ?? DEFAULT_QUERY_STATE_ENTRY;
     return {
-      ...state,
+      ...queryStateValue,
+      lastNonEmptyData,
       // This works only if the user-given queryFn supports abort. If not,
       // this function doesn't do anything, since we don't have any means to
       // abort the running queryFn.
@@ -718,7 +706,7 @@ function useSharedQuery(query, args = []) {
       setData: (data, dataUpdatedMs) => {
         const now = Date.now();
         setQueryStateValue((prev) => ({
-          ...prev ?? {},
+          ...prev,
           data,
           dataUpdatedMs: dataUpdatedMs ?? now,
           lastUpdatedMs: now,
@@ -735,6 +723,7 @@ function useSharedQuery(query, args = []) {
     };
   }, [
     execute,
+    lastNonEmptyData,
     query,
     queryKey,
     queryStateValue,

package/sharedQuery.d.mts

@@ -1,4 +1,5 @@
 import { SharedStateOptions, SharedState } from './sharedState.mjs';
+import 'react';
 import './utils/storage.mjs';
 
 /**
@@ -88,7 +89,7 @@ import './utils/storage.mjs';
 /** Type of the queryFn used to fetch the data from source. */
 type QueryFn<TArgs extends unknown[], TData> = (...args: TArgs) => Promise<TData> | TData;
 /** An entry for a persisted state corresponding to one query key. */
-type QueryStateValue<TData> = {
+type QueryStateValue<TData> = Readonly<{
     /**
      * When this record was last updated. Used for LRU determination. If you want
      * the data age, please use `dataUpdatedMs` instead.
@@ -104,9 +105,14 @@ type QueryStateValue<TData> = {
      */
     error?: unknown;
     errorUpdatedMs?: number;
-};
+}>;
 /** Return type for useSharedQuery(). */
-type UseQueryResult<TData> = QueryStateValue<TData> & {
+type UseQueryResult<TData> = QueryStateValue<TData> & Readonly<{
+    /**
+     * Return the last non-empty data if you want to display the last loaded data
+     * while waiting for the new data to load.
+     */
+    lastNonEmptyData: TData | undefined;
     /**
      * Cancels the inflight query (if any). Returns true if canceled.
      */
@@ -121,7 +127,7 @@ type UseQueryResult<TData> = QueryStateValue<TData> & {
      */
     setData: (data: TData, dataUpdatedMs?: number) => void;
     deleteData: () => void;
-};
+}>;
 /** List of all available persistence options. */
 type PersistTo = "localStorage" | "indexedDb";
 /**
@@ -131,24 +137,71 @@ type PersistTo = "localStorage" | "indexedDb";
 type SharedQueryState<TData> = Record<string, QueryStateValue<TData>>;
 /** Options to configure a shared query. */
 type SharedQueryOptions<TArgs extends unknown[], TData> = {
+    /**
+     * The name could have been auto-generated, but we let the user give us a
+     * human-readable name that can be identified quickly in the logs.
+     * Note that the queryKey is a string formed by the queryName plus the query
+     * arguments.
+     */
     queryName: string;
+    /**
+     * Function to fetch data.
+     */
     queryFn: QueryFn<TArgs, TData>;
+    /**
+     * ms before data considered stale; 0 means always stale.
+     */
     staleMs?: number;
+    /**
+     * ms before data is removed from cache; 0 means never expire.
+     */
     expiryMs?: number;
+    /**
+     * Trigger background re-fetch if stale.
+     */
     refetchOnStale?: boolean;
+    /**
+     * Shortcut to set the localStorageKey or indexedDbKey automatically from
+     * queryName. This is important because it avoids requiring the user to
+     * specify the same queryName twice everytime.
+     */
     persistTo?: PersistTo;
+    /**
+     * Max number of entries to keep. The oldest entries will be discarded.
+     * The last record cannot be discarded. 0 means no limit.
+     */
     maxSize?: number;
+    /**
+     * Max number of bytes to keep. The oldest entries will be discarded.
+     * The last record cannot be discarded. 0 means no limit.
+     */
     maxBytes?: number;
+    /**
+     * Keep a copy of the last non-empty data so that when you change the
+     * query arguments, you can still display the old data while waiting for the
+     * new data to load.
+     */
+    keepLastNonEmptyData?: boolean;
+    /**
+     * Customize the logger.
+     */
     log?: (...args: unknown[]) => void;
 } & SharedStateOptions<SharedQueryState<TData>>;
 /** Users can override these values globally. */
 declare const SharedQueryDefaults: {
+    /** Refetch on every page load. */
     staleMs: number;
+    /** Keep in cache for a long time. */
     expiryMs: number;
+    /** Always refetch automatically if the data is stale. */
     refetchOnStale: boolean;
+    /** No default persistence configured. */
     persistTo: PersistTo | undefined;
+    /** 100 is not too large, but please tweak accordingly. */
     maxSize: number;
+    /** 100kb limit before discarding old records. */
     maxBytes: number;
+    /** Default to log to console. */
     log: (...args: unknown[]) => void;
 };
 /** Please use sharedQuery() instead. */
@@ -168,6 +221,7 @@ declare class SharedQuery<TArgs extends unknown[], TData> {
     readonly refetchOnStale: boolean;
     readonly maxSize: number;
     readonly maxBytes: number;
+    readonly keepLastNonEmptyData: boolean;
     readonly log: (...args: unknown[]) => void;
     constructor(options: SharedQueryOptions<TArgs, TData>);
     /** Returns a key to identify requests based on the given args. */

package/sharedQuery.d.ts

@@ -85,7 +85,7 @@ import { SharedState, SharedStateOptions } from "./sharedState";
 /** Type of the queryFn used to fetch the data from source. */
 export type QueryFn<TArgs extends unknown[], TData> = (...args: TArgs) => Promise<TData> | TData;
 /** An entry for a persisted state corresponding to one query key. */
-export type QueryStateValue<TData> = {
+export type QueryStateValue<TData> = Readonly<{
     /**
      * When this record was last updated. Used for LRU determination. If you want
      * the data age, please use `dataUpdatedMs` instead.
@@ -101,9 +101,14 @@ export type QueryStateValue<TData> = {
      */
     error?: unknown;
     errorUpdatedMs?: number;
-};
+}>;
 /** Return type for useSharedQuery(). */
-export type UseQueryResult<TData> = QueryStateValue<TData> & {
+export type UseQueryResult<TData> = QueryStateValue<TData> & Readonly<{
+    /**
+     * Return the last non-empty data if you want to display the last loaded data
+     * while waiting for the new data to load.
+     */
+    lastNonEmptyData: TData | undefined;
     /**
      * Cancels the inflight query (if any). Returns true if canceled.
      */
@@ -118,7 +123,7 @@ export type UseQueryResult<TData> = QueryStateValue<TData> & {
      */
     setData: (data: TData, dataUpdatedMs?: number) => void;
     deleteData: () => void;
-};
+}>;
 /** List of all available persistence options. */
 export type PersistTo = "localStorage" | "indexedDb";
 /**
@@ -128,24 +133,71 @@ export type PersistTo = "localStorage" | "indexedDb";
 export type SharedQueryState<TData> = Record<string, QueryStateValue<TData>>;
 /** Options to configure a shared query. */
 export type SharedQueryOptions<TArgs extends unknown[], TData> = {
+    /**
+     * The name could have been auto-generated, but we let the user give us a
+     * human-readable name that can be identified quickly in the logs.
+     * Note that the queryKey is a string formed by the queryName plus the query
+     * arguments.
+     */
     queryName: string;
+    /**
+     * Function to fetch data.
+     */
     queryFn: QueryFn<TArgs, TData>;
+    /**
+     * ms before data considered stale; 0 means always stale.
+     */
     staleMs?: number;
+    /**
+     * ms before data is removed from cache; 0 means never expire.
+     */
     expiryMs?: number;
+    /**
+     * Trigger background re-fetch if stale.
+     */
     refetchOnStale?: boolean;
+    /**
+     * Shortcut to set the localStorageKey or indexedDbKey automatically from
+     * queryName. This is important because it avoids requiring the user to
+     * specify the same queryName twice everytime.
+     */
     persistTo?: PersistTo;
+    /**
+     * Max number of entries to keep. The oldest entries will be discarded.
+     * The last record cannot be discarded. 0 means no limit.
+     */
     maxSize?: number;
+    /**
+     * Max number of bytes to keep. The oldest entries will be discarded.
+     * The last record cannot be discarded. 0 means no limit.
+     */
     maxBytes?: number;
+    /**
+     * Keep a copy of the last non-empty data so that when you change the
+     * query arguments, you can still display the old data while waiting for the
+     * new data to load.
+     */
+    keepLastNonEmptyData?: boolean;
+    /**
+     * Customize the logger.
+     */
     log?: (...args: unknown[]) => void;
 } & SharedStateOptions<SharedQueryState<TData>>;
 /** Users can override these values globally. */
 export declare const SharedQueryDefaults: {
+    /** Refetch on every page load. */
     staleMs: number;
+    /** Keep in cache for a long time. */
     expiryMs: number;
+    /** Always refetch automatically if the data is stale. */
     refetchOnStale: boolean;
+    /** No default persistence configured. */
     persistTo: PersistTo | undefined;
+    /** 100 is not too large, but please tweak accordingly. */
     maxSize: number;
+    /** 100kb limit before discarding old records. */
     maxBytes: number;
+    /** Default to log to console. */
     log: (...args: unknown[]) => void;
 };
 /** Please use sharedQuery() instead. */
@@ -165,6 +217,7 @@ export declare class SharedQuery<TArgs extends unknown[], TData> {
     readonly refetchOnStale: boolean;
     readonly maxSize: number;
     readonly maxBytes: number;
+    readonly keepLastNonEmptyData: boolean;
     readonly log: (...args: unknown[]) => void;
     constructor(options: SharedQueryOptions<TArgs, TData>);
     /** Returns a key to identify requests based on the given args. */

package/sharedQuery.min.cjs

@@ -1,2 +1,2 @@
-"use strict";var q=Object.create;var m=Object.defineProperty;var L=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames;var _=Object.getPrototypeOf,j=Object.prototype.hasOwnProperty;var J=(i,e)=>{for(var t in e)m(i,t,{get:e[t],enumerable:!0})},K=(i,e,t,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of R(e))!j.call(i,s)&&s!==t&&m(i,s,{get:()=>e[s],enumerable:!(r=L(e,s))||r.enumerable});return i};var Q=(i,e,t)=>(t=i!=null?q(_(i)):{},K(e||!i||!i.__esModule?m(t,"default",{value:i,enumerable:!0}):t,i)),W=i=>K(m({},"__esModule",{value:!0}),i);var X={};J(X,{SharedQuery:()=>x,SharedQueryDefaults:()=>h,sharedQuery:()=>I,useSharedQuery:()=>H});module.exports=W(X);var U=require("@choksheak/ts-utils/timeConstants"),S=Q(require("object-sizeof")),p=require("react");var O=require("@choksheak/ts-utils/timeConstants"),z=require("react");var f=require("@choksheak/ts-utils/kvStore");function k(i,e){let{localStorageKey:t,indexedDbKey:r,storeExpiryMs:s,store:a}=i??{};if(a)return a;let n=s||e;return t?new w(t,n):r?new D(r,n):null}var w=class{constructor(e,t){this.keyPrefix=e;this.expiryMs=t}save(e,t){if(typeof window>"u")return;let r=this.keyPrefix+":"+e;window.localStorage.setItem(r,JSON.stringify({value:t,expiresAt:this.expiryMs?Date.now()+this.expiryMs:0}))}load(e){if(typeof window>"u")return;let t=this.keyPrefix+":"+e,r=window.localStorage.getItem(t);if(r)try{let s=JSON.parse(r);if(!s||s.expiresAt&&Date.now()>=s.expiresAt){window.localStorage.removeItem(t);return}return s.value}catch{window.localStorage.removeItem(t);return}}delete(e){if(typeof window>"u")return;let t=this.keyPrefix+":"+e;window.localStorage.removeItem(t)}clear(){if(!(typeof window>"u"))for(let e of Object.keys(window.localStorage))e.startsWith(this.keyPrefix)&&window.localStorage.removeItem(e)}},D=class{constructor(e,t){this.keyPrefix=e;this.expiryMs=t}async save(e,t){if(typeof window>"u")return;let r=this.keyPrefix+":"+e;await f.kvStore.set(r,JSON.stringify(t),this.expiryMs)}async load(e){if(typeof window>"u")return;let t=this.keyPrefix+":"+e,r=await f.kvStore.get(t);if(r!==void 0)try{return JSON.parse(r)}catch{await f.kvStore.delete(t);return}}async delete(e){if(typeof window>"u")return;let t=this.keyPrefix+":"+e;await f.kvStore.delete(t)}async clear(){typeof window>"u"||await f.kvStore.forEach(async e=>{e.startsWith(this.keyPrefix)&&await f.kvStore.delete(e)})}};var B={storeExpiryMs:30*O.MS_PER_DAY,lazyLoad:!1},A=class{dataByKey=new Map;subscribersByKey=new Map;get(e){return this.dataByKey.get(e)}set(e,t){let r=this.dataByKey.get(e);r!==t&&(this.dataByKey.set(e,t),this.notify(e,t,r))}delete(e){this.dataByKey.delete(e)}setNoNotify(e,t){this.dataByKey.set(e,t)}subscribe(e,t){let r=this.subscribersByKey.get(e);return r||(r=new Set,this.subscribersByKey.set(e,r)),r.add(t),()=>{r.delete(t),r.size===0&&this.subscribersByKey.delete(e)}}notify(e,t,r){let s=this.subscribersByKey.get(e);if(!s)return;let a=Array.from(s.values());for(let n of a)try{n(t,r)}catch(y){console.error("Error invoking subscriber:",y)}}},g=new A,v="state",Y=0,M=class{constructor(e,t){this.defaultValue=e;this.pubSubKey=String(Y++),this.storageAdapter=k(t,B.storeExpiryMs),this.setValueBounded=a=>this.setValue(a),g.setNoNotify(this.pubSubKey,e);let r=t?.lazyLoad;(r!==void 0?r:B.lazyLoad)||this.initDefaultValueOnce()}pubSubKey;storageAdapter;setValueBounded;initDone=!1;subscribe(e){return g.subscribe(this.pubSubKey,()=>e())}getSnapshot(){return g.get(this.pubSubKey)}setValue(e){if(typeof e=="function"){let t=g.get(this.pubSubKey);e=e(t)}g.set(this.pubSubKey,e),this.storageAdapter?.save(v,e)}delete(){g.set(this.pubSubKey,this.defaultValue),this.storageAdapter?.save(v,this.defaultValue)}async initDefaultValueOnce(){if(this.initDone)return;this.initDone=!0;let e=await this.storageAdapter?.load(v);g.set(this.pubSubKey,e!==void 0?e:this.defaultValue)}};function V(i,e){return new M(i,e)}function $(i){return i.initDefaultValueOnce(),[(0,z.useSyncExternalStore)(t=>i.subscribe(t),()=>i.getSnapshot(),()=>i.getSnapshot()),i.setValueBounded]}function P(i){let e=new Set;return JSON.stringify(i,(t,r)=>{if(typeof r=="function")throw new Error("Functions should not be passed into query parameters");if(!r||typeof r!="object"||Array.isArray(r))return r;if(e.has(r))return"[Circular]";if(e.add(r),r!==i)try{JSON.stringify(r)}catch{return"[Unserializable]"}return Object.keys(r).sort().reduce((s,a)=>(s[a]=r[a],s),{})})}var C=Q(require("lodash/isEqual")),T=require("react");function E(i){let[e,t]=(0,T.useState)(i);return(0,T.useMemo)(()=>e===i||(0,C.default)(e,i)?e:(t(i),i),[e,i])}var h={staleMs:0,expiryMs:30*U.MS_PER_DAY,refetchOnStale:!0,persistTo:void 0,maxSize:100,maxBytes:1e5,log:(...i)=>console.log("[sharedQuery]",...i)},x=class{inflightQueries=new Map;queryState;mountedKeys=new Map;queryName;queryFn;expiryMs;staleMs;refetchOnStale;maxSize;maxBytes;log;constructor(e){if(this.queryName=e.queryName,this.queryFn=e.queryFn,this.staleMs=e?.staleMs??h.staleMs,this.expiryMs=e?.expiryMs??h.expiryMs,this.refetchOnStale=e?.refetchOnStale??h.refetchOnStale,!e.localStorageKey&&!e.indexedDbKey){let t=e.persistTo??h.persistTo;t==="localStorage"?e.localStorageKey=e.queryName:t==="indexedDb"&&(e.indexedDbKey=e.queryName)}this.maxSize=e?.maxSize??h.maxSize,this.maxBytes=e?.maxBytes??h.maxBytes,this.log=e?.log??h.log,this.queryState=V({},{...e,storeExpiryMs:e?.storeExpiryMs||this.expiryMs})}getQueryKey(e){return this.queryName+":"+P(e)}getAbortController(e){let t=this.getQueryKey(e);return this.getAbortControllerByKey(t)}getAbortControllerByKey(e){return this.inflightQueries.get(e)?.abortController??null}getAbortSignal(e){let t=this.getQueryKey(e);return this.getAbortSignalByKey(t)}getAbortSignalByKey(e){return this.getAbortControllerByKey(e)?.signal??null}isStale(e){return this.staleMs===0?!0:Date.now()-e>this.staleMs}isExpired(e){return this.expiryMs===0?!1:Date.now()-e>this.expiryMs}async getCachedOrFetch(...e){let t=this.getQueryKey(e),r=this.queryState.getSnapshot()?.[t];return r?.data&&!this.isExpired(r.dataUpdatedMs??0)?this.isStale(r.dataUpdatedMs??0)?(this.refetchOnStale&&(this.log(`refetchOnStale for ${t}`),this.dedupedFetch(t,...e)),this.log(`Returning stale data for ${t}`),r.data):(this.log(`Return fresh data ${t} from cache without fetching`),r.data):await this.dedupedFetch(t,...e)}dedupedFetch(e,...t){let r=this.inflightQueries.get(e);if(r)return this.log(`Deduplicating inflight fetch for ${e}`),r.promise;let s=this.startFetching(e,t),a=new AbortController;return this.inflightQueries.set(e,{promise:s,abortController:a}),s}async startFetching(e,t){this.log(`Start fetching ${e}`);try{let r=await this.queryFn(...t);return this.log(`Successfully fetched ${e}`),this.setData(e,r,Date.now()),r}catch(r){throw this.log(`Failed to fetch ${e}: ${r}`),r}finally{this.inflightQueries.delete(e)}}getQueryValue(e){return this.queryState.getSnapshot()?.[e]}getData(e){return this.queryState.getSnapshot()?.[e]?.data}setData(e,t,r=Date.now()){let s={lastUpdatedMs:Date.now(),loading:!1,data:t,dataUpdatedMs:r};this.queryState.setValue(a=>({...a,[e]:s})),this.enforceSizeLimit()}async updateFromSource(...e){let t=this.getQueryKey(e);return await this.dedupedFetch(t,...e)}deleteData(e){let r={...this.queryState.getSnapshot()};delete r[e],this.queryState.setValue(r);let s=this.inflightQueries.get(e);s&&(this.inflightQueries.delete(e),s.abortController.abort("Deleted"))}clear(){this.queryState.delete();for(let{abortController:e}of Array.from(this.inflightQueries.values()))e.abort("Cleared");this.inflightQueries.clear()}mount(e){this.mountedKeys.set(e,(this.mountedKeys.get(e)??0)+1)}unmount(e){let t=this.mountedKeys.get(e);t===1?this.mountedKeys.delete(e):this.mountedKeys.set(e,(t??0)-1)}enforceSizeLimit(){if(!this.maxSize&&!this.maxBytes)return;let e=this.queryState.getSnapshot(),t=Object.keys(e).length;if(t<=1)return;let r=(0,S.default)(e),s=e,a=!1;if(this.maxSize){let n=t-this.maxSize;if(n>0){this.log(`enforceSizeLimit for ${this.queryName} needed due to size ${t} > ${this.maxSize}`),s={...s},a=!0;let y=Object.entries(s).sort((l,o)=>l[1].lastUpdatedMs-o[1].lastUpdatedMs);for(let l=0;l<y.length&&n>0;l++){let o=y[l][0];this.mountedKeys.has(o)?this.log(`Cannot clean up ${o} as it is mounted`):(this.log(`Cleaning up unmounted ${o}`),delete s[o],n--)}}}if(this.maxBytes&&Object.keys(s).length>1){let n=a?(0,S.default)(s):r,y=n-this.maxBytes;if(y>0){this.log(`enforceSizeLimit for ${this.queryName} needed due to byte size ${n.toLocaleString()} > ${this.maxBytes.toLocaleString()}`),a||(s={...s},a=!0);let l=Object.entries(s).sort((o,d)=>o[1].lastUpdatedMs-d[1].lastUpdatedMs);for(let o=0;o<l.length&&y>0;o++){let d=l[o][0];if(this.mountedKeys.has(d))this.log(`Cannot clean up ${d} as it is mounted`);else{this.log(`Cleaning up unmounted ${d}`);let c=(0,S.default)(d)+(0,S.default)(s[d]);delete s[d],y-=c}}}}if(a){this.queryState.setValue(s),this.log(`Trimmed data for ${this.queryName}: size=(${t} -> ${Object.keys(s).length}) (limit=${this.maxSize}), byteSize=(${r.toLocaleString()} -> ${(0,S.default)(s).toLocaleString()}) (limit=${this.maxBytes.toLocaleString()})`);return}this.log(`No need to trim data for ${this.queryName}: size=${t} (limit=${this.maxSize}), byteSize=${r.toLocaleString()} (limit=${this.maxBytes.toLocaleString()})`)}},N=new Set;function I(i){if(N.has(i.queryName))throw new Error(`Duplicate shared query "${i.queryName}"`);return N.add(i.queryName),new x(i)}var G={lastUpdatedMs:0,loading:!0};function H(i,e=[]){let t=E(e),[r,s]=$(i.queryState),a=(0,p.useRef)(!0),n=(0,p.useMemo)(()=>i.getQueryKey(t),[i,t]),y=r[n],l=(0,p.useCallback)(d=>{s(c=>{let u={...c};return u[n]=typeof d=="function"?d(u[n]):d,u})},[n,s]),o=(0,p.useCallback)(async d=>{i.log(`Begin executing shared query ${n}`),l(c=>({...c??{},lastUpdatedMs:Date.now(),loading:!0}));try{let c=await(d?i.updateFromSource(...t):i.getCachedOrFetch(...t));if(a.current){let u=Date.now();l({lastUpdatedMs:u,loading:!1,data:c,dataUpdatedMs:u})}}catch(c){if(a.current){let u=Date.now();l(b=>({...b??{},lastUpdatedMs:u,loading:!1,error:c,errorUpdatedMs:u}))}}},[i,n,l,t]);return(0,p.useEffect)(()=>(a.current=!0,i.mount(n),o(!1),()=>{a.current=!1,i.unmount(n)}),[o,i,n]),(0,p.useMemo)(()=>({...y??G,abortCurrentQuery:c=>{let u=i.getAbortControllerByKey(n);return u?.abort(c),!!u},refetch:()=>{o(!0)},setData:(c,u)=>{let b=Date.now();l(F=>({...F??{},data:c,dataUpdatedMs:u??b,lastUpdatedMs:b,loading:!1}))},deleteData:()=>{s(c=>{let u={...c};return delete u[n],u})}}),[o,i,n,y,s,l])}0&&(module.exports={SharedQuery,SharedQueryDefaults,sharedQuery,useSharedQuery});
+"use strict";var q=Object.create;var T=Object.defineProperty;var _=Object.getOwnPropertyDescriptor;var j=Object.getOwnPropertyNames;var J=Object.getPrototypeOf,W=Object.prototype.hasOwnProperty;var Y=(i,e)=>{for(var t in e)T(i,t,{get:e[t],enumerable:!0})},k=(i,e,t,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of j(e))!W.call(i,a)&&a!==t&&T(i,a,{get:()=>e[a],enumerable:!(r=_(e,a))||r.enumerable});return i};var B=(i,e,t)=>(t=i!=null?q(J(i)):{},k(e||!i||!i.__esModule?T(t,"default",{value:i,enumerable:!0}):t,i)),I=i=>k(T({},"__esModule",{value:!0}),i);var Z={};Y(Z,{SharedQuery:()=>w,SharedQueryDefaults:()=>h,sharedQuery:()=>H,useSharedQuery:()=>X});module.exports=I(Z);var R=require("@choksheak/ts-utils/timeConstants"),b=B(require("object-sizeof")),u=require("react");var E=require("@choksheak/ts-utils/timeConstants"),z=require("react");var f=require("@choksheak/ts-utils/kvStore");function N(i,e){let{localStorageKey:t,indexedDbKey:r,storeExpiryMs:a,store:n}=i??{};if(n)return n;let s=a||e;return t?new A(t,s):r?new M(r,s):null}var A=class{constructor(e,t){this.keyPrefix=e;this.expiryMs=t}save(e,t){if(typeof window>"u")return;let r=this.keyPrefix+":"+e;window.localStorage.setItem(r,JSON.stringify({value:t,expiresAt:this.expiryMs?Date.now()+this.expiryMs:0}))}load(e){if(typeof window>"u")return;let t=this.keyPrefix+":"+e,r=window.localStorage.getItem(t);if(r)try{let a=JSON.parse(r);if(!a||a.expiresAt&&Date.now()>=a.expiresAt){window.localStorage.removeItem(t);return}return a.value}catch{window.localStorage.removeItem(t);return}}delete(e){if(typeof window>"u")return;let t=this.keyPrefix+":"+e;window.localStorage.removeItem(t)}clear(){if(!(typeof window>"u"))for(let e of Object.keys(window.localStorage))e.startsWith(this.keyPrefix)&&window.localStorage.removeItem(e)}},M=class{constructor(e,t){this.keyPrefix=e;this.expiryMs=t}async save(e,t){if(typeof window>"u")return;let r=this.keyPrefix+":"+e;await f.kvStore.set(r,JSON.stringify(t),this.expiryMs)}async load(e){if(typeof window>"u")return;let t=this.keyPrefix+":"+e,r=await f.kvStore.get(t);if(r!==void 0)try{return JSON.parse(r)}catch{await f.kvStore.delete(t);return}}async delete(e){if(typeof window>"u")return;let t=this.keyPrefix+":"+e;await f.kvStore.delete(t)}async clear(){typeof window>"u"||await f.kvStore.forEach(async e=>{e.startsWith(this.keyPrefix)&&await f.kvStore.delete(e)})}};var O={storeExpiryMs:30*E.MS_PER_DAY,lazyLoad:!1},K=class{dataByKey=new Map;subscribersByKey=new Map;get(e){return this.dataByKey.get(e)}set(e,t){let r=this.dataByKey.get(e);r!==t&&(this.dataByKey.set(e,t),this.notify(e,t,r))}delete(e){this.dataByKey.delete(e)}setNoNotify(e,t){this.dataByKey.set(e,t)}subscribe(e,t){let r=this.subscribersByKey.get(e);return r||(r=new Set,this.subscribersByKey.set(e,r)),r.add(t),()=>{r.delete(t),r.size===0&&this.subscribersByKey.delete(e)}}notify(e,t,r){let a=this.subscribersByKey.get(e);if(!a)return;let n=Array.from(a.values());for(let s of n)try{s(t,r)}catch(y){console.error("Error invoking subscriber:",y)}}},g=new K,v="state",G=0,Q=class{constructor(e,t){this.defaultValue=e;this.pubSubKey=String(G++),this.storageAdapter=N(t,O.storeExpiryMs),this.setValueBounded=n=>{this.setValue(n)},g.setNoNotify(this.pubSubKey,e);let r=t?.lazyLoad;(r!==void 0?r:O.lazyLoad)||this.initDefaultValueOnce()}pubSubKey;storageAdapter;setValueBounded;initDone=!1;subscribe(e){return g.subscribe(this.pubSubKey,()=>e())}getSnapshot(){return g.get(this.pubSubKey)}setValue(e){if(typeof e=="function"){let t=g.get(this.pubSubKey);e=e(t)}g.set(this.pubSubKey,e),this.storageAdapter?.save(v,e)}delete(){g.set(this.pubSubKey,this.defaultValue),this.storageAdapter?.save(v,this.defaultValue)}async initDefaultValueOnce(){if(this.initDone)return;this.initDone=!0;let e=await this.storageAdapter?.load(v);g.set(this.pubSubKey,e!==void 0?e:this.defaultValue)}};function $(i,e){return new Q(i,e)}function P(i){return i.initDefaultValueOnce(),[(0,z.useSyncExternalStore)(t=>i.subscribe(t),()=>i.getSnapshot(),()=>i.getSnapshot()),i.setValueBounded]}function V(i){let e=new Set;return JSON.stringify(i,(t,r)=>{if(typeof r=="function")throw new Error("Functions should not be passed into query parameters");if(!r||typeof r!="object"||Array.isArray(r))return r;if(e.has(r))return"[Circular]";if(e.add(r),r!==i)try{JSON.stringify(r)}catch{return"[Unserializable]"}return Object.keys(r).sort().reduce((a,n)=>(a[n]=r[n],a),{})})}var C=B(require("lodash/isEqual")),x=require("react");function U(i){let[e,t]=(0,x.useState)(i);return(0,x.useMemo)(()=>e===i||(0,C.default)(e,i)?e:(t(i),i),[e,i])}var h={staleMs:0,expiryMs:30*R.MS_PER_DAY,refetchOnStale:!0,persistTo:void 0,maxSize:100,maxBytes:1e5,log:(...i)=>console.log("[sharedQuery]",...i)},w=class{inflightQueries=new Map;queryState;mountedKeys=new Map;queryName;queryFn;expiryMs;staleMs;refetchOnStale;maxSize;maxBytes;keepLastNonEmptyData;log;constructor(e){if(this.queryName=e.queryName,this.queryFn=e.queryFn,this.staleMs=e?.staleMs??h.staleMs,this.expiryMs=e?.expiryMs??h.expiryMs,this.refetchOnStale=e?.refetchOnStale??h.refetchOnStale,!e.localStorageKey&&!e.indexedDbKey){let t=e.persistTo??h.persistTo;t==="localStorage"?e.localStorageKey=e.queryName:t==="indexedDb"&&(e.indexedDbKey=e.queryName)}this.maxSize=e?.maxSize??h.maxSize,this.maxBytes=e?.maxBytes??h.maxBytes,this.keepLastNonEmptyData=!!e?.keepLastNonEmptyData,this.log=e?.log??h.log,this.queryState=$({},{...e,storeExpiryMs:e?.storeExpiryMs||this.expiryMs})}getQueryKey(e){return this.queryName+":"+V(e)}getAbortController(e){let t=this.getQueryKey(e);return this.getAbortControllerByKey(t)}getAbortControllerByKey(e){return this.inflightQueries.get(e)?.abortController??null}getAbortSignal(e){let t=this.getQueryKey(e);return this.getAbortSignalByKey(t)}getAbortSignalByKey(e){return this.getAbortControllerByKey(e)?.signal??null}isStale(e){return this.staleMs===0?!0:Date.now()-e>this.staleMs}isExpired(e){return this.expiryMs===0?!1:Date.now()-e>this.expiryMs}async getCachedOrFetch(...e){let t=this.getQueryKey(e),r=this.queryState.getSnapshot()?.[t];return r?.data&&!this.isExpired(r.dataUpdatedMs??0)?this.isStale(r.dataUpdatedMs??0)?(this.refetchOnStale&&(this.log(`refetchOnStale for ${t}`),this.dedupedFetch(t,...e)),this.log(`Returning stale data for ${t}`),r.data):(this.log(`Return fresh data ${t} from cache without fetching`),r.data):await this.dedupedFetch(t,...e)}dedupedFetch(e,...t){let r=this.inflightQueries.get(e);if(r)return this.log(`Deduplicating inflight fetch for ${e}`),r.promise;let a=this.startFetching(e,t),n=new AbortController;return this.inflightQueries.set(e,{promise:a,abortController:n}),a}async startFetching(e,t){this.log(`Start fetching ${e}`);try{let r=await this.queryFn(...t);return this.log(`Successfully fetched ${e}`),this.setData(e,r,Date.now()),r}catch(r){throw this.log(`Failed to fetch ${e}: ${r}`),r}finally{this.inflightQueries.delete(e)}}getQueryValue(e){return this.queryState.getSnapshot()?.[e]}getData(e){return this.queryState.getSnapshot()?.[e]?.data}setData(e,t,r=Date.now()){let a={lastUpdatedMs:Date.now(),loading:!1,data:t,dataUpdatedMs:r};this.queryState.setValue(n=>({...n,[e]:a})),this.enforceSizeLimit()}async updateFromSource(...e){let t=this.getQueryKey(e);return await this.dedupedFetch(t,...e)}deleteData(e){let r={...this.queryState.getSnapshot()};delete r[e],this.queryState.setValue(r);let a=this.inflightQueries.get(e);a&&(this.inflightQueries.delete(e),a.abortController.abort("Deleted"))}clear(){this.queryState.delete();for(let{abortController:e}of Array.from(this.inflightQueries.values()))e.abort("Cleared");this.inflightQueries.clear()}mount(e){this.mountedKeys.set(e,(this.mountedKeys.get(e)??0)+1)}unmount(e){let t=this.mountedKeys.get(e);t===1?this.mountedKeys.delete(e):this.mountedKeys.set(e,(t??0)-1)}enforceSizeLimit(){if(!this.maxSize&&!this.maxBytes)return;let e=this.queryState.getSnapshot(),t=Object.keys(e).length;if(t<=1)return;let r=(0,b.default)(e),a=this.maxSize?t-this.maxSize:0,n=this.maxBytes?r-this.maxBytes:0;if(a<=0&&n<=0){this.log(`No need to trim data for ${this.queryName}: size=${t} (limit=${this.maxSize}), byteSize=${r.toLocaleString()} (limit=${this.maxBytes.toLocaleString()})`);return}this.log(`Need to trim ${this.queryName}: numToCut=${a}, bytesToCut=${n}`);let s={...e},y=!1,p=Object.entries(s).sort((d,S)=>d[1].lastUpdatedMs-S[1].lastUpdatedMs);for(let[d]of p){if(this.mountedKeys.has(d)){this.log(`Cannot clean up ${d} as it is mounted`);continue}let S=(0,b.default)(d)+(0,b.default)(s[d]);if(this.log(`Cleaning up unmounted ${d} (byteSize=${S.toLocaleString()})`),a--,n-=S,delete s[d],y=!0,a<=0&&n<=0)break}if(!y){this.log(`No trimmable entries found for ${this.queryName}: size=${t} (limit=${this.maxSize}), byteSize=${r.toLocaleString()} (limit=${this.maxBytes.toLocaleString()})`);return}this.queryState.setValue(s),this.log(`Trimmed data for ${this.queryName}: size=[${t} -> ${Object.keys(s).length}] (limit=${this.maxSize}), byteSize=[${r.toLocaleString()} -> ${(0,b.default)(s).toLocaleString()}] (limit=${this.maxBytes.toLocaleString()})`)}},F=new Set;function H(i){if(F.has(i.queryName))throw new Error(`Duplicate shared query "${i.queryName}"`);return F.add(i.queryName),new w(i)}var L={lastUpdatedMs:0,loading:!0};function X(i,e=[]){let t=U(e),[r,a]=P(i.queryState),n=(0,u.useRef)(!0),s=(0,u.useMemo)(()=>i.getQueryKey(t),[i,t]),y=r[s]??L,p=(0,u.useCallback)(c=>{a(o=>{let l={...o};return l[s]=typeof c=="function"?c(l[s]??L):c,l})},[s,a]),[d,S]=(0,u.useState)();(0,u.useEffect)(()=>{i.keepLastNonEmptyData&&y.data!==void 0&&S(y.data)},[i.keepLastNonEmptyData,y.data]);let m=(0,u.useCallback)(async c=>{i.log(`Begin executing shared query ${s}`),p(o=>({...o,lastUpdatedMs:Date.now(),loading:!0}));try{let o=await(c?i.updateFromSource(...t):i.getCachedOrFetch(...t));if(n.current){let l=Date.now();p({lastUpdatedMs:l,loading:!1,data:o,dataUpdatedMs:l})}}catch(o){if(n.current){let l=Date.now();p(D=>({...D,lastUpdatedMs:l,loading:!1,error:o,errorUpdatedMs:l}))}}},[i,s,p,t]);return(0,u.useEffect)(()=>(n.current=!0,i.mount(s),m(!1),()=>{n.current=!1,i.unmount(s)}),[m,i,s]),(0,u.useMemo)(()=>({...y,lastNonEmptyData:d,abortCurrentQuery:c=>{let o=i.getAbortControllerByKey(s);return o?.abort(c),!!o},refetch:()=>{m(!0)},setData:(c,o)=>{let l=Date.now();p(D=>({...D,data:c,dataUpdatedMs:o??l,lastUpdatedMs:l,loading:!1}))},deleteData:()=>{a(c=>{let o={...c};return delete o[s],o})}}),[m,d,i,s,y,a,p])}0&&(module.exports={SharedQuery,SharedQueryDefaults,sharedQuery,useSharedQuery});
 //# sourceMappingURL=sharedQuery.min.cjs.map