Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/sergiodxa/redux-duck
Helper function to create Redux modules using the ducks-modular-redux proposal
https://github.com/sergiodxa/redux-duck
action-payload duck helpers reducer redux redux-ducks
Last synced: 3 months ago
JSON representation
Helper function to create Redux modules using the ducks-modular-redux proposal
- Host: GitHub
- URL: https://github.com/sergiodxa/redux-duck
- Owner: sergiodxa
- License: mit
- Archived: true
- Created: 2019-11-18T22:43:48.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2022-05-25T15:50:04.000Z (about 2 years ago)
- Last Synced: 2024-04-16T09:08:52.607Z (3 months ago)
- Topics: action-payload, duck, helpers, reducer, redux, redux-ducks
- Language: TypeScript
- Homepage: https://github.com/sergiodxa/redux-duck
- Size: 879 KB
- Stars: 10
- Watchers: 3
- Forks: 2
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Lists
- awesome-redux - **redux-duck** - Helper function to create Redux modules using the ducks-modular-redux proposal
README
# redux-duck
[](https://codeclimate.com/github/sergiodxa/redux-duck/maintainability)
[](https://codeclimate.com/github/sergiodxa/redux-duck/test_coverage)
Helper function to create Redux modules using the [ducks-modular-redux](https://github.com/erikras/ducks-modular-redux/) proposal.
## Installation
```sh
yarn add redux-duck
```
## API
### Create duck
```ts
import { createDuck } from "redux-duck";
const myDuck = createDuck("duck-name", "application-name");
```
- `createDuck` receive 2 arguments, the second argument is optional.
- The first argument is the duck name.
- The second, and optional, argument is the application or module name.
### Define action types
```ts
const ACTION_TYPE = myDuck.defineType("ACTION_TYPE");
```
- `defineType` receive just one argument.
- The argument is the name of the action.
- The result should be an string like `application-name/duck-name/ACTION_TYPE` or `duck-name/ACTION_TYPE` if the application or module name was not defined.
### Create action creators
```ts
const actionType = myDuck.createAction(ACTION_TYPE, false);
```
- `createAction` receive two arguments, the second argument is optional.
- The first argument is the action type.
- The second, and optional, argument is if the action will be an error one.
- This argument should be the defined action type string.
- It will return a function who will receive the action payload and meta data and return a valid (FSA compilant) action object.
- The action creator will receive two optional arguments, one with the action payload and another with the action meta data.
### Create reducer
```ts
const initialState = {
list: Immutable.List(),
data: Immutable.Map()
};
const reducer = myDuck.createReducer(
{
[ACTION_TYPE]: (state, action) => ({
...state,
list: state.list.push(action.payload.id),
data: state.map.set(action.payload.id + "", action.payload)
})
},
initialState
);
```
- `createReducer` receive two arguments, both required.
- The first argument is an object with the possible action cases.
- The second argument is the reducer initial state.
- The first argument should use the previously defined _action types_ as keys.
- Each key in the first argument object should be a function who will receive the current state and the dispatched action as arguments and return the updated state.