@angular-architects/ngrx-toolkit 20.0.2 → 20.1.0

package/src/lib/storage-sync/tests/with-storage-sync.spec.ts

@@ -1,273 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-import { getState, patchState, signalStore, withState } from '@ngrx/signals';
-import { withLocalStorage } from '../features/with-local-storage';
-import { withStorageSync } from '../with-storage-sync';
-
-interface StateObject {
-  foo: string;
-  age: number;
-}
-
-const initialState: StateObject = {
-  foo: 'bar',
-  age: 18,
-};
-const key = 'FooBar';
-
-describe('withStorageSync (sync storage)', () => {
-  beforeEach(() => {
-    // make sure to start with a clean storage
-    localStorage.removeItem(key);
-  });
-
-  it('adds methods for storage access to the store', () => {
-    TestBed.runInInjectionContext(() => {
-      const Store = signalStore(withStorageSync({ key }));
-      const store = new Store();
-
-      expect(Object.keys(store)).toEqual([
-        'clearStorage',
-        'readFromStorage',
-        'writeToStorage',
-      ]);
-    });
-  });
-
-  it('offers manual sync using provided methods', () => {
-    TestBed.runInInjectionContext(() => {
-      // prefill storage
-      localStorage.setItem(
-        key,
-        JSON.stringify({
-          foo: 'baz',
-          age: 99,
-        } as StateObject),
-      );
-
-      const Store = signalStore(
-        { protectedState: false },
-        withState(initialState),
-        withStorageSync({ key, autoSync: false }),
-      );
-      const store = new Store();
-      expect(getState(store)).toEqual(initialState);
-
-      store.readFromStorage();
-      expect(getState(store)).toEqual({
-        foo: 'baz',
-        age: 99,
-      });
-
-      patchState(store, { ...initialState });
-      TestBed.flushEffects();
-
-      let storeItem = JSON.parse(localStorage.getItem(key) || '{}');
-      expect(storeItem).toEqual({
-        foo: 'baz',
-        age: 99,
-      });
-
-      store.writeToStorage();
-      storeItem = JSON.parse(localStorage.getItem(key) || '{}');
-      expect(storeItem).toEqual({
-        ...initialState,
-      });
-
-      store.clearStorage();
-      storeItem = localStorage.getItem(key);
-      expect(storeItem).toEqual(null);
-    });
-  });
-
-  describe('autoSync', () => {
-    it('inits from storage and write to storage on changes when set to `true`', () => {
-      TestBed.runInInjectionContext(() => {
-        // prefill storage
-        localStorage.setItem(
-          key,
-          JSON.stringify({
-            foo: 'baz',
-            age: 99,
-          } as StateObject),
-        );
-
-        const Store = signalStore(
-          { protectedState: false },
-          withState(initialState),
-          withStorageSync(key),
-        );
-        const store = new Store();
-        expect(getState(store)).toEqual({
-          foo: 'baz',
-          age: 99,
-        });
-
-        patchState(store, { ...initialState });
-        TestBed.flushEffects();
-
-        expect(getState(store)).toEqual({
-          ...initialState,
-        });
-        const storeItem = JSON.parse(localStorage.getItem(key) || '{}');
-        expect(storeItem).toEqual({
-          ...initialState,
-        });
-      });
-    });
-
-    it('does not init from storage and does write to storage on changes when set to `false`', () => {
-      TestBed.runInInjectionContext(() => {
-        // prefill storage
-        localStorage.setItem(
-          key,
-          JSON.stringify({
-            foo: 'baz',
-            age: 99,
-          } as StateObject),
-        );
-
-        const Store = signalStore(
-          { protectedState: false },
-          withState(initialState),
-          withStorageSync({ key, autoSync: false }),
-        );
-        const store = new Store();
-        expect(getState(store)).toEqual(initialState);
-
-        patchState(store, { ...initialState });
-        const storeItem = JSON.parse(localStorage.getItem(key) || '{}');
-        expect(storeItem).toEqual({
-          foo: 'baz',
-          age: 99,
-        });
-      });
-    });
-  });
-
-  describe('select', () => {
-    it('syncs the whole state by default', () => {
-      TestBed.runInInjectionContext(() => {
-        const Store = signalStore(
-          { protectedState: false },
-          withState(initialState),
-          withStorageSync(key),
-        );
-        const store = new Store();
-
-        patchState(store, { foo: 'baz', age: 25 });
-
-        const storeItem = JSON.parse(localStorage.getItem(key) || '{}');
-        expect(storeItem).toEqual({
-          foo: 'baz',
-          age: 25,
-        });
-      });
-    });
-
-    it('syncs selected slices when specified', () => {
-      TestBed.runInInjectionContext(() => {
-        const Store = signalStore(
-          { protectedState: false },
-          withState(initialState),
-          withStorageSync({ key, select: ({ foo }) => ({ foo }) }),
-        );
-        const store = new Store();
-
-        patchState(store, { foo: 'baz' });
-        TestBed.flushEffects();
-
-        const storeItem = JSON.parse(localStorage.getItem(key) || '{}');
-        expect(storeItem).toEqual({
-          foo: 'baz',
-        });
-      });
-    });
-  });
-
-  describe('parse/stringify', () => {
-    it('uses custom parsing/stringification when specified', () => {
-      const parse = (stateString: string) => {
-        const [foo, age] = stateString.split('_');
-        return {
-          foo,
-          age: +age,
-        };
-      };
-
-      TestBed.runInInjectionContext(() => {
-        const Store = signalStore(
-          { protectedState: false },
-          withState(initialState),
-          withStorageSync({
-            key,
-            parse,
-            stringify: (state) => `${state.foo}_${state.age}`,
-          }),
-        );
-        const store = new Store();
-
-        patchState(store, { foo: 'baz' });
-        TestBed.flushEffects();
-
-        const storeItem = parse(localStorage.getItem(key) || '');
-        expect(storeItem).toEqual({
-          ...initialState,
-          foo: 'baz',
-        });
-      });
-    });
-  });
-
-  describe('storage factory', () => {
-    it('should throw an error when both config and storage strategy are provided', () => {
-      const signalStoreFactory = () =>
-        signalStore(
-          withStorageSync(
-            { key: 'foo', storage: () => localStorage },
-            withLocalStorage(),
-          ),
-        );
-
-      expect(signalStoreFactory).toThrow(
-        'You can either pass a storage strategy or a config with storage, but not both.',
-      );
-    });
-
-    it('uses specified storage', () => {
-      TestBed.runInInjectionContext(() => {
-        // prefill storage
-        sessionStorage.setItem(
-          key,
-          JSON.stringify({
-            foo: 'baz',
-            age: 99,
-          } as StateObject),
-        );
-
-        const Store = signalStore(
-          { protectedState: false },
-          withState(initialState),
-          withStorageSync({ key, storage: () => sessionStorage }),
-        );
-        const store = new Store();
-        expect(getState(store)).toEqual({
-          foo: 'baz',
-          age: 99,
-        });
-
-        patchState(store, { ...initialState });
-        TestBed.flushEffects();
-
-        expect(getState(store)).toEqual({
-          ...initialState,
-        });
-        const storeItem = JSON.parse(sessionStorage.getItem(key) || '{}');
-        expect(storeItem).toEqual({
-          ...initialState,
-        });
-
-        store.clearStorage();
-      });
-    });
-  });
-});

