Create MainRoute file

src/App.jsx

@@ -1,27 +1,18 @@
 import React, { Suspense } from "react";
 import { QueryClient, QueryClientProvider } from "react-query";
 
-import {
-  BrowserRouter as Router,
-  Route,
-  Switch,
-  Redirect,
-} from "react-router-dom";
+import { BrowserRouter as Router } from "react-router-dom";
 
 import { RecoilRoot } from "recoil";
-import { nanoid } from "nanoid";
 import { ToastContainer } from "react-toastify";
 
 import "react-toastify/dist/ReactToastify.css";
 import "./react-confirm-alert.css";
 
-import Home from "./views/Home";
-import GameView from "./views/GameView";
-import SessionView from "./views/SessionView";
-import AuthView from "./views/AuthView";
-
 import Waiter from "./ui/Waiter";
 
+import MainRoute from "./MainRoute";
+
 const queryClient = new QueryClient();
 
 const App = () => {
@@ -30,33 +21,7 @@ const App = () => {
       <RecoilRoot>
         <QueryClientProvider client={queryClient}>
           <Router>
-            <Switch>
-              <Route path="/game/:gameId/session/" exact>
-                {({
-                  match: {
-                    params: { gameId },
-                  },
-                }) => {
-                  // Redirect to new session id
-                  return (
-                    <Redirect to={`/game/${gameId}/session/${nanoid()}`} />
-                  );
-                }}
-              </Route>
-              <Route path="/game/:gameId/session/:room/">
-                <SessionView />
-              </Route>
-              <Route path="/game/:gameId?">
-                <GameView />
-              </Route>
-              <Route exact path="/login/:userHash/:token">
-                <AuthView />
-              </Route>
-              <Redirect from="/" to="/games/" exact />
-              <Route path="/">
-                <Home />
-              </Route>
-            </Switch>
+            <MainRoute />
           </Router>
         </QueryClientProvider>
       </RecoilRoot>

src/MainRoute.jsx

@@ -0,0 +1,50 @@
+import React from "react";
+
+import {
+  BrowserRouter as Router,
+  Route,
+  Switch,
+  Redirect,
+} from "react-router-dom";
+
+import { nanoid } from "nanoid";
+
+import "react-toastify/dist/ReactToastify.css";
+import "./react-confirm-alert.css";
+
+import Home from "./views/Home";
+import GameView from "./views/GameView";
+import SessionView from "./views/SessionView";
+import AuthView from "./views/AuthView";
+
+const MainRoute = () => {
+  return (
+    <Switch>
+      <Route path="/game/:gameId/session/" exact>
+        {({
+          match: {
+            params: { gameId },
+          },
+        }) => {
+          // Redirect to new session id
+          return <Redirect to={`/game/${gameId}/session/${nanoid()}`} />;
+        }}
+      </Route>
+      <Route path="/game/:gameId/session/:room/">
+        <SessionView />
+      </Route>
+      <Route path="/game/:gameId?">
+        <GameView />
+      </Route>
+      <Route exact path="/login/:userHash/:token">
+        <AuthView />
+      </Route>
+      <Redirect from="/" to="/games/" exact />
+      <Route path="/">
+        <Home />
+      </Route>
+    </Switch>
+  );
+};
+
+export default MainRoute;