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
/>