From a8883f287de2e36a12a4058635f8474cda34a0d4 Mon Sep 17 00:00:00 2001 From: Nathan Bierema Date: Sat, 6 Nov 2021 10:38:27 -0400 Subject: [PATCH] Convert npm extension package to TypeScript (#948) * stash * stash --- extension/src/app/api/index.ts | 10 +-- .../browser/extension/inject/pageScript.ts | 29 +++++--- packages/redux-devtools-extension/.babelrc | 3 + .../redux-devtools-extension/.eslintignore | 1 + .../redux-devtools-extension/.eslintrc.js | 7 ++ packages/redux-devtools-extension/README.md | 10 +-- .../developmentOnly.d.ts | 1 - .../developmentOnly.js | 26 ------- packages/redux-devtools-extension/index.js | 22 ------ .../redux-devtools-extension/logOnly.d.ts | 1 - packages/redux-devtools-extension/logOnly.js | 60 ---------------- .../logOnlyInProduction.d.ts | 1 - .../logOnlyInProduction.js | 28 -------- .../redux-devtools-extension/package.json | 36 ++++++++-- .../src/developmentOnly.ts | 36 ++++++++++ .../{index.d.ts => src/index.ts} | 57 +++++++++++++-- .../redux-devtools-extension/src/logOnly.ts | 71 +++++++++++++++++++ .../src/logOnlyInProduction.ts | 38 ++++++++++ .../src/utils/assign.ts | 26 +++++++ .../redux-devtools-extension/tsconfig.json | 7 ++ .../redux-devtools-extension/utils/assign.js | 24 ------- yarn.lock | 28 +++++--- 22 files changed, 318 insertions(+), 204 deletions(-) create mode 100644 packages/redux-devtools-extension/.babelrc create mode 100644 packages/redux-devtools-extension/.eslintignore create mode 100644 packages/redux-devtools-extension/.eslintrc.js delete mode 100644 packages/redux-devtools-extension/developmentOnly.d.ts delete mode 100644 packages/redux-devtools-extension/developmentOnly.js delete mode 100644 packages/redux-devtools-extension/index.js delete mode 100644 packages/redux-devtools-extension/logOnly.d.ts delete mode 100644 packages/redux-devtools-extension/logOnly.js delete mode 100644 packages/redux-devtools-extension/logOnlyInProduction.d.ts delete mode 100644 packages/redux-devtools-extension/logOnlyInProduction.js create mode 100644 packages/redux-devtools-extension/src/developmentOnly.ts rename packages/redux-devtools-extension/{index.d.ts => src/index.ts} (80%) create mode 100644 packages/redux-devtools-extension/src/logOnly.ts create mode 100644 packages/redux-devtools-extension/src/logOnlyInProduction.ts create mode 100644 packages/redux-devtools-extension/src/utils/assign.ts create mode 100644 packages/redux-devtools-extension/tsconfig.json delete mode 100644 packages/redux-devtools-extension/utils/assign.js diff --git a/extension/src/app/api/index.ts b/extension/src/app/api/index.ts index aeda37dc..e5c27c08 100644 --- a/extension/src/app/api/index.ts +++ b/extension/src/app/api/index.ts @@ -8,11 +8,7 @@ import importState from './importState'; import generateId from './generateInstanceId'; import { Config } from '../../browser/extension/inject/pageScript'; import { Action } from 'redux'; -import { - EnhancedStore, - LiftedState, - PerformAction, -} from '@redux-devtools/instrument'; +import { LiftedState, PerformAction } from '@redux-devtools/instrument'; import { LibConfig } from '@redux-devtools/app/lib/actions'; import { ContentScriptToPageScriptMessage, @@ -527,7 +523,7 @@ export function disconnect() { export interface ConnectResponse { init: >( state: S, - liftedData: LiftedState + liftedData?: LiftedState ) => void; subscribe: >( listener: (message: ListenerMessage) => void @@ -650,7 +646,7 @@ export function connect(preConfig: Config): ConnectResponse { const init = >( state: S, - liftedData: LiftedState + liftedData?: LiftedState ) => { const message: InitMessage = { type: 'INIT', diff --git a/extension/src/browser/extension/inject/pageScript.ts b/extension/src/browser/extension/inject/pageScript.ts index b23fa46d..74728611 100644 --- a/extension/src/browser/extension/inject/pageScript.ts +++ b/extension/src/browser/extension/inject/pageScript.ts @@ -585,30 +585,41 @@ const preEnhancer = const extensionCompose = (config: Config) => - (...funcs: StoreEnhancer[]) => { - return (...args: any[]) => { + (...funcs: StoreEnhancer[]): StoreEnhancer => { + return (...args) => { const instanceId = generateId(config.instanceId); return [preEnhancer(instanceId), ...funcs].reduceRight( (composed, f) => f(composed), - (__REDUX_DEVTOOLS_EXTENSION__({ ...config, instanceId }) as any)( - ...args - ) + __REDUX_DEVTOOLS_EXTENSION__({ ...config, instanceId })(...args) ); }; }; +interface ReduxDevtoolsExtensionCompose { + (config: Config): (...funcs: StoreEnhancer[]) => StoreEnhancer; + (...funcs: StoreEnhancer[]): StoreEnhancer; +} + declare global { interface Window { - __REDUX_DEVTOOLS_EXTENSION_COMPOSE__: unknown; + __REDUX_DEVTOOLS_EXTENSION_COMPOSE__: ReduxDevtoolsExtensionCompose; } } -window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ = (...funcs: any[]) => { +function reduxDevtoolsExtensionCompose( + config: Config +): (...funcs: StoreEnhancer[]) => StoreEnhancer; +function reduxDevtoolsExtensionCompose( + ...funcs: StoreEnhancer[] +): StoreEnhancer; +function reduxDevtoolsExtensionCompose(...funcs: [Config] | StoreEnhancer[]) { if (funcs.length === 0) { return __REDUX_DEVTOOLS_EXTENSION__(); } if (funcs.length === 1 && typeof funcs[0] === 'object') { return extensionCompose(funcs[0]); } - return extensionCompose({})(...funcs); -}; + return extensionCompose({})(...(funcs as StoreEnhancer[])); +} + +window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ = reduxDevtoolsExtensionCompose; diff --git a/packages/redux-devtools-extension/.babelrc b/packages/redux-devtools-extension/.babelrc new file mode 100644 index 00000000..3313ff9e --- /dev/null +++ b/packages/redux-devtools-extension/.babelrc @@ -0,0 +1,3 @@ +{ + "presets": ["@babel/preset-env", "@babel/preset-typescript"] +} diff --git a/packages/redux-devtools-extension/.eslintignore b/packages/redux-devtools-extension/.eslintignore new file mode 100644 index 00000000..a65b4177 --- /dev/null +++ b/packages/redux-devtools-extension/.eslintignore @@ -0,0 +1 @@ +lib diff --git a/packages/redux-devtools-extension/.eslintrc.js b/packages/redux-devtools-extension/.eslintrc.js new file mode 100644 index 00000000..090f9e70 --- /dev/null +++ b/packages/redux-devtools-extension/.eslintrc.js @@ -0,0 +1,7 @@ +module.exports = { + extends: '../../eslintrc.ts.base.json', + parserOptions: { + tsconfigRootDir: __dirname, + project: ['./tsconfig.json'], + }, +}; diff --git a/packages/redux-devtools-extension/README.md b/packages/redux-devtools-extension/README.md index f45f6e88..090d64af 100644 --- a/packages/redux-devtools-extension/README.md +++ b/packages/redux-devtools-extension/README.md @@ -7,14 +7,14 @@ Install: ``` -npm install --save redux-devtools-extension +yarn add @redux-devtools/extension ``` and use like that: ```js import { createStore, applyMiddleware } from 'redux'; -import { composeWithDevTools } from 'redux-devtools-extension'; +import { composeWithDevTools } from '@redux-devtools/extension'; const store = createStore( reducer, @@ -25,11 +25,11 @@ const store = createStore( ); ``` -or if needed to apply [extension’s options](https://github.com/zalmoxisus/redux-devtools-extension/blob/master/docs/API/Arguments.md#windowdevtoolsextensionconfig): +or if needed to apply [extension’s options](https://github.com/reduxjs/redux-devtools/blob/main/extension/docs/API/Arguments.md): ```js import { createStore, applyMiddleware } from 'redux'; -import { composeWithDevTools } from 'redux-devtools-extension'; +import { composeWithDevTools } from '@redux-devtools/extension'; const composeEnhancers = composeWithDevTools({ // Specify here name, actionsDenylist, actionsCreators and other options @@ -43,7 +43,7 @@ const store = createStore( ); ``` -There’re just [few lines of code](https://github.com/zalmoxisus/redux-devtools-extension/blob/master/npm-package/index.js). If you don’t want to allow the extension in production, just use ‘redux-devtools-extension/developmentOnly’ instead of ‘redux-devtools-extension’. +There’re just [few lines of code](https://github.com/reduxjs/redux-devtools/blob/main/packages/redux-devtools-extension/src/index.ts). If you don’t want to allow the extension in production, just use ‘@redux-devtools/extension/lib/developmentOnly’ instead of ‘@redux-devtools/extension’. ## License diff --git a/packages/redux-devtools-extension/developmentOnly.d.ts b/packages/redux-devtools-extension/developmentOnly.d.ts deleted file mode 100644 index e45b4859..00000000 --- a/packages/redux-devtools-extension/developmentOnly.d.ts +++ /dev/null @@ -1 +0,0 @@ -export * from 'redux-devtools-extension'; diff --git a/packages/redux-devtools-extension/developmentOnly.js b/packages/redux-devtools-extension/developmentOnly.js deleted file mode 100644 index 0294f1f9..00000000 --- a/packages/redux-devtools-extension/developmentOnly.js +++ /dev/null @@ -1,26 +0,0 @@ -'use strict'; - -var compose = require('redux').compose; - -exports.__esModule = true; -exports.composeWithDevTools = - process.env.NODE_ENV !== 'production' && - typeof window !== 'undefined' && - window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ - ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ - : function () { - if (arguments.length === 0) return undefined; - if (typeof arguments[0] === 'object') return compose; - return compose.apply(null, arguments); - }; - -exports.devToolsEnhancer = - process.env.NODE_ENV !== 'production' && - typeof window !== 'undefined' && - window.__REDUX_DEVTOOLS_EXTENSION__ - ? window.__REDUX_DEVTOOLS_EXTENSION__ - : function () { - return function (noop) { - return noop; - }; - }; diff --git a/packages/redux-devtools-extension/index.js b/packages/redux-devtools-extension/index.js deleted file mode 100644 index 02fca412..00000000 --- a/packages/redux-devtools-extension/index.js +++ /dev/null @@ -1,22 +0,0 @@ -'use strict'; - -var compose = require('redux').compose; - -exports.__esModule = true; -exports.composeWithDevTools = - typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ - ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ - : function () { - if (arguments.length === 0) return undefined; - if (typeof arguments[0] === 'object') return compose; - return compose.apply(null, arguments); - }; - -exports.devToolsEnhancer = - typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__ - ? window.__REDUX_DEVTOOLS_EXTENSION__ - : function () { - return function (noop) { - return noop; - }; - }; diff --git a/packages/redux-devtools-extension/logOnly.d.ts b/packages/redux-devtools-extension/logOnly.d.ts deleted file mode 100644 index e45b4859..00000000 --- a/packages/redux-devtools-extension/logOnly.d.ts +++ /dev/null @@ -1 +0,0 @@ -export * from 'redux-devtools-extension'; diff --git a/packages/redux-devtools-extension/logOnly.js b/packages/redux-devtools-extension/logOnly.js deleted file mode 100644 index 8aa4237b..00000000 --- a/packages/redux-devtools-extension/logOnly.js +++ /dev/null @@ -1,60 +0,0 @@ -'use strict'; - -var assign = require('./utils/assign'); -var compose = require('redux').compose; - -function enhancer() { - var config = arguments[0] || {}; - config.features = { pause: true, export: true, test: true }; - config.type = 'redux'; - if (config.autoPause === undefined) config.autoPause = true; - if (config.latency === undefined) config.latency = 500; - - return function (createStore) { - return function (reducer, preloadedState, enhancer) { - var store = createStore(reducer, preloadedState, enhancer); - var origDispatch = store.dispatch; - - var devTools = window.__REDUX_DEVTOOLS_EXTENSION__.connect(config); - devTools.init(store.getState()); - - var dispatch = function (action) { - var r = origDispatch(action); - devTools.send(action, store.getState()); - return r; - }; - - if (Object.assign) return Object.assign(store, { dispatch: dispatch }); - return assign(store, 'dispatch', dispatch); - }; - }; -} - -function composeWithEnhancer(config) { - return function () { - return compose(compose.apply(null, arguments), enhancer(config)); - }; -} - -exports.__esModule = true; -exports.composeWithDevTools = function () { - if (typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__) { - if (arguments.length === 0) return enhancer(); - if (typeof arguments[0] === 'object') - return composeWithEnhancer(arguments[0]); - return composeWithEnhancer().apply(null, arguments); - } - - if (arguments.length === 0) return undefined; - if (typeof arguments[0] === 'object') return compose; - return compose.apply(null, arguments); -}; - -exports.devToolsEnhancer = - typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__ - ? enhancer - : function () { - return function (noop) { - return noop; - }; - }; diff --git a/packages/redux-devtools-extension/logOnlyInProduction.d.ts b/packages/redux-devtools-extension/logOnlyInProduction.d.ts deleted file mode 100644 index e45b4859..00000000 --- a/packages/redux-devtools-extension/logOnlyInProduction.d.ts +++ /dev/null @@ -1 +0,0 @@ -export * from 'redux-devtools-extension'; diff --git a/packages/redux-devtools-extension/logOnlyInProduction.js b/packages/redux-devtools-extension/logOnlyInProduction.js deleted file mode 100644 index 3c18b389..00000000 --- a/packages/redux-devtools-extension/logOnlyInProduction.js +++ /dev/null @@ -1,28 +0,0 @@ -'use strict'; - -var compose = require('redux').compose; -var logOnly = require('./logOnly'); - -exports.__esModule = true; -exports.composeWithDevTools = - process.env.NODE_ENV === 'production' - ? logOnly.composeWithDevTools - : typeof window !== 'undefined' && - window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ - ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ - : function () { - if (arguments.length === 0) return undefined; - if (typeof arguments[0] === 'object') return compose; - return compose.apply(null, arguments); - }; - -exports.devToolsEnhancer = - process.env.NODE_ENV === 'production' - ? logOnly.devToolsEnhancer - : typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__ - ? window.__REDUX_DEVTOOLS_EXTENSION__ - : function () { - return function (noop) { - return noop; - }; - }; diff --git a/packages/redux-devtools-extension/package.json b/packages/redux-devtools-extension/package.json index 48917b57..80be93f1 100644 --- a/packages/redux-devtools-extension/package.json +++ b/packages/redux-devtools-extension/package.json @@ -1,15 +1,39 @@ { - "name": "redux-devtools-extension", + "name": "@redux-devtools/extension", "version": "2.13.9", "description": "Wrappers for Redux DevTools Extension.", - "main": "index.js", + "homepage": "https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-extension", + "license": "MIT", + "author": "Mihail Diordiev (https://github.com/zalmoxisus)", + "main": "lib/index.js", + "types": "lib/index.d.ts", "repository": { "type": "git", - "url": "https://github.com/zalmoxisus/redux-devtools-extension" + "url": "https://github.com/reduxjs/redux-devtools" + }, + "scripts": { + "build": "yarn run build:types && yarn run build:js", + "build:types": "tsc --emitDeclarationOnly", + "build:js": "babel src --out-dir lib --extensions \".ts\" --source-maps inline", + "clean": "rimraf lib", + "lint": "eslint . --ext .ts", + "type-check": "tsc --noEmit", + "prepack": "yarn run clean && yarn run build", + "prepublish": "yarn run type-check && yarn run lint" + }, + "devDependencies": { + "@babel/cli": "^7.16.0", + "@babel/core": "^7.16.0", + "@babel/preset-env": "^7.16.0", + "@babel/preset-typescript": "^7.16.0", + "@typescript-eslint/eslint-plugin": "^5.2.0", + "@typescript-eslint/parser": "^5.2.0", + "eslint": "^7.32.0", + "eslint-config-prettier": "^8.3.0", + "redux": "^4.1.2", + "rimraf": "^3.0.2", + "typescript": "~4.4.4" }, - "homepage": "https://github.com/zalmoxisus/redux-devtools-extension", - "author": "Mihail Diordiev (https://github.com/zalmoxisus)", - "license": "MIT", "peerDependencies": { "redux": "^3.1.0 || ^4.0.0" } diff --git a/packages/redux-devtools-extension/src/developmentOnly.ts b/packages/redux-devtools-extension/src/developmentOnly.ts new file mode 100644 index 00000000..97b4deb4 --- /dev/null +++ b/packages/redux-devtools-extension/src/developmentOnly.ts @@ -0,0 +1,36 @@ +import { compose, StoreEnhancer } from 'redux'; +import { Config, EnhancerOptions } from './index'; + +declare const process: { + env: { + NODE_ENV: string; + }; +}; + +function extensionComposeStub( + config: Config +): (...funcs: StoreEnhancer[]) => StoreEnhancer; +function extensionComposeStub(...funcs: StoreEnhancer[]): StoreEnhancer; +function extensionComposeStub(...funcs: [Config] | StoreEnhancer[]) { + if (funcs.length === 0) return undefined; + if (typeof funcs[0] === 'object') return compose; + return compose(...(funcs as StoreEnhancer[])); +} + +export const composeWithDevTools = + process.env.NODE_ENV !== 'production' && + typeof window !== 'undefined' && + window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ + ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ + : extensionComposeStub; + +export const devToolsEnhancer: (options?: EnhancerOptions) => StoreEnhancer = + process.env.NODE_ENV !== 'production' && + typeof window !== 'undefined' && + window.__REDUX_DEVTOOLS_EXTENSION__ + ? window.__REDUX_DEVTOOLS_EXTENSION__ + : function () { + return function (noop) { + return noop; + }; + }; diff --git a/packages/redux-devtools-extension/index.d.ts b/packages/redux-devtools-extension/src/index.ts similarity index 80% rename from packages/redux-devtools-extension/index.d.ts rename to packages/redux-devtools-extension/src/index.ts index 9a22484d..18eb4624 100644 --- a/packages/redux-devtools-extension/index.d.ts +++ b/packages/redux-devtools-extension/src/index.ts @@ -1,4 +1,4 @@ -import { Action, ActionCreator, StoreEnhancer, compose } from 'redux'; +import { Action, ActionCreator, compose, StoreEnhancer } from 'redux'; export interface EnhancerOptions { /** @@ -43,6 +43,7 @@ export interface EnhancerOptions { symbol?: boolean; map?: boolean; set?: boolean; + // eslint-disable-next-line @typescript-eslint/ban-types function?: boolean | Function; }; /** @@ -179,8 +180,52 @@ export interface EnhancerOptions { traceLimit?: number; } -export function composeWithDevTools( - ...funcs: Array> -): StoreEnhancer; -export function composeWithDevTools(options: EnhancerOptions): typeof compose; -export function devToolsEnhancer(options: EnhancerOptions): StoreEnhancer; +export interface Config extends EnhancerOptions { + type?: string; +} + +interface ConnectResponse { + init: (state: unknown) => void; + send: (action: Action, state: unknown) => void; +} + +interface ReduxDevtoolsExtension { + (config?: Config): StoreEnhancer; + connect: (preConfig: Config) => ConnectResponse; +} + +export interface ReduxDevtoolsExtensionCompose { + (config: Config): (...funcs: StoreEnhancer[]) => StoreEnhancer; + (...funcs: StoreEnhancer[]): StoreEnhancer; +} + +declare global { + interface Window { + __REDUX_DEVTOOLS_EXTENSION__?: ReduxDevtoolsExtension; + __REDUX_DEVTOOLS_EXTENSION_COMPOSE__?: ReduxDevtoolsExtensionCompose; + } +} + +function extensionComposeStub( + config: Config +): (...funcs: StoreEnhancer[]) => StoreEnhancer; +function extensionComposeStub(...funcs: StoreEnhancer[]): StoreEnhancer; +function extensionComposeStub(...funcs: [Config] | StoreEnhancer[]) { + if (funcs.length === 0) return undefined; + if (typeof funcs[0] === 'object') return compose; + return compose(...(funcs as StoreEnhancer[])); +} + +export const composeWithDevTools: ReduxDevtoolsExtensionCompose = + typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ + ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ + : extensionComposeStub; + +export const devToolsEnhancer: (options?: EnhancerOptions) => StoreEnhancer = + typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__ + ? window.__REDUX_DEVTOOLS_EXTENSION__ + : function () { + return function (noop) { + return noop; + }; + }; diff --git a/packages/redux-devtools-extension/src/logOnly.ts b/packages/redux-devtools-extension/src/logOnly.ts new file mode 100644 index 00000000..9528bafb --- /dev/null +++ b/packages/redux-devtools-extension/src/logOnly.ts @@ -0,0 +1,71 @@ +import assign from './utils/assign'; +import { + Action, + compose, + Dispatch, + PreloadedState, + Reducer, + StoreEnhancer, +} from 'redux'; +import { Config, EnhancerOptions } from './index'; + +function enhancer(options?: EnhancerOptions): StoreEnhancer { + const config: Config = options || {}; + config.features = { pause: true, export: true, test: true }; + config.type = 'redux'; + if (config.autoPause === undefined) config.autoPause = true; + if (config.latency === undefined) config.latency = 500; + + return function (createStore) { + return function >( + reducer: Reducer, + preloadedState: PreloadedState | undefined + ) { + const store = createStore(reducer, preloadedState); + const origDispatch = store.dispatch; + + const devTools = window.__REDUX_DEVTOOLS_EXTENSION__!.connect(config); + devTools.init(store.getState()); + + const dispatch: Dispatch = function (action) { + const r = origDispatch(action); + devTools.send(action, store.getState()); + return r; + }; + + if (Object.assign) return Object.assign(store, { dispatch: dispatch }); + return assign(store, 'dispatch', dispatch); + }; + }; +} + +function composeWithEnhancer(config?: EnhancerOptions) { + return function (...funcs: StoreEnhancer[]) { + return compose(compose(...funcs), enhancer(config)); + }; +} + +export function composeWithDevTools( + config: Config +): (...funcs: StoreEnhancer[]) => StoreEnhancer; +export function composeWithDevTools(...funcs: StoreEnhancer[]): StoreEnhancer; +export function composeWithDevTools(...funcs: [Config] | StoreEnhancer[]) { + if (typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__) { + if (funcs.length === 0) return enhancer(); + if (typeof funcs[0] === 'object') return composeWithEnhancer(funcs[0]); + return composeWithEnhancer()(...(funcs as StoreEnhancer[])); + } + + if (funcs.length === 0) return undefined; + if (typeof funcs[0] === 'object') return compose; + return compose(...(funcs as StoreEnhancer[])); +} + +export const devToolsEnhancer: (options?: EnhancerOptions) => StoreEnhancer = + typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__ + ? enhancer + : function () { + return function (noop) { + return noop; + }; + }; diff --git a/packages/redux-devtools-extension/src/logOnlyInProduction.ts b/packages/redux-devtools-extension/src/logOnlyInProduction.ts new file mode 100644 index 00000000..68d9fb60 --- /dev/null +++ b/packages/redux-devtools-extension/src/logOnlyInProduction.ts @@ -0,0 +1,38 @@ +import { compose, StoreEnhancer } from 'redux'; +import * as logOnly from './logOnly'; +import { Config, EnhancerOptions } from './index'; + +declare const process: { + env: { + NODE_ENV: string; + }; +}; + +function extensionComposeStub( + config: Config +): (...funcs: StoreEnhancer[]) => StoreEnhancer; +function extensionComposeStub(...funcs: StoreEnhancer[]): StoreEnhancer; +function extensionComposeStub(...funcs: [Config] | StoreEnhancer[]) { + if (funcs.length === 0) return undefined; + if (typeof funcs[0] === 'object') return compose; + return compose(...(funcs as StoreEnhancer[])); +} + +export const composeWithDevTools = + process.env.NODE_ENV === 'production' + ? logOnly.composeWithDevTools + : typeof window !== 'undefined' && + window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ + ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ + : extensionComposeStub; + +export const devToolsEnhancer: (options?: EnhancerOptions) => StoreEnhancer = + process.env.NODE_ENV === 'production' + ? logOnly.devToolsEnhancer + : typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__ + ? window.__REDUX_DEVTOOLS_EXTENSION__ + : function () { + return function (noop) { + return noop; + }; + }; diff --git a/packages/redux-devtools-extension/src/utils/assign.ts b/packages/redux-devtools-extension/src/utils/assign.ts new file mode 100644 index 00000000..b9588369 --- /dev/null +++ b/packages/redux-devtools-extension/src/utils/assign.ts @@ -0,0 +1,26 @@ +const objectKeys = + Object.keys || + function (obj) { + const keys = []; + for (const key in obj) { + if ({}.hasOwnProperty.call(obj, key)) keys.push(key); + } + return keys; + }; + +export default function assign( + obj: T, + newKey: K, + newValue: T[K] +): T { + const keys = objectKeys(obj); + const copy: T = {} as T; + + for (let i = 0, l = keys.length; i < l; i++) { + const key = keys[i]; + copy[key as keyof T] = obj[key as keyof T]; + } + + copy[newKey] = newValue; + return copy; +} diff --git a/packages/redux-devtools-extension/tsconfig.json b/packages/redux-devtools-extension/tsconfig.json new file mode 100644 index 00000000..84575cb5 --- /dev/null +++ b/packages/redux-devtools-extension/tsconfig.json @@ -0,0 +1,7 @@ +{ + "extends": "../../tsconfig.base.json", + "compilerOptions": { + "outDir": "lib" + }, + "include": ["src"] +} diff --git a/packages/redux-devtools-extension/utils/assign.js b/packages/redux-devtools-extension/utils/assign.js deleted file mode 100644 index 75b70438..00000000 --- a/packages/redux-devtools-extension/utils/assign.js +++ /dev/null @@ -1,24 +0,0 @@ -var objectKeys = - Object.keys || - function (obj) { - var keys = []; - for (var key in obj) { - if ({}.hasOwnProperty.call(obj, key)) keys.push(key); - } - return keys; - }; - -function assign(obj, newKey, newValue) { - var keys = objectKeys(obj); - var copy = {}; - - for (var i = 0, l = keys.length; i < l; i++) { - var key = keys[i]; - copy[key] = obj[key]; - } - - copy[newKey] = newValue; - return copy; -} - -module.exports = assign; diff --git a/yarn.lock b/yarn.lock index 96ee14a7..6442ada4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4780,6 +4780,26 @@ __metadata: languageName: unknown linkType: soft +"@redux-devtools/extension@workspace:packages/redux-devtools-extension": + version: 0.0.0-use.local + resolution: "@redux-devtools/extension@workspace:packages/redux-devtools-extension" + dependencies: + "@babel/cli": ^7.16.0 + "@babel/core": ^7.16.0 + "@babel/preset-env": ^7.16.0 + "@babel/preset-typescript": ^7.16.0 + "@typescript-eslint/eslint-plugin": ^5.2.0 + "@typescript-eslint/parser": ^5.2.0 + eslint: ^7.32.0 + eslint-config-prettier: ^8.3.0 + redux: ^4.1.2 + rimraf: ^3.0.2 + typescript: ~4.4.4 + peerDependencies: + redux: ^3.1.0 || ^4.0.0 + languageName: unknown + linkType: soft + "@redux-devtools/inspector-monitor-test-tab@^0.7.2, @redux-devtools/inspector-monitor-test-tab@workspace:packages/redux-devtools-inspector-monitor-test-tab": version: 0.0.0-use.local resolution: "@redux-devtools/inspector-monitor-test-tab@workspace:packages/redux-devtools-inspector-monitor-test-tab" @@ -24596,14 +24616,6 @@ fsevents@^1.2.7: languageName: node linkType: hard -"redux-devtools-extension@workspace:packages/redux-devtools-extension": - version: 0.0.0-use.local - resolution: "redux-devtools-extension@workspace:packages/redux-devtools-extension" - peerDependencies: - redux: ^3.1.0 || ^4.0.0 - languageName: unknown - linkType: soft - "redux-devtools-themes@npm:^1.0.0": version: 1.0.0 resolution: "redux-devtools-themes@npm:1.0.0"