@mmstack/resource 20.2.7 → 20.2.8

package/fesm2022/mmstack-resource.mjs

@@ -1,11 +1,17 @@
-import { computed, untracked, InjectionToken, inject, isDevMode, signal, effect, Injector, linkedSignal, DestroyRef } from '@angular/core';
+import { computed, untracked, InjectionToken, isDevMode, inject, signal, effect, Injector, linkedSignal, DestroyRef } from '@angular/core';
 import { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';
 import { of, tap, map, finalize, shareReplay, interval, firstValueFrom, catchError, combineLatestWith, filter } from 'rxjs';
-import { HttpContextToken, HttpContext, HttpResponse, HttpParams, HttpHeaders, httpResource, HttpClient } from '@angular/common/http';
+import { HttpHeaders, HttpResponse, HttpContextToken, HttpContext, HttpParams, httpResource, HttpClient } from '@angular/common/http';
 import { mutable, toWritable } from '@mmstack/primitives';
 import { v7 } from 'uuid';
 import { keys, hash, entries } from '@mmstack/object';
 
+function isSyncMessage(msg) {
+    return (typeof msg === 'object' &&
+        msg !== null &&
+        'type' in msg &&
+        msg.type === 'cache-sync-message');
+}
 const ONE_DAY = 1000 * 60 * 60 * 24;
 const ONE_HOUR = 1000 * 60 * 60;
 const DEFAULT_CLEANUP_OPT = {
@@ -23,6 +29,14 @@ class Cache {
     staleTime;
     internal = mutable(new Map());
     cleanupOpt;
+    /**
+     * Destroys the cache instance, cleaning up any resources used by the cache.
+     * This method is called automatically when the cache instance is garbage collected.
+     */
+    destroy;
+    broadcast = () => {
+        // noop
+    };
     /**
      * Creates a new `Cache` instance.
      *
@@ -31,12 +45,14 @@ class Cache {
      *                    stale but can still be used while revalidation occurs in the background. Defaults to 1 hour.
      * @param cleanupOpt - Options for configuring the cache cleanup strategy.  Defaults to LRU with a
      *                     `maxSize` of 200 and a `checkInterval` of one hour.
+     * @param syncTabs - If provided, the cache will use the options a BroadcastChannel to send updates between tabs.
+     *                   Defaults to `undefined`, meaning no synchronization across tabs.
      */
     constructor(ttl = ONE_DAY, staleTime = ONE_HOUR, cleanupOpt = {
         type: 'lru',
         maxSize: 1000,
         checkInterval: ONE_HOUR,
-    }) {
+    }, syncTabs) {
         this.ttl = ttl;
         this.staleTime = staleTime;
         this.cleanupOpt = {
@@ -49,14 +65,66 @@ class Cache {
         const cleanupInterval = setInterval(() => {
             this.cleanup();
         }, cleanupOpt.checkInterval);
-        const destroyId = v7();
+        const cacheId = v7();
+        let destroySyncTabs = () => {
+            // noop
+        };
+        if (syncTabs) {
+            const channel = new BroadcastChannel(syncTabs.id);
+            this.broadcast = (msg) => {
+                if (msg.action === 'invalidate')
+                    return channel.postMessage({
+                        action: 'invalidate',
+                        entry: { key: msg.entry.key },
+                        cacheId,
+                        type: 'cache-sync-message',
+                    });
+                return channel.postMessage({
+                    ...msg,
+                    entry: {
+                        ...msg.entry,
+                        value: syncTabs.serialize(msg.entry.value),
+                    },
+                    cacheId,
+                    type: 'cache-sync-message',
+                });
+            };
+            channel.onmessage = (event) => {
+                const msg = event.data;
+                if (!isSyncMessage(msg))
+                    return;
+                if (msg.cacheId === cacheId)
+                    return; // ignore messages from this cache
+                if (msg.action === 'store') {
+                    const value = syncTabs.deserialize(msg.entry.value);
+                    if (value === null)
+                        return;
+                    this.storeInternal(msg.entry.key, value, msg.entry.stale - msg.entry.updated, msg.entry.expiresAt - msg.entry.updated, true);
+                }
+                else if (msg.action === 'invalidate') {
+                    this.invalidateInternal(msg.entry.key, true);
+                }
+            };
+            destroySyncTabs = () => {
+                channel.close();
+            };
+        }
+        let destroyed = false;
+        const destroy = () => {
+            if (destroyed)
+                return;
+            destroyed = true;
+            clearInterval(cleanupInterval);
+            destroySyncTabs();
+        };
+        this.destroy = destroy;
         // cleanup if object is garbage collected, this is because the cache can be quite large from a memory standpoint & we dont want all that floating garbage
         const registry = new FinalizationRegistry((id) => {
-            if (id === destroyId) {
-                clearInterval(cleanupInterval);
+            if (id === cacheId) {
+                destroy();
             }
         });
-        registry.register(this, destroyId);
+        registry.register(this, cacheId);
     }
     /** @internal */
     getInternal(key) {
@@ -116,6 +184,9 @@ class Cache {
      * @param ttl - (Optional) The TTL for this entry, in milliseconds. Overrides the default `ttl`.
      */
     store(key, value, staleTime = this.staleTime, ttl = this.ttl) {
+        this.storeInternal(key, value, staleTime, ttl);
+    }
+    storeInternal(key, value, staleTime = this.staleTime, ttl = this.ttl, fromSync = false) {
         const entry = this.getUntracked(key);
         if (entry) {
             clearTimeout(entry.timeout); // stop invalidation
@@ -125,18 +196,27 @@ class Cache {
         if (ttl < staleTime)
             staleTime = ttl;
         const now = Date.now();
+        const next = {
+            value,
+            created: entry?.created ?? now,
+            updated: now,
+            useCount: prevCount + 1,
+            stale: now + staleTime,
+            expiresAt: now + ttl,
+            key,
+        };
         this.internal.mutate((map) => {
             map.set(key, {
-                value,
-                created: entry?.created ?? now,
-                useCount: prevCount + 1,
-                stale: now + staleTime,
-                expiresAt: now + ttl,
+                ...next,
                 timeout: setTimeout(() => this.invalidate(key), ttl),
-                key,
             });
             return map;
         });
+        if (!fromSync)
+            this.broadcast({
+                action: 'store',
+                entry: next,
+            });
     }
     /**
      * Invalidates (removes) a cache entry.
@@ -144,6 +224,9 @@ class Cache {
      * @param key - The key of the entry to invalidate.
      */
     invalidate(key) {
+        this.invalidateInternal(key);
+    }
+    invalidateInternal(key, fromSync = false) {
         const entry = this.getUntracked(key);
         if (!entry)
             return;
@@ -152,6 +235,8 @@ class Cache {
             map.delete(key);
             return map;
         });
+        if (!fromSync)
+            this.broadcast({ action: 'invalidate', entry: { key } });
     }
     /** @internal */
     cleanup() {
@@ -198,9 +283,53 @@ const CLIENT_CACHE_TOKEN = new InjectionToken('INTERNAL_CLIENT_CACHE');
  * };
  */
 function provideQueryCache(opt) {
+    const syncTabsOpt = opt?.syncTabsId
+        ? {
+            id: opt.syncTabsId,
+            serialize: (value) => {
+                const headersRecord = {};
+                const headerKeys = value.headers.keys();
+                headerKeys.forEach((key) => {
+                    const values = value.headers.getAll(key);
+                    if (!values)
+                        return;
+                    headersRecord[key] = values;
+                });
+                return JSON.stringify({
+                    body: value.body,
+                    status: value.status,
+                    statusText: value.statusText,
+                    headers: headerKeys.length > 0 ? headersRecord : undefined,
+                    url: value.url,
+                });
+            },
+            deserialize: (value) => {
+                try {
+                    const parsed = JSON.parse(value);
+                    if (!parsed || typeof parsed !== 'object' || !('body' in parsed))
+                        throw new Error('Invalid cache entry format');
+                    const headers = parsed.headers
+                        ? new HttpHeaders(parsed.headers)
+                        : undefined;
+                    return new HttpResponse({
+                        body: parsed.body,
+                        status: parsed.status,
+                        statusText: parsed.statusText,
+                        headers: headers,
+                        url: parsed.url,
+                    });
+                }
+                catch (err) {
+                    if (isDevMode())
+                        console.error('Failed to deserialize cache entry:', err);
+                    return null;
+                }
+            },
+        }
+        : undefined;
     return {
         provide: CLIENT_CACHE_TOKEN,
-        useValue: new Cache(opt?.ttl, opt?.staleTime, opt?.cleanup),
+        useValue: new Cache(opt?.ttl, opt?.staleTime, opt?.cleanup, syncTabsOpt),
     };
 }
 class NoopCache extends Cache {