Merge pull request #673 from robintown/fix-warnings

Switch to the React 18 createRoot API

.eslintrc.cjs

@@ -28,6 +28,10 @@ module.exports = {
                 "plugin:matrix-org/react",
                 "prettier",
             ],
+            rules: {
+                // We're aiming to convert this code to strict mode
+                "@typescript-eslint/no-non-null-assertion": "off",
+            },
         },
     ],
     settings: {

src/main.tsx

@@ -20,8 +20,8 @@ limitations under the License.
 // dependency references.
 import "matrix-js-sdk/src/browser-index";
 
-import React from "react";
+import React, { StrictMode } from "react";
-import ReactDOM from "react-dom";
+import { createRoot } from "react-dom/client";
 import { createBrowserHistory } from "history";
 import * as Sentry from "@sentry/react";
 import { Integrations } from "@sentry/tracing";
@@ -39,6 +39,8 @@ initRageshake();
 
 console.info(`matrix-video-chat ${import.meta.env.VITE_APP_VERSION || "dev"}`);
 
+const root = createRoot(document.getElementById("root")!);
+
 let fatalError: Error | null = null;
 
 if (!window.isSecureContext) {
@@ -52,7 +54,7 @@ if (!window.isSecureContext) {
 }
 
 if (fatalError !== null) {
-  ReactDOM.render(<>fatalError.message</>, document.getElementById("root"));
+  root.render(fatalError.message);
   throw fatalError; // Stop the app early
 }
 
@@ -147,9 +149,8 @@ i18n
     },
   });
 
-ReactDOM.render(
+root.render(
-  <React.StrictMode>
+  <StrictMode>
     <App history={history} />
-  </React.StrictMode>,
+  </StrictMode>
-  document.getElementById("root")
 );