package/src/lib/storage-sync/with-storage-sync.ts

@@ -1,236 +0,0 @@
-import { isPlatformServer } from '@angular/common';
-import { computed, effect, inject, PLATFORM_ID, signal } from '@angular/core';
-import {
-  EmptyFeatureResult,
-  getState,
-  signalStoreFeature,
-  SignalStoreFeature,
-  SignalStoreFeatureResult,
-  watchState,
-  withHooks,
-  withMethods,
-  withProps,
-} from '@ngrx/signals';
-import {
-  withLocalStorage,
-  withSessionStorage,
-} from './features/with-local-storage';
-import {
-  AsyncFeatureResult,
-  AsyncStorageStrategy,
-  SYNC_STATUS,
-  SyncFeatureResult,
-  SyncStorageStrategy,
-} from './internal/models';
-
-export type SyncConfig<State> = {
-  /**
-   * The key which is used to access the storage.
-   */
-  key: string;
-  /**
-   * Flag indicating if the store should read from storage on init and write to storage on every state change.
-   *
-   * `true` by default
-   */
-  autoSync?: boolean;
-  /**
-   * Function to select that portion of the state which should be stored.
-   *
-   * Returns the whole state object by default
-   */
-  select?: (state: State) => unknown;
-  /**
-   * Function used to parse the state coming from storage.
-   *
-   * `JSON.parse()` by default
-   */
-  parse?: (stateString: string) => State;
-  /**
-   * Function used to transform the state into a string representation.
-   *
-   * `JSON.stringify()` by default
-   */
-  stringify?: (state: State) => string;
-
-  /**
-   * @deprecated Use {@link withSessionStorage} instead.
-   * Factory function used to switch to sessionStorage.
-   *
-   * `localStorage` by default
-   */
-  storage?: () => Storage;
-};
-
-// only key
-export function withStorageSync<Input extends SignalStoreFeatureResult>(
-  key: string,
-): SignalStoreFeature<Input, SyncFeatureResult>;
-
-// key + indexeddb
-export function withStorageSync<Input extends SignalStoreFeatureResult>(
-  key: string,
-  storageStrategy: AsyncStorageStrategy<Input['state']>,
-): SignalStoreFeature<Input, AsyncFeatureResult>;
-
-// key + localStorage(or sessionStorage)
-export function withStorageSync<Input extends SignalStoreFeatureResult>(
-  key: string,
-  storageStrategy: SyncStorageStrategy<Input['state']>,
-): SignalStoreFeature<Input, SyncFeatureResult>;
-
-// config + localStorage
-export function withStorageSync<Input extends SignalStoreFeatureResult>(
-  config: SyncConfig<Input['state']>,
-): SignalStoreFeature<Input, SyncFeatureResult>;
-
-// config + indexeddb
-export function withStorageSync<Input extends SignalStoreFeatureResult>(
-  config: SyncConfig<Input['state']>,
-  storageStrategy: AsyncStorageStrategy<Input['state']>,
-): SignalStoreFeature<Input, AsyncFeatureResult>;
-
-// config + localStorage(or sessionStorage)
-export function withStorageSync<Input extends SignalStoreFeatureResult>(
-  config: SyncConfig<Input['state']>,
-  storageStrategy: SyncStorageStrategy<Input['state']>,
-): SignalStoreFeature<Input, SyncFeatureResult>;
-
-export function withStorageSync<Input extends SignalStoreFeatureResult>(
-  configOrKey: SyncConfig<Input['state']> | string,
-  storageStrategy?:
-    | AsyncStorageStrategy<Input['state']>
-    | SyncStorageStrategy<Input['state']>,
-): SignalStoreFeature<
-  Input,
-  EmptyFeatureResult & (SyncFeatureResult | AsyncFeatureResult)
-> {
-  if (
-    typeof configOrKey !== 'string' &&
-    configOrKey.storage &&
-    storageStrategy
-  ) {
-    throw new Error(
-      'You can either pass a storage strategy or a config with storage, but not both.',
-    );
-  }
-  const config: Required<SyncConfig<Input['state']>> = {
-    autoSync: true,
-    select: (state: Input['state']) => state,
-    parse: JSON.parse,
-    stringify: JSON.stringify,
-    storage: () => localStorage,
-    ...(typeof configOrKey === 'string' ? { key: configOrKey } : configOrKey),
-  };
-
-  const factory =
-    storageStrategy ??
-    (config.storage() === localStorage
-      ? withLocalStorage()
-      : withSessionStorage());
-
-  if (factory.type === 'sync') {
-    return createSyncStorageSync(factory, config);
-  } else {
-    return createAsyncStorageSync(factory, config);
-  }
-}
-
-function createSyncStorageSync(
-  factory: SyncStorageStrategy<object>,
-  config: Required<SyncConfig<object>>,
-) {
-  return signalStoreFeature(
-    withMethods((store, platformId = inject(PLATFORM_ID)) => {
-      return factory(config, store, isPlatformServer(platformId));
-    }),
-    withHooks({
-      onInit(store, platformId = inject(PLATFORM_ID)) {
-        if (isPlatformServer(platformId)) {
-          return;
-        }
-
-        if (config.autoSync) {
-          store.readFromStorage();
-          watchState(store, () => store.writeToStorage());
-        }
-      },
-    }),
-  ) satisfies SignalStoreFeature<EmptyFeatureResult, SyncFeatureResult>;
-}
-
-function createAsyncStorageSync(
-  factory: AsyncStorageStrategy<object>,
-  config: Required<SyncConfig<object>>,
-) {
-  return signalStoreFeature(
-    withProps(() => {
-      const props = {
-        /*
-        // we need to have that as property (and not state)
-        // Otherwise the state watcher fires when updating the sync status
-        */
-        [SYNC_STATUS]: signal<'idle' | 'syncing' | 'synced'>('idle'),
-      };
-
-      const resolves = [] as (() => void)[];
-
-      effect(() => {
-        const syncStatus = props[SYNC_STATUS]();
-        if (syncStatus === 'synced') {
-          resolves.forEach((resolve) => resolve());
-          resolves.splice(0, resolves.length);
-        }
-      });
-
-      return {
-        ...props,
-        isSynced: computed(() => props[SYNC_STATUS]() === 'synced'),
-        whenSynced: () =>
-          new Promise<void>((resolve) => {
-            if (props[SYNC_STATUS]() === 'synced') {
-              resolve();
-            } else {
-              resolves.push(resolve);
-            }
-          }),
-      };
-    }),
-    withMethods((store, platformId = inject(PLATFORM_ID)) => {
-      return factory(config, store, isPlatformServer(platformId));
-    }),
-    withHooks({
-      async onInit(store, platformId = inject(PLATFORM_ID)) {
-        if (isPlatformServer(platformId)) {
-          return;
-        }
-
-        const initialState = JSON.stringify(getState(store));
-        if (config.autoSync) {
-          let startWatching = false;
-          watchState(store, () => {
-            if (!startWatching) {
-              const currentState = JSON.stringify(getState(store));
-
-              // Necessary because getState returns always a new object
-              if (currentState === initialState) {
-                return;
-              }
-
-              console.warn(
-                `Writing to Store (${config.key}) happened before the state was initially read from storage.`,
-                'Please ensure that the store is not in syncing state via `store.whenSynced()` before writing to the state.',
-                'Alternatively, you can disable autoSync by passing `autoSync: false` in the config.',
-              );
-              return;
-            }
-            return store.writeToStorage();
-          });
-
-          await store.readFromStorage();
-          startWatching = true;
-        }
-      },
-    }),
-  ) satisfies SignalStoreFeature<EmptyFeatureResult, AsyncFeatureResult>;
-}

