feat: enhance OTP service logic, improve planner overlay, and update NavBar styles

2 files changed, 16 insertions, 4 deletions

diff --git a/src/frontend/app/components/layout/NavBar.module.css b/src/frontend/app/components/layout/NavBar.module.css
index ddace40..19d0a93 100644
--- a/src/frontend/app/components/layout/NavBar.module.css
+++ b/src/frontend/app/components/layout/NavBar.module.css
@@ -5,7 +5,6 @@
   padding: 0.5rem 0;
 
   background-color: var(--background-color);
-  border-top: 1px solid var(--border-color);
 
   max-width: 48rem;
   margin-inline: auto;
diff --git a/src/frontend/app/components/layout/NavBar.tsx b/src/frontend/app/components/layout/NavBar.tsx
index 69b3a63..9c42987 100644
--- a/src/frontend/app/components/layout/NavBar.tsx
+++ b/src/frontend/app/components/layout/NavBar.tsx
@@ -1,7 +1,8 @@
 import { Home, Map, Navigation2, Route } from "lucide-react";
 import type { LngLatLike } from "maplibre-gl";
 import { useTranslation } from "react-i18next";
-import { Link, useLocation } from "react-router";
+import { Link, useLocation, useNavigate } from "react-router";
+import { usePlanner } from "~/hooks/usePlanner";
 import { useApp } from "../../AppContext";
 import styles from "./NavBar.module.css";
 
@@ -28,6 +29,8 @@ export default function NavBar({ orientation = "horizontal" }: NavBarProps) {
   const { t } = useTranslation();
   const { mapState, updateMapState, mapPositionMode } = useApp();
   const location = useLocation();
+  const navigate = useNavigate();
+  const { deselectItinerary } = usePlanner();
 
   const navItems = [
     {
@@ -94,8 +97,18 @@ export default function NavBar({ orientation = "horizontal" }: NavBarProps) {
           <Link
             key={item.name}
             to={item.path}
-            className={`${styles.link} ${isActive ? styles.active : ""}`}
-            onClick={item.callback ? item.callback : undefined}
+            className={`${styles.link} ${isActive ? styles.active : ""}${item.path === "/planner" ? " planner-nav-link" : ""}`}
+            onClick={(e) => {
+              if (
+                item.path === "/planner" &&
+                location.pathname === "/planner"
+              ) {
+                deselectItinerary();
+                window.location.reload();
+              } else if (item.callback) {
+                item.callback();
+              }
+            }}
             title={item.name}
             aria-label={item.name}
           >