From 96cd51d1501640eb6262979d455f6d8567c19eef Mon Sep 17 00:00:00 2001
From: Ash Keel <ash@nebula.cafe>
Date: Sun, 4 Dec 2022 18:42:43 +0100
Subject: [PATCH] fix: update to React 18 APIs

---
 frontend/src/index.tsx | 13 ++++++++-----
 frontend/tsconfig.json |  2 +-
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/frontend/src/index.tsx b/frontend/src/index.tsx
index 11909b3..b235653 100644
--- a/frontend/src/index.tsx
+++ b/frontend/src/index.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import { Provider } from 'react-redux';
 import { HashRouter } from 'react-router-dom';
+import { StrictMode } from 'react';
 
 import 'inter-ui/inter.css';
 import '@fontsource/space-mono/index.css';
@@ -15,11 +15,14 @@ import { globalStyles } from './ui/theme';
 
 globalStyles();
 
-ReactDOM.render(
+const main = document.getElementById('main');
+const root = createRoot(main);
+root.render(
   <Provider store={store}>
     <HashRouter>
-      <App />
+      <StrictMode>
+        <App />
+      </StrictMode>
     </HashRouter>
   </Provider>,
-  document.getElementById('main'),
 );
diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json
index 15d1a19..e8b70f1 100644
--- a/frontend/tsconfig.json
+++ b/frontend/tsconfig.json
@@ -3,7 +3,7 @@
     "target": "esnext",
     "moduleResolution": "node",
     "allowSyntheticDefaultImports": true,
-    "jsx": "react",
+    "jsx": "react-jsx",
     "lib": ["es2019", "dom"],
     "resolveJsonModule": true,
     "baseUrl": ".",