auto redirect from / to /servers on page load

amnet-web/src/main.tsx

@@ -1,20 +1,28 @@
 import './index.css'
 
-import {StrictMode} from 'react'
-import {createRoot} from 'react-dom/client'
-import {createHashRouter, RouterProvider} from "react-router-dom"
+import {StrictMode} from "react";
+import {createRoot} from "react-dom/client";
+import {createHashRouter, Navigate, RouterProvider} from "react-router-dom";
 
 import {Toaster} from "@/components/ui/toaster.tsx";
 import {ThemeProvider} from "@/components/theme-provider.tsx";
 
-import CardManager from "@/pages/card-manager.tsx"
-import ServerCardIn from "@/pages/card-in-screen.tsx"
-import ServerListing from "@/pages/server-listing.tsx"
+import CardManager from "@/pages/card-manager.tsx";
+import ServerCardIn from "@/pages/card-in-screen.tsx";
+import ServerListing from "@/pages/server-listing.tsx";
 
 // iOS PWAs show the navigation bar when changing routes
 // HashRouter doesn't have this issue as the URL never changes
 const router = createHashRouter([
-    ...['/', '/servers', '/servers/add'].map(x => {
+    {
+        path: '/',
+        element: <Navigate replace to="/servers"/>
+    },
+    {
+        path: '/servers/:serverId',
+        element: <ServerCardIn/>
+    },
+    ...['/servers', '/servers/add'].map(x => {
         return {
             path: x,
             element: <ServerListing/>
@@ -25,11 +33,7 @@ const router = createHashRouter([
             path: x,
             element: <CardManager/>
         };
-    }),
-    {
-        path: '/servers/:serverId',
-        element: <ServerCardIn/>
-    }
+    })
 ])
 
 createRoot(document.getElementById('root')!).render(