| 1 | import type { Action, ActionCreator, StoreEnhancer } from 'redux'
|
|---|
| 2 | import { compose } from './reduxImports'
|
|---|
| 3 |
|
|---|
| 4 | /**
|
|---|
| 5 | * @public
|
|---|
| 6 | */
|
|---|
| 7 | export interface DevToolsEnhancerOptions {
|
|---|
| 8 | /**
|
|---|
| 9 | * the instance name to be showed on the monitor page. Default value is `document.title`.
|
|---|
| 10 | * If not specified and there's no document title, it will consist of `tabId` and `instanceId`.
|
|---|
| 11 | */
|
|---|
| 12 | name?: string
|
|---|
| 13 | /**
|
|---|
| 14 | * action creators functions to be available in the Dispatcher.
|
|---|
| 15 | */
|
|---|
| 16 | actionCreators?: ActionCreator<any>[] | { [key: string]: ActionCreator<any> }
|
|---|
| 17 | /**
|
|---|
| 18 | * if more than one action is dispatched in the indicated interval, all new actions will be collected and sent at once.
|
|---|
| 19 | * It is the joint between performance and speed. When set to `0`, all actions will be sent instantly.
|
|---|
| 20 | * Set it to a higher value when experiencing perf issues (also `maxAge` to a lower value).
|
|---|
| 21 | *
|
|---|
| 22 | * @default 500 ms.
|
|---|
| 23 | */
|
|---|
| 24 | latency?: number
|
|---|
| 25 | /**
|
|---|
| 26 | * (> 1) - maximum allowed actions to be stored in the history tree. The oldest actions are removed once maxAge is reached. It's critical for performance.
|
|---|
| 27 | *
|
|---|
| 28 | * @default 50
|
|---|
| 29 | */
|
|---|
| 30 | maxAge?: number
|
|---|
| 31 | /**
|
|---|
| 32 | * 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
|
|---|
| 33 | * were to pass an object and specify `options` as a boolean. Giving an object allows fine-grained customization using the `replacer` and `reviver`
|
|---|
| 34 | * functions.
|
|---|
| 35 | */
|
|---|
| 36 | serialize?:
|
|---|
| 37 | | boolean
|
|---|
| 38 | | {
|
|---|
| 39 | /**
|
|---|
| 40 | * - `undefined` - will use regular `JSON.stringify` to send data (it's the fast mode).
|
|---|
| 41 | * - `false` - will handle also circular references.
|
|---|
| 42 | * - `true` - will handle also date, regex, undefined, error objects, symbols, maps, sets and functions.
|
|---|
| 43 | * - object, which contains `date`, `regex`, `undefined`, `error`, `symbol`, `map`, `set` and `function` keys.
|
|---|
| 44 | * For each of them you can indicate if to include (by setting as `true`).
|
|---|
| 45 | * For `function` key you can also specify a custom function which handles serialization.
|
|---|
| 46 | * See [`jsan`](https://github.com/kolodny/jsan) for more details.
|
|---|
| 47 | */
|
|---|
| 48 | options?:
|
|---|
| 49 | | undefined
|
|---|
| 50 | | boolean
|
|---|
| 51 | | {
|
|---|
| 52 | date?: true
|
|---|
| 53 | regex?: true
|
|---|
| 54 | undefined?: true
|
|---|
| 55 | error?: true
|
|---|
| 56 | symbol?: true
|
|---|
| 57 | map?: true
|
|---|
| 58 | set?: true
|
|---|
| 59 | function?: true | ((fn: (...args: any[]) => any) => string)
|
|---|
| 60 | }
|
|---|
| 61 | /**
|
|---|
| 62 | * [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.
|
|---|
| 63 | * In addition, you can specify a data type by adding a [`__serializedType__`](https://github.com/zalmoxisus/remotedev-serialize/blob/master/helpers/index.js#L4)
|
|---|
| 64 | * key. So you can deserialize it back while importing or persisting data.
|
|---|
| 65 | * 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):
|
|---|
| 66 | */
|
|---|
| 67 | replacer?: (key: string, value: unknown) => any
|
|---|
| 68 | /**
|
|---|
| 69 | * [JSON `reviver` function](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse#Using_the_reviver_parameter)
|
|---|
| 70 | * used for parsing the imported actions and states. See [`remotedev-serialize`](https://github.com/zalmoxisus/remotedev-serialize/blob/master/immutable/serialize.js#L8-L41)
|
|---|
| 71 | * as an example on how to serialize special data types and get them back.
|
|---|
| 72 | */
|
|---|
| 73 | reviver?: (key: string, value: unknown) => any
|
|---|
| 74 | /**
|
|---|
| 75 | * Automatically serialize/deserialize immutablejs via [remotedev-serialize](https://github.com/zalmoxisus/remotedev-serialize).
|
|---|
| 76 | * Just pass the Immutable library. It will support all ImmutableJS structures. You can even export them into a file and get them back.
|
|---|
| 77 | * The only exception is `Record` class, for which you should pass this in addition the references to your classes in `refs`.
|
|---|
| 78 | */
|
|---|
| 79 | immutable?: any
|
|---|
| 80 | /**
|
|---|
| 81 | * ImmutableJS `Record` classes used to make possible restore its instances back when importing, persisting...
|
|---|
| 82 | */
|
|---|
| 83 | refs?: any
|
|---|
| 84 | }
|
|---|
| 85 | /**
|
|---|
| 86 | * function which takes `action` object and id number as arguments, and should return `action` object back.
|
|---|
| 87 | */
|
|---|
| 88 | actionSanitizer?: <A extends Action>(action: A, id: number) => A
|
|---|
| 89 | /**
|
|---|
| 90 | * function which takes `state` object and index as arguments, and should return `state` object back.
|
|---|
| 91 | */
|
|---|
| 92 | stateSanitizer?: <S>(state: S, index: number) => S
|
|---|
| 93 | /**
|
|---|
| 94 | * *string or array of strings as regex* - actions types to be hidden / shown in the monitors (while passed to the reducers).
|
|---|
| 95 | * If `actionsAllowlist` specified, `actionsDenylist` is ignored.
|
|---|
| 96 | */
|
|---|
| 97 | actionsDenylist?: string | string[]
|
|---|
| 98 | /**
|
|---|
| 99 | * *string or array of strings as regex* - actions types to be hidden / shown in the monitors (while passed to the reducers).
|
|---|
| 100 | * If `actionsAllowlist` specified, `actionsDenylist` is ignored.
|
|---|
| 101 | */
|
|---|
| 102 | actionsAllowlist?: string | string[]
|
|---|
| 103 | /**
|
|---|
| 104 | * called for every action before sending, takes `state` and `action` object, and returns `true` in case it allows sending the current data to the monitor.
|
|---|
| 105 | * Use it as a more advanced version of `actionsDenylist`/`actionsAllowlist` parameters.
|
|---|
| 106 | */
|
|---|
| 107 | predicate?: <S, A extends Action>(state: S, action: A) => boolean
|
|---|
| 108 | /**
|
|---|
| 109 | * if specified as `false`, it will not record the changes till clicking on `Start recording` button.
|
|---|
| 110 | * Available only for Redux enhancer, for others use `autoPause`.
|
|---|
| 111 | *
|
|---|
| 112 | * @default true
|
|---|
| 113 | */
|
|---|
| 114 | shouldRecordChanges?: boolean
|
|---|
| 115 | /**
|
|---|
| 116 | * if specified, whenever clicking on `Pause recording` button and there are actions in the history log, will add this action type.
|
|---|
| 117 | * If not specified, will commit when paused. Available only for Redux enhancer.
|
|---|
| 118 | *
|
|---|
| 119 | * @default "@@PAUSED""
|
|---|
| 120 | */
|
|---|
| 121 | pauseActionType?: string
|
|---|
| 122 | /**
|
|---|
| 123 | * auto pauses when the extension’s window is not opened, and so has zero impact on your app when not in use.
|
|---|
| 124 | * Not available for Redux enhancer (as it already does it but storing the data to be sent).
|
|---|
| 125 | *
|
|---|
| 126 | * @default false
|
|---|
| 127 | */
|
|---|
| 128 | autoPause?: boolean
|
|---|
| 129 | /**
|
|---|
| 130 | * if specified as `true`, it will not allow any non-monitor actions to be dispatched till clicking on `Unlock changes` button.
|
|---|
| 131 | * Available only for Redux enhancer.
|
|---|
| 132 | *
|
|---|
| 133 | * @default false
|
|---|
| 134 | */
|
|---|
| 135 | shouldStartLocked?: boolean
|
|---|
| 136 | /**
|
|---|
| 137 | * if set to `false`, will not recompute the states on hot reloading (or on replacing the reducers). Available only for Redux enhancer.
|
|---|
| 138 | *
|
|---|
| 139 | * @default true
|
|---|
| 140 | */
|
|---|
| 141 | shouldHotReload?: boolean
|
|---|
| 142 | /**
|
|---|
| 143 | * if specified as `true`, whenever there's an exception in reducers, the monitors will show the error message, and next actions will not be dispatched.
|
|---|
| 144 | *
|
|---|
| 145 | * @default false
|
|---|
| 146 | */
|
|---|
| 147 | shouldCatchErrors?: boolean
|
|---|
| 148 | /**
|
|---|
| 149 | * If you want to restrict the extension, specify the features you allow.
|
|---|
| 150 | * If not specified, all of the features are enabled. When set as an object, only those included as `true` will be allowed.
|
|---|
| 151 | * Note that except `true`/`false`, `import` and `export` can be set as `custom` (which is by default for Redux enhancer), meaning that the importing/exporting occurs on the client side.
|
|---|
| 152 | * Otherwise, you'll get/set the data right from the monitor part.
|
|---|
| 153 | */
|
|---|
| 154 | features?: {
|
|---|
| 155 | /**
|
|---|
| 156 | * start/pause recording of dispatched actions
|
|---|
| 157 | */
|
|---|
| 158 | pause?: boolean
|
|---|
| 159 | /**
|
|---|
| 160 | * lock/unlock dispatching actions and side effects
|
|---|
| 161 | */
|
|---|
| 162 | lock?: boolean
|
|---|
| 163 | /**
|
|---|
| 164 | * persist states on page reloading
|
|---|
| 165 | */
|
|---|
| 166 | persist?: boolean
|
|---|
| 167 | /**
|
|---|
| 168 | * export history of actions in a file
|
|---|
| 169 | */
|
|---|
| 170 | export?: boolean | 'custom'
|
|---|
| 171 | /**
|
|---|
| 172 | * import history of actions from a file
|
|---|
| 173 | */
|
|---|
| 174 | import?: boolean | 'custom'
|
|---|
| 175 | /**
|
|---|
| 176 | * jump back and forth (time travelling)
|
|---|
| 177 | */
|
|---|
| 178 | jump?: boolean
|
|---|
| 179 | /**
|
|---|
| 180 | * skip (cancel) actions
|
|---|
| 181 | */
|
|---|
| 182 | skip?: boolean
|
|---|
| 183 | /**
|
|---|
| 184 | * drag and drop actions in the history list
|
|---|
| 185 | */
|
|---|
| 186 | reorder?: boolean
|
|---|
| 187 | /**
|
|---|
| 188 | * dispatch custom actions or action creators
|
|---|
| 189 | */
|
|---|
| 190 | dispatch?: boolean
|
|---|
| 191 | /**
|
|---|
| 192 | * generate tests for the selected actions
|
|---|
| 193 | */
|
|---|
| 194 | test?: boolean
|
|---|
| 195 | }
|
|---|
| 196 | /**
|
|---|
| 197 | * Set to true or a stacktrace-returning function to record call stack traces for dispatched actions.
|
|---|
| 198 | * Defaults to false.
|
|---|
| 199 | */
|
|---|
| 200 | trace?: boolean | (<A extends Action>(action: A) => string)
|
|---|
| 201 | /**
|
|---|
| 202 | * The maximum number of stack trace entries to record per action. Defaults to 10.
|
|---|
| 203 | */
|
|---|
| 204 | traceLimit?: number
|
|---|
| 205 | }
|
|---|
| 206 |
|
|---|
| 207 | type Compose = typeof compose
|
|---|
| 208 |
|
|---|
| 209 | interface ComposeWithDevTools {
|
|---|
| 210 | (options: DevToolsEnhancerOptions): Compose
|
|---|
| 211 | <StoreExt extends {}>(
|
|---|
| 212 | ...funcs: StoreEnhancer<StoreExt>[]
|
|---|
| 213 | ): StoreEnhancer<StoreExt>
|
|---|
| 214 | }
|
|---|
| 215 |
|
|---|
| 216 | /**
|
|---|
| 217 | * @public
|
|---|
| 218 | */
|
|---|
| 219 | export const composeWithDevTools: ComposeWithDevTools =
|
|---|
| 220 | typeof window !== 'undefined' &&
|
|---|
| 221 | (window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
|
|---|
| 222 | ? (window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
|
|---|
| 223 | : function () {
|
|---|
| 224 | if (arguments.length === 0) return undefined
|
|---|
| 225 | if (typeof arguments[0] === 'object') return compose
|
|---|
| 226 | return compose.apply(null, arguments as any as Function[])
|
|---|
| 227 | }
|
|---|
| 228 |
|
|---|
| 229 | /**
|
|---|
| 230 | * @public
|
|---|
| 231 | */
|
|---|
| 232 | export const devToolsEnhancer: {
|
|---|
| 233 | (options: DevToolsEnhancerOptions): StoreEnhancer<any>
|
|---|
| 234 | } =
|
|---|
| 235 | typeof window !== 'undefined' && (window as any).__REDUX_DEVTOOLS_EXTENSION__
|
|---|
| 236 | ? (window as any).__REDUX_DEVTOOLS_EXTENSION__
|
|---|
| 237 | : function () {
|
|---|
| 238 | return function (noop) {
|
|---|
| 239 | return noop
|
|---|
| 240 | }
|
|---|
| 241 | }
|
|---|