store

Installation

npm install @flexbase/store

or

yarn add @flexbase/store

Concepts

The concept behind the store is to separate state management from other application concerns. It is Promise based utilizing an Observer pattern.

Usage

Example data

interface SomeData {
  name: string;
  id: number;
}

Create a store

const someDataStore = createStore<SomeData>();

const someOtherStore = createStore<number>();

Create Store Options

// object style
const someDataStore = createStore<SomeData>({
        key?: symbol, // use the specified key to represent this store; otherwise Symbol() is used
        defaultValue?: <SomeData>, // use the specified value as the default value
        comparer?: StoreComparer<SomeData>, // use the specified comparer; otherwise defaultStoreComparer is used
        middleware?: StoreMiddleware<SomeData>[], // use the specified middleware(s)
        persistanceProvider?: PersistanceProvider<SomeData>, // use the specified persistance provider
        storageManager: StorageManager // use the specified storage manager; otherwise use the global manager
});

// fluent style
const someDataStore = createStore<SomeData>(options => {
    options
        .key(key: symbol | string) // use the specified key to represent this store; otherwise Symbol() is used
        .defaultValue(value: <SomeData>) // use the specified value as the default value
        .comparer(comparer: StoreComparer<SomeData>) // use the specified comparer; otherwise defaultStoreComparer is used
        .middleware(...middleware: StoreMiddleware<SomeData>[]) // use the specified middleware(s)
        .persistanceProvider(persistanceProvider: PersistanceProvider<SomeData>) // use the specified persistance provider
        .storageManager(storageManager: StorageManager) // use the specified storage manager; otherwise use the global manager
});

Get store value

const value = getStoreValue(someDataStore);

Set store value

await setStoreValue(someDataStore, { name: 'Test', id: 1 });

await setStoreValue(someOtherStore, 42);

Using a callback

await setStoreValue(someDataStore, _ => {name: 'Test', id: 1});

await setStoreValue(someOtherStore, _ => 42);

// do more in the callback
await setStoreValue(test, currentValue => (currentValue ? Math.min(42, currentValue) : 0));

Reset store value

let value: number;

const numberStore = createStore<number>({ defaultValue: 42 });

value = storageManager.getValue(numberStore); // value is 42

await storageManager.setValue(numberStore, 1);

value = storageManager.getValue(numberStore); // value is 1

await resetStoreValue(numberStore);

value = storageManager.getValue(numberStore); // value is 42

Get store setter

const setter = getStoreSetter(someDataStore);

await setter({ name: 'Test', id: 1 });

await setter(_ => {name: 'Test', id: 1});

Subscribe

const subscription = subscribeToStore(someDataStore, context => {...});

subscription.unsubscribe();

Persistance

TODO

Middleware

TODO