package/src/lib/with-call-state.spec.ts

@@ -1,42 +0,0 @@
-import { patchState, signalStore } from '@ngrx/signals';
-import { setLoaded, setLoading, withCallState } from './with-call-state';
-
-describe('withCallState', () => {
-  it('should use and update a callState', () => {
-    const DataStore = signalStore({ protectedState: false }, withCallState());
-    const dataStore = new DataStore();
-
-    patchState(dataStore, setLoading());
-
-    expect(dataStore.callState()).toBe('loading');
-    expect(dataStore.loading()).toBe(true);
-  });
-
-  it('should use the callState for a collection', () => {
-    const DataStore = signalStore(
-      { protectedState: false },
-      withCallState({ collection: 'entities' }),
-    );
-    const dataStore = new DataStore();
-
-    patchState(dataStore, setLoaded('entities'));
-
-    expect(dataStore.entitiesCallState()).toBe('loaded');
-    expect(dataStore.entitiesLoaded()).toBe(true);
-  });
-
-  it('should use the callState for multiple collections with an array', () => {
-    const DataStore = signalStore(
-      { protectedState: false },
-      withCallState({ collections: ['entities', 'products'] }),
-    );
-    const dataStore = new DataStore();
-
-    patchState(dataStore, setLoaded('entities'), setLoaded('products'));
-
-    expect(dataStore.entitiesCallState()).toBe('loaded');
-    expect(dataStore.productsCallState()).toBe('loaded');
-    expect(dataStore.entitiesLoaded()).toBe(true);
-    expect(dataStore.productsLoaded()).toBe(true);
-  });
-});