Revert upgrade to react 18 (#5352)

src/renderer/bootstrap.tsx

@@ -6,14 +6,13 @@
 import "./components/app.scss";
 
 import React from "react";
-import ReactDOM from "react-dom";
+import ReactDOM, { render, unmountComponentAtNode } from "react-dom";
 import * as Mobx from "mobx";
 import * as MobxReact from "mobx-react";
 import * as ReactRouter from "react-router";
 import * as ReactRouterDom from "react-router-dom";
 import * as LensExtensionsCommonApi from "../extensions/common-api";
 import * as LensExtensionsRendererApi from "../extensions/renderer-api";
-import { createRoot } from "react-dom/client";
 import { delay } from "../common/utils";
 import { isMac, isDevelopment } from "../common/vars";
 import { HelmRepoManager } from "../main/helm/helm-repo-manager";
@@ -70,7 +69,6 @@ export async function bootstrap(di: DiContainer) {
   bindEvents();
 
   const rootElem = document.getElementById("app");
-  const rootNode = createRoot(rootElem);
   const logPrefix = `[BOOTSTRAP-${process.isMainFrame ? "ROOT" : "CLUSTER"}-FRAME]:`;
 
   // TODO: Remove temporal dependencies to make timing of initialization not important
@@ -154,7 +152,7 @@ export async function bootstrap(di: DiContainer) {
   }
 
   try {
-    await initializeApp(() => rootNode.unmount());
+    await initializeApp(() => unmountComponentAtNode(rootElem));
   } catch (error) {
     console.error(`[BOOTSTRAP]: view initialization error: ${error}`, {
       origin: location.href,
@@ -162,12 +160,13 @@ export async function bootstrap(di: DiContainer) {
     });
   }
 
-  rootNode.render(
+  render(
     <DiContextProvider value={{ di }}>
       <Router history={di.inject(historyInjectable)}>
         {DefaultProps(App)}
       </Router>
     </DiContextProvider>,
+    rootElem,
   );
 }