update

src/App.test.tsx

@@ -3,13 +3,15 @@ import { Provider } from "react-redux";
 import App from "./App";
 import "@testing-library/jest-dom";
 import { createStore } from "./store";
-
-test("renders learn react link", async () => {
+import { MemoryRouter } from "react-router-dom";
+test("renders", async () => {
   const store = createStore();
 
   render(
     <Provider store={store}>
-      <App />
+      <MemoryRouter>
+        <App />
+      </MemoryRouter>
     </Provider>,
   );
 

src/App.tsx

@@ -1,7 +1,6 @@
 import styled from "@emotion/styled";
 import Footer from "./Footer";
 import WebHeader from "./header/web/Header";
-import { BrowserRouter, MemoryRouter } from "react-router-dom";
 import AppHeader from "./header/app/Header";
 import Routes from "./Routes";
 import HeaderRoutes from "./header/web/HeaderRoutes";
@@ -50,11 +49,8 @@ const Main = styled.main`
 `;
 
 function App() {
-  // Disable iOS swipe navigation when installed
-  const Router = isInstalled() ? MemoryRouter : BrowserRouter;
-
   return (
-    <Router>
+    <>
       <Global
         styles={css`
           :root {
@@ -85,7 +81,7 @@ function App() {
           <Footer />
         </AppContents>
       </AppContainer>
-    </Router>
+    </>
   );
 }
 

src/index.tsx

@@ -7,6 +7,9 @@ import "./setupViewport";
 import "./i18n";
 
 import { createRoot } from "react-dom/client";
+import { BrowserRouter } from "react-router-dom";
+import { isInstalled } from "./helpers/device";
+import { MemoryRouter } from "react-router-dom";
 
 const globalStyles = css`
   :root {
@@ -87,11 +90,17 @@ const globalStyles = css`
 
 const rootNode = document.getElementById("root");
 const root = createRoot(rootNode!);
+
+// Disable iOS swipe navigation when installed
+const Router = isInstalled() ? MemoryRouter : BrowserRouter;
+
 root.render(
   <>
     <Global styles={globalStyles} />
     <Provider store={store}>
-      <App />
+      <Router>
+        <App />
+      </Router>
     </Provider>
   </>,
 );