From 6cf1865f55618f372b75dd6790b6d04c5d519b18 Mon Sep 17 00:00:00 2001 From: Louis DeScioli Date: Tue, 5 Jul 2022 08:53:44 -0400 Subject: [PATCH] Fixes type for serialize option (#1112) * Fixes type for serialize option * Create gold-chairs-rescue.md * Update gold-chairs-rescue.md Co-authored-by: Nathan Bierema --- .changeset/gold-chairs-rescue.md | 5 ++ .../redux-devtools-extension/package.json | 3 +- .../redux-devtools-extension/src/index.ts | 65 ++++++++++++++----- pnpm-lock.yaml | 42 +++++++++++- 4 files changed, 97 insertions(+), 18 deletions(-) create mode 100644 .changeset/gold-chairs-rescue.md diff --git a/.changeset/gold-chairs-rescue.md b/.changeset/gold-chairs-rescue.md new file mode 100644 index 00000000..306fd5cc --- /dev/null +++ b/.changeset/gold-chairs-rescue.md @@ -0,0 +1,5 @@ +--- +'@redux-devtools/extension': patch +--- + +Fix type for serialize option diff --git a/packages/redux-devtools-extension/package.json b/packages/redux-devtools-extension/package.json index 0cab2bdd..888cd018 100644 --- a/packages/redux-devtools-extension/package.json +++ b/packages/redux-devtools-extension/package.json @@ -29,7 +29,8 @@ "prepublish": "pnpm run type-check && pnpm run lint" }, "dependencies": { - "@babel/runtime": "^7.18.3" + "@babel/runtime": "^7.18.3", + "immutable": "^4.0.0" }, "devDependencies": { "@babel/cli": "^7.17.10", 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/pnpm-lock.yaml b/pnpm-lock.yaml index de524e56..aa43798e 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1157,11 +1157,13 @@ importers: '@typescript-eslint/parser': ^5.29.0 eslint: ^8.18.0 eslint-config-prettier: ^8.5.0 + immutable: ^4.0.0 redux: ^4.2.0 rimraf: ^3.0.2 typescript: ~4.7.4 dependencies: '@babel/runtime': 7.18.3 + immutable: 4.1.0 devDependencies: '@babel/cli': 7.17.10_@babel+core@7.18.5 '@babel/core': 7.18.5 @@ -5778,7 +5780,7 @@ packages: strict-event-emitter: 0.2.4 uuid: 8.3.2 optionalDependencies: - msw: 0.42.3_typescript@4.7.4 + msw: 0.43.0_typescript@4.7.4 transitivePeerDependencies: - encoding - supports-color @@ -16438,6 +16440,44 @@ packages: - supports-color dev: false + /msw/0.43.0_typescript@4.7.4: + resolution: {integrity: sha512-XJylZP0qW3D5WUGWh9FFefJEl3MGG4y1I+/8a833d0eedm6B+GaPm6wPVZNcnlS2YVTagvEgShVJ7ZtY66tTRQ==} + engines: {node: '>=14'} + hasBin: true + requiresBuild: true + peerDependencies: + typescript: '>= 4.2.x <= 4.7.x' + peerDependenciesMeta: + typescript: + optional: true + dependencies: + '@mswjs/cookies': 0.2.1 + '@mswjs/interceptors': 0.16.6 + '@open-draft/until': 1.0.3 + '@types/cookie': 0.4.1 + '@types/js-levenshtein': 1.1.1 + chalk: 4.1.1 + chokidar: 3.5.3 + cookie: 0.4.2 + graphql: 16.5.0 + headers-polyfill: 3.0.7 + inquirer: 8.2.4 + is-node-process: 1.0.1 + js-levenshtein: 1.1.6 + node-fetch: 2.6.7 + outvariant: 1.3.0 + path-to-regexp: 6.2.1 + statuses: 2.0.1 + strict-event-emitter: 0.2.4 + type-fest: 1.4.0 + typescript: 4.7.4 + yargs: 17.5.1 + transitivePeerDependencies: + - encoding + - supports-color + dev: false + optional: true + /multicast-dns/7.2.5: resolution: {integrity: sha512-2eznPJP8z2BFLX50tf0LuODrpINqP1RVIm/CObbTcBRITQgmC/TjcREF1NeTBzIcR5XO/ukWo+YHOjBbFwIupg==} hasBin: true