feat: client-side trip tracking with browser notifications (#151)

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: arielcostas <94913521+arielcostas@users.noreply.github.com>

1 files changed, 6 insertions, 0 deletions

diff --git a/src/frontend/app/components/layout/AppShell.tsx b/src/frontend/app/components/layout/AppShell.tsx
index 50f5742..6bb5e34 100644
--- a/src/frontend/app/components/layout/AppShell.tsx
+++ b/src/frontend/app/components/layout/AppShell.tsx
@@ -4,6 +4,8 @@ import {
   PageTitleProvider,
   usePageTitleContext,
 } from "~/contexts/PageTitleContext";
+import { ActiveJourneyBanner } from "~/components/journey/ActiveJourneyBanner";
+import { useJourneyTracker } from "~/hooks/useJourneyTracker";
 import { ThemeColorManager } from "../ThemeColorManager";
 import "./AppShell.css";
 import { Drawer } from "./Drawer";
@@ -15,6 +17,9 @@ const AppShellContent: React.FC = () => {
   const [isDrawerOpen, setIsDrawerOpen] = useState(false);
   const location = useLocation();
 
+  // Mount journey tracker at shell level so tracking persists across navigation
+  useJourneyTracker();
+
   return (
     <div className="app-shell">
       <ThemeColorManager />
@@ -29,6 +34,7 @@ const AppShellContent: React.FC = () => {
           <Outlet key={location.pathname} />
         </main>
       </div>
+      <ActiveJourneyBanner />
       <footer className="app-shell__bottom-nav">
         <NavBar />
       </footer>