perf(deps): update react monorepo to v18 (major) (#292)

* chore(deps): update react monorepo to v18

* chore(deps): update app to React 18

Co-authored-by: Renovate Bot <[email protected]>
Co-authored-by: Justin Hall <[email protected]>

Author: 3 people

package-lock.json

@@ -53,8 +53,8 @@
     "@types/ms": "0.7.31",
     "@types/node": "16.11.27",
     "@types/node-fetch": "2.6.1",
-    "@types/react": "17.0.44",
-    "@types/react-dom": "17.0.15",
+    "@types/react": "18.0.6",
+    "@types/react-dom": "18.0.2",
     "@types/react-helmet": "6.1.5",
     "@vitejs/plugin-react": "1.3.1",
     "@wkovacs64/prettier-config": "3.0.1",
@@ -83,8 +83,8 @@
     "prettier": "2.6.2",
     "prettier-plugin-tailwindcss": "0.1.10",
     "prop-types": "15.8.1",
-    "react": "17.0.2",
-    "react-dom": "17.0.2",
+    "react": "18.0.0",
+    "react-dom": "18.0.0",
     "react-helmet": "6.1.0",
     "react-icons": "4.3.1",
     "react-router-dom": "6.3.0",

package.json

@@ -1,17 +1,19 @@
 import * as React from 'react';
-import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import App from './app';
 import AppProviders from './app-providers';
 
 if (typeof window !== 'undefined') {
   import('./pwa');
 }
 
-ReactDOM.render(
+const container = document.getElementById('root');
+// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+const root = createRoot(container!);
+root.render(
   <React.StrictMode>
     <AppProviders>
       <App />
     </AppProviders>
   </React.StrictMode>,
-  document.getElementById('root'),
 );