Files
web/components/Current/Header/MyPagesMobileDropdown/index.tsx

70 lines
2.3 KiB
TypeScript

import { Fragment } from "react"
import { Lang } from "@/constants/languages"
import { logout } from "@/constants/routes/handleAuth"
import { serverClient } from "@/lib/trpc/server"
import Divider from "@/components/TempDesignSystem/Divider"
import Link from "@/components/TempDesignSystem/Link"
import Title from "@/components/TempDesignSystem/Text/Title"
import styles from "./my-pages-mobile-dropdown.module.css"
export default async function MyPagesMobileDropdown({
lang,
}: {
lang: Lang | null
}) {
const navigation = await serverClient().contentstack.myPages.navigation.get()
if (!navigation) {
return null
}
return (
<nav
className={`${styles.navigationMenu} ${/*isMyPagesMenuOpen*/ true ? styles.navigationMenuIsOpen : ""}`}
>
<Title className={styles.heading} textTransform="capitalize" level="h5">
{navigation.title}
</Title>
{navigation.menuItems.map((menuItem, idx) => (
<Fragment key={`${menuItem.display_sign_out_link}-${idx}`}>
{/*TODO: add pale color? */}
<Divider color="peach" />
<ul className={styles.dropdownWrapper}>
<ul className={styles.dropdownLinks}>
{menuItem.links.map((link) => (
<li key={link.uid}>
<Link
href={link.originalUrl || link.url}
partialMatch
size={menuItem.display_sign_out_link ? "small" : "regular"}
variant="myPage"
color="burgundy"
>
{/*TODO: add myPageMobileMenu variant */}
{link.linkText}
</Link>
</li>
))}
{/* {menuItem.display_sign_out_link ? ( */}
{/* <li> */}
{/* <Link */}
{/* color="burgundy" */}
{/* href={logout[lang]} */}
{/* prefetch={false} */}
{/* size="small" */}
{/* variant="sidebar" */}
{/* > */}
{/* {formatMessage({ id: "Log out" })} */}
{/* </Link> */}
{/* </li> */}
{/* ) : null} */}
</ul>
</ul>
</Fragment>
))}
</nav>
)
}