scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat/SW-3108 external links

Browse Source 
* 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
Download Patch File Download Diff File Expand all files Collapse all files

10
apps/scandic-web/components/Header/MainMenu/NavigationMenu/MegaMenu/index.tsx
View File

@@ -56,9 +56,9 @@ export default function MegaMenu({
) : null}
<div className={styles.megaMenuContent}>
<div className={styles.seeAllLink}>
{seeAllLink?.link ? (
{seeAllLink?.url ? (
<Link
href={seeAllLink.link.url}
href={seeAllLink.url}
variant="icon"
weight="bold"
onClick={handleNavigate}
@@ -75,11 +75,11 @@ export default function MegaMenu({
<span className={styles.submenuTitle}>{item.title}</span>
</Typography>
<ul className={styles.submenu}>
{item.links.map(({ title, link }) =>
link ? (
{item.links.map(({ title, url }) =>
url ? (
<li key={title} className={styles.submenuItem}>
<Link
href={link.url}
href={url}
variant="menu"
className={styles.link}
onClick={handleNavigate}

96
apps/scandic-web/components/Header/MainMenu/NavigationMenu/NavigationMenuItem/index.tsx
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
}

4
apps/scandic-web/components/Header/TopLink/index.tsx
View File

@@ -11,13 +11,13 @@ export default function TopLink({
}: TopLinkProps) {
const linkData = isLoggedIn ? topLink.logged_in : topLink.logged_out
if (!linkData?.link?.url || !linkData?.title) {
if (!linkData?.url || !linkData?.title) {
return null
}
return (
<HeaderLink
href={linkData.link.url}
href={linkData.url}
iconName={linkData.icon || IconName.Gift}
iconSize={iconSize}
>