diff --git a/packages/redux-devtools-extension/package.json b/packages/redux-devtools-extension/package.json index 8b3d99dd..6c5c79b8 100644 --- a/packages/redux-devtools-extension/package.json +++ b/packages/redux-devtools-extension/package.json @@ -42,6 +42,7 @@ "@typescript-eslint/parser": "^5.12.1", "eslint": "^8.10.0", "eslint-config-prettier": "^8.4.0", + "immutable": "^4.0.0", "redux": "^4.1.2", "rimraf": "^3.0.2", "typescript": "~4.5.5" diff --git a/packages/redux-devtools-extension/src/index.ts b/packages/redux-devtools-extension/src/index.ts index 140909cf..54ba0545 100644 --- a/packages/redux-devtools-extension/src/index.ts +++ b/packages/redux-devtools-extension/src/index.ts @@ -1,3 +1,4 @@ +import Immutable from 'immutable'; import { Action, ActionCreator, compose, StoreEnhancer } from 'redux'; export interface EnhancerOptions { @@ -25,26 +26,58 @@ export interface EnhancerOptions { */ maxAge?: number; /** - * - `undefined` - will use regular `JSON.stringify` to send data (it's the fast mode). - * - `false` - will handle also circular references. - * - `true` - will handle also date, regex, undefined, error objects, symbols, maps, sets and functions. - * - object, which contains `date`, `regex`, `undefined`, `error`, `symbol`, `map`, `set` and `function` keys. - * For each of them you can indicate if to include (by setting as `true`). - * For `function` key you can also specify a custom function which handles serialization. - * See [`jsan`](https://github.com/kolodny/jsan) for more details. + * Customizes how actions and state are serialized and deserialized. Can be a boolean or object. If given a boolean, the behavior is the same as if you + * were to pass an object and specify `options` as a boolean. Giving an object allows fine-grained customization using the `replacer` and `reviver` + * functions. */ serialize?: | boolean | { - date?: boolean; - regex?: boolean; - undefined?: boolean; - error?: boolean; - symbol?: boolean; - map?: boolean; - set?: boolean; - // eslint-disable-next-line @typescript-eslint/ban-types - function?: boolean | Function; + /** + * - `undefined` - will use regular `JSON.stringify` to send data (it's the fast mode). + * - `false` - will handle also circular references. + * - `true` - will handle also date, regex, undefined, error objects, symbols, maps, sets and functions. + * - object, which contains `date`, `regex`, `undefined`, `error`, `symbol`, `map`, `set` and `function` keys. + * For each of them you can indicate if to include (by setting as `true`). + * For `function` key you can also specify a custom function which handles serialization. + * See [`jsan`](https://github.com/kolodny/jsan) for more details. + */ + options?: + | undefined + | boolean + | { + date?: true; + regex?: true; + undefined?: true; + error?: true; + symbol?: true; + map?: true; + set?: true; + function?: true | ((fn: (...args: any[]) => any) => string); + }; + /** + * [JSON replacer function](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify#The_replacer_parameter) used for both actions and states stringify. + * In addition, you can specify a data type by adding a [`__serializedType__`](https://github.com/zalmoxisus/remotedev-serialize/blob/master/helpers/index.js#L4) + * key. So you can deserialize it back while importing or persisting data. + * Moreover, it will also [show a nice preview showing the provided custom type](https://cloud.githubusercontent.com/assets/7957859/21814330/a17d556a-d761-11e6-85ef-159dd12f36c5.png): + */ + replacer?: (key: string, value: unknown) => any; + /** + * [JSON `reviver` function](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse#Using_the_reviver_parameter) + * used for parsing the imported actions and states. See [`remotedev-serialize`](https://github.com/zalmoxisus/remotedev-serialize/blob/master/immutable/serialize.js#L8-L41) + * as an example on how to serialize special data types and get them back. + */ + reviver?: (key: string, value: unknown) => any; + /** + * Automatically serialize/deserialize immutablejs via [remotedev-serialize](https://github.com/zalmoxisus/remotedev-serialize). + * Just pass the Immutable library. It will support all ImmutableJS structures. You can even export them into a file and get them back. + * The only exception is `Record` class, for which you should pass this in addition the references to your classes in `refs`. + */ + immutable?: typeof Immutable; + /** + * ImmutableJS `Record` classes used to make possible restore its instances back when importing, persisting... + */ + refs?: Immutable.Record.Factory[]; }; /** * function which takes `action` object and id number as arguments, and should return `action` object back. diff --git a/yarn.lock b/yarn.lock index 00bd6b50..5e31c5e6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5098,6 +5098,7 @@ __metadata: "@typescript-eslint/parser": ^5.12.1 eslint: ^8.10.0 eslint-config-prettier: ^8.4.0 + immutable: ^4.0.0 redux: ^4.1.2 rimraf: ^3.0.2 typescript: ~4.5.5