redux-dry-ts-actions

A micro library to help create action constructors and action types for redux. Written in, and designed for TypeScript.

Don't repeat yourself:

1. You define each action constructor together with its action type string.
2. TypeScript will then infer the action type union for you.

Declaring action constructors and action type

1const actions = {
2    addTodo: createAction('addTodo', (text: string) => ({ text })),
3    deleteTodo: createAction('deleteTodo', (id: string) => ({ id })),
4    clearCompleted: createAction('clearCompleted'),
5};
6
7type Action = ActionTypeFromActionCreators<typeof actions>;
8
9/* The Action type will be correctly inferred as:
10type Action =
11    { type: 'addTodo', payload: { text: string } } |
12    { type: 'deleteTodo', payload: { id: string } } |
13    { type: 'clearCompleted' };
14*/

Using action constructors

1private onAddTodoClicked = () => {
2    this.props.dispatch(actions.addTodo(this.state.text));
3};
4
5private onClearClicked = () => {
6    this.props.dispatch(actions.clearCompleted());
7};