From 5f4ddc8fd7d84500457bb08b0981a84a2d1594b1 Mon Sep 17 00:00:00 2001
From: Hassan Abouelela <hassan@hassanamr.com>
Date: Sat, 18 Jun 2022 23:59:14 +0400
Subject: Bump React To 18.2.0

Bump react to v18, and handle all the breaking changes. This includes
bumping a lot of other dependencies to versions which support react 18,
and handling the breaking changes for those.

Refer to the following documents for migration guides:
React: https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html
Router: https://reactrouter.com/docs/en/v6/upgrading/v5

Signed-off-by: Hassan Abouelela <hassan@hassanamr.com>
---
 src/index.tsx | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

(limited to 'src/index.tsx')

diff --git a/src/index.tsx b/src/index.tsx
index 4bce5a4..2565964 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,5 +1,7 @@
+/** @jsx jsx */
+import { jsx } from "@emotion/react";
 import React from "react";
-import ReactDOM from "react-dom";
+import { createRoot } from "react-dom/client";
 import App from "./App";
 import * as serviceWorker from "./serviceWorker";
 
@@ -33,8 +35,10 @@ console.log(`   SHA: %c ${process.env.COMMIT_REF} `, `padding: 2px; border-radiu
 
 console.log("%cCome join us on Discord! https://discord.gg/python", `font-size: 1.5em; font-family: "Hind", "Arial"; color: ${colors.blurple}`);
 
-/* eslint-disable react/react-in-jsx-scope */
-ReactDOM.render(
+const rootDocument = document.getElementById("root");
+// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+const root = createRoot(rootDocument!);
+root.render(
     <React.StrictMode>
         <Sentry.ErrorBoundary
             fallback={<p>An error has occurred with Python Discord Forms. Please let us know in the Discord server at <a href="https://discord.gg/python">discord.gg/python</a></p>}
@@ -47,10 +51,9 @@ ReactDOM.render(
                     console.log(err);
             }}
         >
-            <App />
+            <App/>
         </Sentry.ErrorBoundary>
-    </React.StrictMode>,
-    document.getElementById("root")
+    </React.StrictMode>
 );
 /* eslint-enable react/react-in-jsx-scope */
 
-- 
cgit v1.2.3

