feat/SW-3108 external links

* feat(SW-3108): Added external link options to shortcuts
* feat(SW-3108): Added external link options to header

Approved-by: Matilda Landström
This commit is contained in:
Erik Tiekstra
2025-08-28 07:25:17 +00:00
parent 1a10afdbad
commit fd48f86c90
8 changed files with 213 additions and 98 deletions

View File

@@ -42,52 +42,58 @@ export default function MenuItem({ item, isMobile }: NavigationMenuItemProps) {
}
}
return submenu.length ? (
<>
<MainMenuButton
onClick={() => toggleMegaMenu(megaMenuTitle)}
if (submenu.length) {
return (
<>
<MainMenuButton
onClick={() => toggleMegaMenu(megaMenuTitle)}
className={`${styles.navigationMenuItem} ${isMobile ? styles.mobile : ""}`}
>
{title}
{isMobile ? (
<MaterialIcon
icon="arrow_forward_ios"
size={20}
className={`${styles.chevron}`}
color="Icon/Interactive/Accent"
/>
) : (
<MaterialIcon
icon="keyboard_arrow_down"
size={20}
className={`${styles.chevron} ${isMegaMenuOpen ? styles.isExpanded : ""}`}
color="Icon/Interactive/Accent"
/>
)}
</MainMenuButton>
<div
ref={megaMenuRef}
className={`${styles.dropdown} ${isMegaMenuOpen ? styles.isExpanded : ""}`}
>
<MegaMenu
isMobile={isMobile}
title={title}
seeAllLink={seeAllLink}
submenu={submenu}
card={card}
isOpen={isMegaMenuOpen}
/>
</div>
</>
)
} else if (link?.url) {
return (
<Link
className={`${styles.navigationMenuItem} ${isMobile ? styles.mobile : ""}`}
variant="navigation"
weight="bold"
onClick={handleNavigate}
href={link.url}
>
{title}
{isMobile ? (
<MaterialIcon
icon="arrow_forward_ios"
size={20}
className={`${styles.chevron}`}
color="Icon/Interactive/Accent"
/>
) : (
<MaterialIcon
icon="keyboard_arrow_down"
size={20}
className={`${styles.chevron} ${isMegaMenuOpen ? styles.isExpanded : ""}`}
color="Icon/Interactive/Accent"
/>
)}
</MainMenuButton>
<div
ref={megaMenuRef}
className={`${styles.dropdown} ${isMegaMenuOpen ? styles.isExpanded : ""}`}
>
<MegaMenu
isMobile={isMobile}
title={title}
seeAllLink={seeAllLink}
submenu={submenu}
card={card}
isOpen={isMegaMenuOpen}
/>
</div>
</>
) : (
<Link
className={`${styles.navigationMenuItem} ${isMobile ? styles.mobile : ""}`}
variant="navigation"
weight="bold"
onClick={handleNavigate}
href={link!.url}
>
{title}
</Link>
)
</Link>
)
}
return null
}