Merged in feature/hardcoded-mypages-links (pull request #1325)

Feature/hardcoded mypages links * feat: wip use hardcoded links * Merge branch 'master' of bitbucket.org:scandic-swap/web into feature/hardcoded-mypages-links * feat: use hardcoded links for my pages to support dynamic links * cleanup * code fixes * refactor: restructure MyPagesMobileDropdown component for improved readability * use util timeout function Approved-by: Christian Andolf Approved-by: Linus Flood
2025-02-13 09:28:30 +00:00
parent eabe45b73c
commit 6f51130e48
30 changed files with 500 additions and 556 deletions
@@ -1,8 +1,9 @@
-import { Fragment } from "react"
-
 import { logout } from "@/constants/routes/handleAuth"
-import { getMyPagesNavigation } from "@/lib/trpc/memoizedRequests"

+import {
+  getPrimaryLinks,
+  getSecondaryLinks,
+} from "@/components/MyPages/menuItems"
 import Divider from "@/components/TempDesignSystem/Divider"
 import Link from "@/components/TempDesignSystem/Link"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
@@ -12,50 +13,85 @@ import { getLang } from "@/i18n/serverContext"
 import styles from "./sidebar.module.css"

 export default async function SidebarMyPages() {
-  const navigation = await getMyPagesNavigation()
  const intl = await getIntl()

  return (
    <aside className={styles.sidebar}>
      <nav className={styles.nav}>
        <Subtitle type="two" color="baseTextHighContrast">
-          {navigation?.title}
+          {intl.formatMessage({ id: "My pages" })}
        </Subtitle>
-        {navigation?.menuItems.map((menuItem, idx) => (
-          <Fragment key={`${menuItem.display_sign_out_link}-${idx}`}>
-            <Divider color="beige" />
-            <ul className={styles.list}>
-              {menuItem.links.map((link) => (
-                <li key={link.uid}>
-                  <Link
-                    color="burgundy"
-                    href={link.originalUrl || link.url}
-                    partialMatch
-                    prefetch={true}
-                    size={menuItem.display_sign_out_link ? "small" : "regular"}
-                    variant="sidebar"
-                  >
-                    {link.linkText}
-                  </Link>
-                </li>
-              ))}
-              {menuItem.display_sign_out_link ? (
-                <li>
-                  <Link
-                    color="burgundy"
-                    href={logout[getLang()]}
-                    prefetch={false}
-                    size="small"
-                    variant="sidebar"
-                  >
-                    {intl.formatMessage({ id: "Log out" })}
-                  </Link>
-                </li>
-              ) : null}
-            </ul>
-          </Fragment>
-        ))}
+
+        <PrimaryLinks />
+        <SecondaryLinks />
      </nav>
    </aside>
  )
 }
+
+async function PrimaryLinks() {
+  const lang = getLang()
+  const links = await getPrimaryLinks({ lang })
+
+  return (
+    <>
+      <Divider color="beige" />
+      <ul className={styles.list}>
+        {links.map((link) => (
+          <li key={link.href}>
+            <Link
+              color="burgundy"
+              href={link.href}
+              partialMatch
+              prefetch={true}
+              size={"regular"}
+              variant="sidebar"
+            >
+              {link.text}
+            </Link>
+          </li>
+        ))}
+      </ul>
+    </>
+  )
+}
+
+async function SecondaryLinks() {
+  const lang = getLang()
+  const links = await getSecondaryLinks({ lang })
+  const intl = await getIntl()
+
+  return (
+    <>
+      <Divider color="beige" />
+      <ul className={styles.list}>
+        {links.map((link) => (
+          <li key={link.href}>
+            <Link
+              color="burgundy"
+              href={link.href}
+              partialMatch
+              prefetch={true}
+              size={"small"}
+              variant="sidebar"
+            >
+              {link.text}
+            </Link>
+          </li>
+        ))}
+        <li>
+          <Link
+            color="burgundy"
+            href={logout[lang]}
+            partialMatch
+            prefetch={false}
+            size={"small"}
+            variant="sidebar"
+          >
+            {intl.formatMessage({ id: "Log out" })}
+          </Link>
+        </li>
+      </ul>
+    </>
+  )
+}
@@ -0,0 +1,101 @@
+import * as routes from "@/constants/routes/myPages"
+import { env } from "@/env/server"
+
+import { getIntl } from "@/i18n"
+import { safeTry } from "@/utils/safeTry"
+
+import type { ReactNode } from "react"
+
+import type { Lang } from "../../constants/languages"
+
+export type MyPagesLink = {
+  text: ReactNode
+  href: string
+}
+
+type Args = {
+  lang: Lang
+}
+
+export async function getPrimaryLinks({ lang }: Args): Promise<MyPagesLink[]> {
+  const intl = await getIntl()
+  const scandicSasPromise = safeTry(isScandicXSASActive())
+  const teamMemberPromise = safeTry(showTeamMemberCard())
+
+  const [showSASLink] = await scandicSasPromise
+  const [showTeamMemberLink] = await teamMemberPromise
+
+  const menuItems: MyPagesLink[] = [
+    {
+      text: intl.formatMessage({ id: "Overview" }),
+      href: routes.overview[lang],
+    },
+    {
+      text: intl.formatMessage({ id: "My Points" }),
+      href: routes.points[lang],
+    },
+    {
+      text: intl.formatMessage({ id: "My Stays" }),
+      href: routes.stays[lang],
+    },
+    {
+      text: intl.formatMessage({ id: "My Benefits" }),
+      href: routes.benefits[lang],
+    },
+  ]
+
+  if (showSASLink) {
+    menuItems.push({
+      text: intl.formatMessage({ id: "Scandic ♥ SAS" }),
+      href: routes.scandicXSAS[lang],
+    })
+  }
+
+  if (showTeamMemberLink) {
+    menuItems.push({
+      text: intl.formatMessage({ id: "Team Member Card" }),
+      href: "#",
+    })
+  }
+
+  return menuItems
+}
+
+export async function getSecondaryLinks({
+  lang,
+}: Args): Promise<MyPagesLink[]> {
+  const intl = await getIntl()
+  const menuItems: MyPagesLink[] = [
+    {
+      text: intl.formatMessage({ id: "About Scandic Friends" }),
+      href: routes.scandicFriends[lang],
+    },
+    {
+      text: intl.formatMessage({ id: "My Profile" }),
+      href: routes.profile[lang],
+    },
+  ]
+
+  return menuItems
+}
+
+async function isScandicXSASActive() {
+  async function checkIfLinked() {
+    // TODO: Implement this check
+    return true
+  }
+
+  const isLinked = await checkIfLinked()
+
+  return env.SAS_ENABLED && isLinked
+}
+
+async function showTeamMemberCard() {
+  async function getIsTeamMember() {
+    // TODO: Implement this check
+    return false
+  }
+
+  const isTeamMember = await getIsTeamMember()
+  return isTeamMember
+}