Upgrading to React 18.x

ReCodEx · Aug 7, 2023 · 9430f3d · 9430f3d
1 parent f8b75f3
commit 9430f3d
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 26 deletions.
diff --git a/package.json b/package.json
@@ -64,14 +64,14 @@
     "pretty-ms": "^8.0.0",
     "prismjs": "^1.29.0",
     "prop-types": "^15.8.1",
-    "react": "^17.0.2",
+    "react": "^18.2.0",
     "react-ace": "^10.1.0",
     "react-bootstrap": "1.6.7",
     "react-collapse": "^5.1.1",
     "react-copy-to-clipboard": "^5.1.0",
     "react-datetime": "^3.2.0",
     "react-diff-viewer": "^3.1.1",
-    "react-dom": "^17.0.2",
+    "react-dom": "^18.2.0",
     "react-dropzone": "^14.2.3",
     "react-height": "^3.0.2",
     "react-helmet": "^6.1.0",

diff --git a/src/client.js b/src/client.js
@@ -1,7 +1,7 @@
 import 'cross-fetch/polyfill';
 
 import React from 'react';
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import { fromJS } from 'immutable';
 import { Provider } from 'react-redux';
 import { BrowserRouter } from 'react-router-dom';
@@ -71,11 +71,12 @@ if (ini) {
 
 const store = configureStore(state, getToken(), getInstanceId(), getLang());
 
-render(
+const container = document.getElementById('root');
+const root = createRoot(container);
+root.render(
   <Provider store={store}>
     <BrowserRouter>
       <App />
     </BrowserRouter>
-  </Provider>,
-  document.getElementById('root')
+  </Provider>
 );
diff --git a/src/redux/helpers/resourceManager/utils.js b/src/redux/helpers/resourceManager/utils.js
@@ -10,7 +10,10 @@ import { hasFailed, didInvalidate } from './status';
  * @param {string} resourceName Name of the resource
  * @return {Function} API endpoint factory
  */
-export const defaultApiEndpointFactory = resourceName => (id = '') => `/${resourceName}/${id}`;
+export const defaultApiEndpointFactory =
+  resourceName =>
+  (id = '') =>
+    `/${resourceName}/${id}`;
 
 /**
  * @param {string} resourceName Name of the resource

diff --git a/yarn.lock b/yarn.lock
@@ -13417,16 +13417,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-dom@npm:^17.0.2":
-  version: 17.0.2
-  resolution: "react-dom@npm:17.0.2"
+"react-dom@npm:^18.2.0":
+  version: 18.2.0
+  resolution: "react-dom@npm:18.2.0"
   dependencies:
     loose-envify: ^1.1.0
-    object-assign: ^4.1.1
-    scheduler: ^0.20.2
+    scheduler: ^0.23.0
   peerDependencies:
-    react: 17.0.2
-  checksum: 1c1eaa3bca7c7228d24b70932e3d7c99e70d1d04e13bb0843bbf321582bc25d7961d6b8a6978a58a598af2af496d1cedcfb1bf65f6b0960a0a8161cb8dab743c
+    react: ^18.2.0
+  checksum: 7d323310bea3a91be2965f9468d552f201b1c27891e45ddc2d6b8f717680c95a75ae0bc1e3f5cf41472446a2589a75aed4483aee8169287909fcd59ad149e8cc
   languageName: node
   linkType: hard
 
@@ -13695,13 +13694,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react@npm:^17.0.2":
-  version: 17.0.2
-  resolution: "react@npm:17.0.2"
+"react@npm:^18.2.0":
+  version: 18.2.0
+  resolution: "react@npm:18.2.0"
   dependencies:
     loose-envify: ^1.1.0
-    object-assign: ^4.1.1
-  checksum: b254cc17ce3011788330f7bbf383ab653c6848902d7936a87b09d835d091e3f295f7e9dd1597c6daac5dc80f90e778c8230218ba8ad599f74adcc11e33b9d61b
+  checksum: 88e38092da8839b830cda6feef2e8505dec8ace60579e46aa5490fc3dc9bba0bd50336507dc166f43e3afc1c42939c09fe33b25fae889d6f402721dcd78fca1b
   languageName: node
   linkType: hard
 
@@ -13842,14 +13840,14 @@ __metadata:
     pretty-ms: ^8.0.0
     prismjs: ^1.29.0
     prop-types: ^15.8.1
-    react: ^17.0.2
+    react: ^18.2.0
     react-ace: ^10.1.0
     react-bootstrap: 1.6.7
     react-collapse: ^5.1.1
     react-copy-to-clipboard: ^5.1.0
     react-datetime: ^3.2.0
     react-diff-viewer: ^3.1.1
-    react-dom: ^17.0.2
+    react-dom: ^18.2.0
     react-dropzone: ^14.2.3
     react-height: ^3.0.2
     react-helmet: ^6.1.0
@@ -14602,13 +14600,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"scheduler@npm:^0.20.2":
-  version: 0.20.2
-  resolution: "scheduler@npm:0.20.2"
+"scheduler@npm:^0.23.0":
+  version: 0.23.0
+  resolution: "scheduler@npm:0.23.0"
   dependencies:
     loose-envify: ^1.1.0
-    object-assign: ^4.1.1
-  checksum: c4b35cf967c8f0d3e65753252d0f260271f81a81e427241295c5a7b783abf4ea9e905f22f815ab66676f5313be0a25f47be582254db8f9241b259213e999b8fc
+  checksum: d79192eeaa12abef860c195ea45d37cbf2bbf5f66e3c4dcd16f54a7da53b17788a70d109ee3d3dde1a0fd50e6a8fc171f4300356c5aee4fc0171de526bf35f8a
   languageName: node
   linkType: hard