Created
March 15, 2018 06:06
-
-
Save velopert/5e5a1a6f29ab76a1588497f5474e4cd3 to your computer and use it in GitHub Desktop.
Painless typed Redux reducer with Flow and Immer
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// @flow | |
import { createAction, handleActions, type ActionType } from 'redux-actions'; | |
import produce from 'immer'; | |
/* ACTION TYPE */ | |
const INCREASE = 'counter/INCREASE'; | |
/* ACTION CREATOR */ | |
const increase = createAction(INCREASE, (value: number) => value); | |
/* ACTION FLOW TYPE */ | |
type increaseAction = ActionType<typeof increase>; | |
/* ACTION CREATORS INTERFACE */ | |
export interface CounterActionCreators { | |
increase(value: number): increaseAction | |
} | |
/* EXPORT ACTION CREATORS */ | |
export const actionCreators: CounterActionCreators = { | |
increase | |
}; | |
/* STATE TYPES */ | |
export type Counter = { | |
value: number | |
}; | |
/* INITIAL STATE */ | |
const initialState: Counter = { | |
value: 0 | |
}; | |
/* REDUCER */ | |
export default handleActions({ | |
[INCREASE]: (state, action: increaseAction) => { | |
return produce(state, draft => { | |
draft.value += 1; | |
}); | |
} | |
}, initialState); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment