Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/cjies/redux-duck-immer
Helpers to adapt ducks-modular-redux proposal
https://github.com/cjies/redux-duck-immer
immer redux redux-duck
Last synced: 9 days ago
JSON representation
Helpers to adapt ducks-modular-redux proposal
- Host: GitHub
- URL: https://github.com/cjies/redux-duck-immer
- Owner: cjies
- License: mit
- Created: 2018-05-18T14:21:19.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2023-01-06T01:47:20.000Z (about 2 years ago)
- Last Synced: 2024-12-21T13:40:54.931Z (18 days ago)
- Topics: immer, redux, redux-duck
- Language: TypeScript
- Homepage:
- Size: 1.04 MB
- Stars: 8
- Watchers: 2
- Forks: 0
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# redux-duck-immer
[![NPM version](https://img.shields.io/npm/v/redux-duck-immer.svg?style=flat-square)](https://www.npmjs.com/package/redux-duck-immer)
[![Build status](https://img.shields.io/travis/cjies/redux-duck-immer.svg?style=flat-square)](https://travis-ci.org/cjies/redux-duck-immer)
[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)Inspired by [redux-duck](https://github.com/PlatziDev/redux-duck).
Providing redux helpers to implement [ducks-modular-redux](https://github.com/erikras/ducks-modular-redux/) proposal.
And the reducer's state is produced by [Immer](https://github.com/mweststrate/immer) for immutability.## Installation
```bash
yarn add redux-duck-immer
```## API
### Define action types
```javascript
import { defineType } from 'redux-duck-immer';/**
* type ActionType = string;
*
* (...actionTypes: string[]): ActionType;
*/
const UPDATE = defineType('UPDATE');
const PREFIXED_UPDATE = defineType('prefix', 'UPDATE'); // 'prefix/UPDATE'
```- `defineType` method receive one or many arguments.
- If multiple arguments are provided, its result should be a string like `prefix/UPDATE`.### Create action creator
```javascript
import { createAction } from 'redux-duck-immer';/**
* interface Action{
* type: ActionType;
* payload?: P;
* }
*
* (actionType: ActionType):(payload?: P) => Action
;
*/
const update = createAction(UPDATE);// Dispatch action
dispatch(update('hello world!'));
```- `createAction` method receive just one argument.
- This argument should be the defined action type string.
- It should return a function who will receive the action payload and return a valid (FSA compilant) action object.
- The action creator will receive an optional argument with the action payload.### Create reducer
```javascript
import { createReducer } from 'redux-duck-immer';const initialState = {
message: '',
};/**
* interface ActionCases {
* [actionType: ActionType]: (state: S, action: Action) => void | S;
* }
*
* (initState: any, cases: ActionCases): (state: S, action: Action) => S;
*/
const reducer = createReducer(initState, {
[UPDATE]: (state, action) => ({
state.message = action.payload
}),
});
```- `createReducer` method receive two arguments, both required.
- The first argument is the reducer initial state.
- The second argument is an object with the possible action cases, should use the previously defined _action types_ as keys.
- Each key in the action cases should be a function who will receive the current state and the dispatched action as arguments.
- Reducer state is immutable which protected by [Immer](https://github.com/mweststrate/immer). In each action case, Immer will produce the nextState based on the mutations to the draft state.## License
Check [LICENSE](/LICENSE) file for more details.