diff --git a/.changeset/early-poets-enjoy.md b/.changeset/early-poets-enjoy.md deleted file mode 100644 index 04fe3d5e7d..0000000000 --- a/.changeset/early-poets-enjoy.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@redux-devtools/cli': major ---- - -Dropped support for Node.js 14. diff --git a/.changeset/plenty-gifts-watch.md b/.changeset/plenty-gifts-watch.md deleted file mode 100644 index 51f97d207b..0000000000 --- a/.changeset/plenty-gifts-watch.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -'remotedev-redux-devtools-extension': minor -'@redux-devtools/inspector-monitor': minor ---- - -Option to sort State Tree keys alphabetically -Option to disable collapsing of object keys diff --git a/.github/workflows/CI.yml b/.github/workflows/CI.yml index f2c7b65a84..a7bcf40135 100644 --- a/.github/workflows/CI.yml +++ b/.github/workflows/CI.yml @@ -11,7 +11,7 @@ jobs: runs-on: ubuntu-latest steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 with: fetch-depth: 0 - uses: nrwl/nx-set-shas@v3 @@ -25,10 +25,10 @@ jobs: - name: Check formatting run: pnpm run format:check - name: Build - run: pnpm exec nx affected --target=build --parallel=1 + run: pnpm run build:all - name: Lint - run: pnpm exec nx affected --target=lint --parallel=1 + run: pnpm run lint:all - name: Test - uses: GabrielBB/xvfb-action@v1 + uses: coactions/setup-xvfb@v1 with: - run: pnpm exec nx affected --target=test --parallel=1 + run: pnpm run test:all diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index 70ae909cc3..34a7270b75 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -13,7 +13,7 @@ jobs: runs-on: ubuntu-latest steps: - name: Checkout Repo - uses: actions/checkout@v3 + uses: actions/checkout@v4 with: # This makes Actions fetch all Git history so that Changesets can generate changelogs with the correct commits fetch-depth: 0 diff --git a/docs/Walkthrough.md b/docs/Walkthrough.md index 8a2381b33f..ae1d0ce058 100644 --- a/docs/Walkthrough.md +++ b/docs/Walkthrough.md @@ -52,7 +52,7 @@ const DevTools = createDevTools( defaultIsVisible={true} > - + , ); export default DevTools; @@ -88,7 +88,7 @@ const enhancer = compose( // Middleware you want to use in development: applyMiddleware(d1, d2, d3), // Required! Enable Redux DevTools with the monitors you chose - DevTools.instrument() + DevTools.instrument(), ); export default function configureStore(initialState) { @@ -100,8 +100,8 @@ export default function configureStore(initialState) { if (module.hot) { module.hot.accept('../reducers', () => store.replaceReducer( - require('../reducers') /*.default if you use Babel 6+ */ - ) + require('../reducers') /*.default if you use Babel 6+ */, + ), ); } @@ -121,7 +121,7 @@ const enhancer = compose( // Required! Enable Redux DevTools with the monitors you chose DevTools.instrument(), // Optional. Lets you write ?debug_session= in address bar to persist debug sessions - persistState(getDebugSessionKey()) + persistState(getDebugSessionKey()), ); function getDebugSessionKey() { @@ -200,7 +200,7 @@ const enhancer = compose( // Required! Enable Redux DevTools with the monitors you chose DevTools.instrument(), // Optional. Lets you write ?debug_session= in address bar to persist debug sessions - persistState(getDebugSessionKey()) + persistState(getDebugSessionKey()), ); function getDebugSessionKey() { @@ -219,8 +219,8 @@ export default function configureStore(initialState) { if (module.hot) { module.hot.accept('../reducers', () => store.replaceReducer( - require('../reducers') /*.default if you use Babel 6+ */ - ) + require('../reducers') /*.default if you use Babel 6+ */, + ), ); } @@ -333,7 +333,7 @@ render( , - document.getElementById('root') + document.getElementById('root'), ); if (process.env.NODE_ENV !== 'production') { @@ -353,7 +353,7 @@ export default function showDevTools(store) { const popup = window.open( null, 'Redux DevTools', - 'menubar=no,location=no,resizable=yes,scrollbars=no,status=no' + 'menubar=no,location=no,resizable=yes,scrollbars=no,status=no', ); // Reload in case it already exists popup.location.reload(); @@ -362,7 +362,7 @@ export default function showDevTools(store) { popup.document.write('
'); render( , - popup.document.getElementById('react-devtools-root') + popup.document.getElementById('react-devtools-root'), ); }, 10); } diff --git a/eslintrc.ts.base.json b/eslintrc.ts.base.json index 6e4e649ff1..cdd3764d68 100644 --- a/eslintrc.ts.base.json +++ b/eslintrc.ts.base.json @@ -3,15 +3,29 @@ "plugins": ["@typescript-eslint"], "extends": [ "eslint:recommended", - "plugin:@typescript-eslint/eslint-recommended", - "plugin:@typescript-eslint/recommended", - "plugin:@typescript-eslint/recommended-requiring-type-checking", + "plugin:@typescript-eslint/recommended-type-checked", + "plugin:@typescript-eslint/stylistic-type-checked", "prettier" ], "rules": { "@typescript-eslint/no-unsafe-return": "off", "@typescript-eslint/no-unsafe-assignment": "off", "@typescript-eslint/no-unsafe-call": "off", - "@typescript-eslint/no-unsafe-member-access": "off" + "@typescript-eslint/no-unsafe-member-access": "off", + "@typescript-eslint/prefer-optional-chain": "off", + "@typescript-eslint/no-base-to-string": "off", + "@typescript-eslint/consistent-indexed-object-style": "off", + "@typescript-eslint/prefer-nullish-coalescing": "off", + "@typescript-eslint/consistent-type-definitions": "off", + "@typescript-eslint/no-unused-vars": "off", + "@typescript-eslint/no-explicit-any": "off", + "@typescript-eslint/prefer-for-of": "off", + "@typescript-eslint/non-nullable-type-assertion-style": "off", + "@typescript-eslint/class-literal-property-style": "off", + "@typescript-eslint/no-redundant-type-constituents": "off", + "@typescript-eslint/prefer-string-starts-ends-with": "off", + "@typescript-eslint/no-duplicate-type-constituents": "off", + "@typescript-eslint/array-type": "off", + "@typescript-eslint/prefer-function-type": "off" } } diff --git a/eslintrc.ts.jest.base.json b/eslintrc.ts.jest.base.json index cbde457e89..8a8cde2d78 100644 --- a/eslintrc.ts.jest.base.json +++ b/eslintrc.ts.jest.base.json @@ -2,9 +2,8 @@ "plugins": ["jest"], "extends": [ "eslint:recommended", - "plugin:@typescript-eslint/eslint-recommended", - "plugin:@typescript-eslint/recommended", - "plugin:@typescript-eslint/recommended-requiring-type-checking", + "plugin:@typescript-eslint/recommended-type-checked", + "plugin:@typescript-eslint/stylistic-type-checked", "plugin:jest/recommended", "plugin:jest/style", "prettier" @@ -13,6 +12,21 @@ "@typescript-eslint/no-unsafe-return": "off", "@typescript-eslint/no-unsafe-assignment": "off", "@typescript-eslint/no-unsafe-call": "off", - "@typescript-eslint/no-unsafe-member-access": "off" + "@typescript-eslint/no-unsafe-member-access": "off", + "@typescript-eslint/prefer-optional-chain": "off", + "@typescript-eslint/no-base-to-string": "off", + "@typescript-eslint/consistent-indexed-object-style": "off", + "@typescript-eslint/prefer-nullish-coalescing": "off", + "@typescript-eslint/consistent-type-definitions": "off", + "@typescript-eslint/no-unused-vars": "off", + "@typescript-eslint/no-explicit-any": "off", + "@typescript-eslint/prefer-for-of": "off", + "@typescript-eslint/non-nullable-type-assertion-style": "off", + "@typescript-eslint/class-literal-property-style": "off", + "@typescript-eslint/no-redundant-type-constituents": "off", + "@typescript-eslint/prefer-string-starts-ends-with": "off", + "@typescript-eslint/no-duplicate-type-constituents": "off", + "@typescript-eslint/array-type": "off", + "@typescript-eslint/prefer-function-type": "off" } } diff --git a/eslintrc.ts.react.base.json b/eslintrc.ts.react.base.json index e10a705c9c..f17dc31cf0 100644 --- a/eslintrc.ts.react.base.json +++ b/eslintrc.ts.react.base.json @@ -8,9 +8,8 @@ "plugins": ["@typescript-eslint", "react"], "extends": [ "eslint:recommended", - "plugin:@typescript-eslint/eslint-recommended", - "plugin:@typescript-eslint/recommended", - "plugin:@typescript-eslint/recommended-requiring-type-checking", + "plugin:@typescript-eslint/recommended-type-checked", + "plugin:@typescript-eslint/stylistic-type-checked", "plugin:react/recommended", "plugin:react-hooks/recommended", "prettier" @@ -32,6 +31,21 @@ "attributes": false } } - ] + ], + "@typescript-eslint/prefer-optional-chain": "off", + "@typescript-eslint/no-base-to-string": "off", + "@typescript-eslint/consistent-indexed-object-style": "off", + "@typescript-eslint/prefer-nullish-coalescing": "off", + "@typescript-eslint/consistent-type-definitions": "off", + "@typescript-eslint/no-unused-vars": "off", + "@typescript-eslint/no-explicit-any": "off", + "@typescript-eslint/prefer-for-of": "off", + "@typescript-eslint/non-nullable-type-assertion-style": "off", + "@typescript-eslint/class-literal-property-style": "off", + "@typescript-eslint/no-redundant-type-constituents": "off", + "@typescript-eslint/prefer-string-starts-ends-with": "off", + "@typescript-eslint/no-duplicate-type-constituents": "off", + "@typescript-eslint/array-type": "off", + "@typescript-eslint/prefer-function-type": "off" } } diff --git a/eslintrc.ts.react.jest.base.json b/eslintrc.ts.react.jest.base.json index ebc4e66f2f..80fbfee6b2 100644 --- a/eslintrc.ts.react.jest.base.json +++ b/eslintrc.ts.react.jest.base.json @@ -2,9 +2,8 @@ "plugins": ["jest"], "extends": [ "eslint:recommended", - "plugin:@typescript-eslint/eslint-recommended", - "plugin:@typescript-eslint/recommended", - "plugin:@typescript-eslint/recommended-requiring-type-checking", + "plugin:@typescript-eslint/recommended-type-checked", + "plugin:@typescript-eslint/stylistic-type-checked", "plugin:react/recommended", "plugin:react-hooks/recommended", "plugin:jest/recommended", @@ -15,6 +14,21 @@ "@typescript-eslint/no-unsafe-return": "off", "@typescript-eslint/no-unsafe-assignment": "off", "@typescript-eslint/no-unsafe-call": "off", - "@typescript-eslint/no-unsafe-member-access": "off" + "@typescript-eslint/no-unsafe-member-access": "off", + "@typescript-eslint/prefer-optional-chain": "off", + "@typescript-eslint/no-base-to-string": "off", + "@typescript-eslint/consistent-indexed-object-style": "off", + "@typescript-eslint/prefer-nullish-coalescing": "off", + "@typescript-eslint/consistent-type-definitions": "off", + "@typescript-eslint/no-unused-vars": "off", + "@typescript-eslint/no-explicit-any": "off", + "@typescript-eslint/prefer-for-of": "off", + "@typescript-eslint/non-nullable-type-assertion-style": "off", + "@typescript-eslint/class-literal-property-style": "off", + "@typescript-eslint/no-redundant-type-constituents": "off", + "@typescript-eslint/prefer-string-starts-ends-with": "off", + "@typescript-eslint/no-duplicate-type-constituents": "off", + "@typescript-eslint/array-type": "off", + "@typescript-eslint/prefer-function-type": "off" } } diff --git a/extension/CHANGELOG.md b/extension/CHANGELOG.md index a769ae4847..f5ad9b89f6 100644 --- a/extension/CHANGELOG.md +++ b/extension/CHANGELOG.md @@ -1,5 +1,43 @@ # remotedev-redux-devtools-extension +## 3.1.4 + +### Patch Changes + +- Updated dependencies [e57bcb39] + - @redux-devtools/app@4.0.0 + +## 3.1.3 + +### Patch Changes + +- bca76009: Fix missing CSS for code editor + +## 3.1.2 + +### Patch Changes + +- 64ed81b0: Fix extension in Firefox and Chrome Incognito + +## 3.1.1 + +### Patch Changes + +- d18525b5: Increase min-width of popup +- Updated dependencies [57751ff9] + - @redux-devtools/app@3.0.0 + +## 3.1.0 + +### Minor Changes + +- d54adb76: Option to sort State Tree keys alphabetically + Option to disable collapsing of object keys + +### Patch Changes + +- @redux-devtools/app@2.2.2 + ## 3.0.19 ### Patch Changes diff --git a/extension/README.md b/extension/README.md index 2e3cd99c08..1dea2a58d6 100644 --- a/extension/README.md +++ b/extension/README.md @@ -105,7 +105,7 @@ const composeEnhancers = : compose; const enhancer = composeEnhancers( - applyMiddleware(...middleware) + applyMiddleware(...middleware), // other store enhancers if any ); const store = createStore(reducer, enhancer); @@ -130,9 +130,9 @@ import { composeWithDevTools } from '@redux-devtools/extension'; const store = createStore( reducer, composeWithDevTools( - applyMiddleware(...middleware) + applyMiddleware(...middleware), // other store enhancers if any - ) + ), ); ``` @@ -148,9 +148,9 @@ const composeEnhancers = composeWithDevTools({ const store = createStore( reducer, /* preloadedState, */ composeEnhancers( - applyMiddleware(...middleware) + applyMiddleware(...middleware), // other store enhancers if any - ) + ), ); ``` @@ -164,7 +164,7 @@ import { devToolsEnhancer } from '@redux-devtools/extension'; const store = createStore( reducer, - /* preloadedState, */ devToolsEnhancer() + /* preloadedState, */ devToolsEnhancer(), // Specify name here, actionsDenylist, actionsCreators and other options if needed ); ``` @@ -181,7 +181,7 @@ import { devToolsEnhancerLogOnlyInProduction } from '@redux-devtools/extension'; const store = createStore( reducer, - /* preloadedState, */ devToolsEnhancerLogOnlyInProduction() + /* preloadedState, */ devToolsEnhancerLogOnlyInProduction(), // options like actionSanitizer, stateSanitizer ); ``` @@ -198,9 +198,9 @@ const composeEnhancers = composeWithDevToolsLogOnlyInProduction({ const store = createStore( reducer, /* preloadedState, */ composeEnhancers( - applyMiddleware(...middleware) + applyMiddleware(...middleware), // other store enhancers if any - ) + ), ); ``` diff --git a/extension/build.mjs b/extension/build.mjs new file mode 100644 index 0000000000..86971a68e7 --- /dev/null +++ b/extension/build.mjs @@ -0,0 +1,71 @@ +import * as fs from 'node:fs'; +import * as esbuild from 'esbuild'; +import pug from 'pug'; + +const args = process.argv.slice(2); +const prod = !args.includes('--dev'); + +const commonEsbuildOptions = { + bundle: true, + logLevel: 'info', + outdir: 'dist', + minify: prod, + sourcemap: !prod, + define: { + 'process.env.NODE_ENV': prod ? '"production"' : '"development"', + 'process.env.BABEL_ENV': prod ? '"production"' : '"development"', + }, +}; + +await esbuild.build({ + ...commonEsbuildOptions, + entryPoints: [ + { out: 'background.bundle', in: 'src/background/index.ts' }, + { out: 'options.bundle', in: 'src/options/index.tsx' }, + { out: 'window.bundle', in: 'src/window/index.tsx' }, + { out: 'remote.bundle', in: 'src/remote/index.tsx' }, + { out: 'devpanel.bundle', in: 'src/devpanel/index.tsx' }, + { out: 'devtools.bundle', in: 'src/devtools/index.ts' }, + { out: 'content.bundle', in: 'src/contentScript/index.ts' }, + { out: 'page.bundle', in: 'src/pageScript/index.ts' }, + ...(prod ? [] : [{ out: 'pagewrap.bundle', in: 'src/pageScriptWrap.ts' }]), + ], + loader: { + '.woff2': 'file', + }, +}); + +if (prod) { + await esbuild.build({ + ...commonEsbuildOptions, + entryPoints: [{ out: 'pagewrap.bundle', in: 'src/pageScriptWrap.ts' }], + loader: { + '.js': 'text', + }, + }); +} + +console.log(); + +console.log('Creating HTML files...'); +const htmlFiles = ['devpanel', 'devtools', 'options', 'remote', 'window']; +for (const htmlFile of htmlFiles) { + fs.writeFileSync( + `dist/${htmlFile}.html`, + pug.renderFile(`src/${htmlFile}/${htmlFile}.pug`), + ); +} + +console.log('Copying manifest.json...'); +fs.copyFileSync('chrome/manifest.json', 'dist/manifest.json'); + +console.log('Copying assets...'); +fs.cpSync('src/assets', 'dist', { recursive: true }); + +console.log('Copying dist for each browser...'); +fs.cpSync('dist', 'chrome/dist', { recursive: true }); +fs.copyFileSync('chrome/manifest.json', 'chrome/dist/manifest.json'); +fs.cpSync('dist', 'edge/dist', { recursive: true }); +fs.copyFileSync('edge/manifest.json', 'edge/dist/manifest.json'); +fs.cpSync('dist', 'firefox/dist', { recursive: true }); +fs.copyFileSync('firefox/manifest.json', 'firefox/dist/manifest.json'); diff --git a/extension/chrome/manifest.json b/extension/chrome/manifest.json index 78fca533f0..e61f37da85 100644 --- a/extension/chrome/manifest.json +++ b/extension/chrome/manifest.json @@ -1,5 +1,5 @@ { - "version": "3.0.19", + "version": "3.1.3", "name": "Redux DevTools", "description": "Redux DevTools for debugging application's state changes.", "homepage_url": "https://github.com/reduxjs/redux-devtools", diff --git a/extension/docs/API/Arguments.md b/extension/docs/API/Arguments.md index 2284b110e0..1589f841a9 100644 --- a/extension/docs/API/Arguments.md +++ b/extension/docs/API/Arguments.md @@ -5,18 +5,18 @@ Use with - `window.__REDUX_DEVTOOLS_EXTENSION__([options])` - `window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__([options])()` - `window.__REDUX_DEVTOOLS_EXTENSION__.connect([options])` -- `redux-devtools-extension` npm package: +- `@redux-devtools/extension` npm package: ```js -import { composeWithDevTools } from 'redux-devtools-extension'; +import { composeWithDevTools } from '@redux-devtools/extension'; const composeEnhancers = composeWithDevTools(options); const store = createStore( reducer, /* preloadedState, */ composeEnhancers( - applyMiddleware(...middleware) + applyMiddleware(...middleware), // other store enhancers if any - ) + ), ); ``` @@ -70,7 +70,7 @@ _boolean_ or _object_ which contains: }, }, }, - }) + }), ); ``` @@ -87,7 +87,7 @@ _boolean_ or _object_ which contains: replacer: (key, value) => value && mori.isMap(value) ? mori.toJs(value) : value, }, - }) + }), ); ``` @@ -109,7 +109,7 @@ _boolean_ or _object_ which contains: } }, }, - }) + }), ); ``` @@ -134,7 +134,7 @@ _boolean_ or _object_ which contains: } }, }, - }) + }), ); ``` @@ -174,7 +174,7 @@ _boolean_ or _object_ which contains: immutable: Immutable, refs: [ABRecord], }, - }) + }), ); ``` @@ -185,7 +185,7 @@ In the example bellow it will always send `{ component: '[React]' }`, regardless ```js function component( state = { component: null, toJSON: () => ({ component: '[React]' }) }, - action + action, ) { switch (action.type) { case 'ADD_COMPONENT': @@ -206,7 +206,7 @@ function counter( return { conter: this.count * 10 }; }, }, - action + action, ) { switch (action.type) { case 'INCREMENT': @@ -236,7 +236,7 @@ const store = createStore( actionSanitizer, stateSanitizer: (state) => state.data ? { ...state, data: '<>' } : state, - }) + }), ); ``` @@ -254,7 +254,7 @@ createStore( actionsDenylist: 'SOME_ACTION', // or actionsDenylist: ['SOME_ACTION', 'SOME_OTHER_ACTION'] // or just actionsDenylist: 'SOME_' to omit both - }) + }), ); ``` @@ -270,7 +270,7 @@ const store = createStore( window.__REDUX_DEVTOOLS_EXTENSION__({ predicate: (state, action) => state.dev.logLevel === VERBOSE && !action.forwarded, - }) + }), ); ``` diff --git a/extension/docs/Integrations.md b/extension/docs/Integrations.md index ae27c64f58..7f9175d112 100644 --- a/extension/docs/Integrations.md +++ b/extension/docs/Integrations.md @@ -32,7 +32,7 @@ import { inspectProps } from 'react-inspect-props'; compose( withState('count', 'setCount', 0), - inspectProps('Counter inspector') + inspectProps('Counter inspector'), )(Counter); ``` @@ -167,7 +167,7 @@ run(App, { { id: newId(), num: 0 }, { id: newId(), num: 0 }, ], - }) + }), ), }); ``` diff --git a/extension/docs/Recipes.md b/extension/docs/Recipes.md index 6a08024316..2ab0cf140a 100644 --- a/extension/docs/Recipes.md +++ b/extension/docs/Recipes.md @@ -28,7 +28,7 @@ type WindowWithDevTools = Window & { }; const isReduxDevtoolsExtenstionExist = ( - arg: Window | WindowWithDevTools + arg: Window | WindowWithDevTools, ): arg is WindowWithDevTools => { return '__REDUX_DEVTOOLS_EXTENSION__' in arg; }; @@ -40,7 +40,7 @@ const store = createStore( initialState, isReduxDevtoolsExtenstionExist(window) ? window.__REDUX_DEVTOOLS_EXTENSION__() - : undefined + : undefined, ); ``` @@ -72,7 +72,7 @@ const store = createStore( instaceID: 2, name: 'Allowlisted', actionsAllowlist: '...', - }) - ) + }), + ), ); ``` diff --git a/extension/docs/Troubleshooting.md b/extension/docs/Troubleshooting.md index d4b8591e44..a166972af7 100644 --- a/extension/docs/Troubleshooting.md +++ b/extension/docs/Troubleshooting.md @@ -35,8 +35,8 @@ const store = createStore( window.__REDUX_DEVTOOLS_EXTENSION__ ? window.__REDUX_DEVTOOLS_EXTENSION__() : (noop) => noop, - batchedSubscribe(/* ... */) - ) + batchedSubscribe(/* ... */), + ), ); ``` @@ -60,7 +60,7 @@ const store = createStore( actionSanitizer, stateSanitizer: (state) => state.data ? { ...state, data: '<>' } : state, - }) + }), ); ``` @@ -124,7 +124,7 @@ const store = Redux.createStore( window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__({ serialize: true, - }) + }), ); ``` diff --git a/extension/edge/manifest.json b/extension/edge/manifest.json index da3c2ea378..3337ff4110 100644 --- a/extension/edge/manifest.json +++ b/extension/edge/manifest.json @@ -1,5 +1,5 @@ { - "version": "3.0.19", + "version": "3.1.3", "name": "Redux DevTools", "description": "Redux DevTools for debugging application's state changes.", "homepage_url": "https://github.com/reduxjs/redux-devtools", diff --git a/extension/examples/counter/index.html b/extension/examples/counter/index.html index 0f9631449c..58c0aa80b9 100644 --- a/extension/examples/counter/index.html +++ b/extension/examples/counter/index.html @@ -1,4 +1,4 @@ - + Redux counter example diff --git a/extension/examples/counter/index.js b/extension/examples/counter/index.js index 0ab7fd0f32..7536393420 100644 --- a/extension/examples/counter/index.js +++ b/extension/examples/counter/index.js @@ -10,5 +10,5 @@ render( , - document.getElementById('root') + document.getElementById('root'), ); diff --git a/extension/examples/counter/server.js b/extension/examples/counter/server.js index 7e993c75e1..3b64665ad2 100644 --- a/extension/examples/counter/server.js +++ b/extension/examples/counter/server.js @@ -11,7 +11,7 @@ app.use( webpackDevMiddleware(compiler, { noInfo: true, publicPath: config.output.publicPath, - }) + }), ); app.use(webpackHotMiddleware(compiler)); @@ -26,7 +26,7 @@ app.listen(port, function (error) { console.info( '==> 🌎 Listening on port %s. Open up http://localhost:%s/ in your browser.', port, - port + port, ); } }); diff --git a/extension/examples/counter/store/configureStore.js b/extension/examples/counter/store/configureStore.js index a36c0d53e7..41505920bd 100644 --- a/extension/examples/counter/store/configureStore.js +++ b/extension/examples/counter/store/configureStore.js @@ -14,7 +14,7 @@ export default function configureStore(preloadedState) { const store = createStore( reducer, preloadedState, - composeEnhancers(applyMiddleware(invariant(), thunk)) + composeEnhancers(applyMiddleware(invariant(), thunk)), ); if (module.hot) { diff --git a/extension/examples/counter/test/actions/counter.spec.js b/extension/examples/counter/test/actions/counter.spec.js index c65cc240b2..5aa9ddf126 100644 --- a/extension/examples/counter/test/actions/counter.spec.js +++ b/extension/examples/counter/test/actions/counter.spec.js @@ -37,7 +37,7 @@ function mockStore(getState, expectedActions, onLastAction) { } const mockStoreWithMiddleware = applyMiddleware(...middlewares)( - mockStoreWithoutMiddleware + mockStoreWithoutMiddleware, ); return mockStoreWithMiddleware(); diff --git a/extension/examples/counter/test/components/Counter.spec.js b/extension/examples/counter/test/components/Counter.spec.js index 85f0e16356..4b91bce307 100644 --- a/extension/examples/counter/test/components/Counter.spec.js +++ b/extension/examples/counter/test/components/Counter.spec.js @@ -11,7 +11,7 @@ function setup() { decrement: expect.createSpy(), }; const component = TestUtils.renderIntoDocument( - + , ); return { component: component, diff --git a/extension/examples/counter/test/containers/App.spec.js b/extension/examples/counter/test/containers/App.spec.js index bfa4d73de7..ede61abb4f 100644 --- a/extension/examples/counter/test/containers/App.spec.js +++ b/extension/examples/counter/test/containers/App.spec.js @@ -10,7 +10,7 @@ function setup(initialState) { const app = TestUtils.renderIntoDocument( - + , ); return { app: app, diff --git a/extension/examples/react-counter-messaging/index.html b/extension/examples/react-counter-messaging/index.html index f877ce0b2c..352f8a0a9b 100644 --- a/extension/examples/react-counter-messaging/index.html +++ b/extension/examples/react-counter-messaging/index.html @@ -1,4 +1,4 @@ - + React counter example diff --git a/extension/examples/router/components/MainSection.js b/extension/examples/router/components/MainSection.js index 51b86378f4..53bd11d250 100644 --- a/extension/examples/router/components/MainSection.js +++ b/extension/examples/router/components/MainSection.js @@ -69,7 +69,7 @@ class MainSection extends Component { const filteredTodos = todos.filter(TODO_FILTERS[filter]); const completedCount = todos.reduce( (count, todo) => (todo.completed ? count + 1 : count), - 0 + 0, ); return ( diff --git a/extension/examples/router/index.html b/extension/examples/router/index.html index 50d21711f1..d04c63f0f0 100644 --- a/extension/examples/router/index.html +++ b/extension/examples/router/index.html @@ -1,4 +1,4 @@ - + Redux TodoMVC example diff --git a/extension/examples/router/index.js b/extension/examples/router/index.js index 760e2cbe4a..9cc7e08dae 100644 --- a/extension/examples/router/index.js +++ b/extension/examples/router/index.js @@ -12,5 +12,5 @@ render( , - document.getElementById('root') + document.getElementById('root'), ); diff --git a/extension/examples/router/reducers/todos.js b/extension/examples/router/reducers/todos.js index 53cc9146b7..acb42a58bb 100644 --- a/extension/examples/router/reducers/todos.js +++ b/extension/examples/router/reducers/todos.js @@ -34,14 +34,14 @@ export default function todos(state = initialState, action) { return state.map((todo) => todo.id === action.id ? Object.assign({}, todo, { text: action.text }) - : todo + : todo, ); case COMPLETE_TODO: return state.map((todo) => todo.id === action.id ? Object.assign({}, todo, { completed: !todo.completed }) - : todo + : todo, ); case COMPLETE_ALL: @@ -49,7 +49,7 @@ export default function todos(state = initialState, action) { return state.map((todo) => Object.assign({}, todo, { completed: !areAllMarked, - }) + }), ); case CLEAR_COMPLETED: diff --git a/extension/examples/router/server.js b/extension/examples/router/server.js index ab169aed92..c4444fd050 100644 --- a/extension/examples/router/server.js +++ b/extension/examples/router/server.js @@ -11,7 +11,7 @@ app.use( webpackDevMiddleware(compiler, { noInfo: true, publicPath: config.output.publicPath, - }) + }), ); app.use(webpackHotMiddleware(compiler)); @@ -26,7 +26,7 @@ app.listen(port, function (error) { console.info( '==> 🌎 Listening on port %s. Open up http://localhost:%s/ in your browser.', port, - port + port, ); } }); diff --git a/extension/examples/router/store/configureStore.js b/extension/examples/router/store/configureStore.js index 6ddb13aad6..ba4fb5f9c3 100644 --- a/extension/examples/router/store/configureStore.js +++ b/extension/examples/router/store/configureStore.js @@ -11,7 +11,7 @@ import rootReducer from '../reducers'; export default function configureStore(initialState) { let finalCreateStore = compose( reduxReactRouter({ createHistory }), - global.devToolsExtension ? global.devToolsExtension() : (f) => f + global.devToolsExtension ? global.devToolsExtension() : (f) => f, )(createStore); const store = finalCreateStore(rootReducer, initialState); diff --git a/extension/examples/router/test/components/Footer.spec.js b/extension/examples/router/test/components/Footer.spec.js index 4a9b23f44b..7285886954 100644 --- a/extension/examples/router/test/components/Footer.spec.js +++ b/extension/examples/router/test/components/Footer.spec.js @@ -13,7 +13,7 @@ function setup(propOverrides) { onClearCompleted: expect.createSpy(), onShow: expect.createSpy(), }, - propOverrides + propOverrides, ); const renderer = TestUtils.createRenderer(); @@ -72,7 +72,7 @@ describe('components', () => { 0: 'All', 1: 'Active', 2: 'Completed', - }[i] + }[i], ); }); }); diff --git a/extension/examples/router/test/components/MainSection.spec.js b/extension/examples/router/test/components/MainSection.spec.js index 03fcb7800a..c07f2dd1c1 100644 --- a/extension/examples/router/test/components/MainSection.spec.js +++ b/extension/examples/router/test/components/MainSection.spec.js @@ -29,7 +29,7 @@ function setup(propOverrides) { clearCompleted: expect.createSpy(), }, }, - propOverrides + propOverrides, ); const renderer = TestUtils.createRenderer(); diff --git a/extension/examples/router/test/components/TodoTextInput.spec.js b/extension/examples/router/test/components/TodoTextInput.spec.js index b4eb03ee3e..d7c0a131b0 100644 --- a/extension/examples/router/test/components/TodoTextInput.spec.js +++ b/extension/examples/router/test/components/TodoTextInput.spec.js @@ -12,7 +12,7 @@ function setup(propOverrides) { editing: false, newTodo: false, }, - propOverrides + propOverrides, ); const renderer = TestUtils.createRenderer(); diff --git a/extension/examples/router/test/reducers/todos.spec.js b/extension/examples/router/test/reducers/todos.spec.js index 8d7b243dde..19cb577bb6 100644 --- a/extension/examples/router/test/reducers/todos.spec.js +++ b/extension/examples/router/test/reducers/todos.spec.js @@ -18,7 +18,7 @@ describe('todos reducer', () => { todos([], { type: types.ADD_TODO, text: 'Run the tests', - }) + }), ).toEqual([ { text: 'Run the tests', @@ -39,8 +39,8 @@ describe('todos reducer', () => { { type: types.ADD_TODO, text: 'Run the tests', - } - ) + }, + ), ).toEqual([ { text: 'Run the tests', @@ -71,8 +71,8 @@ describe('todos reducer', () => { { type: types.ADD_TODO, text: 'Fix the tests', - } - ) + }, + ), ).toEqual([ { text: 'Fix the tests', @@ -110,8 +110,8 @@ describe('todos reducer', () => { { type: types.DELETE_TODO, id: 1, - } - ) + }, + ), ).toEqual([ { text: 'Use Redux', @@ -140,8 +140,8 @@ describe('todos reducer', () => { type: types.EDIT_TODO, text: 'Fix the tests', id: 1, - } - ) + }, + ), ).toEqual([ { text: 'Fix the tests', @@ -174,8 +174,8 @@ describe('todos reducer', () => { { type: types.COMPLETE_TODO, id: 1, - } - ) + }, + ), ).toEqual([ { text: 'Run the tests', @@ -207,8 +207,8 @@ describe('todos reducer', () => { ], { type: types.COMPLETE_ALL, - } - ) + }, + ), ).toEqual([ { text: 'Run the tests', @@ -239,8 +239,8 @@ describe('todos reducer', () => { ], { type: types.COMPLETE_ALL, - } - ) + }, + ), ).toEqual([ { text: 'Run the tests', @@ -272,8 +272,8 @@ describe('todos reducer', () => { ], { type: types.CLEAR_COMPLETED, - } - ) + }, + ), ).toEqual([ { text: 'Use Redux', @@ -308,7 +308,7 @@ describe('todos reducer', () => { completed: false, text: 'Write tests', }, - ]) + ]), ).toEqual([ { text: 'Write more tests', diff --git a/extension/examples/saga-counter/index.html b/extension/examples/saga-counter/index.html index 85d5588f35..c25e89773d 100644 --- a/extension/examples/saga-counter/index.html +++ b/extension/examples/saga-counter/index.html @@ -1,4 +1,4 @@ - + diff --git a/extension/examples/saga-counter/src/main.js b/extension/examples/saga-counter/src/main.js index f8eedf9573..83406bda48 100644 --- a/extension/examples/saga-counter/src/main.js +++ b/extension/examples/saga-counter/src/main.js @@ -20,7 +20,7 @@ const composeEnhancers = compose; const store = createStore( reducer, - composeEnhancers(applyMiddleware(sagaMiddleware)) + composeEnhancers(applyMiddleware(sagaMiddleware)), ); sagaMiddleware.run(rootSaga); @@ -35,7 +35,7 @@ function render() { onIncrementIfOdd={() => action('INCREMENT_IF_ODD')} onIncrementAsync={() => action('INCREMENT_ASYNC')} />, - document.getElementById('root') + document.getElementById('root'), ); } diff --git a/extension/examples/todomvc/components/MainSection.js b/extension/examples/todomvc/components/MainSection.js index 7aecc131fd..e517658d7c 100644 --- a/extension/examples/todomvc/components/MainSection.js +++ b/extension/examples/todomvc/components/MainSection.js @@ -70,7 +70,7 @@ class MainSection extends Component { const filteredTodos = todos.filter(TODO_FILTERS[filter]); const completedCount = todos.reduce( (count, todo) => (todo.completed ? count + 1 : count), - 0 + 0, ); return ( diff --git a/extension/examples/todomvc/index.html b/extension/examples/todomvc/index.html index 50d21711f1..d04c63f0f0 100644 --- a/extension/examples/todomvc/index.html +++ b/extension/examples/todomvc/index.html @@ -1,4 +1,4 @@ - + Redux TodoMVC example diff --git a/extension/examples/todomvc/index.js b/extension/examples/todomvc/index.js index 4f3b96ccde..edc119d987 100644 --- a/extension/examples/todomvc/index.js +++ b/extension/examples/todomvc/index.js @@ -12,5 +12,5 @@ render( , - document.getElementById('root') + document.getElementById('root'), ); diff --git a/extension/examples/todomvc/reducers/todos.js b/extension/examples/todomvc/reducers/todos.js index 0b91c484cb..f63f04281b 100644 --- a/extension/examples/todomvc/reducers/todos.js +++ b/extension/examples/todomvc/reducers/todos.js @@ -36,7 +36,7 @@ export default function todos(state = initialState, action) { return state.map((todo) => todo.id === action.id ? Object.assign({}, todo, { text: action.text, modified: new Date() }) - : todo + : todo, ); case COMPLETE_TODO: @@ -46,7 +46,7 @@ export default function todos(state = initialState, action) { completed: !todo.completed, modified: new Date(), }) - : todo + : todo, ); case COMPLETE_ALL: @@ -55,7 +55,7 @@ export default function todos(state = initialState, action) { Object.assign({}, todo, { completed: !areAllMarked, modified: new Date(), - }) + }), ); case CLEAR_COMPLETED: diff --git a/extension/examples/todomvc/server.js b/extension/examples/todomvc/server.js index ab169aed92..c4444fd050 100644 --- a/extension/examples/todomvc/server.js +++ b/extension/examples/todomvc/server.js @@ -11,7 +11,7 @@ app.use( webpackDevMiddleware(compiler, { noInfo: true, publicPath: config.output.publicPath, - }) + }), ); app.use(webpackHotMiddleware(compiler)); @@ -26,7 +26,7 @@ app.listen(port, function (error) { console.info( '==> 🌎 Listening on port %s. Open up http://localhost:%s/ in your browser.', port, - port + port, ); } }); diff --git a/extension/examples/todomvc/store/configureStore.js b/extension/examples/todomvc/store/configureStore.js index 9a0cbfa872..25e80ffa82 100644 --- a/extension/examples/todomvc/store/configureStore.js +++ b/extension/examples/todomvc/store/configureStore.js @@ -13,7 +13,7 @@ export default function configureStore(preloadedState) { if (!enhancer) { console.warn( 'Install Redux DevTools Extension to inspect the app state: ' + - 'https://github.com/zalmoxisus/redux-devtools-extension#installation' + 'https://github.com/zalmoxisus/redux-devtools-extension#installation', ); } diff --git a/extension/examples/todomvc/test/components/Footer.spec.js b/extension/examples/todomvc/test/components/Footer.spec.js index 4a9b23f44b..7285886954 100644 --- a/extension/examples/todomvc/test/components/Footer.spec.js +++ b/extension/examples/todomvc/test/components/Footer.spec.js @@ -13,7 +13,7 @@ function setup(propOverrides) { onClearCompleted: expect.createSpy(), onShow: expect.createSpy(), }, - propOverrides + propOverrides, ); const renderer = TestUtils.createRenderer(); @@ -72,7 +72,7 @@ describe('components', () => { 0: 'All', 1: 'Active', 2: 'Completed', - }[i] + }[i], ); }); }); diff --git a/extension/examples/todomvc/test/components/MainSection.spec.js b/extension/examples/todomvc/test/components/MainSection.spec.js index 03fcb7800a..c07f2dd1c1 100644 --- a/extension/examples/todomvc/test/components/MainSection.spec.js +++ b/extension/examples/todomvc/test/components/MainSection.spec.js @@ -29,7 +29,7 @@ function setup(propOverrides) { clearCompleted: expect.createSpy(), }, }, - propOverrides + propOverrides, ); const renderer = TestUtils.createRenderer(); diff --git a/extension/examples/todomvc/test/components/TodoTextInput.spec.js b/extension/examples/todomvc/test/components/TodoTextInput.spec.js index b4eb03ee3e..d7c0a131b0 100644 --- a/extension/examples/todomvc/test/components/TodoTextInput.spec.js +++ b/extension/examples/todomvc/test/components/TodoTextInput.spec.js @@ -12,7 +12,7 @@ function setup(propOverrides) { editing: false, newTodo: false, }, - propOverrides + propOverrides, ); const renderer = TestUtils.createRenderer(); diff --git a/extension/examples/todomvc/test/reducers/todos.spec.js b/extension/examples/todomvc/test/reducers/todos.spec.js index 8d7b243dde..19cb577bb6 100644 --- a/extension/examples/todomvc/test/reducers/todos.spec.js +++ b/extension/examples/todomvc/test/reducers/todos.spec.js @@ -18,7 +18,7 @@ describe('todos reducer', () => { todos([], { type: types.ADD_TODO, text: 'Run the tests', - }) + }), ).toEqual([ { text: 'Run the tests', @@ -39,8 +39,8 @@ describe('todos reducer', () => { { type: types.ADD_TODO, text: 'Run the tests', - } - ) + }, + ), ).toEqual([ { text: 'Run the tests', @@ -71,8 +71,8 @@ describe('todos reducer', () => { { type: types.ADD_TODO, text: 'Fix the tests', - } - ) + }, + ), ).toEqual([ { text: 'Fix the tests', @@ -110,8 +110,8 @@ describe('todos reducer', () => { { type: types.DELETE_TODO, id: 1, - } - ) + }, + ), ).toEqual([ { text: 'Use Redux', @@ -140,8 +140,8 @@ describe('todos reducer', () => { type: types.EDIT_TODO, text: 'Fix the tests', id: 1, - } - ) + }, + ), ).toEqual([ { text: 'Fix the tests', @@ -174,8 +174,8 @@ describe('todos reducer', () => { { type: types.COMPLETE_TODO, id: 1, - } - ) + }, + ), ).toEqual([ { text: 'Run the tests', @@ -207,8 +207,8 @@ describe('todos reducer', () => { ], { type: types.COMPLETE_ALL, - } - ) + }, + ), ).toEqual([ { text: 'Run the tests', @@ -239,8 +239,8 @@ describe('todos reducer', () => { ], { type: types.COMPLETE_ALL, - } - ) + }, + ), ).toEqual([ { text: 'Run the tests', @@ -272,8 +272,8 @@ describe('todos reducer', () => { ], { type: types.CLEAR_COMPLETED, - } - ) + }, + ), ).toEqual([ { text: 'Use Redux', @@ -308,7 +308,7 @@ describe('todos reducer', () => { completed: false, text: 'Write tests', }, - ]) + ]), ).toEqual([ { text: 'Write more tests', diff --git a/extension/firefox/manifest.json b/extension/firefox/manifest.json index 9c52efc8a8..9e0bd68d68 100644 --- a/extension/firefox/manifest.json +++ b/extension/firefox/manifest.json @@ -1,5 +1,5 @@ { - "version": "3.0.19", + "version": "3.1.3", "name": "Redux DevTools", "manifest_version": 2, "description": "Redux Developer Tools for debugging application state changes.", diff --git a/extension/jest.config.js b/extension/jest.config.js index e48385f6ee..a5d16b1825 100644 --- a/extension/jest.config.js +++ b/extension/jest.config.js @@ -6,6 +6,6 @@ module.exports = { '\\.css$': '/test/__mocks__/styleMock.ts', }, transformIgnorePatterns: [ - 'node_modules/(?!.pnpm|d3|dateformat|delaunator|internmap|nanoid|robust-predicates|uuid)', + 'node_modules/(?!.pnpm|@babel/code-frame|@babel/highlight|@babel/helper-validator-identifier|chalk|d3|dateformat|delaunator|internmap|nanoid|robust-predicates|uuid)', ], }; diff --git a/extension/package.json b/extension/package.json index 2c8fa6199b..26363dbf4c 100644 --- a/extension/package.json +++ b/extension/package.json @@ -1,7 +1,7 @@ { "private": true, "name": "remotedev-redux-devtools-extension", - "version": "3.0.19", + "version": "3.1.4", "description": "Redux Developer Tools for debugging application state changes.", "homepage": "https://github.com/reduxjs/redux-devtools/tree/master/extension", "license": "MIT", @@ -11,12 +11,8 @@ "url": "https://github.com/reduxjs/redux-devtools.git" }, "scripts": { - "start": "webpack --env development --watch", - "build": "pnpm run build:extension && pnpm run build:chrome && pnpm run build:edge && pnpm run build:firefox", - "build:extension": "webpack --env production && webpack --config wrap.webpack.config.js", - "build:chrome": "cpy . ../chrome/dist --cwd dist && cpy manifest.json dist --cwd chrome", - "build:edge": "cpy . ../edge/dist --cwd dist && cpy manifest.json dist --cwd edge", - "build:firefox": "cpy . ../firefox/dist --cwd dist && cpy manifest.json dist --cwd firefox", + "build": "pnpm run build:extension && pnpm run type-check", + "build:extension": "node build.mjs", "build:examples": "babel-node examples/buildAll.js", "clean": "rimraf dist && rimraf chrome/dist && rimraf edge/dist && rimraf firefox/dist", "test:app": "cross-env BABEL_ENV=test jest test/app", @@ -28,69 +24,60 @@ }, "dependencies": { "@babel/polyfill": "^7.12.1", - "@redux-devtools/app": "^2.2.1", + "@redux-devtools/app": "^4.0.0", "@redux-devtools/core": "^3.13.0", "@redux-devtools/instrument": "^2.1.0", "@redux-devtools/serialize": "^0.4.1", "@redux-devtools/slider-monitor": "^4.0.0", "@redux-devtools/ui": "^1.3.0", "@redux-devtools/utils": "^2.0.0", - "@types/jsan": "^3.1.2", + "@types/jsan": "^3.1.3", "jsan": "^3.1.14", "localforage": "^1.10.0", "lodash": "^4.17.21", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-icons": "^4.9.0", + "react-icons": "^4.11.0", "react-is": "^18.2.0", "react-json-tree": "^0.18.0", - "react-redux": "^8.0.7", + "react-redux": "^8.1.2", "redux": "^4.2.1", "redux-persist": "^6.0.0", "styled-components": "^5.3.11" }, "devDependencies": { - "@babel/core": "^7.22.1", - "@babel/preset-env": "^7.22.4", - "@babel/preset-react": "^7.22.3", - "@babel/preset-typescript": "^7.21.5", - "@babel/register": "^7.21.0", - "@testing-library/jest-dom": "^5.16.5", + "@babel/core": "^7.23.0", + "@babel/preset-env": "^7.22.20", + "@babel/preset-react": "^7.22.15", + "@babel/preset-typescript": "^7.23.0", + "@babel/register": "^7.22.15", + "@testing-library/jest-dom": "^6.1.3", "@testing-library/react": "^14.0.0", - "@types/chrome": "^0.0.237", - "@types/lodash": "^4.14.195", - "@types/react": "^18.2.8", - "@types/react-dom": "^18.2.4", - "@types/styled-components": "^5.1.26", - "babel-loader": "^9.1.2", - "chromedriver": "^112.0.1", - "copy-webpack-plugin": "^11.0.0", - "cpy-cli": "^4.2.0", + "@types/chrome": "^0.0.246", + "@types/lodash": "^4.14.199", + "@types/react": "^18.2.23", + "@types/react-dom": "^18.2.8", + "@types/styled-components": "^5.1.28", + "chromedriver": "^116.0.0", "cross-env": "^7.0.3", - "css-loader": "^6.8.1", - "electron": "^24.4.1", - "eslint": "^8.42.0", + "electron": "^26.2.2", + "esbuild": "^0.19.3", + "eslint": "^8.50.0", "eslint-config-airbnb": "^19.0.4", - "eslint-plugin-import": "^2.27.5", + "eslint-plugin-import": "^2.28.1", "eslint-plugin-jsx-a11y": "^6.7.1", - "eslint-plugin-react": "^7.32.2", + "eslint-plugin-react": "^7.33.2", "eslint-plugin-react-hooks": "^4.6.0", - "file-loader": "^6.2.0", - "fork-ts-checker-webpack-plugin": "^8.0.0", - "immutable": "^4.3.0", - "jest": "^29.5.0", - "jest-environment-jsdom": "^29.5.0", - "pug-html-loader": "^1.1.5", - "raw-loader": "^4.0.2", - "react-transform-catch-errors": "^1.0.2", - "react-transform-hmr": "^1.0.4", - "rimraf": "^5.0.1", - "selenium-webdriver": "^4.9.2", + "immutable": "^4.3.4", + "jest": "^29.7.0", + "jest-environment-jsdom": "^29.7.0", + "pug": "^3.0.2", + "rimraf": "^5.0.5", + "selenium-webdriver": "^4.13.0", "sinon-chrome": "^3.0.1", - "style-loader": "^3.3.3", - "ts-jest": "^29.1.0", - "typescript": "~5.0.4", - "webpack": "^5.85.0", - "webpack-cli": "^5.1.3" + "ts-jest": "^29.1.1", + "typescript": "~5.2.2", + "webpack": "^5.88.2", + "webpack-cli": "^5.1.4" } } diff --git a/extension/src/app/Actions.tsx b/extension/src/app/Actions.tsx index 4e032e5cf7..00abd2b906 100644 --- a/extension/src/app/Actions.tsx +++ b/extension/src/app/Actions.tsx @@ -17,7 +17,7 @@ import { StoreState, TopButtons, } from '@redux-devtools/app'; -import { GoRadioTower } from 'react-icons/go'; +import { GoBroadcast } from 'react-icons/go'; import { MdBorderBottom, MdBorderLeft, MdBorderRight } from 'react-icons/md'; import type { Position } from '../pageScript/api/openWindow'; import type { SingleMessage } from '../background/store/apiMiddleware'; @@ -131,7 +131,7 @@ class Actions extends Component { this.openWindow('remote'); }} > - + )} diff --git a/extension/src/background/index.ts b/extension/src/background/index.ts index c7236e2e55..0fc24ea7d4 100644 --- a/extension/src/background/index.ts +++ b/extension/src/background/index.ts @@ -1,3 +1,4 @@ +import '../chromeApiMock'; import { Store } from 'redux'; import configureStore, { BackgroundAction } from './store/backgroundStore'; import openDevToolsWindow, { DevToolsPosition } from './openWindow'; diff --git a/extension/src/background/logging.ts b/extension/src/background/logging.ts index 4d5cc91780..22cdd00279 100644 --- a/extension/src/background/logging.ts +++ b/extension/src/background/logging.ts @@ -3,7 +3,7 @@ import { LIFTED_ACTION } from '@redux-devtools/app'; export function getReport( reportId: string, tabId: string | number, - instanceId: number + instanceId: number, ) { chrome.storage.local.get(['s:hostname', 's:port', 's:secure'], (options) => { if (!options['s:hostname'] || !options['s:port']) return; diff --git a/extension/src/background/openWindow.ts b/extension/src/background/openWindow.ts index 2793ff8f71..2c3f1db0bb 100644 --- a/extension/src/background/openWindow.ts +++ b/extension/src/background/openWindow.ts @@ -12,7 +12,7 @@ export default function openDevToolsWindow(position: DevToolsPosition) { function popWindow( action: string, url: string, - customOptions: chrome.windows.CreateData & chrome.windows.UpdateInfo + customOptions: chrome.windows.CreateData & chrome.windows.UpdateInfo, ) { function focusIfExist(callback: () => void) { if (!windows[position]) { @@ -37,7 +37,7 @@ export default function openDevToolsWindow(position: DevToolsPosition) { }; if (action === 'open') { options.url = chrome.extension.getURL( - url + '#' + position.substr(position.indexOf('-') + 1) + url + '#' + position.substr(position.indexOf('-') + 1), ); chrome.windows.create(options, (win) => { windows[position] = win!.id; diff --git a/extension/src/background/store/apiMiddleware.ts b/extension/src/background/store/apiMiddleware.ts index fb132e1d72..f533943b4b 100644 --- a/extension/src/background/store/apiMiddleware.ts +++ b/extension/src/background/store/apiMiddleware.ts @@ -193,7 +193,7 @@ type TabPort = Omit & { }; type PanelPort = Omit & { postMessage: >( - message: PanelMessage + message: PanelMessage, ) => void; }; type MonitorPort = Omit & { @@ -232,13 +232,13 @@ type MonitorAction> = function toMonitors>( action: MonitorAction, tabId?: string | number, - verbose?: boolean + verbose?: boolean, ) { Object.keys(connections.monitor).forEach((id) => { connections.monitor[id].postMessage( verbose || action.type === 'ERROR' || action.type === SET_PERSIST ? action - : { type: UPDATE_STATE } + : { type: UPDATE_STATE }, ); }); Object.keys(connections.panel).forEach((id) => { @@ -267,7 +267,7 @@ function toContentScript(messageBody: ToContentScriptMessage) { message, instanceId, action as AppDispatchAction, - state + state, ), id: instanceId.toString().replace(/^[^\/]+\//, ''), }); @@ -281,7 +281,7 @@ function toContentScript(messageBody: ToContentScriptMessage) { message, instanceId, action as unknown as AppDispatchAction, - state + state, ), id: instanceId.toString().replace(/^[^\/]+\//, ''), }); @@ -295,7 +295,7 @@ function toContentScript(messageBody: ToContentScriptMessage) { message, instanceId, action as unknown as AppDispatchAction, - state + state, ), id: instanceId.toString().replace(/^[^\/]+\//, ''), }); @@ -309,7 +309,7 @@ function toContentScript(messageBody: ToContentScriptMessage) { message, instanceId, action as unknown as AppDispatchAction, - state + state, ), id: instanceId.toString().replace(/^[^\/]+\//, ''), }); @@ -323,7 +323,7 @@ function toContentScript(messageBody: ToContentScriptMessage) { message, instanceId, action as AppDispatchAction, - state + state, ), id: (instanceId as number).toString().replace(/^[^\/]+\//, ''), }); @@ -397,7 +397,7 @@ type BackgroundStoreResponse = { readonly options: Options }; function messaging>( request: BackgroundStoreMessage, sender: chrome.runtime.MessageSender, - sendResponse?: (response?: BackgroundStoreResponse) => void + sendResponse?: (response?: BackgroundStoreResponse) => void, ) { let tabId = getId(sender); if (!tabId) return; @@ -427,7 +427,7 @@ function messaging>( let position: DevToolsPosition = 'devtools-left'; if ( ['remote', 'panel', 'left', 'right', 'bottom'].indexOf( - request.position + request.position, ) !== -1 ) { position = ('devtools-' + request.position) as DevToolsPosition; @@ -489,7 +489,7 @@ function messaging>( function disconnect( type: 'tab' | 'monitor' | 'panel', id: number | string, - listener?: (message: any, port: chrome.runtime.Port) => void + listener?: (message: any, port: chrome.runtime.Port) => void, ) { return function disconnectListener() { const p = connections[type][id]; @@ -537,7 +537,7 @@ function onConnect>(port: chrome.runtime.Port) { instanceId, state: stringifyJSON( persistedState, - state.instances.options[instanceId].serialize + state.instances.options[instanceId].serialize, ), }); } @@ -588,7 +588,7 @@ declare global { window.syncOptions = syncOptions(toAllTabs); // Expose to the options page export default function api( - store: MiddlewareAPI, BackgroundState> + store: MiddlewareAPI, BackgroundState>, ) { return (next: Dispatch) => (action: BackgroundAction) => { if (action.type === LIFTED_ACTION) toContentScript(action); diff --git a/extension/src/background/store/backgroundStore.ts b/extension/src/background/store/backgroundStore.ts index da72bdd434..21187ce827 100644 --- a/extension/src/background/store/backgroundStore.ts +++ b/extension/src/background/store/backgroundStore.ts @@ -60,7 +60,7 @@ export type BackgroundAction = | DisconnectedAction; export default function configureStore( - preloadedState?: PreloadedState + preloadedState?: PreloadedState, ) { return createStore(rootReducer, preloadedState, applyMiddleware(api)); /* diff --git a/extension/src/contentScript/index.ts b/extension/src/contentScript/index.ts index 2c65ee14e1..8f77d3fe3b 100644 --- a/extension/src/contentScript/index.ts +++ b/extension/src/contentScript/index.ts @@ -1,3 +1,4 @@ +import '../chromeApiMock'; import { injectOptions, getOptionsFromBg, @@ -205,9 +206,11 @@ export type SplitMessage = function tryCatch>( fn: ( - args: PageScriptToContentScriptMessageWithoutDisconnect | SplitMessage + args: + | PageScriptToContentScriptMessageWithoutDisconnect + | SplitMessage, ) => void, - args: PageScriptToContentScriptMessageWithoutDisconnect + args: PageScriptToContentScriptMessageWithoutDisconnect, ) { try { return fn(args); @@ -273,7 +276,7 @@ export type ContentScriptToBackgroundMessage> = | RelayMessage; function postToBackground>( - message: ContentScriptToBackgroundMessage + message: ContentScriptToBackgroundMessage, ) { bg!.postMessage(message); } @@ -281,7 +284,7 @@ function postToBackground>( function send>( message: | PageScriptToContentScriptMessageWithoutDisconnect - | SplitMessage + | SplitMessage, ) { if (!connected) connect(); if (message.type === 'INIT_INSTANCE') { @@ -294,7 +297,7 @@ function send>( // Resend messages from the page to the background script function handleMessages>( - event: MessageEvent> + event: MessageEvent>, ) { if (!isAllowed()) return; if (!event || event.source !== window || typeof event.data !== 'object') { diff --git a/extension/src/devpanel/devpanel.pug b/extension/src/devpanel/devpanel.pug index 4aa1268de7..bf5105d33f 100644 --- a/extension/src/devpanel/devpanel.pug +++ b/extension/src/devpanel/devpanel.pug @@ -12,4 +12,5 @@ html body #root + link(href='/devpanel.bundle.css', rel='stylesheet') script(src='/devpanel.bundle.js') diff --git a/extension/src/devpanel/index.tsx b/extension/src/devpanel/index.tsx index a3879998dd..34a69f9fce 100644 --- a/extension/src/devpanel/index.tsx +++ b/extension/src/devpanel/index.tsx @@ -1,3 +1,4 @@ +import '../chromeApiMock'; import React, { CSSProperties, ReactNode } from 'react'; import { createRoot, Root } from 'react-dom/client'; import { Provider } from 'react-redux'; @@ -6,7 +7,6 @@ import { REMOVE_INSTANCE, StoreAction } from '@redux-devtools/app'; import App from '../app/App'; import configureStore from './store/panelStore'; -import './devpanel.pug'; import { Action, Store } from 'redux'; import type { PanelMessage } from '../background/store/apiMiddleware'; import type { StoreStateWithoutSocket } from './store/panelReducer'; @@ -42,7 +42,7 @@ function renderDevTools() { - + , ); rendered = true; } @@ -104,7 +104,7 @@ function init(id: number) { if (!rendered) renderDevTools(); store!.dispatch(message); } - } + }, ); } diff --git a/extension/src/devpanel/store/panelReducer.ts b/extension/src/devpanel/store/panelReducer.ts index 568a080fbc..9dc14c71b0 100644 --- a/extension/src/devpanel/store/panelReducer.ts +++ b/extension/src/devpanel/store/panelReducer.ts @@ -12,6 +12,8 @@ import { ReportsState, section, SectionState, + StateTreeSettings, + stateTreeSettings, StoreAction, theme, ThemeState, @@ -25,6 +27,7 @@ export interface StoreStateWithoutSocket { readonly instances: InstancesState; readonly reports: ReportsState; readonly notification: NotificationState; + readonly stateTreeSettings: StateTreeSettings; } const rootReducer: Reducer = @@ -36,6 +39,7 @@ const rootReducer: Reducer = section, theme, connection, + stateTreeSettings, }); export default rootReducer; diff --git a/extension/src/devpanel/store/panelStore.ts b/extension/src/devpanel/store/panelStore.ts index f8b8e62213..e8ce7ca5ec 100644 --- a/extension/src/devpanel/store/panelStore.ts +++ b/extension/src/devpanel/store/panelStore.ts @@ -16,11 +16,11 @@ const persistedReducer: Reducer = export default function configureStore( position: string, - bgConnection: chrome.runtime.Port + bgConnection: chrome.runtime.Port, ) { const enhancer = applyMiddleware( exportStateMiddleware, - panelDispatcher(bgConnection) + panelDispatcher(bgConnection), ); const store = createStore(persistedReducer, enhancer); const persistor = persistStore(store); diff --git a/extension/src/devtools/index.ts b/extension/src/devtools/index.ts index cdd376b68e..202e6c9725 100644 --- a/extension/src/devtools/index.ts +++ b/extension/src/devtools/index.ts @@ -1,11 +1,9 @@ -import './devtools.pug'; - function createPanel(url: string) { chrome.devtools.panels.create( 'Redux', 'img/logo/scalable.png', url, - function () {} + function () {}, ); } diff --git a/extension/src/options/Options.tsx b/extension/src/options/Options.tsx index 579dd3ac41..202c3e0559 100644 --- a/extension/src/options/Options.tsx +++ b/extension/src/options/Options.tsx @@ -10,7 +10,7 @@ export interface OptionsProps { readonly options: Options; readonly saveOption: ( name: K, - value: Options[K] + value: Options[K], ) => void; } diff --git a/extension/src/options/index.tsx b/extension/src/options/index.tsx index 181fa1b152..2e0fd7a42b 100644 --- a/extension/src/options/index.tsx +++ b/extension/src/options/index.tsx @@ -1,10 +1,9 @@ +import '../chromeApiMock'; import React from 'react'; import { createRoot } from 'react-dom/client'; import OptionsComponent from './Options'; import { Options } from './syncOptions'; -import './options.pug'; - chrome.runtime.getBackgroundPage((background) => { const syncOptions = background!.syncOptions; diff --git a/extension/src/options/syncOptions.ts b/extension/src/options/syncOptions.ts index e523c598a1..7f5ac82bad 100644 --- a/extension/src/options/syncOptions.ts +++ b/extension/src/options/syncOptions.ts @@ -93,7 +93,7 @@ const get = (callback: (options: Options) => void) => { function (items) { options = migrateOldOptions(items as OldOrNewOptions); callback(options); - } + }, ); } }; @@ -125,8 +125,8 @@ export const injectOptions = (newOptions: Options) => { document.createTextNode( 'window.devToolsOptions = Object.assign(window.devToolsOptions||{},' + JSON.stringify(options) + - ');' - ) + ');', + ), ); (document.head || document.documentElement).appendChild(s); s.parentNode!.removeChild(s); diff --git a/extension/src/pageScript/Monitor.ts b/extension/src/pageScript/Monitor.ts index 47fc3a51fd..a6eac428a0 100644 --- a/extension/src/pageScript/Monitor.ts +++ b/extension/src/pageScript/Monitor.ts @@ -11,7 +11,7 @@ declare global { export default class Monitor> { update: ( liftedState?: LiftedState | undefined, - libConfig?: LibConfig + libConfig?: LibConfig, ) => void; active?: boolean; paused?: boolean; @@ -21,8 +21,8 @@ export default class Monitor> { constructor( update: ( liftedState?: LiftedState | undefined, - libConfig?: LibConfig - ) => void + libConfig?: LibConfig, + ) => void, ) { this.update = update; } diff --git a/extension/src/pageScript/api/filters.ts b/extension/src/pageScript/api/filters.ts index e23a823da0..7410ae3860 100644 --- a/extension/src/pageScript/api/filters.ts +++ b/extension/src/pageScript/api/filters.ts @@ -23,7 +23,7 @@ export const noFiltersApplied = (localFilter: LocalFilter | undefined) => export function isFiltered>( action: A | string, - localFilter: LocalFilter | undefined + localFilter: LocalFilter | undefined, ) { if ( noFiltersApplied(localFilter) || @@ -43,7 +43,7 @@ export function isFiltered>( function filterActions>( actionsById: { [p: number]: PerformAction }, - actionSanitizer: ((action: A, id: number) => A) | undefined + actionSanitizer: ((action: A, id: number) => A) | undefined, ): { [p: number]: PerformAction } { if (!actionSanitizer) return actionsById; return mapValues(actionsById, (action, id) => ({ @@ -54,7 +54,7 @@ function filterActions>( function filterStates( computedStates: { state: S; error?: string | undefined }[], - stateSanitizer: ((state: S, index: number) => S) | undefined + stateSanitizer: ((state: S, index: number) => S) | undefined, ) { if (!stateSanitizer) return computedStates; return computedStates.map((state, idx) => ({ @@ -68,7 +68,7 @@ export function filterState>( localFilter: LocalFilter | undefined, stateSanitizer: ((state: S, index: number) => S) | undefined, actionSanitizer: ((action: A, id: number) => A) | undefined, - predicate: ((state: S, action: A) => boolean) | undefined + predicate: ((state: S, action: A) => boolean) | undefined, ): LiftedState { if (predicate || !noFiltersApplied(localFilter)) { const filteredStagedActionIds: number[] = []; @@ -94,7 +94,7 @@ export function filterState>( filteredComputedStates.push( stateSanitizer ? { ...liftedState, state: stateSanitizer(currState, idx) } - : liftedState + : liftedState, ); if (actionSanitizer) { sanitizedActionsById![id] = { @@ -139,7 +139,7 @@ export function startingFrom>( | undefined, predicate: | (>(state: S, action: A) => boolean) - | undefined + | undefined, ): LiftedState | PartialLiftedState | undefined { const stagedActionIds = state.stagedActionIds; if (sendingActionId <= stagedActionIds[1]) return state; @@ -178,7 +178,7 @@ export function startingFrom>( newComputedStates.push( !stateSanitizer ? currState - : { ...currState, state: stateSanitizer(currState.state, i) } + : { ...currState, state: stateSanitizer(currState.state, i) }, ); } diff --git a/extension/src/pageScript/api/importState.ts b/extension/src/pageScript/api/importState.ts index ae818149b2..319a7008bd 100644 --- a/extension/src/pageScript/api/importState.ts +++ b/extension/src/pageScript/api/importState.ts @@ -10,7 +10,7 @@ interface SerializeWithRequiredImmutable extends SerializeWithImmutable { } function isSerializeWithImmutable( - serialize: boolean | SerializeWithImmutable + serialize: boolean | SerializeWithImmutable, ): serialize is SerializeWithRequiredImmutable { return !!(serialize as SerializeWithImmutable).immutable; } @@ -20,7 +20,7 @@ interface SerializeWithRequiredReviver extends SerializeWithImmutable { } function isSerializeWithReviver( - serialize: boolean | SerializeWithImmutable + serialize: boolean | SerializeWithImmutable, ): serialize is SerializeWithRequiredReviver { return !!(serialize as SerializeWithImmutable).immutable; } @@ -32,7 +32,7 @@ interface ParsedSerializedLiftedState { export default function importState>( state: string | undefined, - { serialize }: Config + { serialize }: Config, ) { if (!state) return undefined; let parse = jsan.parse; @@ -45,8 +45,8 @@ export default function importState>( serialize.immutable, serialize.refs, serialize.replacer, - serialize.reviver - ).reviver + serialize.reviver, + ).reviver, ); } else if (isSerializeWithReviver(serialize)) { parse = (v) => jsan.parse(v, serialize.reviver); diff --git a/extension/src/pageScript/api/index.ts b/extension/src/pageScript/api/index.ts index ed062fe9b0..7292718bed 100644 --- a/extension/src/pageScript/api/index.ts +++ b/extension/src/pageScript/api/index.ts @@ -56,7 +56,7 @@ function stringify(obj: unknown, serialize?: Serialize | undefined) { // 16 MB /* eslint-disable no-console */ console.warn( - 'Application state or actions payloads are too large making Redux DevTools serialization slow and consuming a lot of memory. See https://github.com/reduxjs/redux-devtools-extension/blob/master/docs/Troubleshooting.md#excessive-use-of-memory-and-cpu on how to configure it.' + 'Application state or actions payloads are too large making Redux DevTools serialization slow and consuming a lot of memory. See https://github.com/reduxjs/redux-devtools-extension/blob/master/docs/Troubleshooting.md#excessive-use-of-memory-and-cpu on how to configure it.', ); /* eslint-enable no-console */ stringifyWarned = true; @@ -80,7 +80,7 @@ export function getSerializeParameter(config: Config) { serialize.immutable, serialize.refs, serialize.replacer, - serialize.reviver + serialize.reviver, ); return { replacer: immutableSerializer.replacer, @@ -183,7 +183,7 @@ interface OpenMessage { export type PageScriptToContentScriptMessageForwardedToMonitors< S, - A extends Action + A extends Action, > = | InitMessage | LiftedMessage @@ -194,7 +194,7 @@ export type PageScriptToContentScriptMessageForwardedToMonitors< export type PageScriptToContentScriptMessageWithoutDisconnectOrInitInstance< S, - A extends Action + A extends Action, > = | PageScriptToContentScriptMessageForwardedToMonitors | ErrorMessage @@ -204,7 +204,7 @@ export type PageScriptToContentScriptMessageWithoutDisconnectOrInitInstance< export type PageScriptToContentScriptMessageWithoutDisconnect< S, - A extends Action + A extends Action, > = | PageScriptToContentScriptMessageWithoutDisconnectOrInitInstance | InitInstancePageScriptToContentScriptMessage @@ -215,14 +215,14 @@ export type PageScriptToContentScriptMessage> = | DisconnectMessage; function post>( - message: PageScriptToContentScriptMessage + message: PageScriptToContentScriptMessage, ) { window.postMessage(message, '*'); } function getStackTrace( config: Config, - toExcludeFromTrace: Function | undefined + toExcludeFromTrace: Function | undefined, ) { if (!config.trace) return undefined; if (typeof config.trace === 'function') return config.trace(); @@ -265,7 +265,7 @@ function amendActionType>( | StructuralPerformAction[] | string, config: Config, - toExcludeFromTrace: Function | undefined + toExcludeFromTrace: Function | undefined, ): StructuralPerformAction { let timestamp = Date.now(); let stack = getStackTrace(config, toExcludeFromTrace); @@ -383,7 +383,7 @@ type ToContentScriptMessage> = export function toContentScript>( message: ToContentScriptMessage, serializeState?: Serialize | undefined, - serializeAction?: Serialize | undefined + serializeAction?: Serialize | undefined, ) { if (message.type === 'ACTION') { post({ @@ -430,7 +430,7 @@ export function sendMessage>( state: LiftedState, config: Config, instanceId?: number, - name?: string + name?: string, ) { let amendedAction = action; if (typeof config !== 'object') { @@ -450,7 +450,7 @@ export function sendMessage>( instanceId: config.instanceId || instanceId || 1, }, config.serialize as Serialize | undefined, - config.serialize as Serialize | undefined + config.serialize as Serialize | undefined, ); } else { toContentScript( @@ -464,7 +464,7 @@ export function sendMessage>( instanceId: config.instanceId || instanceId || 1, }, config.serialize as Serialize | undefined, - config.serialize as Serialize | undefined + config.serialize as Serialize | undefined, ); } } @@ -489,7 +489,7 @@ function handleMessages(event: MessageEvent) { export function setListener( onMessage: (message: ContentScriptToPageScriptMessage) => void, - instanceId: number + instanceId: number, ) { listeners[instanceId] = onMessage; window.addEventListener('message', handleMessages, false); @@ -498,7 +498,7 @@ export function setListener( const liftListener = >( listener: (message: ListenerMessage) => void, - config: Config + config: Config, ) => (message: ContentScriptToPageScriptMessage) => { if (message.type === 'IMPORT') { @@ -522,15 +522,15 @@ export function disconnect() { export interface ConnectResponse { init: >( state: S, - liftedData?: LiftedState + liftedData?: LiftedState, ) => void; subscribe: >( - listener: (message: ListenerMessage) => void + listener: (message: ListenerMessage) => void, ) => (() => void) | undefined; unsubscribe: () => void; send: >( action: A, - state: LiftedState + state: LiftedState, ) => void; error: (payload: string) => void; } @@ -575,12 +575,12 @@ export function connect(preConfig: Config): ConnectResponse { listeners[id] = [rootListener]; const subscribe = >( - listener: (message: ListenerMessage) => void + listener: (message: ListenerMessage) => void, ) => { if (!listener) return undefined; const liftedListener = liftListener(listener, config); const listenersForId = listeners[id] as (( - message: ContentScriptToPageScriptMessage + message: ContentScriptToPageScriptMessage, ) => void)[]; listenersForId.push(liftedListener); @@ -602,7 +602,7 @@ export function connect(preConfig: Config): ConnectResponse { const send = >( action: A, - state: LiftedState + state: LiftedState, ) => { if ( isPaused || @@ -639,13 +639,13 @@ export function connect(preConfig: Config): ConnectResponse { sendMessage( amendedAction as StructuralPerformAction, amendedState, - config + config, ); }; const init = >( state: S, - liftedData?: LiftedState + liftedData?: LiftedState, ) => { const message: InitMessage = { type: 'INIT', diff --git a/extension/src/pageScript/api/notifyErrors.ts b/extension/src/pageScript/api/notifyErrors.ts index 569cbb3a78..e0b826e733 100644 --- a/extension/src/pageScript/api/notifyErrors.ts +++ b/extension/src/pageScript/api/notifyErrors.ts @@ -26,7 +26,7 @@ function postError(message: string) { type: 'ERROR', message: message, }, - '*' + '*', ); } diff --git a/extension/src/pageScript/api/openWindow.ts b/extension/src/pageScript/api/openWindow.ts index 53704b5831..02cd850fbf 100644 --- a/extension/src/pageScript/api/openWindow.ts +++ b/extension/src/pageScript/api/openWindow.ts @@ -4,7 +4,7 @@ import type { PageScriptToContentScriptMessage } from './index'; export type Position = 'left' | 'right' | 'bottom' | 'panel' | 'remote'; function post>( - message: PageScriptToContentScriptMessage + message: PageScriptToContentScriptMessage, ) { window.postMessage(message, '*'); } diff --git a/extension/src/pageScript/enhancerStore.ts b/extension/src/pageScript/enhancerStore.ts index 5961292f9d..dfe0e7f8b8 100644 --- a/extension/src/pageScript/enhancerStore.ts +++ b/extension/src/pageScript/enhancerStore.ts @@ -5,7 +5,7 @@ import type { ConfigWithExpandedMaxAge } from './index'; export function getUrlParam(key: string) { const matches = window.location.href.match( - new RegExp(`[?&]${key}=([^&#]+)\\b`) + new RegExp(`[?&]${key}=([^&#]+)\\b`), ); return matches && matches.length > 0 ? matches[1] : null; } @@ -20,11 +20,11 @@ export default function configureStore< S, A extends Action, MonitorState, - MonitorAction extends Action + MonitorAction extends Action, >( next: StoreEnhancerStoreCreator, monitorReducer: Reducer, - config: ConfigWithExpandedMaxAge + config: ConfigWithExpandedMaxAge, ) { return compose( instrument(monitorReducer, { @@ -37,6 +37,6 @@ export default function configureStore< shouldStartLocked: config.shouldStartLocked, pauseActionType: config.pauseActionType || '@@PAUSED', }), - persistState(getUrlParam('debug_session')) + persistState(getUrlParam('debug_session')), )(next); } diff --git a/extension/src/pageScript/index.ts b/extension/src/pageScript/index.ts index fef17af1d3..b9b4b0296d 100644 --- a/extension/src/pageScript/index.ts +++ b/extension/src/pageScript/index.ts @@ -57,7 +57,7 @@ import type { ContentScriptToPageScriptMessage } from '../contentScript'; type EnhancedStoreWithInitialDispatch< S, A extends Action, - MonitorState + MonitorState, > = EnhancedStore & { initialDispatch: Dispatch }; const source = '@devtools-page'; @@ -73,7 +73,7 @@ let reportId: string | null | undefined; function deprecateParam(oldParam: string, newParam: string) { /* eslint-disable no-console */ console.warn( - `${oldParam} parameter is deprecated, use ${newParam} instead: https://github.com/reduxjs/redux-devtools/blob/main/extension/docs/API/Arguments.md` + `${oldParam} parameter is deprecated, use ${newParam} instead: https://github.com/reduxjs/redux-devtools/blob/main/extension/docs/API/Arguments.md`, ); /* eslint-enable no-console */ } @@ -99,18 +99,18 @@ export interface ConfigWithExpandedMaxAge { readonly stateSanitizer?: (state: S, index?: number) => S; readonly actionSanitizer?: >( action: A, - id?: number + id?: number, ) => A; readonly predicate?: >( state: S, - action: A + action: A, ) => boolean; readonly latency?: number; readonly maxAge?: | number | (>( currentLiftedAction: LiftedAction, - previousLiftedState: LiftedState | undefined + previousLiftedState: LiftedState | undefined, ) => number); readonly trace?: boolean | (() => string | undefined); readonly traceLimit?: number; @@ -142,11 +142,11 @@ interface ReduxDevtoolsExtension { state: LiftedState, config: Config, instanceId?: number, - name?: string + name?: string, ) => void; listen: ( onMessage: (message: ContentScriptToPageScriptMessage) => void, - instanceId: number + instanceId: number, ) => void; connect: (preConfig: Config) => ConnectResponse; disconnect: () => void; @@ -159,7 +159,7 @@ declare global { } function __REDUX_DEVTOOLS_EXTENSION__>( - config?: Config + config?: Config, ): StoreEnhancer { /* eslint-disable no-param-reassign */ if (typeof config !== 'object') config = {}; @@ -188,7 +188,7 @@ function __REDUX_DEVTOOLS_EXTENSION__>( const relayState = throttle( ( liftedState?: LiftedState | undefined, - libConfig?: LibConfig + libConfig?: LibConfig, ) => { relayAction.cancel(); const state = liftedState || store.liftedStore.getState(); @@ -201,17 +201,17 @@ function __REDUX_DEVTOOLS_EXTENSION__>( localFilter, stateSanitizer, actionSanitizer, - predicate + predicate, ), source, instanceId, libConfig, }, serializeState, - serializeAction + serializeAction, ); }, - latency + latency, ); const monitor = new Monitor(relayState); @@ -233,7 +233,7 @@ function __REDUX_DEVTOOLS_EXTENSION__>( instanceId, }, serializeState, - serializeAction + serializeAction, ); } @@ -269,13 +269,13 @@ function __REDUX_DEVTOOLS_EXTENSION__>( ? liftedState.actionsById[nextActionId - 1] : actionSanitizer( liftedState.actionsById[nextActionId - 1].action, - nextActionId - 1 + nextActionId - 1, ), maxAge: getMaxAge(), nextActionId, }, serializeState, - serializeAction + serializeAction, ); return; } @@ -287,7 +287,7 @@ function __REDUX_DEVTOOLS_EXTENSION__>( localFilter, stateSanitizer, actionSanitizer, - predicate + predicate, ); sendingActionId = nextActionId; if (typeof payload === 'undefined') return; @@ -300,13 +300,13 @@ function __REDUX_DEVTOOLS_EXTENSION__>( localFilter, stateSanitizer, actionSanitizer, - predicate + predicate, ), source, instanceId, }, serializeState, - serializeAction + serializeAction, ); return; } @@ -319,7 +319,7 @@ function __REDUX_DEVTOOLS_EXTENSION__>( maxAge: getMaxAge(), }, serializeState, - serializeAction + serializeAction, ); }, latency); @@ -337,7 +337,7 @@ function __REDUX_DEVTOOLS_EXTENSION__>( instanceId, }, serializeState, - serializeAction + serializeAction, ); } } @@ -357,7 +357,7 @@ function __REDUX_DEVTOOLS_EXTENSION__>( instanceId, }, serializeState, - serializeAction + serializeAction, ); } } @@ -419,7 +419,7 @@ function __REDUX_DEVTOOLS_EXTENSION__>( instanceId, }, serializeState, - serializeAction + serializeAction, ); reportId = null; } @@ -437,7 +437,7 @@ function __REDUX_DEVTOOLS_EXTENSION__>( instanceId, }, serializeState, - serializeAction + serializeAction, ); } } @@ -446,7 +446,7 @@ function __REDUX_DEVTOOLS_EXTENSION__>( const filteredActionIds: number[] = []; // simple circular buffer of non-excluded actions with fixed maxAge-1 length const getMaxAge = ( liftedAction?: LiftedAction, - liftedState?: LiftedState | undefined + liftedState?: LiftedState | undefined, ) => { let m = (config && config.maxAge) || window.devToolsOptions.maxAge || 50; if ( @@ -497,7 +497,7 @@ function __REDUX_DEVTOOLS_EXTENSION__>( instanceId, }, serializeState, - serializeAction + serializeAction, ); store.subscribe(handleChange); @@ -529,11 +529,11 @@ function __REDUX_DEVTOOLS_EXTENSION__>( const enhance = (): StoreEnhancer => ( - next: StoreEnhancerStoreCreator + next: StoreEnhancerStoreCreator, ): any => { return ( reducer_: Reducer, - initialState_?: PreloadedState + initialState_?: PreloadedState, ) => { if (!isAllowed(window.devToolsOptions)) { return next(reducer_, initialState_); @@ -545,7 +545,7 @@ function __REDUX_DEVTOOLS_EXTENSION__>( { ...config, maxAge: getMaxAge as any, - } + }, )(reducer_, initialState_) as any; if (isInIframe()) setTimeout(init, 3000); @@ -593,7 +593,7 @@ const preEnhancer = export type InferComposedStoreExt = StoreEnhancers extends [ infer HeadStoreEnhancer, - ...infer RestStoreEnhancers + ...infer RestStoreEnhancers, ] ? HeadStoreEnhancer extends StoreEnhancer ? StoreExt & InferComposedStoreExt @@ -611,13 +611,15 @@ const extensionCompose = return [preEnhancer(instanceId), ...funcs].reduceRight( // @ts-ignore FIXME (composed, f) => f(composed), - __REDUX_DEVTOOLS_EXTENSION__({ ...config, instanceId })(...args) + __REDUX_DEVTOOLS_EXTENSION__({ ...config, instanceId })(...args), ); }; }; interface ReduxDevtoolsExtensionCompose { - (config: Config): []>( + ( + config: Config, + ): []>( ...funcs: StoreEnhancers ) => StoreEnhancer>; []>( @@ -632,12 +634,12 @@ declare global { } function reduxDevtoolsExtensionCompose( - config: Config + config: Config, ): []>( ...funcs: StoreEnhancers ) => StoreEnhancer>; function reduxDevtoolsExtensionCompose< - StoreEnhancers extends readonly StoreEnhancer[] + StoreEnhancers extends readonly StoreEnhancer[], >( ...funcs: StoreEnhancers ): StoreEnhancer>; diff --git a/extension/src/pageScriptWrap.ts b/extension/src/pageScriptWrap.ts index ae1da249db..5b02a9ce37 100644 --- a/extension/src/pageScriptWrap.ts +++ b/extension/src/pageScriptWrap.ts @@ -1,8 +1,10 @@ +// @ts-ignore +import script from '../dist/page.bundle.js'; + let s = document.createElement('script'); s.type = 'text/javascript'; if (process.env.NODE_ENV === 'production') { - const { default: script } = require('raw-loader!../dist/page.bundle.js'); s.appendChild(document.createTextNode(script)); (document.head || document.documentElement).appendChild(s); s.parentNode!.removeChild(s); @@ -10,7 +12,7 @@ if (process.env.NODE_ENV === 'production') { s.src = chrome.extension.getURL('page.bundle.js'); s.onload = function () { (this as HTMLScriptElement).parentNode!.removeChild( - this as HTMLScriptElement + this as HTMLScriptElement, ); }; (document.head || document.documentElement).appendChild(s); diff --git a/extension/src/remote/index.tsx b/extension/src/remote/index.tsx index af100aca31..dceae3b5b2 100644 --- a/extension/src/remote/index.tsx +++ b/extension/src/remote/index.tsx @@ -2,8 +2,6 @@ import React from 'react'; import { createRoot } from 'react-dom/client'; import { Root } from '@redux-devtools/app'; -import './remote.pug'; - chrome.storage.local.get( { 'select-monitor': 'InspectorMonitor', @@ -31,7 +29,7 @@ chrome.storage.local.get( } : undefined } - /> + />, ); - } + }, ); diff --git a/extension/src/remote/remote.pug b/extension/src/remote/remote.pug index 259bd8f4bf..a64a926e48 100644 --- a/extension/src/remote/remote.pug +++ b/extension/src/remote/remote.pug @@ -8,4 +8,5 @@ html body #root + link(href='/remote.bundle.css', rel='stylesheet') script(src='/remote.bundle.js') diff --git a/extension/src/window/index.tsx b/extension/src/window/index.tsx index c74e33a10e..6f40e05539 100644 --- a/extension/src/window/index.tsx +++ b/extension/src/window/index.tsx @@ -7,8 +7,6 @@ import App from '../app/App'; import configureStore from './store/windowStore'; import type { MonitorMessage } from '../background/store/apiMiddleware'; -import './window.pug'; - const position = location.hash; chrome.runtime.getBackgroundPage((window) => { @@ -31,8 +29,9 @@ chrome.runtime.getBackgroundPage((window) => { - + , ); }); +if (position === '#popup') document.body.style.minWidth = '760px'; if (position !== '#popup') document.body.style.minHeight = '100%'; diff --git a/extension/src/window/store/instanceSelectorMiddleware.ts b/extension/src/window/store/instanceSelectorMiddleware.ts index 6db884cd1b..e10879bc97 100644 --- a/extension/src/window/store/instanceSelectorMiddleware.ts +++ b/extension/src/window/store/instanceSelectorMiddleware.ts @@ -9,7 +9,7 @@ import { function selectInstance( tabId: number, store: MiddlewareAPI, StoreState>, - next: Dispatch + next: Dispatch, ) { const instances = store.getState().instances; if (instances.current === 'default') return; @@ -29,12 +29,12 @@ function getCurrentTabId(next: (tabId: number) => void) { const tab = tabs[0]; if (!tab) return; next(tab.id!); - } + }, ); } export default function popupSelector( - store: MiddlewareAPI, StoreState> + store: MiddlewareAPI, StoreState>, ) { return (next: Dispatch) => (action: StoreAction) => { const result = next(action); diff --git a/extension/src/window/store/instancesReducer.ts b/extension/src/window/store/instancesReducer.ts index cc39478bdd..29497656c3 100644 --- a/extension/src/window/store/instancesReducer.ts +++ b/extension/src/window/store/instancesReducer.ts @@ -13,7 +13,7 @@ import type { export default function instances( state = instancesInitialState, - action: WindowStoreAction + action: WindowStoreAction, ) { switch (action.type) { case UPDATE_STATE: diff --git a/extension/src/window/store/windowStore.ts b/extension/src/window/store/windowStore.ts index f63002aedb..43cea9c57d 100644 --- a/extension/src/window/store/windowStore.ts +++ b/extension/src/window/store/windowStore.ts @@ -45,12 +45,12 @@ const persistConfig = { const persistedReducer: Reducer = persistReducer( persistConfig, - rootReducer + rootReducer, ) as any; export default function configureStore( baseStore: Store, - position: string + position: string, ) { let enhancer: StoreEnhancer; const middlewares = [exportStateMiddleware, api, syncStores(baseStore)]; @@ -65,7 +65,7 @@ export default function configureStore( applyMiddleware(...middlewares), window.__REDUX_DEVTOOLS_EXTENSION__ ? window.__REDUX_DEVTOOLS_EXTENSION__() - : (noop: unknown) => noop + : (noop: unknown) => noop, ); } const store = createStore(persistedReducer, enhancer); diff --git a/extension/src/window/window.pug b/extension/src/window/window.pug index 630a3edf20..efda47dbf5 100644 --- a/extension/src/window/window.pug +++ b/extension/src/window/window.pug @@ -14,4 +14,5 @@ html height=300, width=350, style='position: absolute; top: 50%; left: 50%; margin-top: -175px; margin-left: -175px;' ) + link(href='/window.bundle.css', rel='stylesheet') script(src='/window.bundle.js') diff --git a/extension/test/app/containers/App.spec.js b/extension/test/app/containers/App.spec.js index 267253113f..051f5b30ec 100644 --- a/extension/test/app/containers/App.spec.js +++ b/extension/test/app/containers/App.spec.js @@ -25,7 +25,7 @@ describe('App container', () => { render( - + , ); expect(screen.getByTestId('inspector')).toBeDefined(); }); @@ -34,11 +34,9 @@ describe('App container', () => { render( - + , ); const actionList = screen.getByTestId('actionList'); - expect( - within(actionList).getByTestId('actionListRows') - ).toBeEmptyDOMElement(); + expect(within(actionList).queryByRole('button')).not.toBeInTheDocument(); }); }); diff --git a/extension/test/app/inject/api.spec.js b/extension/test/app/inject/api.spec.js index 0a06d321ed..54a059fe3f 100644 --- a/extension/test/app/inject/api.spec.js +++ b/extension/test/app/inject/api.spec.js @@ -50,7 +50,7 @@ describe('API', () => { window.__REDUX_DEVTOOLS_EXTENSION__.send( { type: 'hi' }, { counter: 1 }, - 1 + 1, ); }); expect(message).toMatchObject({ @@ -66,7 +66,7 @@ describe('API', () => { window.__REDUX_DEVTOOLS_EXTENSION__.send( { type: 'hi' }, { counter: 1 }, - 1 + 1, ); }); expect(message).toMatchObject({ diff --git a/extension/test/app/inject/enhancer.spec.js b/extension/test/app/inject/enhancer.spec.js index c4ce2b8888..219c73ecc4 100644 --- a/extension/test/app/inject/enhancer.spec.js +++ b/extension/test/app/inject/enhancer.spec.js @@ -19,7 +19,7 @@ describe('Redux enhancer', () => { const message = await listenMessage(() => { window.store = createStore( counter, - window.__REDUX_DEVTOOLS_EXTENSION__() + window.__REDUX_DEVTOOLS_EXTENSION__(), ); expect(typeof window.store).toBe('object'); }); @@ -37,7 +37,7 @@ describe('Redux enhancer', () => { message = await listenMessage(); expect(message.type).toBe('STATE'); expect(message.actionsById).toMatch( - /{"0":{"type":"PERFORM_ACTION","action":{"type":"@@INIT"},"/ + /{"0":{"type":"PERFORM_ACTION","action":{"type":"@@INIT"},"/, ); expect(message.computedStates).toBe('[{"state":0}]'); }); @@ -49,7 +49,7 @@ describe('Redux enhancer', () => { }); expect(message.type).toBe('ACTION'); expect(message.action).toMatch( - /{"type":"PERFORM_ACTION","action":{"type":"INCREMENT"},/ + /{"type":"PERFORM_ACTION","action":{"type":"INCREMENT"},/, ); expect(message.payload).toBe('1'); @@ -59,7 +59,7 @@ describe('Redux enhancer', () => { }); expect(message.type).toBe('ACTION'); expect(message.action).toMatch( - /{"type":"PERFORM_ACTION","action":{"type":"INCREMENT"},/ + /{"type":"PERFORM_ACTION","action":{"type":"INCREMENT"},/, ); expect(message.payload).toBe('2'); }); @@ -72,7 +72,7 @@ describe('Redux enhancer', () => { payload: "{ type: 'INCREMENT' }", source: '@devtools-extension', }, - '*' + '*', ); }); expect(message.type).toBe('ACTION'); @@ -80,7 +80,7 @@ describe('Redux enhancer', () => { message = await listenMessage(); expect(message.type).toBe('ACTION'); expect(message.action).toMatch( - /{"type":"PERFORM_ACTION","action":{"type":"INCREMENT"},/ + /{"type":"PERFORM_ACTION","action":{"type":"INCREMENT"},/, ); expect(message.payload).toBe('3'); }); @@ -93,7 +93,7 @@ describe('Redux enhancer', () => { payload: { type: 'TOGGLE_ACTION', id: 1 }, source: '@devtools-extension', }, - '*' + '*', ); }); expect(message.type).toBe('DISPATCH'); @@ -109,7 +109,7 @@ describe('Redux enhancer', () => { payload: { type: 'TOGGLE_ACTION', id: 1 }, source: '@devtools-extension', }, - '*' + '*', ); }); expect(message.type).toBe('DISPATCH'); @@ -127,7 +127,7 @@ describe('Redux enhancer', () => { payload: { type: 'JUMP_TO_STATE', index: 2, actionId: 2 }, source: '@devtools-extension', }, - '*' + '*', ); }); expect(message.type).toBe('DISPATCH'); @@ -140,7 +140,7 @@ describe('Redux enhancer', () => { payload: { type: 'JUMP_TO_STATE', index: 3, actionId: 3 }, source: '@devtools-extension', }, - '*' + '*', ); }); expect(message.type).toBe('DISPATCH'); @@ -167,7 +167,7 @@ describe('Redux enhancer', () => { }), source: '@devtools-extension', }, - '*' + '*', ); }); expect(message.type).toBe('IMPORT'); @@ -182,7 +182,7 @@ describe('Redux enhancer', () => { counter, window.__REDUX_DEVTOOLS_EXTENSION__({ actionsDenylist: ['SOME_ACTION'], - }) + }), ); expect(typeof window.store).toBe('object'); }); @@ -204,7 +204,7 @@ describe('Redux enhancer', () => { const message = await listenMessage(() => { window.store = createStore( counter, - compose(testEnhancer, window.__REDUX_DEVTOOLS_EXTENSION__()) + compose(testEnhancer, window.__REDUX_DEVTOOLS_EXTENSION__()), ); expect(typeof window.store).toBe('object'); }); diff --git a/extension/test/chrome/extension.spec.js b/extension/test/chrome/extension.spec.js index 94e2ac60ae..b3eba673a0 100644 --- a/extension/test/chrome/extension.spec.js +++ b/extension/test/chrome/extension.spec.js @@ -19,7 +19,7 @@ describe('Chrome extension', function () { driver = new webdriver.Builder() .usingServer(`http://localhost:${port}`) .setChromeOptions( - new chrome.Options().addArguments(`load-extension=${path}`) + new chrome.Options().addArguments(`load-extension=${path}`), ) .forBrowser('chrome') .build(); @@ -52,14 +52,14 @@ describe('Chrome extension', function () { it('should contain an empty actions list', async () => { const val = await driver .findElement( - webdriver.By.xpath('//div[contains(@class, "actionListRows-")]') + webdriver.By.xpath('//div[contains(@class, "actionListRows-")]'), ) .getText(); expect(val).toBe(''); }); Object.keys(switchMonitorTests).forEach((description) => - it(description, () => switchMonitorTests[description](driver)) + it(description, () => switchMonitorTests[description](driver)), ); it('should get actions list', async () => { @@ -77,14 +77,14 @@ describe('Chrome extension', function () { const result = await driver.wait( driver .findElement( - webdriver.By.xpath('//div[contains(@class, "actionListRows-")]') + webdriver.By.xpath('//div[contains(@class, "actionListRows-")]'), ) .getText() .then((val) => { return actionsPattern.test(val); }), 15000, - "it doesn't match actions pattern" + "it doesn't match actions pattern", ); expect(result).toBeTruthy(); }); diff --git a/extension/test/electron/devpanel.spec.js b/extension/test/electron/devpanel.spec.js index b275f5f693..62705f71c5 100644 --- a/extension/test/electron/devpanel.spec.js +++ b/extension/test/electron/devpanel.spec.js @@ -20,7 +20,7 @@ describe('DevTools panel for Electron', function () { .setChromeOptions( new chrome.Options() .setChromeBinaryPath(electronPath) - .addArguments(`app=${join(__dirname, 'fixture')}`) + .addArguments(`app=${join(__dirname, 'fixture')}`), ) .forBrowser('chrome') .build(); @@ -44,7 +44,7 @@ describe('DevTools panel for Electron', function () { } } expect(await driver.getCurrentUrl()).toMatch( - /devtools:\/\/devtools\/bundled\/devtools_app.html/ + /devtools:\/\/devtools\/bundled\/devtools_app.html/, ); const id = await driver.executeAsyncScript(function (callback) { @@ -81,8 +81,8 @@ describe('DevTools panel for Electron', function () { .switchTo() .frame( driver.findElement( - webdriver.By.xpath(`//iframe[@src='${devPanelPath}']`) - ) + webdriver.By.xpath(`//iframe[@src='${devPanelPath}']`), + ), ); await delay(1000); }); @@ -90,10 +90,10 @@ describe('DevTools panel for Electron', function () { it('should contain INIT action', async () => { const element = await driver.wait( webdriver.until.elementLocated( - webdriver.By.xpath('//div[contains(@class, "actionListRows-")]') + webdriver.By.xpath('//div[contains(@class, "actionListRows-")]'), ), 5000, - 'Element not found' + 'Element not found', ); const val = await element.getText(); expect(val).toMatch(/@@INIT/); @@ -107,7 +107,7 @@ describe('DevTools panel for Electron', function () { }); Object.keys(switchMonitorTests).forEach((description) => - it(description, () => switchMonitorTests[description](driver)) + it(description, () => switchMonitorTests[description](driver)), ); /* it('should be no logs in console of main window', async () => { diff --git a/extension/test/electron/fixture/index.html b/extension/test/electron/fixture/index.html index 0618313da9..decc94cbb5 100644 --- a/extension/test/electron/fixture/index.html +++ b/extension/test/electron/fixture/index.html @@ -1,4 +1,4 @@ - + diff --git a/extension/test/electron/fixture/main.js b/extension/test/electron/fixture/main.js index 6bf7c2ef0e..f29e52b3de 100644 --- a/extension/test/electron/fixture/main.js +++ b/extension/test/electron/fixture/main.js @@ -5,7 +5,7 @@ app.on('window-all-closed', app.quit); app.whenReady().then(async () => { await session.defaultSession.loadExtension( path.join(__dirname, '../../../dist'), - { allowFileAccess: true } + { allowFileAccess: true }, ); const mainWindow = new BrowserWindow({ diff --git a/extension/test/electron/fixture/src/renderer.js b/extension/test/electron/fixture/src/renderer.js index 574a7baecc..5923fac3f0 100644 --- a/extension/test/electron/fixture/src/renderer.js +++ b/extension/test/electron/fixture/src/renderer.js @@ -19,7 +19,7 @@ const store = createStore( initialState, window.__REDUX_DEVTOOLS_EXTENSION__ ? window.__REDUX_DEVTOOLS_EXTENSION__() - : (noop) => noop + : (noop) => noop, ); const el = document.getElementById('counter'); diff --git a/extension/test/perf/send.spec.js b/extension/test/perf/send.spec.js index b95aaed782..bb5ed89f84 100644 --- a/extension/test/perf/send.spec.js +++ b/extension/test/perf/send.spec.js @@ -9,7 +9,7 @@ function test(title, data, maxTime = 100) { await listenMessage(() => { window.__REDUX_DEVTOOLS_EXTENSION__.send( { type: 'TEST_ACTION', data }, - data + data, ); }); const ms = new Date() - start; diff --git a/extension/test/utils/e2e.js b/extension/test/utils/e2e.js index 200e59be3d..9fe9ea37eb 100644 --- a/extension/test/utils/e2e.js +++ b/extension/test/utils/e2e.js @@ -15,8 +15,8 @@ export const switchMonitorTests = { await delay(500); await driver.findElement( webdriver.By.xpath( - '//div[div[button[text()="Reset"]] and .//div[button[text()="Revert"]]]' - ) + '//div[div[button[text()="Reset"]] and .//div[button[text()="Revert"]]]', + ), ); await delay(500); }, @@ -31,7 +31,7 @@ export const switchMonitorTests = { .click(); await delay(500); await driver.findElement( - webdriver.By.xpath('//*[@class="nodeText" and text()="state"]') + webdriver.By.xpath('//*[@class="nodeText" and text()="state"]'), ); await delay(500); // Wait till menu is closed }, diff --git a/extension/webpack.config.js b/extension/webpack.config.js deleted file mode 100644 index 9e31302e7b..0000000000 --- a/extension/webpack.config.js +++ /dev/null @@ -1,81 +0,0 @@ -const path = require('path'); -const webpack = require('webpack'); -const CopyPlugin = require('copy-webpack-plugin'); -const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin'); - -module.exports = function (env) { - return { - mode: env.production ? 'production' : 'development', - devtool: env.production ? undefined : 'eval-source-map', - entry: { - background: [ - path.resolve(__dirname, 'src/chromeApiMock'), - path.resolve(__dirname, 'src/background/index'), - ], - options: [ - path.resolve(__dirname, 'src/chromeApiMock'), - path.resolve(__dirname, 'src/options/index'), - ], - window: [path.resolve(__dirname, 'src/window/index')], - remote: [path.resolve(__dirname, 'src/remote/index')], - devpanel: [ - path.resolve(__dirname, 'src/chromeApiMock'), - path.resolve(__dirname, 'src/devpanel/index'), - ], - devtools: path.resolve(__dirname, 'src/devtools/index'), - content: [ - path.resolve(__dirname, 'src/chromeApiMock'), - path.resolve(__dirname, 'src/contentScript/index'), - ], - page: path.join(__dirname, 'src/pageScript'), - ...(env.production - ? {} - : { pagewrap: path.resolve(__dirname, 'src/pageScriptWrap') }), - }, - output: { - filename: '[name].bundle.js', - }, - plugins: [ - new webpack.DefinePlugin({ - 'process.env.BABEL_ENV': JSON.stringify(process.env.NODE_ENV), - }), - new ForkTsCheckerWebpackPlugin({ - typescript: { - configFile: 'tsconfig.json', - }, - }), - new CopyPlugin({ - patterns: [ - { - from: path.join(__dirname, 'chrome/manifest.json'), - to: path.join(__dirname, 'dist/manifest.json'), - }, - { - from: path.join(__dirname, 'src/assets'), - to: path.join(__dirname, 'dist'), - }, - ], - }), - ], - resolve: { - extensions: ['.js', '.jsx', '.ts', '.tsx'], - }, - module: { - rules: [ - { - test: /\.(js|ts)x?$/, - use: 'babel-loader', - exclude: /node_modules/, - }, - { - test: /\.css?$/, - use: ['style-loader', 'css-loader'], - }, - { - test: /\.pug$/, - use: ['file-loader?name=[name].html', 'pug-html-loader'], - }, - ], - }, - }; -}; diff --git a/extension/wrap.webpack.config.js b/extension/wrap.webpack.config.js deleted file mode 100644 index 1eb38ca180..0000000000 --- a/extension/wrap.webpack.config.js +++ /dev/null @@ -1,31 +0,0 @@ -const path = require('path'); -const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin'); - -module.exports = { - mode: 'production', - entry: { - pagewrap: path.resolve(__dirname, 'src/pageScriptWrap'), - }, - output: { - filename: '[name].bundle.js', - }, - plugins: [ - new ForkTsCheckerWebpackPlugin({ - typescript: { - configFile: 'tsconfig.json', - }, - }), - ], - resolve: { - extensions: ['.js', '.jsx', '.ts', '.tsx'], - }, - module: { - rules: [ - { - test: /\.(js|ts)x?$/, - use: 'babel-loader', - exclude: /(node_modules|dist\/page\.bundle)/, - }, - ], - }, -}; diff --git a/package.json b/package.json index 9295e45d9f..ba3f2a3bbe 100644 --- a/package.json +++ b/package.json @@ -1,21 +1,21 @@ { "private": true, "devDependencies": { - "@babel/core": "^7.22.1", - "@babel/eslint-parser": "^7.21.8", - "@changesets/cli": "^2.26.1", - "@typescript-eslint/eslint-plugin": "^5.59.8", - "@typescript-eslint/parser": "^5.59.8", - "eslint": "^8.42.0", - "eslint-config-prettier": "^8.8.0", - "eslint-plugin-jest": "^27.2.1", - "eslint-plugin-react": "^7.32.2", + "@babel/core": "^7.23.0", + "@babel/eslint-parser": "^7.22.15", + "@changesets/cli": "^2.26.2", + "@typescript-eslint/eslint-plugin": "^6.7.3", + "@typescript-eslint/parser": "^6.7.3", + "eslint": "^8.50.0", + "eslint-config-prettier": "^9.0.0", + "eslint-plugin-jest": "^27.4.0", + "eslint-plugin-react": "^7.33.2", "eslint-plugin-react-hooks": "^4.6.0", - "jest": "^29.5.0", - "prettier": "2.8.8", - "typescript": "~5.0.4", - "nx": "^16.3.2", - "@nrwl/nx-cloud": "^16.0.5" + "jest": "^29.7.0", + "prettier": "3.0.3", + "typescript": "~5.2.2", + "nx": "^16.9.1", + "@nrwl/nx-cloud": "^16.4.0" }, "scripts": { "format": "prettier --write .", @@ -39,10 +39,5 @@ "packages/redux-devtools-rtk-query-monitor/demo", "packages/redux-devtools-slider-monitor/examples/todomvc" ], - "packageManager": "pnpm@8.6.0", - "pnpm": { - "overrides": { - "@babel/highlight>chalk": "Methuselah96/chalk#v2-without-process" - } - } + "packageManager": "pnpm@8.8.0" } diff --git a/packages/d3-state-visualizer/.eslintrc.js b/packages/d3-state-visualizer/.eslintrc.js index 90313a7609..6435f87729 100644 --- a/packages/d3-state-visualizer/.eslintrc.js +++ b/packages/d3-state-visualizer/.eslintrc.js @@ -6,7 +6,7 @@ module.exports = { extends: '../../eslintrc.ts.base.json', parserOptions: { tsconfigRootDir: __dirname, - project: ['./tsconfig.json'], + project: true, }, }, ], diff --git a/packages/d3-state-visualizer/examples/tree/.eslintrc.js b/packages/d3-state-visualizer/examples/tree/.eslintrc.js index 4217bea7c0..8c163509ab 100644 --- a/packages/d3-state-visualizer/examples/tree/.eslintrc.js +++ b/packages/d3-state-visualizer/examples/tree/.eslintrc.js @@ -2,7 +2,7 @@ module.exports = { extends: '../../../../eslintrc.ts.base.json', parserOptions: { tsconfigRootDir: __dirname, - project: ['./tsconfig.json'], + project: true, }, overrides: [ { diff --git a/packages/d3-state-visualizer/examples/tree/package.json b/packages/d3-state-visualizer/examples/tree/package.json index f81c083f0a..9b250e5a93 100644 --- a/packages/d3-state-visualizer/examples/tree/package.json +++ b/packages/d3-state-visualizer/examples/tree/package.json @@ -29,22 +29,22 @@ "map2tree": "^3.0.0" }, "devDependencies": { - "@babel/core": "^7.22.1", - "@babel/preset-env": "^7.22.4", - "@babel/preset-typescript": "^7.21.5", - "@types/node": "^18.16.16", - "@typescript-eslint/eslint-plugin": "^5.59.8", - "@typescript-eslint/parser": "^5.59.8", - "babel-loader": "^9.1.2", + "@babel/core": "^7.23.0", + "@babel/preset-env": "^7.22.20", + "@babel/preset-typescript": "^7.23.0", + "@types/node": "^18.18.0", + "@typescript-eslint/eslint-plugin": "^6.7.3", + "@typescript-eslint/parser": "^6.7.3", + "babel-loader": "^9.1.3", "cross-env": "^7.0.3", - "eslint": "^8.42.0", - "eslint-config-prettier": "^8.8.0", + "eslint": "^8.50.0", + "eslint-config-prettier": "^9.0.0", "fork-ts-checker-webpack-plugin": "^8.0.0", - "html-webpack-plugin": "^5.5.1", + "html-webpack-plugin": "^5.5.3", "ts-node": "^10.9.1", - "typescript": "~5.0.4", - "webpack": "^5.85.0", - "webpack-cli": "^5.1.3", - "webpack-dev-server": "^4.15.0" + "typescript": "~5.2.2", + "webpack": "^5.88.2", + "webpack-cli": "^5.1.4", + "webpack-dev-server": "^4.15.1" } } diff --git a/packages/d3-state-visualizer/package.json b/packages/d3-state-visualizer/package.json index 37d5ceb31c..831a7760ce 100644 --- a/packages/d3-state-visualizer/package.json +++ b/packages/d3-state-visualizer/package.json @@ -40,8 +40,8 @@ "prepublish": "pnpm run type-check && pnpm run lint" }, "dependencies": { - "@babel/runtime": "^7.22.3", - "@types/d3": "^7.4.0", + "@babel/runtime": "^7.23.1", + "@types/d3": "^7.4.1", "d3": "^7.8.5", "d3tooltip": "^3.0.0", "deepmerge": "^4.3.1", @@ -49,17 +49,17 @@ "ramda": "^0.29.0" }, "devDependencies": { - "@babel/cli": "^7.21.5", - "@babel/core": "^7.22.1", - "@babel/eslint-parser": "^7.21.8", - "@babel/preset-env": "^7.22.4", - "@babel/preset-typescript": "^7.21.5", - "@types/ramda": "^0.29.2", - "@typescript-eslint/eslint-plugin": "^5.59.8", - "@typescript-eslint/parser": "^5.59.8", - "eslint": "^8.42.0", - "eslint-config-prettier": "^8.8.0", - "rimraf": "^5.0.1", - "typescript": "~5.0.4" + "@babel/cli": "^7.23.0", + "@babel/core": "^7.23.0", + "@babel/eslint-parser": "^7.22.15", + "@babel/preset-env": "^7.22.20", + "@babel/preset-typescript": "^7.23.0", + "@types/ramda": "^0.29.5", + "@typescript-eslint/eslint-plugin": "^6.7.3", + "@typescript-eslint/parser": "^6.7.3", + "eslint": "^8.50.0", + "eslint-config-prettier": "^9.0.0", + "rimraf": "^5.0.5", + "typescript": "~5.2.2" } } diff --git a/packages/d3-state-visualizer/src/charts/tree/tree.ts b/packages/d3-state-visualizer/src/charts/tree/tree.ts index fb1ad7e264..4a87ffc884 100644 --- a/packages/d3-state-visualizer/src/charts/tree/tree.ts +++ b/packages/d3-state-visualizer/src/charts/tree/tree.ts @@ -189,14 +189,14 @@ export default function (DOMNode: HTMLElement, options: Partial = {}) { zoom.on('zoom', (event) => { const { transform } = event as D3ZoomEvent; vis.attr('transform', transform.toString()); - }) + }), ) .append('g') .attr( 'transform', `translate(${margin.left + nodeStyleOptions.radius}, ${ margin.top - }) scale(${initialZoom})` + }) scale(${initialZoom})`, ); // previousNodePositionsById stores node x and y @@ -217,7 +217,7 @@ export default function (DOMNode: HTMLElement, options: Partial = {}) { function findParentNodePosition( nodePositionsById: { [nodeId: string | number]: NodePosition }, nodeId: string | number, - filter: (nodePosition: NodePosition) => boolean + filter: (nodePosition: NodePosition) => boolean, ) { let currentPosition = nodePositionsById[nodeId]; while (currentPosition) { @@ -264,7 +264,7 @@ export default function (DOMNode: HTMLElement, options: Partial = {}) { c.id = `${node.id || ''}|${c.name}`; return c; }) - : null + : null, ); update(); @@ -291,7 +291,7 @@ export default function (DOMNode: HTMLElement, options: Partial = {}) { const rootNode = d3.hierarchy(data); if (isSorted) { rootNode.sort((a, b) => - b.data.name.toLowerCase() < a.data.name.toLowerCase() ? 1 : -1 + b.data.name.toLowerCase() < a.data.name.toLowerCase() ? 1 : -1, ); } @@ -300,7 +300,7 @@ export default function (DOMNode: HTMLElement, options: Partial = {}) { rootPointNode.each( (node) => - (node.y = node.depth * (maxLabelLength * 7 * widthBetweenNodesCoeff)) + (node.y = node.depth * (maxLabelLength * 7 * widthBetweenNodesCoeff)), ); const nodes = rootPointNode.descendants(); @@ -327,7 +327,7 @@ export default function (DOMNode: HTMLElement, options: Partial = {}) { const position = findParentNodePosition( nodePositionsById, d.data.id, - (n) => !!previousNodePositionsById[n.id] + (n) => !!previousNodePositionsById[n.id], ); const previousPosition = (position && previousNodePositionsById[position.id]) || @@ -358,7 +358,7 @@ export default function (DOMNode: HTMLElement, options: Partial = {}) { ...tooltipOptions, root, text: (d) => getTooltipString(d.data, tooltipOptions), - }) + }), ); } @@ -402,7 +402,7 @@ export default function (DOMNode: HTMLElement, options: Partial = {}) { ? nodeStyleOptions.colors.collapsed : d.data.children && d.data.children.length > 0 ? nodeStyleOptions.colors.parent - : nodeStyleOptions.colors.default + : nodeStyleOptions.colors.default, ); // transition nodes to their new position @@ -433,7 +433,7 @@ export default function (DOMNode: HTMLElement, options: Partial = {}) { this: SVGGElement & { __oldData__?: HierarchyPointNode; }, - d + d, ) { // test whether the relevant properties of d match // the equivalent property of the oldData @@ -458,7 +458,7 @@ export default function (DOMNode: HTMLElement, options: Partial = {}) { const position = findParentNodePosition( previousNodePositionsById, d.data.id, - (n) => !!nodePositionsById[n.id] + (n) => !!nodePositionsById[n.id], ); const futurePosition = (position && nodePositionsById[position.id]) || @@ -474,7 +474,7 @@ export default function (DOMNode: HTMLElement, options: Partial = {}) { // update the links const link = vis .selectAll>( - 'path.link' + 'path.link', ) .data(links, (d) => d.target.data.id); @@ -487,7 +487,7 @@ export default function (DOMNode: HTMLElement, options: Partial = {}) { const position = findParentNodePosition( nodePositionsById, d.target.data.id, - (n) => !!previousNodePositionsById[n.id] + (n) => !!previousNodePositionsById[n.id], ); const previousPosition = (position && previousNodePositionsById[position.id]) || @@ -519,7 +519,7 @@ export default function (DOMNode: HTMLElement, options: Partial = {}) { const position = findParentNodePosition( previousNodePositionsById, d.target.data.id, - (n) => !!nodePositionsById[n.id] + (n) => !!nodePositionsById[n.id], ); const futurePosition = (position && nodePositionsById[position.id]) || diff --git a/packages/d3-state-visualizer/src/charts/tree/utils.ts b/packages/d3-state-visualizer/src/charts/tree/utils.ts index a20873ca01..8f229caeab 100644 --- a/packages/d3-state-visualizer/src/charts/tree/utils.ts +++ b/packages/d3-state-visualizer/src/charts/tree/utils.ts @@ -32,7 +32,7 @@ export function toggleChildren(node: InternalNode) { export function visit( parent: InternalNode, visitFn: (parent: InternalNode) => void, - childrenFn: (parent: InternalNode) => InternalNode[] | null | undefined + childrenFn: (parent: InternalNode) => InternalNode[] | null | undefined, ) { if (!parent) { return; diff --git a/packages/d3tooltip/.eslintrc.js b/packages/d3tooltip/.eslintrc.js index 90313a7609..6435f87729 100644 --- a/packages/d3tooltip/.eslintrc.js +++ b/packages/d3tooltip/.eslintrc.js @@ -6,7 +6,7 @@ module.exports = { extends: '../../eslintrc.ts.base.json', parserOptions: { tsconfigRootDir: __dirname, - project: ['./tsconfig.json'], + project: true, }, }, ], diff --git a/packages/d3tooltip/README.md b/packages/d3tooltip/README.md index 9671dada82..2ce766a4e0 100644 --- a/packages/d3tooltip/README.md +++ b/packages/d3tooltip/README.md @@ -32,7 +32,7 @@ vis d3tooltip('tooltipClassName', { ...options, text: (d) => toStringOrHtml(d), - }) + }), ) .on('mouseover', function () { d3.select(this).style('fill', 'skyblue'); diff --git a/packages/d3tooltip/package.json b/packages/d3tooltip/package.json index edd9bad9eb..355129dc7b 100644 --- a/packages/d3tooltip/package.json +++ b/packages/d3tooltip/package.json @@ -36,25 +36,25 @@ "prepublish": "pnpm run type-check && pnpm run lint" }, "dependencies": { - "@babel/runtime": "^7.22.3" + "@babel/runtime": "^7.23.1" }, "devDependencies": { - "@babel/cli": "^7.21.5", - "@babel/core": "^7.22.1", - "@babel/eslint-parser": "^7.21.8", - "@babel/preset-env": "^7.22.4", - "@babel/preset-typescript": "^7.21.5", - "@types/d3": "^7.4.0", - "@typescript-eslint/eslint-plugin": "^5.59.8", - "@typescript-eslint/parser": "^5.59.8", + "@babel/cli": "^7.23.0", + "@babel/core": "^7.23.0", + "@babel/eslint-parser": "^7.22.15", + "@babel/preset-env": "^7.22.20", + "@babel/preset-typescript": "^7.23.0", + "@types/d3": "^7.4.1", + "@typescript-eslint/eslint-plugin": "^6.7.3", + "@typescript-eslint/parser": "^6.7.3", "d3": "^7.8.5", - "eslint": "^8.42.0", - "eslint-config-prettier": "^8.8.0", - "rimraf": "^5.0.1", - "typescript": "~5.0.4" + "eslint": "^8.50.0", + "eslint-config-prettier": "^9.0.0", + "rimraf": "^5.0.5", + "typescript": "~5.2.2" }, "peerDependencies": { - "@types/d3": "^7.4.0", + "@types/d3": "^7.4.1", "d3": "^7.8.5" } } diff --git a/packages/d3tooltip/src/index.ts b/packages/d3tooltip/src/index.ts index 7d295b60ed..3147bd6689 100644 --- a/packages/d3tooltip/src/index.ts +++ b/packages/d3tooltip/src/index.ts @@ -8,7 +8,7 @@ interface Options< RootGElement extends BaseType, RootDatum, RootPElement extends BaseType, - RootPDatum + RootPDatum, > { left: number | undefined; top: number | undefined; @@ -40,12 +40,12 @@ export function tooltip< RootGElement extends BaseType, RootDatum, RootPElement extends BaseType, - RootPDatum + RootPDatum, >( className = 'tooltip', options: Partial< Options - > = {} + > = {}, ) { const { left, top, offset, root, styles, text } = { ...defaultOptions, diff --git a/packages/map2tree/.eslintrc.js b/packages/map2tree/.eslintrc.js index 84c5da42da..b01386d064 100644 --- a/packages/map2tree/.eslintrc.js +++ b/packages/map2tree/.eslintrc.js @@ -6,7 +6,7 @@ module.exports = { extends: '../../eslintrc.ts.jest.base.json', parserOptions: { tsconfigRootDir: __dirname, - project: ['./tsconfig.json'], + project: true, }, }, { diff --git a/packages/map2tree/README.md b/packages/map2tree/README.md index e6f543fd52..b2cde78ae6 100755 --- a/packages/map2tree/README.md +++ b/packages/map2tree/README.md @@ -13,7 +13,7 @@ map2tree( (options = { key: 'state', // the name you want for as the root node of the output tree pushMethod: 'push', // use 'unshift' to change the order children nodes are added - }) + }), ); ``` diff --git a/packages/map2tree/package.json b/packages/map2tree/package.json index 9b6cc11f32..97c165bbb8 100755 --- a/packages/map2tree/package.json +++ b/packages/map2tree/package.json @@ -40,26 +40,26 @@ "prepublish": "pnpm run type-check && pnpm run lint && pnpm run test" }, "dependencies": { - "@babel/runtime": "^7.22.3", + "@babel/runtime": "^7.23.1", "lodash": "^4.17.21" }, "devDependencies": { - "@babel/cli": "^7.21.5", - "@babel/core": "^7.22.1", - "@babel/eslint-parser": "^7.21.8", - "@babel/preset-env": "^7.22.4", - "@babel/preset-typescript": "^7.21.5", - "@types/jest": "^29.5.2", - "@types/lodash": "^4.14.195", - "@typescript-eslint/eslint-plugin": "^5.59.8", - "@typescript-eslint/parser": "^5.59.8", - "eslint": "^8.42.0", - "eslint-config-prettier": "^8.8.0", - "eslint-plugin-jest": "^27.2.1", - "immutable": "^4.3.0", - "jest": "^29.5.0", - "rimraf": "^5.0.1", - "ts-jest": "^29.1.0", - "typescript": "~5.0.4" + "@babel/cli": "^7.23.0", + "@babel/core": "^7.23.0", + "@babel/eslint-parser": "^7.22.15", + "@babel/preset-env": "^7.22.20", + "@babel/preset-typescript": "^7.23.0", + "@types/jest": "^29.5.5", + "@types/lodash": "^4.14.199", + "@typescript-eslint/eslint-plugin": "^6.7.3", + "@typescript-eslint/parser": "^6.7.3", + "eslint": "^8.50.0", + "eslint-config-prettier": "^9.0.0", + "eslint-plugin-jest": "^27.4.0", + "immutable": "^4.3.4", + "jest": "^29.7.0", + "rimraf": "^5.0.5", + "ts-jest": "^29.1.1", + "typescript": "~5.2.2" } } diff --git a/packages/map2tree/src/index.ts b/packages/map2tree/src/index.ts index a07163b6e0..74e231fbc3 100644 --- a/packages/map2tree/src/index.ts +++ b/packages/map2tree/src/index.ts @@ -12,7 +12,7 @@ export interface Node { function visit( parent: Node, visitFn: (parent: Node) => void, - childrenFn: (parent: Node) => Node[] | undefined | null + childrenFn: (parent: Node) => Node[] | undefined | null, ) { if (!parent) return; @@ -37,7 +37,7 @@ function getNode(tree: Node, key: string): Node | null { node = d; } }, - (d) => d.children + (d) => d.children, ); return node; @@ -46,7 +46,7 @@ function getNode(tree: Node, key: string): Node | null { export function map2tree( root: unknown, options: { key?: string; pushMethod?: 'push' | 'unshift' } = {}, - tree: Node = { name: options.key || 'state', children: [] } + tree: Node = { name: options.key || 'state', children: [] }, // eslint-disable-next-line @typescript-eslint/ban-types ): Node | {} { // eslint-disable-next-line @typescript-eslint/ban-types @@ -94,7 +94,7 @@ export function map2tree( currentNode.children![pushMethod](newNode); map2tree(value, { key, pushMethod }, tree); - } + }, ); return tree; diff --git a/packages/react-base16-styling/.eslintrc.js b/packages/react-base16-styling/.eslintrc.js index 84c5da42da..b01386d064 100644 --- a/packages/react-base16-styling/.eslintrc.js +++ b/packages/react-base16-styling/.eslintrc.js @@ -6,7 +6,7 @@ module.exports = { extends: '../../eslintrc.ts.jest.base.json', parserOptions: { tsconfigRootDir: __dirname, - project: ['./tsconfig.json'], + project: true, }, }, { diff --git a/packages/react-base16-styling/package.json b/packages/react-base16-styling/package.json index 8b2f497dd4..983feeba5c 100644 --- a/packages/react-base16-styling/package.json +++ b/packages/react-base16-styling/package.json @@ -39,33 +39,33 @@ "prepublish": "pnpm run type-check && pnpm run lint && pnpm run test" }, "dependencies": { - "@babel/runtime": "^7.22.3", - "@types/base16": "^1.0.2", - "@types/lodash": "^4.14.195", + "@babel/runtime": "^7.23.1", + "@types/base16": "^1.0.3", + "@types/lodash": "^4.14.199", "base16": "^1.0.0", "color": "^4.2.3", "csstype": "^3.1.2", "lodash.curry": "^4.1.1" }, "devDependencies": { - "@babel/cli": "^7.21.5", - "@babel/core": "^7.22.1", - "@babel/eslint-parser": "^7.21.8", - "@babel/plugin-transform-runtime": "^7.22.4", - "@babel/preset-env": "^7.22.4", - "@babel/preset-typescript": "^7.21.5", - "@types/color": "^3.0.3", - "@types/jest": "^29.5.2", + "@babel/cli": "^7.23.0", + "@babel/core": "^7.23.0", + "@babel/eslint-parser": "^7.22.15", + "@babel/plugin-transform-runtime": "^7.22.15", + "@babel/preset-env": "^7.22.20", + "@babel/preset-typescript": "^7.23.0", + "@types/color": "^3.0.4", + "@types/jest": "^29.5.5", "@types/lodash.curry": "^4.1.7", - "@typescript-eslint/eslint-plugin": "^5.59.8", - "@typescript-eslint/parser": "^5.59.8", - "eslint": "^8.42.0", - "eslint-config-prettier": "^8.8.0", - "eslint-plugin-jest": "^27.2.1", - "jest": "^29.5.0", - "jest-environment-jsdom": "^29.5.0", - "rimraf": "^5.0.1", - "ts-jest": "^29.1.0", - "typescript": "~5.0.4" + "@typescript-eslint/eslint-plugin": "^6.7.3", + "@typescript-eslint/parser": "^6.7.3", + "eslint": "^8.50.0", + "eslint-config-prettier": "^9.0.0", + "eslint-plugin-jest": "^27.4.0", + "jest": "^29.7.0", + "jest-environment-jsdom": "^29.7.0", + "rimraf": "^5.0.5", + "ts-jest": "^29.1.1", + "typescript": "~5.2.2" } } diff --git a/packages/react-base16-styling/src/index.ts b/packages/react-base16-styling/src/index.ts index 6bc86ba5e1..181373fa85 100644 --- a/packages/react-base16-styling/src/index.ts +++ b/packages/react-base16-styling/src/index.ts @@ -41,7 +41,7 @@ const merger = (styling: Partial) => { const mergeStyling = ( customStyling: StylingValue, - defaultStyling: StylingValue + defaultStyling: StylingValue, ): StylingValue | undefined => { if (customStyling === undefined) { return defaultStyling; @@ -97,7 +97,7 @@ const mergeStyling = ( merger(styling)({ className: defaultStyling as string, }), - ...args + ...args, ); case 'object': return (styling, ...args) => @@ -105,16 +105,16 @@ const mergeStyling = ( merger(styling)({ style: defaultStyling as CSS.Properties, }), - ...args + ...args, ); case 'function': return (styling, ...args) => (customStyling as StylingValueFunction)( (defaultStyling as StylingValueFunction)( styling, - ...args + ...args, ) as Styling, - ...args + ...args, ); } } @@ -122,7 +122,7 @@ const mergeStyling = ( const mergeStylings = ( customStylings: StylingConfig, - defaultStylings: StylingConfig + defaultStylings: StylingConfig, ): StylingConfig => { const keys = Object.keys(defaultStylings); for (const key in customStylings) { @@ -133,11 +133,11 @@ const mergeStylings = ( (mergedStyling, key) => ( (mergedStyling[key as keyof StylingConfig] = mergeStyling( customStylings[key] as StylingValue, - defaultStylings[key] as StylingValue + defaultStylings[key] as StylingValue, ) as StylingValue), mergedStyling ), - {} as StylingConfig + {} as StylingConfig, ); }; @@ -170,7 +170,7 @@ const getStylingByKeys = ( return obj; }, - { className: '', style: {} } + { className: '', style: {} }, ); if (!props.className) { @@ -194,7 +194,7 @@ export const invertBase16Theme = (base16Theme: Base16Theme): Base16Theme => : base16Theme[key as keyof Base16Theme]), t ), - {} as Base16Theme + {} as Base16Theme, ); interface Options { @@ -236,7 +236,7 @@ export const createStyling: CurriedFunction3< defaultBase16[key as keyof Base16Theme]), t ), - {} as Base16Theme + {} as Base16Theme, ); const customStyling = Object.keys(themeOrStyling).reduce( @@ -244,7 +244,7 @@ export const createStyling: CurriedFunction3< BASE16_KEYS.indexOf(key) === -1 ? ((s[key] = (themeOrStyling as StylingConfig)[key]), s) : s, - {} as StylingConfig + {} as StylingConfig, ); const defaultStyling = getStylingFromBase16(theme); @@ -253,7 +253,7 @@ export const createStyling: CurriedFunction3< return curry(getStylingByKeys, 2)(mergedStyling, ...args); }, - 3 + 3, ); const isStylingConfig = (theme: Theme): theme is StylingConfig => @@ -261,7 +261,7 @@ const isStylingConfig = (theme: Theme): theme is StylingConfig => export const getBase16Theme = ( theme: Theme, - base16Themes?: { [themeName: string]: Base16Theme } | null + base16Themes?: { [themeName: string]: Base16Theme } | null, ): Base16Theme | undefined => { if (theme && isStylingConfig(theme) && theme.extend) { theme = theme.extend as string | Base16Theme; diff --git a/packages/react-dock/.eslintrc.js b/packages/react-dock/.eslintrc.js index e62f5871e5..33fb8f941c 100644 --- a/packages/react-dock/.eslintrc.js +++ b/packages/react-dock/.eslintrc.js @@ -6,7 +6,7 @@ module.exports = { extends: '../../eslintrc.ts.react.base.json', parserOptions: { tsconfigRootDir: __dirname, - project: ['./tsconfig.json'], + project: true, }, }, { diff --git a/packages/react-dock/demo/.eslintrc.js b/packages/react-dock/demo/.eslintrc.js index a9cf623bd1..6a8196ce43 100644 --- a/packages/react-dock/demo/.eslintrc.js +++ b/packages/react-dock/demo/.eslintrc.js @@ -2,7 +2,7 @@ module.exports = { extends: '../../../eslintrc.ts.react.base.json', parserOptions: { tsconfigRootDir: __dirname, - project: ['./tsconfig.json'], + project: true, }, overrides: [ { diff --git a/packages/react-dock/demo/index.html b/packages/react-dock/demo/index.html index b51456052e..6038bd311b 100644 --- a/packages/react-dock/demo/index.html +++ b/packages/react-dock/demo/index.html @@ -1,4 +1,4 @@ - + React Dock diff --git a/packages/react-dock/demo/package.json b/packages/react-dock/demo/package.json index 3738017867..349304d744 100644 --- a/packages/react-dock/demo/package.json +++ b/packages/react-dock/demo/package.json @@ -11,36 +11,36 @@ }, "dependencies": { "react": "^18.2.0", - "react-bootstrap": "^2.7.4", + "react-bootstrap": "^2.9.0", "react-dock": "^0.6.0", "react-dom": "^18.2.0", - "react-icons": "^4.9.0", + "react-icons": "^4.11.0", "react-is": "^18.2.0", "styled-components": "^5.3.11" }, "devDependencies": { - "@babel/core": "^7.22.1", - "@babel/preset-env": "^7.22.4", - "@babel/preset-react": "^7.22.3", - "@babel/preset-typescript": "^7.21.5", - "@types/node": "^18.16.16", - "@types/react": "^18.2.8", - "@types/react-dom": "^18.2.4", - "@types/styled-components": "^5.1.26", - "@typescript-eslint/eslint-plugin": "^5.59.8", - "@typescript-eslint/parser": "^5.59.8", - "babel-loader": "^9.1.2", + "@babel/core": "^7.23.0", + "@babel/preset-env": "^7.22.20", + "@babel/preset-react": "^7.22.15", + "@babel/preset-typescript": "^7.23.0", + "@types/node": "^18.18.0", + "@types/react": "^18.2.23", + "@types/react-dom": "^18.2.8", + "@types/styled-components": "^5.1.28", + "@typescript-eslint/eslint-plugin": "^6.7.3", + "@typescript-eslint/parser": "^6.7.3", + "babel-loader": "^9.1.3", "cross-env": "^7.0.3", - "eslint": "^8.42.0", - "eslint-config-prettier": "^8.8.0", - "eslint-plugin-react": "^7.32.2", + "eslint": "^8.50.0", + "eslint-config-prettier": "^9.0.0", + "eslint-plugin-react": "^7.33.2", "eslint-plugin-react-hooks": "^4.6.0", "fork-ts-checker-webpack-plugin": "^8.0.0", - "html-webpack-plugin": "^5.5.1", + "html-webpack-plugin": "^5.5.3", "ts-node": "^10.9.1", - "typescript": "~5.0.4", - "webpack": "^5.85.0", - "webpack-cli": "^5.1.3", - "webpack-dev-server": "^4.15.0" + "typescript": "~5.2.2", + "webpack": "^5.88.2", + "webpack-cli": "^5.1.4", + "webpack-dev-server": "^4.15.1" } } diff --git a/packages/react-dock/package.json b/packages/react-dock/package.json index 78b1187cc3..5b07826302 100644 --- a/packages/react-dock/package.json +++ b/packages/react-dock/package.json @@ -39,38 +39,38 @@ "prepublish": "pnpm run type-check && pnpm run lint && pnpm run test" }, "dependencies": { - "@babel/runtime": "^7.22.3", - "@types/lodash": "^4.14.195", - "@types/prop-types": "^15.7.5", + "@babel/runtime": "^7.23.1", + "@types/lodash": "^4.14.199", + "@types/prop-types": "^15.7.7", "lodash.debounce": "^4.0.8", "prop-types": "^15.8.1" }, "devDependencies": { - "@babel/cli": "^7.21.5", - "@babel/core": "^7.22.1", - "@babel/eslint-parser": "^7.21.8", - "@babel/plugin-transform-runtime": "^7.22.4", - "@babel/preset-env": "^7.22.4", - "@babel/preset-react": "^7.22.3", - "@babel/preset-typescript": "^7.21.5", - "@types/jest": "^29.5.2", + "@babel/cli": "^7.23.0", + "@babel/core": "^7.23.0", + "@babel/eslint-parser": "^7.22.15", + "@babel/plugin-transform-runtime": "^7.22.15", + "@babel/preset-env": "^7.22.20", + "@babel/preset-react": "^7.22.15", + "@babel/preset-typescript": "^7.23.0", + "@types/jest": "^29.5.5", "@types/lodash.debounce": "^4.0.7", - "@types/react": "^18.2.8", - "@types/react-test-renderer": "^18.0.0", - "@typescript-eslint/eslint-plugin": "^5.59.8", - "@typescript-eslint/parser": "^5.59.8", - "eslint": "^8.42.0", - "eslint-config-prettier": "^8.8.0", - "eslint-plugin-jest": "^27.2.1", - "eslint-plugin-react": "^7.32.2", + "@types/react": "^18.2.23", + "@types/react-test-renderer": "^18.0.3", + "@typescript-eslint/eslint-plugin": "^6.7.3", + "@typescript-eslint/parser": "^6.7.3", + "eslint": "^8.50.0", + "eslint-config-prettier": "^9.0.0", + "eslint-plugin-jest": "^27.4.0", + "eslint-plugin-react": "^7.33.2", "eslint-plugin-react-hooks": "^4.6.0", - "jest": "^29.5.0", - "jest-environment-jsdom": "^29.5.0", + "jest": "^29.7.0", + "jest-environment-jsdom": "^29.7.0", "react": "^18.2.0", "react-test-renderer": "^18.2.0", - "rimraf": "^5.0.1", - "ts-jest": "^29.1.0", - "typescript": "~5.0.4" + "rimraf": "^5.0.5", + "ts-jest": "^29.1.1", + "typescript": "~5.2.2" }, "peerDependencies": { "@types/react": "^16.3.0 || ^17.0.0 || ^18.0.0", diff --git a/packages/react-dock/src/Dock.tsx b/packages/react-dock/src/Dock.tsx index c2036ddd0a..45d6f0f2cf 100644 --- a/packages/react-dock/src/Dock.tsx +++ b/packages/react-dock/src/Dock.tsx @@ -11,7 +11,7 @@ interface Styles { function autoprefixes(styles: Styles) { return Object.keys(styles).reduce( (obj, key) => ((obj[key] = autoprefix(styles[key])), obj), - {} + {}, ); } @@ -81,13 +81,13 @@ const styles = autoprefixes({ function getTransitions(duration: number) { return ['left', 'top', 'width', 'height'].map( - (p) => `${p} ${duration / 1000}s ease-out` + (p) => `${p} ${duration / 1000}s ease-out`, ); } function getDockStyles( { fluid, dockStyle, dockHiddenStyle, duration, position, isVisible }: Props, - { size, isResizing, fullWidth, fullHeight }: State + { size, isResizing, fullWidth, fullHeight }: State, ) { let posStyle; const absSize = fluid ? `${size * 100}%` : `${size}px`; @@ -145,7 +145,7 @@ function getDockStyles( function getDimStyles( { dimMode, dimStyle, duration, isVisible }: Props, - { isTransitionStarted }: State + { isTransitionStarted }: State, ) { return [ styles.dim, @@ -209,7 +209,7 @@ function getResizerStyles(position: 'left' | 'right' | 'top' | 'bottom') { function getFullSize( position: 'left' | 'right' | 'top' | 'bottom', fullWidth: number, - fullHeight: number + fullHeight: number, ) { return position === 'left' || position === 'right' ? fullWidth : fullHeight; } @@ -358,11 +358,11 @@ export default class Dock extends Component { const dimStyles = Object.assign( {}, - ...getDimStyles(this.props, this.state) + ...getDimStyles(this.props, this.state), ); const dockStyles = Object.assign( {}, - ...getDockStyles(this.props, this.state) + ...getDockStyles(this.props, this.state), ); const resizerStyles = Object.assign({}, ...getResizerStyles(position)); @@ -441,7 +441,7 @@ export default class Dock extends Component { debouncedUpdateWindowSizeEnd: DebouncedFunc<() => void> = debounce( this.updateWindowSizeEnd, - 30 + 30, ); handleWrapperLeave = () => { diff --git a/packages/react-dock/src/autoprefix.ts b/packages/react-dock/src/autoprefix.ts index 07eaa4e2de..49e087367f 100644 --- a/packages/react-dock/src/autoprefix.ts +++ b/packages/react-dock/src/autoprefix.ts @@ -41,7 +41,7 @@ function prefixProp(key: string, value: Value) { (obj, pre) => ( (obj[pre + key[0].toUpperCase() + key.substr(1)] = value), obj ), - {} + {}, ); } @@ -54,6 +54,6 @@ export default function autoprefix(style: CSSProperties) { ...prefixProp(key, style[key as keyof CSSProperties]), } : obj, - style + style, ); } diff --git a/packages/react-json-tree/.eslintrc.js b/packages/react-json-tree/.eslintrc.js index cda9a03531..da9d7dfc67 100644 --- a/packages/react-json-tree/.eslintrc.js +++ b/packages/react-json-tree/.eslintrc.js @@ -6,7 +6,7 @@ module.exports = { extends: '../../eslintrc.ts.react.base.json', parserOptions: { tsconfigRootDir: __dirname, - project: ['./tsconfig.json'], + project: true, }, }, { diff --git a/packages/react-json-tree/README.md b/packages/react-json-tree/README.md index 7a55b3e110..678a5b6a64 100644 --- a/packages/react-json-tree/README.md +++ b/packages/react-json-tree/README.md @@ -26,7 +26,7 @@ const json = { #### Result: -![](http://cl.ly/image/3f2C2k2t3D0o/screenshot%202015-08-26%20at%2010.24.12%20AM.png) +![](https://i.ibb.co/0KSYRJg/example-result.png) Check out [examples](examples) directory for more details. diff --git a/packages/react-json-tree/examples/.eslintrc.js b/packages/react-json-tree/examples/.eslintrc.js index a9cf623bd1..6a8196ce43 100644 --- a/packages/react-json-tree/examples/.eslintrc.js +++ b/packages/react-json-tree/examples/.eslintrc.js @@ -2,7 +2,7 @@ module.exports = { extends: '../../../eslintrc.ts.react.base.json', parserOptions: { tsconfigRootDir: __dirname, - project: ['./tsconfig.json'], + project: true, }, overrides: [ { diff --git a/packages/react-json-tree/examples/index.html b/packages/react-json-tree/examples/index.html index f2be3989d8..862a02742d 100755 --- a/packages/react-json-tree/examples/index.html +++ b/packages/react-json-tree/examples/index.html @@ -3,7 +3,12 @@ Sample App +
@@ -32,7 +33,7 @@