Utility for awaiting Storeon events.
It size is 67 B (minified and gzipped) and uses Size Limit to control size.
The goal of this tiny library is provide the easy way to awaiting occurrence of the particular storeon event.
npm i storeon-until --save
From version 1.1.0 we provided the shortcut to inline the await statement with dispatch.
The returned promise contains the dispatch function which allows to dispatch the event on store,
that function returns the promise again.
import { createStoreon } from "storeon";
import { until } from "storeon-until";
// create store
const store = createStoreon([]);
// some async event handler
store.on('loadDocument', async (state, id) => {
const document = await fetch(`http://some.document.com/${id}`);
store.dispatch('documentLoaded', {id, document});
});
// reducer for ending event
store.on('documentLoaded', (_, {id, document}) => ({
id,
document
}));
const {id, document} =
// awaiting for the ending event
await until(store, 'documentLoaded', (_, {id}) => id === 'id1')
// dispatch event over waiting
.dispatchOver('loadDocument', 'id1');
console.log(document);
const {id, document} =
// waits until data in state will pass condition
await until(store, '@changed', ({id}) => id === 'id2')
// dispatch event over waiting
.dispatchOver('loadDocument', 'id2');
console.log(document);import { createStoreon } from "storeon";
import { until } from "storeon-until";
// create store
const store = createStoreon([]);
// some async event handler
store.on('loadDocument', async (state, id) => {
const document = await fetch(`http://some.document.com/${id}`);
store.dispatch('documentLoaded', {id, document});
});
// reducer for ending event
store.on('documentLoaded', (_, {id, document}) => ({
id,
document
}));
// awaiting for the ending event
const documentLoadedPromise = until(store, 'documentLoaded', (_, {id}) => id === 'id1');
// dispatch event
store.dispatch('loadDocument', 'id1');
// waits until async flow will finish
const {id, document} = await documentLoadedPromise;
console.log(document);
// we can also await for the state
const statePromise = until(store, '@changed', ({id}) => id === 'id2');
// dispatch event
store.dispatch('loadDocument', 'id2');
// waits until data in state will pass condition
const {id, document} = await statePromise;
console.log(document);Caution
Please notice, that we should always use until utility to create promise before the event dispatch
as dispatched event can run synchronously.
-
until- is function which returnsUntilResult(which is promise) of requested event data. Params:-
storethe store -
eventthe event which we are waiting for -
condition- (optional) - the function which gets state, and event data and have to return true if promise has to be resolved for that state or data
-
-
UntilResult-
dispatchOver- function which allows to dispatch event on the store in await place
-