Fix for dynamic routes with app router SSR

components/AppShell.tsx

@@ -1,29 +1,29 @@
 'use client';
 import { IonApp, IonRouterOutlet, setupIonicReact } from '@ionic/react';
 import { StatusBar, Style } from '@capacitor/status-bar';
-
 import { IonReactRouter } from '@ionic/react-router';
-import { Redirect, Route } from 'react-router-dom';
+import { Route } from 'react-router-dom';
 
 import Tabs from './pages/Tabs';
 
 setupIonicReact({});
 
-window.matchMedia('(prefers-color-scheme: dark)').addListener(async status => {
-  try {
-    await StatusBar.setStyle({
-      style: status.matches ? Style.Dark : Style.Light,
-    });
-  } catch {}
-});
+window
+  .matchMedia('(prefers-color-scheme: dark)')
+  .addEventListener('change', async status => {
+    try {
+      await StatusBar.setStyle({
+        style: status.matches ? Style.Dark : Style.Light,
+      });
+    } catch {}
+  });
 
 const AppShell = () => {
   return (
     <IonApp>
       <IonReactRouter>
         <IonRouterOutlet id="main">
-          <Route path="/tabs" render={() => <Tabs />} />
-          <Route path="/" render={() => <Redirect to="/tabs/feed" />} exact={true} />
+          <Route path="/" render={() => <Tabs />} />
         </IonRouterOutlet>
       </IonReactRouter>
     </IonApp>