@gluonjs/core / packages/store/src / StoreManager
Class: StoreManager
Constructors
Constructor
new StoreManager(
options?):StoreManager
Parameters
options?
StoreManagerOptions = {}
Returns
StoreManager
Methods
addPlugin()
addPlugin(
plugin): () =>void
Parameters
plugin
Returns
() => void
dehydrate()
dehydrate():
StoreSnapshot
Returns
deserialize()
deserialize(
serialized):void
Parameters
serialized
string
Returns
void
dispose()
dispose():
void
Returns
void
hotUpdate()
hotUpdate<
Id,State,Getters,Actions>(definition,metadata?):Store<Id,State,Getters,Actions>
Type Parameters
Id
Id extends string
State
State extends StateTree
Getters
Getters extends StoreGetterTree<State>
Actions
Actions extends StoreActionTree
Parameters
definition
StoreDefinition<Id, State, Getters, Actions>
metadata?
Returns
Store<Id, State, Getters, Actions>
hydrate()
hydrate(
snapshot):void
Parameters
snapshot
Returns
void
serialize()
serialize():
string
Returns
string
subscribe()
subscribe(
callback): () =>void
Parameters
callback
Returns
() => void
use()
use<
Id,State,Getters,Actions>(definition):Store<Id,State,Getters,Actions>
Type Parameters
Id
Id extends string
State
State extends StateTree
Getters
Getters extends StoreGetterTree<State>
Actions
Actions extends StoreActionTree
Parameters
definition
StoreDefinition<Id, State, Getters, Actions>
Returns
Store<Id, State, Getters, Actions>
withMetadata()
withMetadata<
Result>(metadata,callback):Result
Type Parameters
Result
Result
Parameters
metadata
callback
() => Result
Returns
Result
Example
Own Store instances, plugins, transaction observation, metadata, hydration, HMR, serialization, and deterministic disposal for one application or test:
import {
StoreManager,
createStoreManager,
createTestingStoreManager,
defineStore,
type JsonPrimitive,
type JsonValue,
type StateTree,
type Store,
type StoreActionContext,
type StoreActionSubscription,
type StoreActionTree,
type StoreGetterTree,
type StoreGetterValues,
type StoreManagerOptions,
type StorePlugin,
type StorePluginDefinition,
type StorePluginResult,
type StorePluginStore,
type StoreProperties,
type StoreSnapshot,
type StoreSubscription,
type StoreTransaction,
type StoreTransactionMetadata,
type StoreTransactionStatus,
type StoreTransactionType,
type TestingStoreManagerOptions,
} from '@gluonjs/store';
type CartState = { items: string[]; open: boolean };
type CartGetters = { count: number };
type CartActions = { add(item: string): number };
const stateTree: StateTree = { items: [], open: false };
const getterTree: StoreGetterTree<CartState> = { count: 0 };
const getterValues: StoreGetterValues<CartGetters> = { count: 0 };
const actionTree: StoreActionTree = { add: (_item: string) => 1 };
const transactionType: StoreTransactionType = 'action';
const transactionStatus: StoreTransactionStatus = 'fulfilled';
const metadata: StoreTransactionMetadata = { source: 'product-page' };
const primitive: JsonPrimitive = 'lamp';
const json: JsonValue = { items: [primitive] };
const records: StoreTransaction[] = [];
const subscription: StoreSubscription = (transaction) => records.push(transaction);
const options = { onTransaction: subscription } satisfies StoreManagerOptions;
const manager: StoreManager = createStoreManager(options);
const definition = defineStore({
id: 'cart',
state: (): CartState => ({ items: [], open: false }),
getters: (state): CartGetters => ({ count: state.items.length }),
actions: (store): CartActions => ({ add(item) { store.items.push(item); return store.items.length; } }),
});
const cart: Store<'cart', CartState, CartGetters, CartActions> = definition.use(manager);
const properties: StoreProperties<'cart', CartState> = cart;
const actionSubscription: StoreActionSubscription = (context: StoreActionContext) =>
context.after((result) => console.log('action result', result));
const stopAction = cart.$onAction(actionSubscription);
manager.withMetadata(metadata, () => cart.add('lamp'));
const snapshot: StoreSnapshot = manager.dehydrate();
const plugin: StorePlugin = ({ definition: pluginDefinition, store }) => {
const typedDefinition: StorePluginDefinition = pluginDefinition;
const typedStore: StorePluginStore = store;
const result: StorePluginResult = { inspectionId: `${typedDefinition.id}:${typedStore.$id}` };
return result;
};
manager.addPlugin(plugin);
const testingOptions = { initialState: snapshot, plugins: [plugin] } satisfies TestingStoreManagerOptions;
const testing = createTestingStoreManager(testingOptions);
console.log(stateTree, getterTree, getterValues, actionTree, transactionType, transactionStatus, json, properties.$state, testing.use(definition).items);
stopAction();
testing.dispose();
manager.dispose();