Skip to content

Commit

Permalink
Add README, tweak project settings
Browse files Browse the repository at this point in the history
  • Loading branch information
dphilipson committed Jan 19, 2017
1 parent 1267e6c commit f93bed1
Show file tree
Hide file tree
Showing 4 changed files with 70 additions and 1 deletion.
3 changes: 3 additions & 0 deletions .travis.yml
@@ -0,0 +1,3 @@
language: node_js
node_js:
- "node"
63 changes: 63 additions & 0 deletions README.md
Expand Up @@ -2,4 +2,67 @@

Fluent syntax for defining typesafe reducers on top of [redux-typescript-actions](https://github.com/aikoven/redux-typescript-actions).

[![Build Status](https://travis-ci.org/dphilipson/redux-typescript-reducers.svg?branch=master)](https://travis-ci.org/dphilipson/redux-typescript-reducers)

## Installation

```
npm install --save redux-typescript-reducers
```

## Usage

This library allows you to define reducers by chaining a series of handlers for different action
types and optionally providing an initial value. It assumes familiarity with the excellent library
[redux-typescript-actions](https://github.com/aikoven/redux-typescript-actions).

Suppose we have the setup:
``` javascript
import actionCreatorFactory from "redux-typescript-actions";

const actionCreator = actionCreatorFactory();

const INITIAL_STATE = "Hello";

const sliceState = actionCreator<number>("SLICE_STATE");
function sliceStateHandler(state: string, payload: number): string {
return state.slice(payload);
}

const toUpperCaseState = actionCreator<void>("TO_UPPER_CASE_STATE");
function toUpperCaseStateHandler(state: string): string {
return state.toUpperCase();
}
```
Using vanilla `redux-typescript-actions`, you would most likely define a reducer as follows:
``` javascript
import { Action } from "redux";
import { isType } from "redux-typescript-actions";

function reducer(state = INITIAL_STATE, action: Action): State {
if (isType(action, sliceState)) {
return sliceStateHandler(state, action.payload);
} else if (isType(action, toUpperCaseState)) {
return toUpperCaseStateHandler(state, action.payload);
} else {
return state;
}
}
```
With `redux-typescript-reducers`, this is exactly equivalent to the following code:
``` javascript
import { reducerWithInitialState } from "redux-typescript-reducer";

const reducer = reducerWithInitialState(INITIAL_STATE)
.case(sliceState, sliceStateHandler)
.case(toUpperCaseState, toUpperCaseStateHandler);
```
Everything is typesafe. If the handler is handling the wrong payload type for the given action
type, then TypeScript will complain.

`redux-typescript-reducers` exports two functions: `reducerWithInitialState` and
`reducerWithoutInitialState`. Redux seems to really want you to provide an initial state for your
reducers (and enforces it at the root level and if you use `combineReducers`), so
`reducerWithInitialState` will likely be the more common choice.

Copyright © 2017 David Philipson
3 changes: 3 additions & 0 deletions package.json
Expand Up @@ -4,6 +4,9 @@
"description": "Fluent syntax for defining typesafe reducers on top of redux-typescript-actions.",
"main": "dist/index.js",
"types": "dist/index",
"files": [
"dist/"
],
"repository": {
"type": "git",
"url": "git://github.com/dphilipson/redux-typescript-reducers.git"
Expand Down
2 changes: 1 addition & 1 deletion src/index.ts
@@ -1,4 +1,4 @@
import { Action, Reducer } from "redux";
import { Action } from "redux";
import { ActionCreator, isType } from "redux-typescript-actions";

export interface ReducerBuilder<S> {
Expand Down

0 comments on commit f93bed1

Please sign in to comment.