feat(SW-187): Fixed toggling issue

This commit is contained in:
Pontus Dreij
2024-09-11 10:18:39 +02:00
parent 84fb10aa2c
commit 76c7cfa6f0
3 changed files with 15 additions and 10 deletions

View File

@@ -24,11 +24,16 @@ export default function MobileMenu({
}: MobileMenuProps) { }: MobileMenuProps) {
const intl = useIntl() const intl = useIntl()
const { toggleDropdown, openDropdown } = useDropdownStore() const { toggleDropdown, openDropdown } = useDropdownStore()
const isHamburgerMenuOpen = openDropdown === DropdownType.HamburgerMenu const isHamburgerMenuOpen =
openDropdown === DropdownType.HamburgerMenu ||
openDropdown === DropdownType.HeaderLanguageMobile
const isMyPagesMobileMenuOpen = const isMyPagesMobileMenuOpen =
openDropdown === DropdownType.MyPagesMobileMenu openDropdown === DropdownType.MyPagesMobileMenu
const isHeaderLanguageSwitcherOpen = const isHeaderLanguageSwitcherOpen =
openDropdown === DropdownType.HeaderLanguageMobile openDropdown === DropdownType.HeaderLanguageMobile
const isFooterLanguageSwitcherOpen =
openDropdown === DropdownType.FooterLanguage
useHandleKeyUp((event: KeyboardEvent) => { useHandleKeyUp((event: KeyboardEvent) => {
if (event.key === "Escape" && isHamburgerMenuOpen) { if (event.key === "Escape" && isHamburgerMenuOpen) {
@@ -43,8 +48,11 @@ export default function MobileMenu({
if (isHeaderLanguageSwitcherOpen) { if (isHeaderLanguageSwitcherOpen) {
toggleDropdown(DropdownType.HeaderLanguageMobile) toggleDropdown(DropdownType.HeaderLanguageMobile)
} }
if (!isFooterLanguageSwitcherOpen) {
toggleDropdown(DropdownType.HamburgerMenu) toggleDropdown(DropdownType.HamburgerMenu)
} else {
toggleDropdown(DropdownType.FooterLanguage)
}
} }
} }
@@ -52,7 +60,7 @@ export default function MobileMenu({
<> <>
<button <button
type="button" type="button"
className={`${styles.hamburger} ${isHamburgerMenuOpen || isMyPagesMobileMenuOpen ? styles.isExpanded : ""}`} className={`${styles.hamburger} ${isHamburgerMenuOpen || isMyPagesMobileMenuOpen || isFooterLanguageSwitcherOpen ? styles.isExpanded : ""}`}
aria-label={intl.formatMessage({ aria-label={intl.formatMessage({
id: isHamburgerMenuOpen ? "Close menu" : "Open menu", id: isHamburgerMenuOpen ? "Close menu" : "Open menu",
})} })}

View File

@@ -26,9 +26,7 @@ export default function LanguageSwitcherContent({
const languageSwitcherRef = useTrapFocus() const languageSwitcherRef = useTrapFocus()
const urlKeys = Object.keys(urls) as Lang[] const urlKeys = Object.keys(urls) as Lang[]
const position = const position =
type === "footer" type === "footer" ? DropdownType.FooterLanguage : DropdownType.HamburgerMenu
? DropdownType.FooterLanguage
: DropdownType.HeaderLanguage
return ( return (
<div className={styles.languageSwitcherContent} ref={languageSwitcherRef}> <div className={styles.languageSwitcherContent} ref={languageSwitcherRef}>

View File

@@ -7,7 +7,6 @@ import { removeMultipleSlashes } from "@/utils/url"
import { imageVaultAssetTransformedSchema } from "../schemas/imageVault" import { imageVaultAssetTransformedSchema } from "../schemas/imageVault"
import { Image } from "@/types/image" import { Image } from "@/types/image"
import { PageLinkEnum } from "@/types/requests/pageLinks"
// Help me write this zod schema based on the type ContactConfig // Help me write this zod schema based on the type ContactConfig
export const validateContactConfigSchema = z.object({ export const validateContactConfigSchema = z.object({
@@ -310,7 +309,7 @@ const validateInternalLink = z
const lang = node.system.locale const lang = node.system.locale
return { return {
url: originalUrl || removeMultipleSlashes(`/${lang}/${url}`), url: originalUrl ?? removeMultipleSlashes(`/${lang}/${url}`),
title: node.title, title: node.title,
} }
}) })
@@ -500,7 +499,7 @@ const cardButtonSchema = z
const href = const href =
isContentstackLink && externalLink.href isContentstackLink && externalLink.href
? externalLink.href ? externalLink.href
: linkConnectionData?.href || "" : linkConnectionData?.href ?? ""
return { return {
openInNewTab: data.open_in_new_tab, openInNewTab: data.open_in_new_tab,