Skip to content

Commit e140669

Browse files
committed
Merge pull request #53 from omnidan/v1.0.0-fixes
beta4
2 parents 5b48578 + 7428fc3 commit e140669

File tree

4 files changed

+546
-179
lines changed

4 files changed

+546
-179
lines changed

README.md

Lines changed: 77 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -10,14 +10,15 @@ _simple undo/redo functionality for redux state containers_
1010

1111
**Switching from 0.x to 1.0 (beta):** Make sure to update your programs to the [latest History API](#history-api).
1212

13+
---
1314

14-
## Installation
15+
**This README is about the new 1.0-beta branch of redux-undo, if you are using
16+
or plan on using 0.6, check out [the `0.6` branch](https://github.com/omnidan/redux-undo/tree/0.6)**
1517

16-
```
17-
npm install --save redux-undo
18-
```
18+
---
1919

20-
Or you can install the beta:
20+
21+
## Installation
2122

2223
```
2324
npm install --save redux-undo@beta
@@ -102,10 +103,13 @@ perform undo/redo operations on your state:
102103
store.dispatch(ActionCreators.undo()) // undo the last action
103104
store.dispatch(ActionCreators.redo()) // redo the last action
104105

106+
store.dispatch(ActionCreators.jump(-2)) // undo 2 steps
107+
store.dispatch(ActionCreators.jump(5)) // redo 5 steps
108+
105109
store.dispatch(ActionCreators.jumpToPast(index)) // jump to requested index in the past[] array
106110
store.dispatch(ActionCreators.jumpToFuture(index)) // jump to requested index in the future[] array
107111

108-
store.dispatch(ActionCreators.clearHistory()) // Remove all items from past[] and future[] arrays
112+
store.dispatch(ActionCreators.clearHistory()) // [beta only] Remove all items from past[] and future[] arrays
109113
```
110114

111115

@@ -123,18 +127,14 @@ undoable(reducer, {
123127
undoType: ActionTypes.UNDO, // define a custom action type for this undo action
124128
redoType: ActionTypes.REDO, // define a custom action type for this redo action
125129

130+
jumpType: ActionTypes.JUMP, // define custom action type for this jump action
131+
126132
jumpToPastType: ActionTypes.JUMP_TO_PAST, // define custom action type for this jumpToPast action
127133
jumpToFutureType: ActionTypes.JUMP_TO_FUTURE, // define custom action type for this jumpToFuture action
128134

129-
clearHistoryType: ActionTypes.CLEAR_HISTORY, // define custom action type for this clearHistory action
135+
clearHistoryType: ActionTypes.CLEAR_HISTORY, // [beta only] define custom action type for this clearHistory action
130136

131-
initialState: undefined, // initial state (e.g. for loading)
132-
initTypes: ['@@redux/INIT', '@@INIT'] // history will be (re)set upon init action type
133-
initialHistory: { // initial history (e.g. for loading)
134-
past: [],
135-
present: config.initialState,
136-
future: []
137-
},
137+
initTypes: ['@@redux-undo/INIT'] // history will be (re)set upon init action type
138138

139139
debug: false, // set to `true` to turn on debugging
140140
})
@@ -143,50 +143,90 @@ undoable(reducer, {
143143
**Note:** If you want to use just the `initTypes` functionality, but not import
144144
the whole redux-undo library, use [redux-recycle](https://github.com/omnidan/redux-recycle)!
145145

146-
### Filtering Actions
146+
#### Initial State and History
147147

148-
If you don't want to include every action in the undo/redo history, you can
149-
pass a function to `undoable` like this:
148+
You can use your redux store to set an initial history for your undoable reducers:
150149

151150
```js
152-
undoable(reducer, {
153-
filter: function filterActions(action, currentState, previousState) {
154-
return action.type === SOME_ACTION; // only add to history if action is SOME_ACTION
155-
}
156-
})
157151

158-
// or you could do...
152+
import { createStore } from 'redux';
153+
154+
const initialHistory = {
155+
past: [0, 1, 2, 3],
156+
present: 4,
157+
future: [5, 6, 7]
158+
}
159+
160+
const store = createStore(undoable(counter), initialHistory);
161+
162+
```
163+
164+
Or just set the current state like you're used to with Redux. Redux-undo will create the history for you:
165+
166+
```js
167+
168+
import { createStore } from 'redux';
169+
170+
const store = createStore(undoable(counter), {foo: 'bar'});
171+
172+
// will make the state look like this:
173+
{
174+
past: [],
175+
present: {foo: 'bar'},
176+
future: []
177+
}
159178

160-
undoable(reducer, {
161-
filter: function filterState(action, currentState, previousState) {
162-
return currentState !== previousState; // only add to history if state changed
163-
}
164-
})
165179
```
166180

167-
Or you can use the `distinctState`, `includeAction` and `excludeAction` helpers,
168-
which should be imported like this:
181+
### Filtering Actions
182+
183+
If you don't want to include every action in the undo/redo history, you can
184+
add a `filter` function to `undoable`. `redux-undo` provides you with the
185+
`includeAction` and `excludeAction` helpers for basic filtering.
186+
187+
They should be imported like this:
169188

170189
```js
171-
import undoable, { distinctState, includeAction, excludeAction } from 'redux-undo';
190+
import undoable, { includeAction, excludeAction } from 'redux-undo';
172191
```
173192

174-
Now you can use the helper, which is pretty simple:
193+
Now you can use the helper functions:
175194

176195
```js
177196
undoable(reducer, { filter: includeAction(SOME_ACTION) })
178197
undoable(reducer, { filter: excludeAction(SOME_ACTION) })
179198

180-
// or you could do...
199+
// they even support Arrays:
181200

182-
undoable(reducer, { filter: distinctState() })
201+
undoable(reducer, { filter: includeAction([SOME_ACTION, SOME_OTHER_ACTION]) })
202+
undoable(reducer, { filter: excludeAction([SOME_ACTION, SOME_OTHER_ACTION]) })
183203
```
184204

185-
... they even support Arrays:
205+
**Note:** Since [`beta4`](https://github.com/omnidan/redux-undo/releases/tag/beta4),
206+
only actions resulting in a new state are recorded. This means the
207+
(now deprecated) `distinctState()` filter is auto-applied.
208+
209+
#### Custom filters
210+
211+
If you want to create your own filter, pass in a function with the signature
212+
`(action, currentState, previousHistory)`. For example:
186213

187214
```js
188-
undoable(reducer, { filter: includeAction([SOME_ACTION, SOME_OTHER_ACTION]) })
189-
undoable(reducer, { filter: excludeAction([SOME_ACTION, SOME_OTHER_ACTION]) })
215+
undoable(reducer, {
216+
filter: function filterActions(action, currentState, previousHistory) {
217+
return action.type === SOME_ACTION; // only add to history if action is SOME_ACTION
218+
}
219+
})
220+
221+
// The entire `history` state is available to your filter, so you can make
222+
// decisions based on past or future states:
223+
224+
undoable(reducer, {
225+
filter: function filterState(action, currentState, previousHistory) {
226+
let { past, present, future } = previousHistory;
227+
return future.length === 0; // only add to history if future is empty
228+
}
229+
})
190230
```
191231

192232
### Ignoring Actions

package.json

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,16 @@
11
{
22
"name": "redux-undo",
3-
"version": "1.0.0-beta3",
3+
"version": "1.0.0-beta4",
44
"description": "simple undo/redo functionality for redux state containers",
55
"main": "lib/index.js",
66
"scripts": {
77
"clean": "./node_modules/.bin/rimraf lib",
88
"compile": "./node_modules/.bin/babel src --out-dir lib",
99
"lint": "./node_modules/.bin/eslint src test",
10-
"test": "NODE_ENV=test ./node_modules/.bin/mocha --compilers js:babel-core/register --recursive",
11-
"test:watch": "NODE_ENV=test ./node_modules/.bin/mocha --compilers js:babel-core/register --recursive --watch",
12-
"test:cov": "./node_modules/.bin/babel-node ./node_modules/.bin/isparta cover ./node_modules/.bin/_mocha -- --recursive",
10+
"test": "NODE_ENV=test ./node_modules/.bin/mocha --compilers js:babel-core/register",
11+
"test:watch": "npm run test -- --watch",
12+
"test:bail": "npm run test:watch -- --bail",
13+
"test:cov": "./node_modules/.bin/babel-node ./node_modules/.bin/isparta cover ./node_modules/.bin/_mocha",
1314
"prepublish": "npm run lint && npm run test && npm run clean && npm run compile"
1415
},
1516
"repository": {

0 commit comments

Comments
 (0)