React: Upgrading react to v17, wip (#29057)

* React: Upgrading react, wip

* build(grafana-ui): bump react to v17

* build: get enzyme running with react 17

* chore(grafana-ui): declare isMemo namedExport for rollup

Co-authored-by: Jack Westbrook <jack.westbrook@gmail.com>

package.json

@@ -99,9 +99,9 @@
     "@types/node": "13.7.0",
     "@types/papaparse": "5.2.0",
     "@types/prismjs": "1.16.0",
-    "@types/react": "16.8.16",
+    "@types/react": "16.9.9",
     "@types/react-beautiful-dnd": "12.1.2",
-    "@types/react-dom": "16.8.4",
+    "@types/react-dom": "16.9.9",
     "@types/react-grid-layout": "0.16.7",
     "@types/react-redux": "7.1.7",
     "@types/react-select": "3.0.8",
@@ -119,6 +119,7 @@
     "@types/tinycolor2": "1.4.2",
     "@typescript-eslint/eslint-plugin": "4.0.1",
     "@typescript-eslint/parser": "4.0.1",
+    "@wojtekmaj/enzyme-adapter-react-17": "0.3.1",
     "angular-mocks": "1.6.6",
     "autoprefixer": "9.7.4",
     "axios": "0.19.2",
@@ -129,8 +130,8 @@
     "clean-webpack-plugin": "3.0.0",
     "css-loader": "3.4.2",
     "enzyme": "3.11.0",
-    "enzyme-adapter-react-16": "1.15.2",
     "enzyme-to-json": "3.4.4",
+    "es-abstract": "1.18.0-next.1",
     "es6-promise": "4.2.8",
     "es6-shim": "0.35.5",
     "eslint": "7.4.0",
@@ -262,8 +263,9 @@
     "prop-types": "15.7.2",
     "rc-cascader": "1.0.1",
     "re-resizable": "^6.2.0",
-    "react": "16.12.0",
-    "react-dom": "16.12.0",
+    "react-beautiful-dnd": "13.0.0",
+    "react": "17.0.1",
+    "react-dom": "17.0.1",
     "react-grid-layout": "0.17.1",
     "react-highlight-words": "0.16.0",
     "react-loadable": "5.5.0",

packages/grafana-data/package.json

@@ -43,7 +43,7 @@
     "@types/marked": "1.1.0",
     "@types/node": "10.14.1",
     "@types/papaparse": "5.2.0",
-    "@types/react": "16.8.16",
+    "@types/react": "16.9.9",
     "@types/rollup-plugin-visualizer": "2.6.0",
     "@types/sinon": "^7.5.2",
     "pretty-format": "25.1.0",

packages/grafana-ui/package.json

@@ -53,14 +53,14 @@
     "papaparse": "5.3.0",
     "rc-cascader": "1.0.1",
     "rc-drawer": "3.1.3",
-    "rc-slider": "9.3.1",
+    "rc-slider": "9.6.2",
     "rc-time-picker": "^3.7.3",
-    "react": "16.12.0",
+    "react": "17.0.1",
     "react-beautiful-dnd": "13.0.0",
     "react-calendar": "2.19.2",
     "react-color": "2.18.0",
     "react-custom-scrollbars": "4.2.1",
-    "react-dom": "16.12.0",
+    "react-dom": "17.0.1",
     "react-highlight-words": "0.16.0",
     "react-hook-form": "5.1.3",
     "react-monaco-editor": "0.36.0",
@@ -91,8 +91,8 @@
     "@types/lodash": "4.14.123",
     "@types/node": "10.14.1",
     "@types/papaparse": "5.2.0",
-    "@types/rc-slider": "8.6.5",
-    "@types/react": "16.8.16",
+    "@types/rc-slider": "8.6.6",
+    "@types/react": "16.9.9",
     "@types/react-custom-scrollbars": "4.0.5",
     "@types/react-test-renderer": "16.9.2",
     "@types/react-transition-group": "4.2.4",

packages/grafana-ui/rollup.config.ts

@@ -82,7 +82,8 @@ const buildCjsPackage = ({ env }) => {
             'useAbsoluteLayout',
             'useFilters',
           ],
-          '../../node_modules/react-is/index.js': ['isValidElementType', 'isContextConsumer'],
+          '../../node_modules/rc-tooltip/node_modules/react-is/index.js': ['isMemo'],
+          '../../node_modules/rc-motion/node_modules/react-is/index.js': ['isMemo'],
         },
       }),
       resolve(),

public/test/jest-setup.ts

 import { configure } from 'enzyme';
-import Adapter from 'enzyme-adapter-react-16';
+import Adapter from '@wojtekmaj/enzyme-adapter-react-17';
 import 'jquery';
 import $ from 'jquery';
 import 'mutationobserver-shim';