Merge pull request #5209 from ccnmtl/INFRA-2428-react-18-gas

Update to React 18
ccnmtl · Oct 9, 2023 · 28d61b4 · 28d61b4
2 parents 0e6959f + 1295916
commit 28d61b4
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 39 deletions.
diff --git a/gas-retention-simulator/package-lock.json b/gas-retention-simulator/package-lock.json
diff --git a/gas-retention-simulator/package.json b/gas-retention-simulator/package.json
@@ -33,15 +33,15 @@
     "eslint-plugin-security": "^1.4.0",
     "matter-js": "^0.19.0",
     "pixi.js": "~7.3.0",
-    "react": "~17.0.1",
-    "react-dom": "~17.0.1",
-    "react-range-step-input": "^1.3.0"
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-range-step-input": "github:Evan-CTL/react-range-step-input"
   },
   "devDependencies": {
     "@babel/core": "^7.5.5",
+    "@babel/eslint-parser": "^7.15.8",
     "@babel/preset-env": "^7.5.5",
     "@babel/preset-react": "^7.0.0",
-    "@babel/eslint-parser": "^7.15.8",
     "babel-loader": "^9.0.1",
     "eslint": "^8.0.1",
     "eslint-plugin-react": "~7.32.0",

diff --git a/gas-retention-simulator/src/main.jsx b/gas-retention-simulator/src/main.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import * as PIXI from 'pixi.js';
 import {RangeStepInput} from 'react-range-step-input';
 import Chamber from './Chamber';
@@ -686,4 +686,5 @@ class GasRetentionSimulator extends React.Component {
 }
 
 const domContainer = document.querySelector('#sim-container');
-ReactDOM.render(<GasRetentionSimulator />, domContainer);
+const root = createRoot(domContainer);
+root.render(<GasRetentionSimulator />);