From 6d40cc34c30d5a7dcf5d105f4ad96197bf42fa1a Mon Sep 17 00:00:00 2001 From: Daniel Mendes Date: Mon, 27 Oct 2025 19:25:43 +0100 Subject: [PATCH] refactor: migrate to new jsx runtime --- .eslintrc.js | 4 + babel.config.js | 28 ++++-- package-lock.json | 35 ++----- package.json | 4 +- .../src/AuthenticationPage.js | 8 +- .../src/implementation.tsx | 1 - .../src/AuthenticationPage.js | 8 +- .../src/AuthenticationPage.js | 8 +- .../src/git-lfs-client.ts | 2 +- .../src/netlify-lfs-client.ts | 2 +- .../src/AuthenticationPage.js | 8 +- .../src/AuthenticationPage.js | 8 +- .../src/implementation.tsx | 1 - .../src/AuthenticationPage.js | 8 +- .../src/AuthenticationPage.js | 4 +- .../src/AuthenticationPage.js | 4 +- packages/decap-cms-core/src/bootstrap.js | 1 - .../decap-cms-core/src/components/App/App.js | 6 +- .../src/components/App/Header.js | 4 +- .../src/components/App/NotFoundPage.js | 1 - .../src/components/Collection/Collection.js | 4 +- .../Collection/CollectionControls.js | 1 - .../components/Collection/CollectionSearch.js | 4 +- .../components/Collection/CollectionTop.js | 1 - .../components/Collection/ControlButton.js | 1 - .../components/Collection/Entries/Entries.js | 1 - .../Collection/Entries/EntriesCollection.js | 4 +- .../Collection/Entries/EntriesSearch.js | 4 +- .../Collection/Entries/EntryCard.js | 1 - .../Collection/Entries/EntryListing.js | 4 +- .../__tests__/EntriesCollection.spec.js | 1 - .../components/Collection/FilterControl.js | 1 - .../src/components/Collection/GroupControl.js | 1 - .../components/Collection/NestedCollection.js | 8 +- .../src/components/Collection/Sidebar.js | 4 +- .../src/components/Collection/SortControl.js | 1 - .../components/Collection/ViewStyleControl.js | 1 - .../Collection/__tests__/Collection.spec.js | 1 - .../__tests__/NestedCollection.spec.js | 1 - .../Collection/__tests__/Sidebar.spec.js | 1 - .../src/components/Editor/Editor.js | 4 +- .../Editor/EditorControlPane/EditorControl.js | 4 +- .../EditorControlPane/EditorControlPane.js | 4 +- .../Editor/EditorControlPane/Widget.js | 4 +- .../src/components/Editor/EditorInterface.js | 2 +- .../Editor/EditorPreviewPane/EditorPreview.js | 4 +- .../EditorPreviewPane/EditorPreviewContent.js | 8 +- .../EditorPreviewPane/EditorPreviewPane.js | 4 +- .../Editor/EditorPreviewPane/PreviewHOC.js | 6 +- .../src/components/Editor/EditorToolbar.js | 12 +-- .../Editor/__tests__/Editor.spec.js | 1 - .../Editor/__tests__/EditorToolbar.spec.js | 1 - .../__snapshots__/EditorToolbar.spec.js.snap | 27 +---- .../src/components/Editor/withWorkflow.js | 4 +- .../EditorWidgets/Unknown/UnknownControl.js | 1 - .../EditorWidgets/Unknown/UnknownPreview.js | 1 - .../components/MediaLibrary/EmptyMessage.js | 1 - .../components/MediaLibrary/MediaLibrary.js | 4 +- .../MediaLibrary/MediaLibraryButtons.js | 4 +- .../MediaLibrary/MediaLibraryCard.js | 4 +- .../MediaLibrary/MediaLibraryCardGrid.js | 1 - .../MediaLibrary/MediaLibraryHeader.js | 1 - .../MediaLibrary/MediaLibraryModal.js | 1 - .../MediaLibrary/MediaLibrarySearch.js | 1 - .../MediaLibrary/MediaLibraryTop.js | 1 - .../__tests__/MediaLibraryButtons.spec.js | 1 - .../__tests__/MediaLibraryCard.spec.js | 1 - .../src/components/UI/DragDrop.js | 8 +- .../src/components/UI/ErrorBoundary.js | 6 +- .../src/components/UI/FileUploadButton.js | 1 - .../decap-cms-core/src/components/UI/Modal.js | 6 +- .../src/components/UI/Notifications.tsx | 5 +- .../src/components/UI/SettingsDropdown.js | 6 +- .../UI/__tests__/ErrorBoundary.spec.js | 1 - .../src/components/Workflow/Workflow.js | 2 +- .../src/components/Workflow/WorkflowCard.js | 1 - .../src/components/Workflow/WorkflowList.js | 4 +- .../src/constants/fieldInference.tsx | 2 +- .../decap-cms-default-exports/src/index.js | 2 +- .../src/index.js | 2 - packages/decap-cms-ui-auth/index.d.ts | 6 +- .../src/NetlifyAuthenticationPage.js | 4 +- .../src/PKCEAuthenticationPage.js | 8 +- .../NetlifyAuthenticationPage.spec.js | 1 - .../NetlifyAuthenticationPage.spec.js.snap | 16 +-- .../src/AuthenticationPage.js | 1 - packages/decap-cms-ui-default/src/Dropdown.js | 1 - .../decap-cms-ui-default/src/GoBackButton.js | 4 +- packages/decap-cms-ui-default/src/Icon.js | 1 - .../decap-cms-ui-default/src/IconButton.js | 1 - .../src/ListItemTopBar.js | 1 - packages/decap-cms-ui-default/src/Loader.js | 4 +- .../src/ObjectWidgetTopBar.js | 4 +- packages/decap-cms-ui-default/src/Toggle.js | 2 +- packages/decap-cms-ui-default/src/styles.js | 1 - .../src/BooleanControl.js | 4 +- .../decap-cms-widget-code/src/CodeControl.js | 4 +- .../decap-cms-widget-code/src/CodePreview.js | 1 - .../src/SettingsButton.js | 1 - .../decap-cms-widget-code/src/SettingsPane.js | 1 - .../src/ColorControl.js | 4 +- .../src/ColorPreview.js | 1 - .../src/DateTimeControl.js | 7 +- .../src/DateTimePreview.js | 1 - .../src/__tests__/DateTimeControl.spec.js | 1 - .../decap-cms-widget-file/src/FilePreview.js | 1 - .../src/withFileControl.js | 4 +- .../src/ImagePreview.js | 1 - .../decap-cms-widget-list/src/ListControl.js | 4 +- .../src/__tests__/ListControl.spec.js | 1 - .../__snapshots__/ListControl.spec.js.snap | 99 ++++--------------- .../decap-cms-widget-map/src/MapPreview.js | 1 - .../src/withMapControl.js | 6 +- .../src/MarkdownControl/RawEditor.js | 2 +- .../src/MarkdownControl/Toolbar.js | 4 +- .../src/MarkdownControl/ToolbarButton.js | 1 - .../src/MarkdownControl/VisualEditor.js | 2 +- .../MarkdownControl/components/Shortcode.js | 2 +- .../MarkdownControl/components/VoidBlock.js | 1 - .../src/MarkdownControl/index.js | 4 +- .../src/MarkdownControl/renderers.js | 1 - .../src/MarkdownPreview.js | 4 +- .../src/__tests__/renderer.spec.js | 1 - .../src/serializers/__tests__/slate.spec.js | 3 +- .../src/serializers/remarkRehypeShortcodes.js | 4 +- .../src/NumberControl.js | 4 +- .../src/NumberPreview.js | 1 - .../src/__tests__/number.spec.js | 4 +- .../src/ObjectControl.js | 4 +- .../src/ObjectPreview.js | 1 - .../src/RelationControl.js | 4 +- .../src/RelationPreview.js | 1 - .../src/__tests__/relation.spec.js | 4 +- .../src/SelectControl.js | 4 +- .../src/SelectPreview.js | 1 - .../src/__tests__/select.spec.js | 4 +- .../src/StringControl.js | 4 +- .../src/StringPreview.js | 1 - .../decap-cms-widget-text/src/TextControl.js | 4 +- .../decap-cms-widget-text/src/TextPreview.js | 1 - packages/decap-cms/src/index.js | 4 +- tsconfig.json | 3 +- 142 files changed, 228 insertions(+), 390 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index 6753607da287..204b5f19c86f 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -30,6 +30,8 @@ module.exports = { rules: { 'no-console': [0], 'react/prop-types': [0], + 'react/jsx-uses-react': 'off', // Not needed with new JSX transform + 'react/react-in-jsx-scope': 'off', // Not needed with new JSX transform 'import/no-named-as-default': 0, 'import/order': [ 'error', @@ -89,6 +91,8 @@ module.exports = { }, rules: { 'no-duplicate-imports': [0], // handled by @typescript-eslint + 'react/jsx-uses-react': 'off', // Not needed with new JSX transform + 'react/react-in-jsx-scope': 'off', // Not needed with new JSX transform '@typescript-eslint/ban-types': [0], // TODO enable in future '@typescript-eslint/no-non-null-assertion': [0], '@typescript-eslint/consistent-type-imports': 'error', diff --git a/babel.config.js b/babel.config.js index 78dfd4c7f41f..f35a8f8e4229 100644 --- a/babel.config.js +++ b/babel.config.js @@ -48,14 +48,14 @@ const svgo = { function presets() { return [ - '@babel/preset-react', - ...(!isESM ? [['@babel/preset-env', {}]] : []), [ - '@emotion/babel-preset-css-prop', + '@babel/preset-react', { - autoLabel: 'always', + runtime: 'automatic', + importSource: '@emotion/react', }, ], + ...(!isESM ? [['@babel/preset-env', {}]] : []), '@babel/preset-typescript', ]; } @@ -64,6 +64,7 @@ function plugins() { if (isESM) { return [ ...defaultPlugins, + '@emotion/babel-plugin', [ 'transform-define', { @@ -89,6 +90,7 @@ function plugins() { if (isTest) { return [ ...defaultPlugins, + '@emotion/babel-plugin', [ 'inline-react-svg', { @@ -99,13 +101,27 @@ function plugins() { } if (!isProduction) { - return [...defaultPlugins]; + return [...defaultPlugins, '@emotion/babel-plugin']; } - return defaultPlugins; + return [...defaultPlugins, '@emotion/babel-plugin']; } module.exports = { presets: presets(), plugins: plugins(), + overrides: [ + { + test: /slate\.spec\.js$/, + presets: [ + [ + '@babel/preset-react', + { + runtime: 'classic', + pragma: 'h', + }, + ], + ], + }, + ], }; diff --git a/package-lock.json b/package-lock.json index cd35e9d83b89..12154799ec72 100644 --- a/package-lock.json +++ b/package-lock.json @@ -7,7 +7,6 @@ "": { "version": "0.0.0", "dependencies": { - "@emotion/babel-preset-css-prop": "^11.11.0", "ajv": "^8.17.1", "ajv-errors": "^3.0.0", "ajv-keywords": "^5.1.0", @@ -38,6 +37,7 @@ "@babel/preset-typescript": "^7.10.4", "@commitlint/cli": "^16.0.0", "@commitlint/config-conventional": "^16.0.0", + "@emotion/babel-plugin": "^11.13.5", "@emotion/eslint-plugin": "^11.0.0", "@emotion/jest": "^11.11.0", "@octokit/rest": "^16.28.7", @@ -262,6 +262,7 @@ "version": "7.27.3", "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.27.3.tgz", "integrity": "sha512-fXSwMQqitTGeHLBC08Eq5yXz2m37E4pJX1qAU1+2cNedz/ifv/bVXft90VeSav5nFO61EcNgwr0aJxbyPaWBPg==", + "dev": true, "license": "MIT", "dependencies": { "@babel/types": "^7.27.3" @@ -436,6 +437,7 @@ "version": "7.27.1", "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.27.1.tgz", "integrity": "sha512-1gn1Up5YXka3YYAHGKpbideQ5Yjf1tDa9qYcgysz+cNCXukyLl6DjPXhD3VRwSb8c0J9tA4b2+rHEZtc6R0tlw==", + "dev": true, "license": "MIT", "engines": { "node": ">=6.9.0" @@ -900,6 +902,7 @@ "version": "7.27.1", "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.27.1.tgz", "integrity": "sha512-y8YTNIeKoyhGd9O0Jiyzyyqk8gdjnumGTQPsz0xOZOQ2RmkVJeZ1vmmfIvFEKqucBG6axJGBZDE/7iI5suUI/w==", + "dev": true, "license": "MIT", "dependencies": { "@babel/helper-plugin-utils": "^7.27.1" @@ -1733,6 +1736,7 @@ "version": "7.27.1", "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.27.1.tgz", "integrity": "sha512-2KH4LWGSrJIkVf5tSiBFYuXDAoWRq2MMwgivCf+93dd0GQi8RXLjKA/0EvRnVV5G0hrHczsquXuD01L8s6dmBw==", + "dev": true, "license": "MIT", "dependencies": { "@babel/helper-annotate-as-pure": "^7.27.1", @@ -2789,39 +2793,12 @@ "stylis": "4.2.0" } }, - "node_modules/@emotion/babel-plugin-jsx-pragmatic": { - "version": "0.3.0", - "resolved": "https://registry.npmjs.org/@emotion/babel-plugin-jsx-pragmatic/-/babel-plugin-jsx-pragmatic-0.3.0.tgz", - "integrity": "sha512-XkRI5RdNl+f7HqpJADfTWlzZkd4tNaz2Gjzt97ZqN72jFSOqpL0grGGLdzKJ9dMQHXJBT/KZV+kphTycOblIsQ==", - "license": "MIT", - "dependencies": { - "@babel/plugin-syntax-jsx": "^7.17.12" - }, - "peerDependencies": { - "@babel/core": "^7.0.0" - } - }, "node_modules/@emotion/babel-plugin/node_modules/convert-source-map": { "version": "1.9.0", "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.9.0.tgz", "integrity": "sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==", "license": "MIT" }, - "node_modules/@emotion/babel-preset-css-prop": { - "version": "11.12.0", - "resolved": "https://registry.npmjs.org/@emotion/babel-preset-css-prop/-/babel-preset-css-prop-11.12.0.tgz", - "integrity": "sha512-wJYhkqVvH4nbxqwmw6XEkF/IWFFRQhYXiv69p7gibbT/e4S/5bMatoukDxRVxZla7aNvpZbXnfPeeNDlFehkKA==", - "license": "MIT", - "dependencies": { - "@babel/plugin-transform-react-jsx": "^7.17.12", - "@babel/runtime": "^7.18.3", - "@emotion/babel-plugin": "^11.12.0", - "@emotion/babel-plugin-jsx-pragmatic": "^0.3.0" - }, - "peerDependencies": { - "@babel/core": "^7.0.0" - } - }, "node_modules/@emotion/cache": { "version": "11.14.0", "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.14.0.tgz", @@ -39721,7 +39698,7 @@ "decap-cms-ui-default": "^3.0.0", "lodash": "^4.17.11", "prop-types": "^15.7.2", - "react": "^18.2.0" + "react": "^19.1.0" } }, "packages/decap-cms-ui-default": { diff --git a/package.json b/package.json index 9f27667a3a17..de3a5903d48d 100644 --- a/package.json +++ b/package.json @@ -27,7 +27,7 @@ "mock:server:start": "node -e 'require(\"./cypress/utils/mock-server\").start()'", "mock:server:stop": "node -e 'require(\"./cypress/utils/mock-server\").stop()'", "lint": "run-p -c --aggregate-output \"lint:*\"", - "lint-quiet": "run-p -c --aggregate-output \"lint:* --quiet\"", + "lint-quiet": "run-p -c --aggregate-output \"lint:*\"", "lint:css": "stylelint --ignore-path .gitignore \"packages/**/*.{css,js,jsx,ts,tsx}\"", "lint:js": "eslint --color --ignore-path .gitignore \"{{packages,scripts}/**/,}*.{js,jsx,ts,tsx}\"", "lint:format": "prettier \"{{packages,scripts}/**/,}*.{js,jsx,ts,tsx,css}\" --list-different", @@ -59,6 +59,7 @@ "@babel/preset-typescript": "^7.10.4", "@commitlint/cli": "^16.0.0", "@commitlint/config-conventional": "^16.0.0", + "@emotion/babel-plugin": "^11.13.5", "@emotion/eslint-plugin": "^11.0.0", "@emotion/jest": "^11.11.0", "@octokit/rest": "^16.28.7", @@ -158,7 +159,6 @@ }, "private": true, "dependencies": { - "@emotion/babel-preset-css-prop": "^11.11.0", "ajv": "^8.17.1", "ajv-errors": "^3.0.0", "ajv-keywords": "^5.1.0", diff --git a/packages/decap-cms-backend-aws-cognito-github-proxy/src/AuthenticationPage.js b/packages/decap-cms-backend-aws-cognito-github-proxy/src/AuthenticationPage.js index 1bad216280a8..5f24111f7598 100644 --- a/packages/decap-cms-backend-aws-cognito-github-proxy/src/AuthenticationPage.js +++ b/packages/decap-cms-backend-aws-cognito-github-proxy/src/AuthenticationPage.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component, Fragment } from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import { PkceAuthenticator } from 'decap-cms-lib-auth'; @@ -8,7 +8,7 @@ const LoginButtonIcon = styled(Icon)` margin-right: 18px; `; -export default class GenericPKCEAuthenticationPage extends React.Component { +export default class GenericPKCEAuthenticationPage extends Component { static propTypes = { inProgress: PropTypes.bool, config: PropTypes.object.isRequired, @@ -72,9 +72,9 @@ export default class GenericPKCEAuthenticationPage extends React.Component { logo={config.logo} siteUrl={config.site_url} renderButtonContent={() => ( - + {inProgress ? t('auth.loggingIn') : t('auth.login')} - + )} t={t} /> diff --git a/packages/decap-cms-backend-aws-cognito-github-proxy/src/implementation.tsx b/packages/decap-cms-backend-aws-cognito-github-proxy/src/implementation.tsx index 69fa2e85a7a1..ad659efa17d2 100644 --- a/packages/decap-cms-backend-aws-cognito-github-proxy/src/implementation.tsx +++ b/packages/decap-cms-backend-aws-cognito-github-proxy/src/implementation.tsx @@ -1,4 +1,3 @@ -import * as React from 'react'; import { GitHubBackend } from 'decap-cms-backend-github'; import { PKCEAuthenticationPage } from 'decap-cms-ui-auth'; diff --git a/packages/decap-cms-backend-azure/src/AuthenticationPage.js b/packages/decap-cms-backend-azure/src/AuthenticationPage.js index e55c99f2fde3..30971d163bca 100644 --- a/packages/decap-cms-backend-azure/src/AuthenticationPage.js +++ b/packages/decap-cms-backend-azure/src/AuthenticationPage.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component, Fragment } from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import { ImplicitAuthenticator } from 'decap-cms-lib-auth'; @@ -8,7 +8,7 @@ const LoginButtonIcon = styled(Icon)` margin-right: 18px; `; -export default class AzureAuthenticationPage extends React.Component { +export default class AzureAuthenticationPage extends Component { static propTypes = { onLogin: PropTypes.func.isRequired, inProgress: PropTypes.bool, @@ -76,10 +76,10 @@ export default class AzureAuthenticationPage extends React.Component { logoUrl={config.logo_url} // Deprecated, replaced by `logo.src` logo={config.logo} renderButtonContent={() => ( - + {inProgress ? t('auth.loggingIn') : t('auth.loginWithAzure')} - + )} t={t} /> diff --git a/packages/decap-cms-backend-bitbucket/src/AuthenticationPage.js b/packages/decap-cms-backend-bitbucket/src/AuthenticationPage.js index ddee1f56810b..0652bf637f0f 100644 --- a/packages/decap-cms-backend-bitbucket/src/AuthenticationPage.js +++ b/packages/decap-cms-backend-bitbucket/src/AuthenticationPage.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component, Fragment } from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import { NetlifyAuthenticator, ImplicitAuthenticator } from 'decap-cms-lib-auth'; @@ -8,7 +8,7 @@ const LoginButtonIcon = styled(Icon)` margin-right: 18px; `; -export default class BitbucketAuthenticationPage extends React.Component { +export default class BitbucketAuthenticationPage extends Component { static propTypes = { onLogin: PropTypes.func.isRequired, inProgress: PropTypes.bool, @@ -91,10 +91,10 @@ export default class BitbucketAuthenticationPage extends React.Component { logo={config.logo} siteUrl={config.site_url} renderButtonContent={() => ( - + {inProgress ? t('auth.loggingIn') : t('auth.loginWithBitbucket')} - + )} t={t} /> diff --git a/packages/decap-cms-backend-bitbucket/src/git-lfs-client.ts b/packages/decap-cms-backend-bitbucket/src/git-lfs-client.ts index b800f054708b..4681e1316961 100644 --- a/packages/decap-cms-backend-bitbucket/src/git-lfs-client.ts +++ b/packages/decap-cms-backend-bitbucket/src/git-lfs-client.ts @@ -1,4 +1,4 @@ -import minimatch from 'minimatch'; +import { minimatch } from 'minimatch'; import { unsentRequest } from 'decap-cms-lib-util'; import type { ApiRequest, PointerFile } from 'decap-cms-lib-util'; diff --git a/packages/decap-cms-backend-git-gateway/src/netlify-lfs-client.ts b/packages/decap-cms-backend-git-gateway/src/netlify-lfs-client.ts index 032a0077ac0f..9ce813940fc8 100644 --- a/packages/decap-cms-backend-git-gateway/src/netlify-lfs-client.ts +++ b/packages/decap-cms-backend-git-gateway/src/netlify-lfs-client.ts @@ -1,7 +1,7 @@ import { flow, fromPairs, map } from 'lodash/fp'; import isPlainObject from 'lodash/isPlainObject'; import isEmpty from 'lodash/isEmpty'; -import minimatch from 'minimatch'; +import { minimatch } from 'minimatch'; import { unsentRequest } from 'decap-cms-lib-util'; import type { ApiRequest, PointerFile } from 'decap-cms-lib-util'; diff --git a/packages/decap-cms-backend-gitea/src/AuthenticationPage.js b/packages/decap-cms-backend-gitea/src/AuthenticationPage.js index f5b5c397ec0e..924f53b11d04 100644 --- a/packages/decap-cms-backend-gitea/src/AuthenticationPage.js +++ b/packages/decap-cms-backend-gitea/src/AuthenticationPage.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component, Fragment } from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import { PkceAuthenticator } from 'decap-cms-lib-auth'; @@ -8,7 +8,7 @@ const LoginButtonIcon = styled(Icon)` margin-right: 18px; `; -export default class GiteaAuthenticationPage extends React.Component { +export default class GiteaAuthenticationPage extends Component { static propTypes = { inProgress: PropTypes.bool, config: PropTypes.object.isRequired, @@ -68,10 +68,10 @@ export default class GiteaAuthenticationPage extends React.Component { logo={config.logo} siteUrl={config.site_url} renderButtonContent={() => ( - + {' '} {inProgress ? t('auth.loggingIn') : t('auth.loginWithGitea')} - + )} t={t} /> diff --git a/packages/decap-cms-backend-github/src/AuthenticationPage.js b/packages/decap-cms-backend-github/src/AuthenticationPage.js index d87f9c68cdef..0a9523b4591d 100644 --- a/packages/decap-cms-backend-github/src/AuthenticationPage.js +++ b/packages/decap-cms-backend-github/src/AuthenticationPage.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component, Fragment } from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import { NetlifyAuthenticator } from 'decap-cms-lib-auth'; @@ -21,7 +21,7 @@ const ForkButtonsContainer = styled.div` align-items: center; `; -export default class GitHubAuthenticationPage extends React.Component { +export default class GitHubAuthenticationPage extends Component { static propTypes = { onLogin: PropTypes.func.isRequired, inProgress: PropTypes.bool, @@ -107,10 +107,10 @@ export default class GitHubAuthenticationPage extends React.Component { return inProgress || this.state.findingFork ? ( t('auth.loggingIn') ) : ( - + {t('auth.loginWithGitHub')} - + ); }; diff --git a/packages/decap-cms-backend-github/src/implementation.tsx b/packages/decap-cms-backend-github/src/implementation.tsx index 31149d8e9f26..2bc2ff126776 100644 --- a/packages/decap-cms-backend-github/src/implementation.tsx +++ b/packages/decap-cms-backend-github/src/implementation.tsx @@ -1,4 +1,3 @@ -import * as React from 'react'; import semaphore from 'semaphore'; import trimStart from 'lodash/trimStart'; import { stripIndent } from 'common-tags'; diff --git a/packages/decap-cms-backend-gitlab/src/AuthenticationPage.js b/packages/decap-cms-backend-gitlab/src/AuthenticationPage.js index bf4b943358d3..be7d57d29d35 100644 --- a/packages/decap-cms-backend-gitlab/src/AuthenticationPage.js +++ b/packages/decap-cms-backend-gitlab/src/AuthenticationPage.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component, Fragment } from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import { @@ -39,7 +39,7 @@ const clientSideAuthenticators = { }), }; -export default class GitLabAuthenticationPage extends React.Component { +export default class GitLabAuthenticationPage extends Component { static propTypes = { onLogin: PropTypes.func.isRequired, inProgress: PropTypes.bool, @@ -114,10 +114,10 @@ export default class GitLabAuthenticationPage extends React.Component { logo={config.logo} siteUrl={config.site_url} renderButtonContent={() => ( - + {' '} {inProgress ? t('auth.loggingIn') : t('auth.loginWithGitLab')} - + )} t={t} /> diff --git a/packages/decap-cms-backend-proxy/src/AuthenticationPage.js b/packages/decap-cms-backend-proxy/src/AuthenticationPage.js index 8a3594abde2e..ed130f1ee260 100644 --- a/packages/decap-cms-backend-proxy/src/AuthenticationPage.js +++ b/packages/decap-cms-backend-proxy/src/AuthenticationPage.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import { Icon, buttons, shadows, GoBackButton, renderPageLogo } from 'decap-cms-ui-default'; @@ -28,7 +28,7 @@ const LoginButton = styled.button` } `; -export default class AuthenticationPage extends React.Component { +export default class AuthenticationPage extends Component { static propTypes = { onLogin: PropTypes.func.isRequired, inProgress: PropTypes.bool, diff --git a/packages/decap-cms-backend-test/src/AuthenticationPage.js b/packages/decap-cms-backend-test/src/AuthenticationPage.js index 18b3fee274c8..d40452e1d30f 100644 --- a/packages/decap-cms-backend-test/src/AuthenticationPage.js +++ b/packages/decap-cms-backend-test/src/AuthenticationPage.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import { Icon, buttons, shadows, GoBackButton } from 'decap-cms-ui-default'; @@ -33,7 +33,7 @@ const LoginButton = styled.button` } `; -export default class AuthenticationPage extends React.Component { +export default class AuthenticationPage extends Component { static propTypes = { onLogin: PropTypes.func.isRequired, inProgress: PropTypes.bool, diff --git a/packages/decap-cms-core/src/bootstrap.js b/packages/decap-cms-core/src/bootstrap.js index fe5cf749b348..daf554faf6cf 100644 --- a/packages/decap-cms-core/src/bootstrap.js +++ b/packages/decap-cms-core/src/bootstrap.js @@ -1,5 +1,4 @@ import './lib/polyfill'; -import React from 'react'; import { createRoot } from 'react-dom/client'; import { Provider, connect } from 'react-redux'; import { Route, Router } from 'react-router-dom'; diff --git a/packages/decap-cms-core/src/components/App/App.js b/packages/decap-cms-core/src/components/App/App.js index 3f568055e10f..f15fe8c27b86 100644 --- a/packages/decap-cms-core/src/components/App/App.js +++ b/packages/decap-cms-core/src/components/App/App.js @@ -1,5 +1,5 @@ import PropTypes from 'prop-types'; -import React from 'react'; +import { createElement, Component } from 'react'; import { translate } from 'react-polyglot'; import ImmutablePropTypes from 'react-immutable-proptypes'; import styled from '@emotion/styled'; @@ -69,7 +69,7 @@ function RouteInCollection({ collections, render, ...props }) { ); } -class App extends React.Component { +class App extends Component { static propTypes = { auth: PropTypes.object.isRequired, config: PropTypes.object.isRequired, @@ -124,7 +124,7 @@ class App extends React.Component { return (
- {React.createElement(backend.authComponent(), { + {createElement(backend.authComponent(), { onLogin: this.handleLogin.bind(this), error: auth.error, inProgress: auth.isFetching, diff --git a/packages/decap-cms-core/src/components/App/Header.js b/packages/decap-cms-core/src/components/App/Header.js index cf561ff9b992..b3c5f13a0aa3 100644 --- a/packages/decap-cms-core/src/components/App/Header.js +++ b/packages/decap-cms-core/src/components/App/Header.js @@ -1,5 +1,5 @@ import PropTypes from 'prop-types'; -import React from 'react'; +import { Component } from 'react'; import ImmutablePropTypes from 'react-immutable-proptypes'; import styled from '@emotion/styled'; import { css } from '@emotion/react'; @@ -127,7 +127,7 @@ const AppHeaderLogo = styled.li` } `; -class Header extends React.Component { +class Header extends Component { static propTypes = { user: PropTypes.object.isRequired, collections: ImmutablePropTypes.map.isRequired, diff --git a/packages/decap-cms-core/src/components/App/NotFoundPage.js b/packages/decap-cms-core/src/components/App/NotFoundPage.js index 0f404fd072b8..4255a2cda4b0 100644 --- a/packages/decap-cms-core/src/components/App/NotFoundPage.js +++ b/packages/decap-cms-core/src/components/App/NotFoundPage.js @@ -1,4 +1,3 @@ -import React from 'react'; import styled from '@emotion/styled'; import { translate } from 'react-polyglot'; import { lengths } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-core/src/components/Collection/Collection.js b/packages/decap-cms-core/src/components/Collection/Collection.js index cdc3c0c111a7..621d0ac61643 100644 --- a/packages/decap-cms-core/src/components/Collection/Collection.js +++ b/packages/decap-cms-core/src/components/Collection/Collection.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import styled from '@emotion/styled'; @@ -42,7 +42,7 @@ const SearchResultHeading = styled.h1` ${components.cardTopHeading}; `; -export class Collection extends React.Component { +export class Collection extends Component { static propTypes = { searchTerm: PropTypes.string, collectionName: PropTypes.string, diff --git a/packages/decap-cms-core/src/components/Collection/CollectionControls.js b/packages/decap-cms-core/src/components/Collection/CollectionControls.js index afd9758ae1ea..dfb5aa0cd8fb 100644 --- a/packages/decap-cms-core/src/components/Collection/CollectionControls.js +++ b/packages/decap-cms-core/src/components/Collection/CollectionControls.js @@ -1,4 +1,3 @@ -import React from 'react'; import styled from '@emotion/styled'; import { lengths } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-core/src/components/Collection/CollectionSearch.js b/packages/decap-cms-core/src/components/Collection/CollectionSearch.js index 564c48100817..eca77679541c 100644 --- a/packages/decap-cms-core/src/components/Collection/CollectionSearch.js +++ b/packages/decap-cms-core/src/components/Collection/CollectionSearch.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import styled from '@emotion/styled'; import { colorsRaw, colors, Icon, lengths, zIndex } from 'decap-cms-ui-default'; import { translate } from 'react-polyglot'; @@ -86,7 +86,7 @@ const SuggestionDivider = styled.div` width: 100%; `; -class CollectionSearch extends React.Component { +class CollectionSearch extends Component { static propTypes = { collections: ImmutablePropTypes.map.isRequired, collection: ImmutablePropTypes.map, diff --git a/packages/decap-cms-core/src/components/Collection/CollectionTop.js b/packages/decap-cms-core/src/components/Collection/CollectionTop.js index 47d63e956d45..798a7018b919 100644 --- a/packages/decap-cms-core/src/components/Collection/CollectionTop.js +++ b/packages/decap-cms-core/src/components/Collection/CollectionTop.js @@ -1,6 +1,5 @@ import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; -import React from 'react'; import styled from '@emotion/styled'; import { translate } from 'react-polyglot'; import { Link } from 'react-router-dom'; diff --git a/packages/decap-cms-core/src/components/Collection/ControlButton.js b/packages/decap-cms-core/src/components/Collection/ControlButton.js index a31e04834a56..ac05e48667de 100644 --- a/packages/decap-cms-core/src/components/Collection/ControlButton.js +++ b/packages/decap-cms-core/src/components/Collection/ControlButton.js @@ -1,4 +1,3 @@ -import React from 'react'; import { css } from '@emotion/react'; import styled from '@emotion/styled'; import { buttons, StyledDropdownButton, colors } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-core/src/components/Collection/Entries/Entries.js b/packages/decap-cms-core/src/components/Collection/Entries/Entries.js index 0ef11da57274..361b1edacfe9 100644 --- a/packages/decap-cms-core/src/components/Collection/Entries/Entries.js +++ b/packages/decap-cms-core/src/components/Collection/Entries/Entries.js @@ -1,5 +1,4 @@ import PropTypes from 'prop-types'; -import React from 'react'; import styled from '@emotion/styled'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { translate } from 'react-polyglot'; diff --git a/packages/decap-cms-core/src/components/Collection/Entries/EntriesCollection.js b/packages/decap-cms-core/src/components/Collection/Entries/EntriesCollection.js index 8847f3b7c242..b1aa38b8ed1e 100644 --- a/packages/decap-cms-core/src/components/Collection/Entries/EntriesCollection.js +++ b/packages/decap-cms-core/src/components/Collection/Entries/EntriesCollection.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { connect } from 'react-redux'; @@ -60,7 +60,7 @@ function withGroups(groups, entries, EntriesToRender, t) { }); } -export class EntriesCollection extends React.Component { +export class EntriesCollection extends Component { static propTypes = { collection: ImmutablePropTypes.map.isRequired, collections: ImmutablePropTypes.iterable, diff --git a/packages/decap-cms-core/src/components/Collection/Entries/EntriesSearch.js b/packages/decap-cms-core/src/components/Collection/Entries/EntriesSearch.js index 757d5f6a6437..47b2002dc9aa 100644 --- a/packages/decap-cms-core/src/components/Collection/Entries/EntriesSearch.js +++ b/packages/decap-cms-core/src/components/Collection/Entries/EntriesSearch.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { connect } from 'react-redux'; @@ -12,7 +12,7 @@ import { } from '../../../actions/search'; import Entries from './Entries'; -class EntriesSearch extends React.Component { +class EntriesSearch extends Component { static propTypes = { isFetching: PropTypes.bool, searchEntries: PropTypes.func.isRequired, diff --git a/packages/decap-cms-core/src/components/Collection/Entries/EntryCard.js b/packages/decap-cms-core/src/components/Collection/Entries/EntryCard.js index 99b4361201b1..0f8c5bf11a77 100644 --- a/packages/decap-cms-core/src/components/Collection/Entries/EntryCard.js +++ b/packages/decap-cms-core/src/components/Collection/Entries/EntryCard.js @@ -1,4 +1,3 @@ -import React from 'react'; import styled from '@emotion/styled'; import { connect } from 'react-redux'; import { Link } from 'react-router-dom'; diff --git a/packages/decap-cms-core/src/components/Collection/Entries/EntryListing.js b/packages/decap-cms-core/src/components/Collection/Entries/EntryListing.js index c6d0e391457d..a205fa38ff8e 100644 --- a/packages/decap-cms-core/src/components/Collection/Entries/EntryListing.js +++ b/packages/decap-cms-core/src/components/Collection/Entries/EntryListing.js @@ -1,5 +1,5 @@ import PropTypes from 'prop-types'; -import React from 'react'; +import { Component } from 'react'; import ImmutablePropTypes from 'react-immutable-proptypes'; import styled from '@emotion/styled'; import { Waypoint } from 'react-waypoint'; @@ -18,7 +18,7 @@ const CardsGrid = styled.ul` margin-bottom: 16px; `; -class EntryListing extends React.Component { +class EntryListing extends Component { static propTypes = { collections: ImmutablePropTypes.iterable.isRequired, entries: ImmutablePropTypes.list, diff --git a/packages/decap-cms-core/src/components/Collection/Entries/__tests__/EntriesCollection.spec.js b/packages/decap-cms-core/src/components/Collection/Entries/__tests__/EntriesCollection.spec.js index 9d719a8248c0..3f35699449df 100644 --- a/packages/decap-cms-core/src/components/Collection/Entries/__tests__/EntriesCollection.spec.js +++ b/packages/decap-cms-core/src/components/Collection/Entries/__tests__/EntriesCollection.spec.js @@ -1,4 +1,3 @@ -import React from 'react'; import { render } from '@testing-library/react'; import { fromJS } from 'immutable'; import configureStore from 'redux-mock-store'; diff --git a/packages/decap-cms-core/src/components/Collection/FilterControl.js b/packages/decap-cms-core/src/components/Collection/FilterControl.js index ddd71f2249eb..1301d5494698 100644 --- a/packages/decap-cms-core/src/components/Collection/FilterControl.js +++ b/packages/decap-cms-core/src/components/Collection/FilterControl.js @@ -1,4 +1,3 @@ -import React from 'react'; import { translate } from 'react-polyglot'; import { Dropdown, DropdownCheckedItem } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-core/src/components/Collection/GroupControl.js b/packages/decap-cms-core/src/components/Collection/GroupControl.js index 34b7e692c8d8..ef600813fc7d 100644 --- a/packages/decap-cms-core/src/components/Collection/GroupControl.js +++ b/packages/decap-cms-core/src/components/Collection/GroupControl.js @@ -1,4 +1,3 @@ -import React from 'react'; import { translate } from 'react-polyglot'; import { Dropdown, DropdownItem } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-core/src/components/Collection/NestedCollection.js b/packages/decap-cms-core/src/components/Collection/NestedCollection.js index bb38ebd5ed62..4695ab7e7731 100644 --- a/packages/decap-cms-core/src/components/Collection/NestedCollection.js +++ b/packages/decap-cms-core/src/components/Collection/NestedCollection.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component, Fragment } from 'react'; import { List } from 'immutable'; import { css } from '@emotion/react'; import styled from '@emotion/styled'; @@ -102,7 +102,7 @@ function TreeNode(props) { : node.children.some(c => c.isDir)); return ( - + )} - + ); }); } @@ -247,7 +247,7 @@ export function updateNode(treeData, node, callback) { return updater([...treeData]); } -export class NestedCollection extends React.Component { +export class NestedCollection extends Component { static propTypes = { collection: ImmutablePropTypes.map.isRequired, entries: ImmutablePropTypes.list.isRequired, diff --git a/packages/decap-cms-core/src/components/Collection/Sidebar.js b/packages/decap-cms-core/src/components/Collection/Sidebar.js index 93fe974eda96..afdd12cae127 100644 --- a/packages/decap-cms-core/src/components/Collection/Sidebar.js +++ b/packages/decap-cms-core/src/components/Collection/Sidebar.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import styled from '@emotion/styled'; @@ -67,7 +67,7 @@ const SidebarNavLink = styled(NavLink)` `}; `; -export class Sidebar extends React.Component { +export class Sidebar extends Component { static propTypes = { collections: ImmutablePropTypes.map.isRequired, collection: ImmutablePropTypes.map, diff --git a/packages/decap-cms-core/src/components/Collection/SortControl.js b/packages/decap-cms-core/src/components/Collection/SortControl.js index 698e547ca4c3..bab28e477c42 100644 --- a/packages/decap-cms-core/src/components/Collection/SortControl.js +++ b/packages/decap-cms-core/src/components/Collection/SortControl.js @@ -1,4 +1,3 @@ -import React from 'react'; import { translate } from 'react-polyglot'; import { Dropdown, DropdownItem } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-core/src/components/Collection/ViewStyleControl.js b/packages/decap-cms-core/src/components/Collection/ViewStyleControl.js index b38ca5b8c1a2..f7e0c77ecf92 100644 --- a/packages/decap-cms-core/src/components/Collection/ViewStyleControl.js +++ b/packages/decap-cms-core/src/components/Collection/ViewStyleControl.js @@ -1,4 +1,3 @@ -import React from 'react'; import styled from '@emotion/styled'; import { Icon, buttons, colors } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-core/src/components/Collection/__tests__/Collection.spec.js b/packages/decap-cms-core/src/components/Collection/__tests__/Collection.spec.js index eca5af8d4023..c5f66e67a1e7 100644 --- a/packages/decap-cms-core/src/components/Collection/__tests__/Collection.spec.js +++ b/packages/decap-cms-core/src/components/Collection/__tests__/Collection.spec.js @@ -1,4 +1,3 @@ -import React from 'react'; import { render } from '@testing-library/react'; import { fromJS } from 'immutable'; import configureStore from 'redux-mock-store'; diff --git a/packages/decap-cms-core/src/components/Collection/__tests__/NestedCollection.spec.js b/packages/decap-cms-core/src/components/Collection/__tests__/NestedCollection.spec.js index bdeac4040567..d007013549dd 100644 --- a/packages/decap-cms-core/src/components/Collection/__tests__/NestedCollection.spec.js +++ b/packages/decap-cms-core/src/components/Collection/__tests__/NestedCollection.spec.js @@ -1,4 +1,3 @@ -import React from 'react'; import { MemoryRouter } from 'react-router-dom'; import { render, fireEvent } from '@testing-library/react'; import { fromJS } from 'immutable'; diff --git a/packages/decap-cms-core/src/components/Collection/__tests__/Sidebar.spec.js b/packages/decap-cms-core/src/components/Collection/__tests__/Sidebar.spec.js index d94723964fb1..690d72b7f86b 100644 --- a/packages/decap-cms-core/src/components/Collection/__tests__/Sidebar.spec.js +++ b/packages/decap-cms-core/src/components/Collection/__tests__/Sidebar.spec.js @@ -1,4 +1,3 @@ -import React from 'react'; import { MemoryRouter } from 'react-router-dom'; import { render } from '@testing-library/react'; import { fromJS } from 'immutable'; diff --git a/packages/decap-cms-core/src/components/Editor/Editor.js b/packages/decap-cms-core/src/components/Editor/Editor.js index ac2a4f84fd78..b6a3564ec063 100644 --- a/packages/decap-cms-core/src/components/Editor/Editor.js +++ b/packages/decap-cms-core/src/components/Editor/Editor.js @@ -1,5 +1,5 @@ import PropTypes from 'prop-types'; -import React from 'react'; +import { Component } from 'react'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { connect } from 'react-redux'; import { Loader } from 'decap-cms-ui-default'; @@ -36,7 +36,7 @@ import { status, EDITORIAL_WORKFLOW } from '../../constants/publishModes'; import EditorInterface from './EditorInterface'; import withWorkflow from './withWorkflow'; -export class Editor extends React.Component { +export class Editor extends Component { static propTypes = { changeDraftField: PropTypes.func.isRequired, changeDraftFieldValidation: PropTypes.func.isRequired, diff --git a/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControl.js b/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControl.js index 0a99468ac887..5e71b477ced0 100644 --- a/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControl.js +++ b/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControl.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import { bindActionCreators } from 'redux'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; @@ -121,7 +121,7 @@ function LabelComponent({ field, isActive, hasErrors, uniqueFieldId, isFieldOpti return labelComponent; } -class EditorControl extends React.Component { +class EditorControl extends Component { static propTypes = { value: PropTypes.oneOfType([ PropTypes.node, diff --git a/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControlPane.js b/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControlPane.js index dae2d3d3a241..d55e9cacd973 100644 --- a/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControlPane.js +++ b/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControlPane.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { css } from '@emotion/react'; @@ -94,7 +94,7 @@ function getFieldValue({ field, entry, isTranslatable, locale }) { return entry.getIn(['data', field.get('name')]); } -export default class ControlPane extends React.Component { +export default class ControlPane extends Component { state = { selectedLocale: this.props.locale, }; diff --git a/packages/decap-cms-core/src/components/Editor/EditorControlPane/Widget.js b/packages/decap-cms-core/src/components/Editor/EditorControlPane/Widget.js index c6d165e0bca7..9a148f506f91 100644 --- a/packages/decap-cms-core/src/components/Editor/EditorControlPane/Widget.js +++ b/packages/decap-cms-core/src/components/Editor/EditorControlPane/Widget.js @@ -1,5 +1,5 @@ import PropTypes from 'prop-types'; -import React, { Component } from 'react'; +import { createElement, Component } from 'react'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { Map, List } from 'immutable'; import { oneLine } from 'common-tags'; @@ -328,7 +328,7 @@ export default class Widget extends Component { isParentListCollapsed, } = this.props; - return React.createElement(controlComponent, { + return createElement(controlComponent, { entry, collection, config, diff --git a/packages/decap-cms-core/src/components/Editor/EditorInterface.js b/packages/decap-cms-core/src/components/Editor/EditorInterface.js index cad473866aa2..e1439b1b4061 100644 --- a/packages/decap-cms-core/src/components/Editor/EditorInterface.js +++ b/packages/decap-cms-core/src/components/Editor/EditorInterface.js @@ -1,5 +1,5 @@ import PropTypes from 'prop-types'; -import React, { Component } from 'react'; +import { Component } from 'react'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { css, Global } from '@emotion/react'; import styled from '@emotion/styled'; diff --git a/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/EditorPreview.js b/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/EditorPreview.js index ea8a96b5d00e..0763191b649f 100644 --- a/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/EditorPreview.js +++ b/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/EditorPreview.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import styled from '@emotion/styled'; @@ -15,7 +15,7 @@ const PreviewContainer = styled.div` * Use a stateful component so that child components can effectively utilize * `shouldComponentUpdate`. */ -export default class Preview extends React.Component { +export default class Preview extends Component { render() { const { collection, fields, widgetFor } = this.props; if (!collection || !fields) { diff --git a/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/EditorPreviewContent.js b/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/EditorPreviewContent.js index beb765b142b4..4dbe818a8974 100644 --- a/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/EditorPreviewContent.js +++ b/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/EditorPreviewContent.js @@ -1,5 +1,5 @@ import PropTypes from 'prop-types'; -import React from 'react'; +import { cloneElement, createElement, Component } from 'react'; import { isElement } from 'react-is'; import { ScrollSyncPane } from 'react-scroll-sync'; import { FrameContextConsumer } from 'react-frame-component'; @@ -9,7 +9,7 @@ import { vercelStegaDecode } from '@vercel/stega'; * PreviewContent renders the preview component and optionally handles visual editing interactions. * By default it uses scroll sync, but can be configured to use visual editing instead. */ -class PreviewContent extends React.Component { +class PreviewContent extends Component { handleClick = e => { const { previewProps, onFieldClick } = this.props; const visualEditing = previewProps?.collection?.getIn(['editor', 'visualEditing'], false); @@ -36,8 +36,8 @@ class PreviewContent extends React.Component { return (
{isElement(previewComponent) - ? React.cloneElement(previewComponent, previewProps) - : React.createElement(previewComponent, previewProps)} + ? cloneElement(previewComponent, previewProps) + : createElement(previewComponent, previewProps)}
); } diff --git a/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/EditorPreviewPane.js b/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/EditorPreviewPane.js index 3cc025fd705d..6b43ecfdd437 100644 --- a/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/EditorPreviewPane.js +++ b/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/EditorPreviewPane.js @@ -1,5 +1,5 @@ import PropTypes from 'prop-types'; -import React from 'react'; +import { Component } from 'react'; import styled from '@emotion/styled'; import { List, Map } from 'immutable'; import ImmutablePropTypes from 'react-immutable-proptypes'; @@ -36,7 +36,7 @@ const PreviewPaneFrame = styled(Frame)` border-radius: ${lengths.borderRadius}; `; -export class PreviewPane extends React.Component { +export class PreviewPane extends Component { getWidget = (field, value, metadata, props, idx = null) => { const { getAsset, entry } = props; const widget = resolveWidget(field.get('widget')); diff --git a/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/PreviewHOC.js b/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/PreviewHOC.js index e00fb7626598..41b418c4ae59 100644 --- a/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/PreviewHOC.js +++ b/packages/decap-cms-core/src/components/Editor/EditorPreviewPane/PreviewHOC.js @@ -1,8 +1,8 @@ -import React from 'react'; +import { createElement, Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; -class PreviewHOC extends React.Component { +class PreviewHOC extends Component { /** * Only re-render on value change, but always re-render objects and lists. * Their child widgets will each also be wrapped with this component, and @@ -20,7 +20,7 @@ class PreviewHOC extends React.Component { render() { const { previewComponent, ...props } = this.props; - return React.createElement(previewComponent, props); + return createElement(previewComponent, props); } } diff --git a/packages/decap-cms-core/src/components/Editor/EditorToolbar.js b/packages/decap-cms-core/src/components/Editor/EditorToolbar.js index a0f16a479af4..e4959335d665 100644 --- a/packages/decap-cms-core/src/components/Editor/EditorToolbar.js +++ b/packages/decap-cms-core/src/components/Editor/EditorToolbar.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component, Fragment } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { css } from '@emotion/react'; @@ -244,7 +244,7 @@ const StatusDropdownItem = styled(DropdownItem)` } `; -export class EditorToolbar extends React.Component { +export class EditorToolbar extends Component { static propTypes = { isPersisting: PropTypes.bool, isPublishing: PropTypes.bool, @@ -597,19 +597,19 @@ export class EditorToolbar extends React.Component { , currentStatus ? [ - + {this.renderWorkflowStatusControls()} {!hasChanged && this.renderNewEntryWorkflowPublishControls({ canCreate, canPublish })} - , + , ] : !isNewEntry && ( - + {this.renderExistingEntryWorkflowPublishControls({ canCreate, canPublish, canDelete, })} - + ), (!showDelete || useOpenAuthoring) && !hasUnpublishedChanges && !isModification ? null : ( - + @@ -2101,14 +2094,7 @@ exports[`EditorToolbar should render with status=pending_publish,useOpenAuthorin - + @@ -2779,14 +2765,7 @@ exports[`EditorToolbar should render with status=pending_review,useOpenAuthoring - + diff --git a/packages/decap-cms-core/src/components/Editor/withWorkflow.js b/packages/decap-cms-core/src/components/Editor/withWorkflow.js index 47fb52c0cfb8..8d9f61027c28 100644 --- a/packages/decap-cms-core/src/components/Editor/withWorkflow.js +++ b/packages/decap-cms-core/src/components/Editor/withWorkflow.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import { connect } from 'react-redux'; import { EDITORIAL_WORKFLOW } from '../../constants/publishModes'; @@ -52,7 +52,7 @@ export default function withWorkflow(Editor) { null, mergeProps, )( - class WorkflowEditor extends React.Component { + class WorkflowEditor extends Component { render() { return ; } diff --git a/packages/decap-cms-core/src/components/EditorWidgets/Unknown/UnknownControl.js b/packages/decap-cms-core/src/components/EditorWidgets/Unknown/UnknownControl.js index 638b9ea653fe..45d4fb506be8 100644 --- a/packages/decap-cms-core/src/components/EditorWidgets/Unknown/UnknownControl.js +++ b/packages/decap-cms-core/src/components/EditorWidgets/Unknown/UnknownControl.js @@ -1,4 +1,3 @@ -import React from 'react'; import { translate } from 'react-polyglot'; import ImmutablePropTypes from 'react-immutable-proptypes'; import PropTypes from 'prop-types'; diff --git a/packages/decap-cms-core/src/components/EditorWidgets/Unknown/UnknownPreview.js b/packages/decap-cms-core/src/components/EditorWidgets/Unknown/UnknownPreview.js index 44a8ec0b5460..1dc4435abf67 100644 --- a/packages/decap-cms-core/src/components/EditorWidgets/Unknown/UnknownPreview.js +++ b/packages/decap-cms-core/src/components/EditorWidgets/Unknown/UnknownPreview.js @@ -1,4 +1,3 @@ -import React from 'react'; import { translate } from 'react-polyglot'; import ImmutablePropTypes from 'react-immutable-proptypes'; import PropTypes from 'prop-types'; diff --git a/packages/decap-cms-core/src/components/MediaLibrary/EmptyMessage.js b/packages/decap-cms-core/src/components/MediaLibrary/EmptyMessage.js index 024181c47de8..c91b475ac638 100644 --- a/packages/decap-cms-core/src/components/MediaLibrary/EmptyMessage.js +++ b/packages/decap-cms-core/src/components/MediaLibrary/EmptyMessage.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import { colors } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibrary.js b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibrary.js index 5245e329eccd..de6cf0674300 100644 --- a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibrary.js +++ b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibrary.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { connect } from 'react-redux'; @@ -36,7 +36,7 @@ const IMAGE_EXTENSIONS_VIEWABLE = [ ]; const IMAGE_EXTENSIONS = [...IMAGE_EXTENSIONS_VIEWABLE]; -class MediaLibrary extends React.Component { +class MediaLibrary extends Component { static propTypes = { isVisible: PropTypes.bool, loadMediaDisplayURL: PropTypes.func, diff --git a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryButtons.js b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryButtons.js index f3d7e726b335..65606765b47b 100644 --- a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryButtons.js +++ b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryButtons.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import { css } from '@emotion/react'; import styled from '@emotion/styled'; @@ -71,7 +71,7 @@ const ActionButton = styled.button` export const DownloadButton = ActionButton; -export class CopyToClipBoardButton extends React.Component { +export class CopyToClipBoardButton extends Component { mounted = false; timeout; diff --git a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryCard.js b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryCard.js index fa954f3bb792..0cf9eaa45c75 100644 --- a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryCard.js +++ b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryCard.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import styled from '@emotion/styled'; @@ -62,7 +62,7 @@ const DraftText = styled.p` border-radius: ${lengths.borderRadius} 0 ${lengths.borderRadius} 0; `; -class MediaLibraryCard extends React.Component { +class MediaLibraryCard extends Component { render() { const { isSelected, diff --git a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryCardGrid.js b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryCardGrid.js index 1fa7cb176c0c..212309ce48d0 100644 --- a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryCardGrid.js +++ b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryCardGrid.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import { Waypoint } from 'react-waypoint'; diff --git a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryHeader.js b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryHeader.js index a29620d52086..81684fc3f82c 100644 --- a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryHeader.js +++ b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryHeader.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import { Icon, shadows, colors, buttons } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryModal.js b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryModal.js index ba89b25517c0..46e8dd94a06f 100644 --- a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryModal.js +++ b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryModal.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import { Map } from 'immutable'; diff --git a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibrarySearch.js b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibrarySearch.js index 54629f373387..104ceff865ae 100644 --- a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibrarySearch.js +++ b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibrarySearch.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import { Icon, lengths, colors, zIndex } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryTop.js b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryTop.js index 00b3ed06ac05..b466024b823d 100644 --- a/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryTop.js +++ b/packages/decap-cms-core/src/components/MediaLibrary/MediaLibraryTop.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; diff --git a/packages/decap-cms-core/src/components/MediaLibrary/__tests__/MediaLibraryButtons.spec.js b/packages/decap-cms-core/src/components/MediaLibrary/__tests__/MediaLibraryButtons.spec.js index 9761933283b5..9acc834c3a31 100644 --- a/packages/decap-cms-core/src/components/MediaLibrary/__tests__/MediaLibraryButtons.spec.js +++ b/packages/decap-cms-core/src/components/MediaLibrary/__tests__/MediaLibraryButtons.spec.js @@ -1,4 +1,3 @@ -import React from 'react'; import { render } from '@testing-library/react'; import { CopyToClipBoardButton } from '../MediaLibraryButtons'; diff --git a/packages/decap-cms-core/src/components/MediaLibrary/__tests__/MediaLibraryCard.spec.js b/packages/decap-cms-core/src/components/MediaLibrary/__tests__/MediaLibraryCard.spec.js index d0516c87d28e..fee162a2a21c 100644 --- a/packages/decap-cms-core/src/components/MediaLibrary/__tests__/MediaLibraryCard.spec.js +++ b/packages/decap-cms-core/src/components/MediaLibrary/__tests__/MediaLibraryCard.spec.js @@ -1,4 +1,3 @@ -import React from 'react'; import { Map } from 'immutable'; import { render } from '@testing-library/react'; diff --git a/packages/decap-cms-core/src/components/UI/DragDrop.js b/packages/decap-cms-core/src/components/UI/DragDrop.js index 9e08eb6131d0..de0530727384 100644 --- a/packages/decap-cms-core/src/components/UI/DragDrop.js +++ b/packages/decap-cms-core/src/components/UI/DragDrop.js @@ -4,7 +4,7 @@ import { DragSource as ReactDNDDragSource, DropTarget as ReactDNDDropTarget, } from 'react-dnd'; -import React from 'react'; +import { createElement, Component } from 'react'; import PropTypes from 'prop-types'; export function DragSource({ namespace, ...props }) { @@ -22,7 +22,7 @@ export function DragSource({ namespace, ...props }) { }), )(({ children, connectDragComponent }) => children(connectDragComponent)); - return React.createElement(DragComponent, props, props.children); + return createElement(DragComponent, props, props.children); } DragSource.propTypes = { @@ -44,7 +44,7 @@ export function DropTarget({ onDrop, namespace, ...props }) { }), )(({ children, connectDropTarget, isHovered }) => children(connectDropTarget, { isHovered })); - return React.createElement(DropComponent, props, props.children); + return createElement(DropComponent, props, props.children); } DropTarget.propTypes = { @@ -54,7 +54,7 @@ DropTarget.propTypes = { }; export function HTML5DragDrop(WrappedComponent) { - return class HTML5DragDrop extends React.Component { + return class HTML5DragDrop extends Component { render() { return ( diff --git a/packages/decap-cms-core/src/components/UI/ErrorBoundary.js b/packages/decap-cms-core/src/components/UI/ErrorBoundary.js index bcde8e757fab..018eefbba099 100644 --- a/packages/decap-cms-core/src/components/UI/ErrorBoundary.js +++ b/packages/decap-cms-core/src/components/UI/ErrorBoundary.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import { translate } from 'react-polyglot'; import styled from '@emotion/styled'; @@ -127,9 +127,9 @@ function RecoveredEntry({ entry, t }) { ); } -export class ErrorBoundary extends React.Component { +export class ErrorBoundary extends Component { static propTypes = { - children: PropTypes.node, + children: PropTypes.any, t: PropTypes.func.isRequired, config: PropTypes.object.isRequired, }; diff --git a/packages/decap-cms-core/src/components/UI/FileUploadButton.js b/packages/decap-cms-core/src/components/UI/FileUploadButton.js index 3746e6e57a37..88f3cd2e5d18 100644 --- a/packages/decap-cms-core/src/components/UI/FileUploadButton.js +++ b/packages/decap-cms-core/src/components/UI/FileUploadButton.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; export function FileUploadButton({ label, imagesOnly, onChange, disabled, className }) { diff --git a/packages/decap-cms-core/src/components/UI/Modal.js b/packages/decap-cms-core/src/components/UI/Modal.js index 0388e21755ed..77ede840fdb3 100644 --- a/packages/decap-cms-core/src/components/UI/Modal.js +++ b/packages/decap-cms-core/src/components/UI/Modal.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import { css, Global, ClassNames } from '@emotion/react'; import ReactModal from 'react-modal'; @@ -54,9 +54,9 @@ const styleStrings = { `, }; -export class Modal extends React.Component { +export class Modal extends Component { static propTypes = { - children: PropTypes.node.isRequired, + children: PropTypes.any.isRequired, isOpen: PropTypes.bool.isRequired, className: PropTypes.string, onClose: PropTypes.func.isRequired, diff --git a/packages/decap-cms-core/src/components/UI/Notifications.tsx b/packages/decap-cms-core/src/components/UI/Notifications.tsx index 664888157c78..af7e97adcb52 100644 --- a/packages/decap-cms-core/src/components/UI/Notifications.tsx +++ b/packages/decap-cms-core/src/components/UI/Notifications.tsx @@ -1,5 +1,4 @@ -// eslint-disable-next-line no-unused-vars -import React, { useEffect } from 'react'; +import { useState, useEffect } from 'react'; // import { translate } from 'react-polyglot'; import { injectStyle } from 'react-toastify/dist/inject-style'; import { toast, ToastContainer } from 'react-toastify'; @@ -25,7 +24,7 @@ type IdMap = { function Notifications({ notifications }: Props) { const t = useTranslate(); const dispatch = useDispatch(); - const [idMap, setIdMap] = React.useState({}); + const [idMap, setIdMap] = useState({}); useEffect(() => { notifications diff --git a/packages/decap-cms-core/src/components/UI/SettingsDropdown.js b/packages/decap-cms-core/src/components/UI/SettingsDropdown.js index 06979bc86073..db7712dcd7e2 100644 --- a/packages/decap-cms-core/src/components/UI/SettingsDropdown.js +++ b/packages/decap-cms-core/src/components/UI/SettingsDropdown.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Fragment } from 'react'; import PropTypes from 'prop-types'; import { css } from '@emotion/react'; import styled from '@emotion/styled'; @@ -61,7 +61,7 @@ Avatar.propTypes = { function SettingsDropdown({ displayUrl, isTestRepo, imageUrl, onLogoutClick, t }) { return ( - + {isTestRepo && ( - + ); } diff --git a/packages/decap-cms-core/src/components/UI/__tests__/ErrorBoundary.spec.js b/packages/decap-cms-core/src/components/UI/__tests__/ErrorBoundary.spec.js index ea11b0997b4a..b25d9e9dd652 100644 --- a/packages/decap-cms-core/src/components/UI/__tests__/ErrorBoundary.spec.js +++ b/packages/decap-cms-core/src/components/UI/__tests__/ErrorBoundary.spec.js @@ -1,4 +1,3 @@ -import React from 'react'; import { render } from '@testing-library/react'; import { oneLineTrim } from 'common-tags'; diff --git a/packages/decap-cms-core/src/components/Workflow/Workflow.js b/packages/decap-cms-core/src/components/Workflow/Workflow.js index 61a564c58f4c..8fbb6976b44f 100644 --- a/packages/decap-cms-core/src/components/Workflow/Workflow.js +++ b/packages/decap-cms-core/src/components/Workflow/Workflow.js @@ -1,5 +1,5 @@ import PropTypes from 'prop-types'; -import React, { Component } from 'react'; +import { Component } from 'react'; import ImmutablePropTypes from 'react-immutable-proptypes'; import styled from '@emotion/styled'; import { OrderedMap } from 'immutable'; diff --git a/packages/decap-cms-core/src/components/Workflow/WorkflowCard.js b/packages/decap-cms-core/src/components/Workflow/WorkflowCard.js index 1a7d671ed901..0a237c62c418 100644 --- a/packages/decap-cms-core/src/components/Workflow/WorkflowCard.js +++ b/packages/decap-cms-core/src/components/Workflow/WorkflowCard.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; import { css } from '@emotion/react'; import styled from '@emotion/styled'; diff --git a/packages/decap-cms-core/src/components/Workflow/WorkflowList.js b/packages/decap-cms-core/src/components/Workflow/WorkflowList.js index 34259320ae50..84ef76ea57ab 100644 --- a/packages/decap-cms-core/src/components/Workflow/WorkflowList.js +++ b/packages/decap-cms-core/src/components/Workflow/WorkflowList.js @@ -1,5 +1,5 @@ import PropTypes from 'prop-types'; -import React from 'react'; +import { Component } from 'react'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { css } from '@emotion/react'; import styled from '@emotion/styled'; @@ -128,7 +128,7 @@ function getColumnHeaderText(columnName, t) { } } -class WorkflowList extends React.Component { +class WorkflowList extends Component { static propTypes = { entries: ImmutablePropTypes.orderedMap, handleChangeStatus: PropTypes.func.isRequired, diff --git a/packages/decap-cms-core/src/constants/fieldInference.tsx b/packages/decap-cms-core/src/constants/fieldInference.tsx index 56c49aa7440c..deb7ea99434b 100644 --- a/packages/decap-cms-core/src/constants/fieldInference.tsx +++ b/packages/decap-cms-core/src/constants/fieldInference.tsx @@ -1,4 +1,4 @@ -import React from 'react'; +import * as React from 'react'; export const IDENTIFIER_FIELDS = ['title', 'path'] as const; diff --git a/packages/decap-cms-default-exports/src/index.js b/packages/decap-cms-default-exports/src/index.js index 8548109c9b3a..ca31b9125ada 100644 --- a/packages/decap-cms-default-exports/src/index.js +++ b/packages/decap-cms-default-exports/src/index.js @@ -14,7 +14,7 @@ import Immutable from 'immutable'; import ImmutablePropTypes from 'react-immutable-proptypes'; import Lodash from 'lodash/lodash'; import PropTypes from 'prop-types'; -import React from 'react'; +import * as React from 'react'; import ReactDOM from 'react-dom'; import * as UUId from 'uuid'; diff --git a/packages/decap-cms-editor-component-image/src/index.js b/packages/decap-cms-editor-component-image/src/index.js index 866d0a1bcbd7..c425e4427ca1 100644 --- a/packages/decap-cms-editor-component-image/src/index.js +++ b/packages/decap-cms-editor-component-image/src/index.js @@ -1,5 +1,3 @@ -import React from 'react'; - const image = { label: 'Image', id: 'image', diff --git a/packages/decap-cms-ui-auth/index.d.ts b/packages/decap-cms-ui-auth/index.d.ts index b989ebf130e6..a8c8f2a31075 100644 --- a/packages/decap-cms-ui-auth/index.d.ts +++ b/packages/decap-cms-ui-auth/index.d.ts @@ -1,13 +1,13 @@ declare module 'decap-cms-ui-auth' { - import React from 'react'; + import { Component } from 'react'; import type { Implementation } from 'decap-cms-lib-util/src'; - class PKCEAuthenticationPage extends React.Component { + class PKCEAuthenticationPage extends Component { constructor({ backend }: { backend: Implementation }); handleLogin(e: ChangeEvent): void; } - class NetlifyAuthenticationPage extends React.Component { + class NetlifyAuthenticationPage extends Component { handleLogin(e: ChangeEvent): void; static authClient: () => Promise; } diff --git a/packages/decap-cms-ui-auth/src/NetlifyAuthenticationPage.js b/packages/decap-cms-ui-auth/src/NetlifyAuthenticationPage.js index fe2a594f41d2..7566e2cf4c30 100644 --- a/packages/decap-cms-ui-auth/src/NetlifyAuthenticationPage.js +++ b/packages/decap-cms-ui-auth/src/NetlifyAuthenticationPage.js @@ -1,5 +1,5 @@ import PropTypes from 'prop-types'; -import React from 'react'; +import { Component } from 'react'; import styled from '@emotion/styled'; import partial from 'lodash/partial'; import { @@ -65,7 +65,7 @@ if (window.netlifyIdentity) { }); } -export default class NetlifyAuthenticationPage extends React.Component { +export default class NetlifyAuthenticationPage extends Component { static authClient; static propTypes = { diff --git a/packages/decap-cms-ui-auth/src/PKCEAuthenticationPage.js b/packages/decap-cms-ui-auth/src/PKCEAuthenticationPage.js index 8fc218d4b3ae..1b352131f5ad 100644 --- a/packages/decap-cms-ui-auth/src/PKCEAuthenticationPage.js +++ b/packages/decap-cms-ui-auth/src/PKCEAuthenticationPage.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component, Fragment } from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import jwtDecode from 'jwt-decode'; @@ -39,7 +39,7 @@ function normalizeClaimsToUser( }; } -export default class PKCEAuthenticationPage extends React.Component { +export default class PKCEAuthenticationPage extends Component { static propTypes = { inProgress: PropTypes.bool, config: PropTypes.object.isRequired, @@ -142,9 +142,9 @@ export default class PKCEAuthenticationPage extends React.Component { logo={config.logo} siteUrl={config.site_url} renderButtonContent={() => ( - + {inProgress ? t('auth.loggingIn') : t('auth.login')} - + )} t={t} /> diff --git a/packages/decap-cms-ui-auth/src/__tests__/NetlifyAuthenticationPage.spec.js b/packages/decap-cms-ui-auth/src/__tests__/NetlifyAuthenticationPage.spec.js index 31411fb6774a..0419ef7c0971 100644 --- a/packages/decap-cms-ui-auth/src/__tests__/NetlifyAuthenticationPage.spec.js +++ b/packages/decap-cms-ui-auth/src/__tests__/NetlifyAuthenticationPage.spec.js @@ -1,4 +1,3 @@ -import React from 'react'; import { render } from '@testing-library/react'; import NetlifyAuthenticationPage from '../NetlifyAuthenticationPage'; diff --git a/packages/decap-cms-ui-auth/src/__tests__/__snapshots__/NetlifyAuthenticationPage.spec.js.snap b/packages/decap-cms-ui-auth/src/__tests__/__snapshots__/NetlifyAuthenticationPage.spec.js.snap index 1be9f729581e..2b70ea75c5db 100644 --- a/packages/decap-cms-ui-auth/src/__tests__/__snapshots__/NetlifyAuthenticationPage.spec.js.snap +++ b/packages/decap-cms-ui-auth/src/__tests__/__snapshots__/NetlifyAuthenticationPage.spec.js.snap @@ -117,13 +117,7 @@ exports[`NetlifyAuthenticationPage should render with identity error 1`] = ` - + - + ); export default function withFileControl({ forImage } = {}) { - return class FileControl extends React.Component { + return class FileControl extends Component { static propTypes = { field: PropTypes.object.isRequired, getAsset: PropTypes.func.isRequired, diff --git a/packages/decap-cms-widget-image/src/ImagePreview.js b/packages/decap-cms-widget-image/src/ImagePreview.js index 36d8f7c0cd3e..a5110a0a4b69 100644 --- a/packages/decap-cms-widget-image/src/ImagePreview.js +++ b/packages/decap-cms-widget-image/src/ImagePreview.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import { List } from 'immutable'; diff --git a/packages/decap-cms-widget-list/src/ListControl.js b/packages/decap-cms-widget-list/src/ListControl.js index 97f74e9da16c..130b16ccfddd 100644 --- a/packages/decap-cms-widget-list/src/ListControl.js +++ b/packages/decap-cms-widget-list/src/ListControl.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import styled from '@emotion/styled'; @@ -172,7 +172,7 @@ function LabelComponent({ field, isActive, hasErrors, uniqueFieldId, isFieldOpti ); } -export default class ListControl extends React.Component { +export default class ListControl extends Component { childRefs = {}; static propTypes = { diff --git a/packages/decap-cms-widget-list/src/__tests__/ListControl.spec.js b/packages/decap-cms-widget-list/src/__tests__/ListControl.spec.js index 92403ae30e64..a05835fbeca1 100644 --- a/packages/decap-cms-widget-list/src/__tests__/ListControl.spec.js +++ b/packages/decap-cms-widget-list/src/__tests__/ListControl.spec.js @@ -1,4 +1,3 @@ -import React from 'react'; import { fireEvent, render } from '@testing-library/react'; import { fromJS } from 'immutable'; diff --git a/packages/decap-cms-widget-list/src/__tests__/__snapshots__/ListControl.spec.js.snap b/packages/decap-cms-widget-list/src/__tests__/__snapshots__/ListControl.spec.js.snap index fe50682ab40d..7eda4335a01a 100644 --- a/packages/decap-cms-widget-list/src/__tests__/__snapshots__/ListControl.spec.js.snap +++ b/packages/decap-cms-widget-list/src/__tests__/__snapshots__/ListControl.spec.js.snap @@ -168,9 +168,7 @@ exports[`ListControl should add to list when add button is clicked 1`] = ` - + @@ -186,12 +184,7 @@ exports[`ListControl should add to list when add button is clicked 1`] = ` - + @@ -420,9 +413,7 @@ exports[`ListControl should remove from list when remove button is clicked 1`] = - + @@ -438,12 +429,7 @@ exports[`ListControl should remove from list when remove button is clicked 1`] = - + @@ -702,9 +688,7 @@ exports[`ListControl should remove from list when remove button is clicked 2`] = - + @@ -720,12 +704,7 @@ exports[`ListControl should remove from list when remove button is clicked 2`] = - + @@ -967,9 +946,7 @@ exports[`ListControl should render list with fields with collapse = "false" and - + @@ -985,12 +962,7 @@ exports[`ListControl should render list with fields with collapse = "false" and - + @@ -1249,9 +1221,7 @@ exports[`ListControl should render list with fields with collapse = "false" and - + @@ -1267,12 +1237,7 @@ exports[`ListControl should render list with fields with collapse = "false" and - + @@ -1531,9 +1496,7 @@ exports[`ListControl should render list with fields with default collapse ("true - + @@ -1549,12 +1512,7 @@ exports[`ListControl should render list with fields with default collapse ("true - + @@ -1796,9 +1754,7 @@ exports[`ListControl should render list with fields with default collapse ("true - + @@ -1814,12 +1770,7 @@ exports[`ListControl should render list with fields with default collapse ("true - + @@ -1999,9 +1950,7 @@ exports[`ListControl should render list with nested object 1`] = ` - + @@ -2017,12 +1966,7 @@ exports[`ListControl should render list with nested object 1`] = ` - + @@ -2285,9 +2229,7 @@ exports[`ListControl should render list with nested object with collapse = false - + @@ -2303,12 +2245,7 @@ exports[`ListControl should render list with nested object with collapse = false - + diff --git a/packages/decap-cms-widget-map/src/MapPreview.js b/packages/decap-cms-widget-map/src/MapPreview.js index 1e0f57b4f8a5..3f7821f2257a 100644 --- a/packages/decap-cms-widget-map/src/MapPreview.js +++ b/packages/decap-cms-widget-map/src/MapPreview.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; import { WidgetPreviewContainer } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-widget-map/src/withMapControl.js b/packages/decap-cms-widget-map/src/withMapControl.js index d04d0d929482..6acf13444c01 100644 --- a/packages/decap-cms-widget-map/src/withMapControl.js +++ b/packages/decap-cms-widget-map/src/withMapControl.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { createRef, Component } from 'react'; import PropTypes from 'prop-types'; import { ClassNames } from '@emotion/react'; import olStyles from 'ol/ol.css'; @@ -29,7 +29,7 @@ function getDefaultMap(target, featuresLayer) { } export default function withMapControl({ getFormat, getMap } = {}) { - return class MapControl extends React.Component { + return class MapControl extends Component { static propTypes = { onChange: PropTypes.func.isRequired, field: PropTypes.object.isRequired, @@ -44,7 +44,7 @@ export default function withMapControl({ getFormat, getMap } = {}) { constructor(props) { super(props); - this.mapContainer = React.createRef(); + this.mapContainer = createRef(); this.resizeObserver = null; } diff --git a/packages/decap-cms-widget-markdown/src/MarkdownControl/RawEditor.js b/packages/decap-cms-widget-markdown/src/MarkdownControl/RawEditor.js index be007246a58e..081705cc1e69 100644 --- a/packages/decap-cms-widget-markdown/src/MarkdownControl/RawEditor.js +++ b/packages/decap-cms-widget-markdown/src/MarkdownControl/RawEditor.js @@ -1,4 +1,4 @@ -import React, { useEffect, useMemo, useState } from 'react'; +import { useEffect, useMemo, useState } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { ClassNames } from '@emotion/react'; diff --git a/packages/decap-cms-widget-markdown/src/MarkdownControl/Toolbar.js b/packages/decap-cms-widget-markdown/src/MarkdownControl/Toolbar.js index 6f405729184d..bc3bd184d05d 100644 --- a/packages/decap-cms-widget-markdown/src/MarkdownControl/Toolbar.js +++ b/packages/decap-cms-widget-markdown/src/MarkdownControl/Toolbar.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import styled from '@emotion/styled'; @@ -59,7 +59,7 @@ const ToolbarToggleLabel = styled.span` `}; `; -export default class Toolbar extends React.Component { +export default class Toolbar extends Component { static propTypes = { buttons: ImmutablePropTypes.list, editorComponents: ImmutablePropTypes.list, diff --git a/packages/decap-cms-widget-markdown/src/MarkdownControl/ToolbarButton.js b/packages/decap-cms-widget-markdown/src/MarkdownControl/ToolbarButton.js index c75a2dbb53c0..9886b2710b6c 100644 --- a/packages/decap-cms-widget-markdown/src/MarkdownControl/ToolbarButton.js +++ b/packages/decap-cms-widget-markdown/src/MarkdownControl/ToolbarButton.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; import styled from '@emotion/styled'; import { Icon, buttons } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-widget-markdown/src/MarkdownControl/VisualEditor.js b/packages/decap-cms-widget-markdown/src/MarkdownControl/VisualEditor.js index bb3555a14e58..efe10c3dc131 100644 --- a/packages/decap-cms-widget-markdown/src/MarkdownControl/VisualEditor.js +++ b/packages/decap-cms-widget-markdown/src/MarkdownControl/VisualEditor.js @@ -1,5 +1,5 @@ // @refresh reset -import React, { useCallback, useEffect, useMemo, useState } from 'react'; +import { useCallback, useEffect, useMemo, useState } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { ClassNames, css as coreCss } from '@emotion/react'; diff --git a/packages/decap-cms-widget-markdown/src/MarkdownControl/components/Shortcode.js b/packages/decap-cms-widget-markdown/src/MarkdownControl/components/Shortcode.js index 7a835796de22..5c4ba28a46fb 100644 --- a/packages/decap-cms-widget-markdown/src/MarkdownControl/components/Shortcode.js +++ b/packages/decap-cms-widget-markdown/src/MarkdownControl/components/Shortcode.js @@ -1,5 +1,5 @@ /* eslint-disable react/prop-types */ -import React, { useState } from 'react'; +import { useState } from 'react'; import { css } from '@emotion/react'; import { fromJS } from 'immutable'; import omit from 'lodash/omit'; diff --git a/packages/decap-cms-widget-markdown/src/MarkdownControl/components/VoidBlock.js b/packages/decap-cms-widget-markdown/src/MarkdownControl/components/VoidBlock.js index ad2b0a7b9ef0..a23cfd49c1d5 100644 --- a/packages/decap-cms-widget-markdown/src/MarkdownControl/components/VoidBlock.js +++ b/packages/decap-cms-widget-markdown/src/MarkdownControl/components/VoidBlock.js @@ -1,5 +1,4 @@ /* eslint-disable react/prop-types */ -import React from 'react'; import { css } from '@emotion/react'; import { zIndex } from 'decap-cms-ui-default'; import { ReactEditor, useSlate } from 'slate-react'; diff --git a/packages/decap-cms-widget-markdown/src/MarkdownControl/index.js b/packages/decap-cms-widget-markdown/src/MarkdownControl/index.js index df6ab65c4480..c1e20ad153ab 100644 --- a/packages/decap-cms-widget-markdown/src/MarkdownControl/index.js +++ b/packages/decap-cms-widget-markdown/src/MarkdownControl/index.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { List, Map } from 'immutable'; @@ -22,7 +22,7 @@ export function getEditorComponents() { return _getEditorComponents(); } -export default class MarkdownControl extends React.Component { +export default class MarkdownControl extends Component { static propTypes = { onChange: PropTypes.func.isRequired, onAddAsset: PropTypes.func.isRequired, diff --git a/packages/decap-cms-widget-markdown/src/MarkdownControl/renderers.js b/packages/decap-cms-widget-markdown/src/MarkdownControl/renderers.js index 9bc0e4c810de..1888aabf1409 100644 --- a/packages/decap-cms-widget-markdown/src/MarkdownControl/renderers.js +++ b/packages/decap-cms-widget-markdown/src/MarkdownControl/renderers.js @@ -1,5 +1,4 @@ /* eslint-disable react/display-name */ -import React from 'react'; import { css } from '@emotion/react'; import styled from '@emotion/styled'; import { colors, lengths } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-widget-markdown/src/MarkdownPreview.js b/packages/decap-cms-widget-markdown/src/MarkdownPreview.js index 5378fc06ae0c..7ce0661883d3 100644 --- a/packages/decap-cms-widget-markdown/src/MarkdownPreview.js +++ b/packages/decap-cms-widget-markdown/src/MarkdownPreview.js @@ -1,10 +1,10 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import { WidgetPreviewContainer } from 'decap-cms-ui-default'; import DOMPurify from 'dompurify'; import { markdownToHtml } from './serializers'; -class MarkdownPreview extends React.Component { +class MarkdownPreview extends Component { static propTypes = { getAsset: PropTypes.func.isRequired, resolveWidget: PropTypes.func.isRequired, diff --git a/packages/decap-cms-widget-markdown/src/__tests__/renderer.spec.js b/packages/decap-cms-widget-markdown/src/__tests__/renderer.spec.js index 75bbe01b6773..1189e08b1670 100644 --- a/packages/decap-cms-widget-markdown/src/__tests__/renderer.spec.js +++ b/packages/decap-cms-widget-markdown/src/__tests__/renderer.spec.js @@ -1,4 +1,3 @@ -import React from 'react'; import { render, screen } from '@testing-library/react'; import padStart from 'lodash/padStart'; import { Map } from 'immutable'; diff --git a/packages/decap-cms-widget-markdown/src/serializers/__tests__/slate.spec.js b/packages/decap-cms-widget-markdown/src/serializers/__tests__/slate.spec.js index a0bb78b64dfb..3cf9df8420a0 100644 --- a/packages/decap-cms-widget-markdown/src/serializers/__tests__/slate.spec.js +++ b/packages/decap-cms-widget-markdown/src/serializers/__tests__/slate.spec.js @@ -1,7 +1,6 @@ -/** @jsx h */ - import flow from 'lodash/flow'; +// eslint-disable-next-line no-unused-vars import h from '../../../test-helpers/h'; import { markdownToSlate, slateToMarkdown } from '../index'; diff --git a/packages/decap-cms-widget-markdown/src/serializers/remarkRehypeShortcodes.js b/packages/decap-cms-widget-markdown/src/serializers/remarkRehypeShortcodes.js index 7ca6fd6b8456..d351e6839c5a 100644 --- a/packages/decap-cms-widget-markdown/src/serializers/remarkRehypeShortcodes.js +++ b/packages/decap-cms-widget-markdown/src/serializers/remarkRehypeShortcodes.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { createElement } from 'react'; import map from 'lodash/map'; import has from 'lodash/has'; import { renderToString } from 'react-dom/server'; @@ -59,7 +59,7 @@ export default function remarkToRehypeShortcodes({ plugins, getAsset, resolveWid return toPreview(shortcodeData, getAsset, fields); } const preview = resolveWidget(widget); - return React.createElement(preview.preview, { + return createElement(preview.preview, { value: shortcodeData, field: plugin, getAsset, diff --git a/packages/decap-cms-widget-number/src/NumberControl.js b/packages/decap-cms-widget-number/src/NumberControl.js index 2d74dcabd182..9464a947f9a6 100644 --- a/packages/decap-cms-widget-number/src/NumberControl.js +++ b/packages/decap-cms-widget-number/src/NumberControl.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; const ValidationErrorTypes = { @@ -48,7 +48,7 @@ export function validateMinMax(value, min, max, field, t) { return error; } -export default class NumberControl extends React.Component { +export default class NumberControl extends Component { static propTypes = { field: ImmutablePropTypes.map.isRequired, onChange: PropTypes.func.isRequired, diff --git a/packages/decap-cms-widget-number/src/NumberPreview.js b/packages/decap-cms-widget-number/src/NumberPreview.js index 397de228edd3..d71fe42b795f 100644 --- a/packages/decap-cms-widget-number/src/NumberPreview.js +++ b/packages/decap-cms-widget-number/src/NumberPreview.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; import { WidgetPreviewContainer } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-widget-number/src/__tests__/number.spec.js b/packages/decap-cms-widget-number/src/__tests__/number.spec.js index bab212c8348d..44af3a13327e 100644 --- a/packages/decap-cms-widget-number/src/__tests__/number.spec.js +++ b/packages/decap-cms-widget-number/src/__tests__/number.spec.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import { fromJS } from 'immutable'; import { render, fireEvent } from '@testing-library/react'; @@ -14,7 +14,7 @@ const fieldSettings = { value_type: 'int', }; -class NumberController extends React.Component { +class NumberController extends Component { state = { value: this.props.defaultValue, }; diff --git a/packages/decap-cms-widget-object/src/ObjectControl.js b/packages/decap-cms-widget-object/src/ObjectControl.js index 3ecadfcd434a..b730aad9e81b 100644 --- a/packages/decap-cms-widget-object/src/ObjectControl.js +++ b/packages/decap-cms-widget-object/src/ObjectControl.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { ClassNames } from '@emotion/react'; @@ -21,7 +21,7 @@ const styleStrings = { `, }; -export default class ObjectControl extends React.Component { +export default class ObjectControl extends Component { childRefs = {}; processControlRef = ref => { diff --git a/packages/decap-cms-widget-object/src/ObjectPreview.js b/packages/decap-cms-widget-object/src/ObjectPreview.js index f9015fc0f8c3..a480350c166e 100644 --- a/packages/decap-cms-widget-object/src/ObjectPreview.js +++ b/packages/decap-cms-widget-object/src/ObjectPreview.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; import { WidgetPreviewContainer } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-widget-relation/src/RelationControl.js b/packages/decap-cms-widget-relation/src/RelationControl.js index dc5910aeca70..04f15dc57aff 100644 --- a/packages/decap-cms-widget-relation/src/RelationControl.js +++ b/packages/decap-cms-widget-relation/src/RelationControl.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { components } from 'react-select'; @@ -191,7 +191,7 @@ function convertToSortableOption(raw) { }; } -export default class RelationControl extends React.Component { +export default class RelationControl extends Component { mounted = false; state = { diff --git a/packages/decap-cms-widget-relation/src/RelationPreview.js b/packages/decap-cms-widget-relation/src/RelationPreview.js index c4c5a96356ec..18b3710c67ad 100644 --- a/packages/decap-cms-widget-relation/src/RelationPreview.js +++ b/packages/decap-cms-widget-relation/src/RelationPreview.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; import { WidgetPreviewContainer } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-widget-relation/src/__tests__/relation.spec.js b/packages/decap-cms-widget-relation/src/__tests__/relation.spec.js index 3ac35f7f4377..b5d87a8027e4 100644 --- a/packages/decap-cms-widget-relation/src/__tests__/relation.spec.js +++ b/packages/decap-cms-widget-relation/src/__tests__/relation.spec.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import { fromJS } from 'immutable'; import { render, fireEvent, waitFor, act } from '@testing-library/react'; @@ -241,7 +241,7 @@ const numberFieldsHits = [ }, }, ]; -class RelationController extends React.Component { +class RelationController extends Component { state = { value: this.props.value, queryHits: [], diff --git a/packages/decap-cms-widget-select/src/SelectControl.js b/packages/decap-cms-widget-select/src/SelectControl.js index 7295501c3cb7..6732d6f382a8 100644 --- a/packages/decap-cms-widget-select/src/SelectControl.js +++ b/packages/decap-cms-widget-select/src/SelectControl.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { Map, List, fromJS } from 'immutable'; @@ -37,7 +37,7 @@ function getSelectedValue({ value, options, isMultiple }) { } } -export default class SelectControl extends React.Component { +export default class SelectControl extends Component { static propTypes = { onChange: PropTypes.func.isRequired, value: PropTypes.node, diff --git a/packages/decap-cms-widget-select/src/SelectPreview.js b/packages/decap-cms-widget-select/src/SelectPreview.js index ea20f7b5eb1d..34d38f50a771 100644 --- a/packages/decap-cms-widget-select/src/SelectPreview.js +++ b/packages/decap-cms-widget-select/src/SelectPreview.js @@ -1,5 +1,4 @@ import PropTypes from 'prop-types'; -import React from 'react'; import { List } from 'immutable'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { WidgetPreviewContainer } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-widget-select/src/__tests__/select.spec.js b/packages/decap-cms-widget-select/src/__tests__/select.spec.js index 448d87bcae08..7d8086e3059f 100644 --- a/packages/decap-cms-widget-select/src/__tests__/select.spec.js +++ b/packages/decap-cms-widget-select/src/__tests__/select.spec.js @@ -1,4 +1,4 @@ -import React from 'react'; +import { Component } from 'react'; import { fromJS, List } from 'immutable'; import { render, fireEvent } from '@testing-library/react'; @@ -18,7 +18,7 @@ const numberOptions = [ { value: 2, label: 'Baz' }, ]; -class SelectController extends React.Component { +class SelectController extends Component { state = { value: this.props.defaultValue, }; diff --git a/packages/decap-cms-widget-string/src/StringControl.js b/packages/decap-cms-widget-string/src/StringControl.js index 864d7274fd6b..516d46a5d1a0 100644 --- a/packages/decap-cms-widget-string/src/StringControl.js +++ b/packages/decap-cms-widget-string/src/StringControl.js @@ -1,7 +1,7 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; -export default class StringControl extends React.Component { +export default class StringControl extends Component { static propTypes = { onChange: PropTypes.func.isRequired, forID: PropTypes.string, diff --git a/packages/decap-cms-widget-string/src/StringPreview.js b/packages/decap-cms-widget-string/src/StringPreview.js index f475c0ab2aff..5f3c94516cbd 100644 --- a/packages/decap-cms-widget-string/src/StringPreview.js +++ b/packages/decap-cms-widget-string/src/StringPreview.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; import { WidgetPreviewContainer } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms-widget-text/src/TextControl.js b/packages/decap-cms-widget-text/src/TextControl.js index 4319f0d9f9ed..a5ac849bfef9 100644 --- a/packages/decap-cms-widget-text/src/TextControl.js +++ b/packages/decap-cms-widget-text/src/TextControl.js @@ -1,8 +1,8 @@ -import React from 'react'; +import { Component } from 'react'; import PropTypes from 'prop-types'; import Textarea from 'react-textarea-autosize'; -export default class TextControl extends React.Component { +export default class TextControl extends Component { static propTypes = { onChange: PropTypes.func.isRequired, forID: PropTypes.string, diff --git a/packages/decap-cms-widget-text/src/TextPreview.js b/packages/decap-cms-widget-text/src/TextPreview.js index 8ce1bf1ffd5c..3e0cd8e8be18 100644 --- a/packages/decap-cms-widget-text/src/TextPreview.js +++ b/packages/decap-cms-widget-text/src/TextPreview.js @@ -1,4 +1,3 @@ -import React from 'react'; import PropTypes from 'prop-types'; import { WidgetPreviewContainer } from 'decap-cms-ui-default'; diff --git a/packages/decap-cms/src/index.js b/packages/decap-cms/src/index.js index fc0c632efc2e..0ddbe0cabc17 100644 --- a/packages/decap-cms/src/index.js +++ b/packages/decap-cms/src/index.js @@ -1,5 +1,5 @@ import createReactClass from 'create-react-class'; -import React from 'react'; +import { createElement } from 'react'; import { DecapCmsApp as CMS } from 'decap-cms-app'; import './extensions'; @@ -19,7 +19,7 @@ if (typeof window !== 'undefined') { window.CMS = CMS; window.initCMS = CMS.init; window.createClass = window.createClass || createReactClass; - window.h = window.h || React.createElement; + window.h = window.h || createElement; /** * Log the version number. */ diff --git a/tsconfig.json b/tsconfig.json index 732806af3e16..d7a0d672d1bf 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,7 +1,8 @@ { "compilerOptions": { "declaration": true, - "jsx": "react", + "jsx": "react-jsx", + "jsxImportSource": "@emotion/react", "target": "esnext", "module": "esnext", "moduleResolution": "node",