React 18 update

https://issues.redhat.com/browse/COST-3928

package.json

@@ -63,9 +63,9 @@
     "js-file-download": "^0.4.12",
     "lodash": "^4.17.21",
     "qs": "^6.11.2",
-    "react": "^17.0.2",
+    "react": "^18.2.0",
     "react-bootstrap": "^2.8.0",
-    "react-dom": "^17.0.2",
+    "react-dom": "^18.2.0",
     "react-intl": "^6.4.4",
     "react-redux": "^8.1.2",
     "react-router-dom": "^6.14.2",
@@ -80,12 +80,12 @@
     "@formatjs/cli": "^6.1.3",
     "@redhat-cloud-services/eslint-config-redhat-cloud-services": "^1.3.0",
     "@redhat-cloud-services/frontend-components-config": "^5.1.1",
-    "@testing-library/react": "^12.1.5",
+    "@testing-library/react": "^14.0.0",
     "@testing-library/user-event": "^14.4.3",
     "@types/jest": "^29.5.3",
     "@types/qs": "^6.9.7",
-    "@types/react": "^17.0.35",
-    "@types/react-dom": "^17.0.9",
+    "@types/react": "^18.2.17",
+    "@types/react-dom": "^18.2.7",
     "@types/react-redux": "^7.1.25",
     "@types/react-router-dom": "^5.3.3",
     "@typescript-eslint/eslint-plugin": "^6.2.1",
@@ -117,6 +117,8 @@
   },
   "overrides": {
     "eslint": "^8.46.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "react-intl": "^6.4.4"
   },
   "insights": {

src/bootstrap.tsx

@@ -1,7 +1,12 @@
 import React from 'react';
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 
 import AppEntry from './appEntry';
 
-const root = document.getElementById('root');
-render(<AppEntry />, root, () => root.setAttribute('data-ouia-safe', 'true'));
+// const root = document.getElementById('root');
+// ReactDOM.render(<AppEntry />, root, () => root?.setAttribute('data-ouia-safe', 'true'));
+
+const container = document.getElementById('app');
+const root = createRoot(container!);
+root.render(<AppEntry />);
+container?.setAttribute('data-ouia-safe', 'true');

src/typings/frontend-components.ts

@@ -0,0 +1 @@
+declare module '@redhat-cloud-services/frontend-components/PageHeader';