To create the queue, use:
makeQueue<T>(
state: IStateRecord<T>,
reducers: IReducer<T>[],
subscribers: ISubscriber<T>[] = []
)
Example:
import { queue } from "state0";
// instead of "IClickState", you can use your own type / interface.
// For example, maybe your dispatcher takes care of multiple states,
// you can use (IUserState | INotesState | ISettingsState) instead of "IClickState".
const queue = makeQueue<IClickState>(
initialState,
[clickReducer],
[clickSubscriber]
);
Events can be dispatched using
queueDispatch(queue: IQueue<T>, IAction<T>)
queueDispatch(queue, { type: ACTION_CLICK_INCREASE, payload: { amount: 1 } });
To subscribe on an event, use
queueSubscribe(queue: IQueue<T>, ISubscriber<T>)
export const clickSubscriber = {
type: CLICK_ACTION,
id: "mySubscriberId",
trigger: (data: IClickState) => {
console.log(`Just received some data ${data}`);
},
};
queueSubscribe(queue, clickSubscriber);
Reducers are added when calling
makeQueue
(as mentioned at the top of this page).
You can pass a reducer to it like this:
export const clickReducer = {
type: CLICK_ACTION,
trigger: (prevState: IClickState, nextState: IClickState): IClickState => {
return { amount: prevState.amount + nextState.amount };
},
};
const queue = makeQueue<IClickState>(
initialState,
[clickReducer],
[clickSubscriber]
);
Since its probably most likely you are going to use this with React,
Here is how to do that:
State0 with React