rematchjs_typescript_store_setup_with_typed_dispatch_and_state.ts

1import { init, RematchDispatch, RematchRootState } from '@rematch/core'
2import { createModel } from '@rematch/core'
3
4// 1. Define a model
5export const count = createModel<RootModel>()({
6  state: 0,
7  reducers: {
8    increment(state, payload: number) {
9      return state + payload
10    },
11  },
12  effects: (dispatch) => ({
13    async incrementAsync(payload: number) {
14      await new Promise((resolve) => setTimeout(resolve, 1000))
15      dispatch.count.increment(payload)
16    },
17  }),
18})
19
20// 2. Define the models interface
21export interface RootModel {
22  count: typeof count
23}
24
25export const models: RootModel = { count }
26
27// 3. Initialize the store
28export const store = init({
29  models,
30})
31
32// 4. Export types for use in your app
33export type Store = typeof store
34export type Dispatch = RematchDispatch<RootModel>
35export type RootState = RematchRootState<RootModel>