feat: add realtime GNSS monitor with telemetry websocket

frontend/src/routes/_layout.tsx

@@ -1,4 +1,9 @@
-import { createFileRoute, Outlet, redirect } from "@tanstack/react-router"
+import {
+  createFileRoute,
+  Outlet,
+  redirect,
+  useRouterState,
+} from "@tanstack/react-router"
 
 import { Footer } from "@/components/Common/Footer"
 import AppSidebar from "@/components/Sidebar/AppSidebar"
@@ -21,6 +26,11 @@ export const Route = createFileRoute("/_layout")({
 })
 
 function Layout() {
+  const pathname = useRouterState({
+    select: (state) => state.location.pathname,
+  })
+  const isGnssMonitorPage = pathname === "/gnss-monitor"
+
   return (
     <SidebarProvider>
       <AppSidebar />
@@ -29,7 +39,9 @@ function Layout() {
           <SidebarTrigger className="-ml-1 text-muted-foreground" />
         </header>
         <main className="flex-1 p-6 md:p-8">
-          <div className="mx-auto max-w-7xl">
+          <div
+            className={`mx-auto ${isGnssMonitorPage ? "max-w-none" : "max-w-7xl"}`}
+          >
             <Outlet />
           </div>
         </main>