https://github.com/fluttercommunity/redux_undo
Redux Undo - Make your redux store undo- and redoable. Inspired by the JS redux_undo package. Maintainer: @michelengelen
https://github.com/fluttercommunity/redux_undo
Last synced: 6 months ago
JSON representation
Redux Undo - Make your redux store undo- and redoable. Inspired by the JS redux_undo package. Maintainer: @michelengelen
- Host: GitHub
- URL: https://github.com/fluttercommunity/redux_undo
- Owner: fluttercommunity
- License: bsd-3-clause
- Created: 2019-12-02T08:13:20.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2020-04-23T14:29:29.000Z (about 6 years ago)
- Last Synced: 2025-03-28T15:51:59.496Z (about 1 year ago)
- Language: Dart
- Homepage: https://pub.dev/packages/redux_undo
- Size: 154 KB
- Stars: 5
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
[](https://github.com/fluttercommunity/community)
[](https://travis-ci.com/fluttercommunity/redux_undo)
[](https://codecov.io/gh/fluttercommunity/redux_undo)
[](https://pub.dartlang.org/packages/redux_undo)
# redux_undo.dart
This package will make your redux store undoable.
## Things to come in the future
- [ ] Support for making only a slice of the state undoable
- [ ] more examples and documentation
## Installation
define the dependency in your `pubspec.yaml` file:
```yaml
dependencies:
redux_undo: ^1.0.0+1
```
update your applications packages by running
```shell
pub get
```
or when using flutter as a framework
```shell
flutter pub get
```
import the package to use in the file you are setting up redux:
```dart
import 'package:redux_undo/redux_undo.dart';
```
## Structure
`redux_undo` will slightly modify your state by adding a new properties-layer at the root of the store. The final structure will look like this:
```dart
/// when accessed directly from the store, store.state will have this structure
UndoableHistory state = {
past: [],
present: null, // <-- the current state of the app
future: [],
latestUnfiltered: null // <-- basically equals present, to store a mutual state before storing it into past or future
};
```
## Usage
Because it modifies the initial state you need to initiate `redux_undo` when initiating the redux store.
This is done by calling 2 separate functions:
```dart
/// to wrap the root reducer
Reducer> createUndoableReducer(Reducer reducer, { UndoableConfig config });
/// to wrap the Root state of your app.
UndoableState createUndoableState(S initialState, bool ignoreInitialState);
```
Here is an example of how this can be done in a flutter app:
```dart
import 'package:flutter/material.dart';
import 'package:flutter_redux/flutter_redux.dart';
import 'package:redux/redux.dart';
import 'package:redux_undo/redux_undo.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
final Store> store = Store>(
createUndoableReducer(rootReducer),
initialState: createUndoableState(RootState.initial(), false),
);
@override
Widget build(BuildContext context) {
return StoreProvider>(
store: store,
child: MaterialApp(
title: 'Redux Undo Demo',
home: const MyHomePage(),
),
);
}
}
```
## Actions
`redux_undo` provides 4 basic actions
- `UndoableUndoAction` - Standard-Action for undo
**Usage:** `store.dispatch(UndoableUndoAction())`
- `UndoableRedoAction` - Standard-Action for redo
**Usage:** `store.dispatch(UndoableRedoAction())`
- `UndoableJumpAction` - Standard-Action for jump (to past or to future)
**Usage:** `store.dispatch(UndoableJumpAction(index: -2))` // <- jumps 2 steps to the past (same as dispatching `UndoableUndoAction` twice)
**Usage:** `store.dispatch(UndoableJumpAction(index: 0))` // <- does nothing, since it just returns the current `UndoableState`
**Usage:** `store.dispatch(UndoableJumpAction(index: 2))` // <- jumps 2 steps to the future (same as dispatching `UndoableRedoAction` twice)
- `UndoableClearHistoryAction` - Standard-Action for clearing the history
## Options
It is possible to provide a configuration object to the UndoableState instantiation like this:
```dart
final UndoableConfig config = UndoableConfig(
limit: 100,
blackList: [
BlacklistedAction,
],
whiteList: [
WhitelistedAction,
],
);
```
Then pass it to the `createUndoableReducer` function like this:
```dart
final Store> store = Store>(
createUndoableReducer(rootReducer, config: config),
initialState: createUndoableState(RootState.initial(), false),
);
```
These are the options the `UndoableConfig` class provides:
- int limit: limits the length of the `UndoableState.past` List and with this ultimately the length of `UndoableState.future` as well
- default value => **10**
- List whiteList: actions in this list need to be extended from one of the provided `redux_undo` actions and will fire the original `rootReducer` after performing the action they extended from without updating `UndoableState.past` or `UndoableState.future`
## Contributors
* [Michel Engelen](https://github.com/michelengelen)