From ddef7c489d190c169911af07dc059ba62b31dc64 Mon Sep 17 00:00:00 2001 From: Mark Erikson Date: Sat, 13 Aug 2022 23:41:30 -0400 Subject: [PATCH] Update RDT options types, and export those + AnyListenerPredicate --- packages/toolkit/src/configureStore.ts | 4 +- packages/toolkit/src/devtoolsExtension.ts | 70 +++++++++++++++++------ packages/toolkit/src/index.ts | 2 + 3 files changed, 55 insertions(+), 21 deletions(-) diff --git a/packages/toolkit/src/configureStore.ts b/packages/toolkit/src/configureStore.ts index 56297672a..442ce10dc 100644 --- a/packages/toolkit/src/configureStore.ts +++ b/packages/toolkit/src/configureStore.ts @@ -11,7 +11,7 @@ import type { CombinedState, } from 'redux' import { createStore, compose, applyMiddleware, combineReducers } from 'redux' -import type { EnhancerOptions as DevToolsOptions } from './devtoolsExtension' +import type { DevToolsEnhancerOptions as DevToolsOptions } from './devtoolsExtension' import { composeWithDevTools } from './devtoolsExtension' import isPlainObject from './isPlainObject' @@ -52,7 +52,7 @@ export interface ConfigureStoreOptions< /** * An array of Redux middleware to install. If not supplied, defaults to * the set of middleware returned by `getDefaultMiddleware()`. - * + * * @example `middleware: (gDM) => gDM().concat(logger, apiMiddleware, yourCustomMiddleware)` * @see https://redux-toolkit.js.org/api/getDefaultMiddleware#intended-usage */ diff --git a/packages/toolkit/src/devtoolsExtension.ts b/packages/toolkit/src/devtoolsExtension.ts index bca6790af..b16b8b857 100644 --- a/packages/toolkit/src/devtoolsExtension.ts +++ b/packages/toolkit/src/devtoolsExtension.ts @@ -4,7 +4,7 @@ import { compose } from 'redux' /** * @public */ -export interface EnhancerOptions { +export interface DevToolsEnhancerOptions { /** * the instance name to be showed on the monitor page. Default value is `document.title`. * If not specified and there's no document title, it will consist of `tabId` and `instanceId`. @@ -29,26 +29,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?: any + /** + * ImmutableJS `Record` classes used to make possible restore its instances back when importing, persisting... + */ + refs?: any } /** * function which takes `action` object and id number as arguments, and should return `action` object back. @@ -187,7 +219,7 @@ export interface EnhancerOptions { type Compose = typeof compose interface ComposeWithDevTools { - (options: EnhancerOptions): Compose + (options: DevToolsEnhancerOptions): Compose (...funcs: StoreEnhancer[]): StoreEnhancer } @@ -208,7 +240,7 @@ export const composeWithDevTools: ComposeWithDevTools = * @public */ export const devToolsEnhancer: { - (options: EnhancerOptions): StoreEnhancer + (options: DevToolsEnhancerOptions): StoreEnhancer } = typeof window !== 'undefined' && (window as any).__REDUX_DEVTOOLS_EXTENSION__ ? (window as any).__REDUX_DEVTOOLS_EXTENSION__ diff --git a/packages/toolkit/src/index.ts b/packages/toolkit/src/index.ts index 17b53d00b..a0690f584 100644 --- a/packages/toolkit/src/index.ts +++ b/packages/toolkit/src/index.ts @@ -34,6 +34,7 @@ export type { ConfigureStoreOptions, EnhancedStore, } from './configureStore' +export type { DevToolsEnhancerOptions } from './devtoolsExtension' export { // js createAction, @@ -174,6 +175,7 @@ export type { TaskResolved, TaskResult, } from './listenerMiddleware/index' +export type { AnyListenerPredicate } from './listenerMiddleware/types' export { createListenerMiddleware,