diff --git a/src/components/Nav/MainNavLinks.tsx b/src/components/Nav/MainNavLinks.tsx index b40a7abff5..62bf0ddde3 100644 --- a/src/components/Nav/MainNavLinks.tsx +++ b/src/components/Nav/MainNavLinks.tsx @@ -15,6 +15,7 @@ type MainNavLinksProps = { hasJumpTo: boolean; handleToggle: () => void; isOpen: boolean; + currentPath: string; }; export const MainNavLinks = ({ @@ -26,6 +27,7 @@ export const MainNavLinks = ({ handleToggle, isOpen, hasJumpTo, + currentPath, }: MainNavLinksProps) => { if (!links || links?.length <= 0) return null; @@ -75,8 +77,10 @@ export const MainNavLinks = ({ {renderLogo()} diff --git a/src/components/Nav/NavPanels.tsx b/src/components/Nav/NavPanels.tsx index 05359f44e9..9be90bd097 100644 --- a/src/components/Nav/NavPanels.tsx +++ b/src/components/Nav/NavPanels.tsx @@ -14,6 +14,7 @@ interface NavPanelsProps { jumpToLabel: string; isHomepage: boolean; jumpToState: JumpToState | null; + currentPath: string; } /** @@ -30,6 +31,7 @@ export const NavPanels = (props: NavPanelsProps) => { mobileMenuLabel, jumpToLabel, jumpToState, + currentPath, } = props; const [isOpen, setIsOpen] = useState({ main: false, jump: false }); @@ -90,6 +92,7 @@ export const NavPanels = (props: NavPanelsProps) => { hasJumpTo={jumpToState !== null} isOpen={isOpen.main} handleToggle={handleMainNavToggle} + currentPath={currentPath} /> = { + "/events/": "/community/", + "/sketches/": "/community/", + "/libraries/": "/community/", + "/people/": "/about/", + "/code-of-conduct/": "/about/", + "/education-resources/": "/tutorials/", + "/donate/": "/contribute/" +}; + +// Check if the current URL matches the extra triggers +const extraPathTriggers = Object.keys(unmatchedPathMappings).find(trigger => + pathMinusLocale.startsWith(trigger) +); + +// Set the active path: use the mapping if found, otherwise fall back to the main links logic +const currentPath = extraPathTriggers + ? unmatchedPathMappings[extraPathTriggers] + : (mainLinks.find((link) => pathMinusLocale.startsWith(link.url))?.url ?? ""); + const editorButtonLabel = t("Start Coding"); const donateButtonLabel = t("Donate"); const mobileMenuLabel = t("Menu"); @@ -37,6 +58,7 @@ const jumpToLabel = t("Jump To"); mobileMenuLabel={mobileMenuLabel as string} jumpToLabel={jumpToLabel as string} jumpToState={jumpToState} + currentPath={currentPath} client:load />