Skip to content

Commit 9b9e2d1

Browse files
chiptusclaude
andauthored
fix(nav): keep tab active on nested routes (#117)
Fixes #26 Mobile tab active-state used exact route matching, so tabs lost their highlight on descendant routes. Adds `fuzzy: true` to `useMatchRoute` so parent tabs stay highlighted on nested routes, matching the desktop `Link`'s existing behavior. ## Verification - Navigate to a set detail page (`.../sets/$setSlug`) on mobile; the Sets tab stays highlighted. - Navigate to `.../schedule/timeline` or `.../schedule/list` on mobile; the Schedule tab stays highlighted. - Switch between tabs (Sets, Schedule, Map, Info, Social, Explore); exactly one tab is highlighted at a time, no cross-activation. - Desktop tab bar behavior is unchanged (still uses `Link activeProps`). --- _Generated by [Claude Code](https://claude.ai/code/session_014iiisPt8nyYMGcYfh9p5yo)_ Co-authored-by: Claude <noreply@anthropic.com>
1 parent a2f71ba commit 9b9e2d1

1 file changed

Lines changed: 1 addition & 1 deletion

File tree

src/pages/EditionView/TabNavigation/MobileTabButton.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ export function MobileTabButton({ config }: TabButtonProps) {
1515
from: "/festivals/$festivalSlug/editions/$editionSlug",
1616
});
1717
const matchRoute = useMatchRoute();
18-
const isActive = !!matchRoute({ to: tabRoutes[config.key] });
18+
const isActive = !!matchRoute({ to: tabRoutes[config.key], fuzzy: true });
1919

2020
return (
2121
<Link

0 commit comments

Comments
 (0)