Navbar: do not select the first value on unknown id (#2403)

resolves #2401 Co-authored-by: Fred Lefévère-Laoide <[email protected]>
Avaiga · Jan 17, 2025 · 1632da3 · 1632da3
1 parent f64ab3c
commit 1632da3
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 9 deletions.
diff --git a/frontend/taipy-gui/src/components/Taipy/NavBar.spec.tsx b/frontend/taipy-gui/src/components/Taipy/NavBar.spec.tsx
@@ -53,18 +53,18 @@ describe("NavBar Component", () => {
     });
     it("is disabled", async () => {
         const { getAllByRole } = render(<BrowserRouter><NavBar lov={lov} active={false} /></BrowserRouter>);
-        const elts = getAllByRole("tab");
-        elts.forEach(elt => expect(elt).toBeDisabled());
+        const tabElements = getAllByRole("tab");
+        tabElements.forEach(elt => expect(elt).toBeDisabled());
     });
     it("is enabled by default", async () => {
         const { getAllByRole } = render(<BrowserRouter><NavBar lov={lov} /></BrowserRouter>);
-        const elts = getAllByRole("tab");
-        elts.forEach(elt => expect(elt).not.toBeDisabled());
+        const tabElements = getAllByRole("tab");
+        tabElements.forEach(elt => expect(elt).not.toBeDisabled());
     });
     it("is enabled by active", async () => {
         const { getAllByRole } = render(<BrowserRouter><NavBar lov={lov} active={true} /></BrowserRouter>);
-        const elts = getAllByRole("tab");
-        elts.forEach(elt => expect(elt).not.toBeDisabled());
+        const tabElements = getAllByRole("tab");
+        tabElements.forEach(elt => expect(elt).not.toBeDisabled());
     });
     it("dispatch a well formed message", async () => {
         const focusSpy = jest.fn()

diff --git a/frontend/taipy-gui/src/components/Taipy/NavBar.tsx b/frontend/taipy-gui/src/components/Taipy/NavBar.tsx
@@ -66,9 +66,7 @@ const NavBar = (props: LovProps) => {
         [state.locations, navigate]
     );
 
-    const selectedVal =
-        lov.find((it) => getBaseURL() + it.id.substring(1) === location.pathname)?.id ||
-        (lov.length ? lov[0].id : false);
+    const selectedVal = lov.find((it) => getBaseURL() + it.id.substring(1) === location.pathname)?.id || "";
 
     return isMobile ? (
         <Tooltip title={hover || ""}>