fix: loyalty levels fetch in rsc for mobile menu

fix: get loyalty level in rsc

fix: typo

.env.local.example

@@ -19,7 +19,7 @@ DESIGN_SYSTEM_ACCESS_TOKEN=""
 NEXTAUTH_REDIRECT_PROXY_URL="http://localhost:3000/api/web/auth"
 NEXTAUTH_SECRET=""
 REVALIDATE_SECRET=""
-SALESFORCE_PREFRENCE_BASE_URL="https://mc31njyvc80x-2b9wg-24jxcj5yq.pub.sfmc-content.com/disfelgm4fv"
+SALESFORCE_PREFERENCE_BASE_URL="https://cloud.emails.scandichotels.com/preference-center"
 
 SEAMLESS_LOGIN_DA="http://www.example.dk/updatelogin"
 SEAMLESS_LOGIN_DE="http://www.example.de/updatelogin"

components/Header/MainMenu/MyPagesMenu/index.tsx

@@ -24,6 +24,7 @@ export default function MyPagesMenu({
   membership,
   navigation,
   user,
+  membershipLevel,
 }: MyPagesMenuProps) {
   const intl = useIntl()
   const myPagesMenuRef = useRef<HTMLDivElement>(null)
@@ -57,6 +58,7 @@ export default function MyPagesMenu({
       {isMyPagesMenuOpen ? (
         <div className={styles.dropdown}>
           <MyPagesMenuContent
+            membershipLevel={membershipLevel}
             navigation={navigation}
             user={user}
             membership={membership}

components/Header/MainMenu/MyPagesMenuContent/index.tsx

@@ -2,9 +2,7 @@
 
 import { useIntl } from "react-intl"
 
-import { MembershipLevelEnum } from "@/constants/membershipLevels"
 import { logout } from "@/constants/routes/handleAuth"
-import { trpc } from "@/lib/trpc/client"
 
 import { ArrowRightIcon } from "@/components/Icons"
 import Divider from "@/components/TempDesignSystem/Divider"
@@ -23,18 +21,12 @@ export default function MyPagesMenuContent({
   navigation,
   toggleOpenStateFn,
   user,
+  membershipLevel,
 }: MyPagesMenuContentProps) {
   const intl = useIntl()
   const lang = useLang()
   const myPagesMenuContentRef = useTrapFocus()
 
-  const membershipLevel = trpc.contentstack.loyaltyLevels.byLevel.useQuery(
-    {
-      level: MembershipLevelEnum[membership?.membershipLevel!],
-    },
-    { enabled: !!membership?.membershipLevel }
-  ).data
-
   const membershipPoints = membership?.currentPoints
   const introClassName =
     membershipLevel && membershipPoints

components/Header/MainMenu/MyPagesMenuWrapper/index.tsx

@@ -1,3 +1,4 @@
+import { MembershipLevelEnum } from "@/constants/membershipLevels"
 import { myPages } from "@/constants/routes/myPages"
 import { serverClient } from "@/lib/trpc/server"
 
@@ -20,16 +21,24 @@ export default async function MyPagesMenuWrapper() {
     serverClient().user.safeMembershipLevel(),
   ])
 
+  const membershipLevel = membership?.membershipLevel
+    ? await serverClient().contentstack.loyaltyLevels.byLevel({
+        level: MembershipLevelEnum[membership.membershipLevel],
+      })
+    : null
+
   return (
     <>
       {user ? (
         <>
           <MyPagesMenu
+            membershipLevel={membershipLevel}
             membership={membership}
             navigation={myPagesNavigation}
             user={user}
           />
           <MyPagesMobileMenu
+            membershipLevel={membershipLevel}
             membership={membership}
             navigation={myPagesNavigation}
             user={user}

components/Header/MainMenu/MyPagesMobileMenu/index.tsx

@@ -20,6 +20,7 @@ import { DropdownTypeEnum } from "@/types/components/dropdown/dropdown"
 import type { MyPagesMenuProps } from "@/types/components/header/myPagesMenu"
 
 export default function MyPagesMobileMenu({
+  membershipLevel,
   membership,
   navigation,
   user,
@@ -62,6 +63,7 @@ export default function MyPagesMobileMenu({
           aria-label={intl.formatMessage({ id: "My pages menu" })}
         >
           <MyPagesMenuContent
+            membershipLevel={membershipLevel}
             membership={membership}
             navigation={navigation}
             user={user}

env/server.ts

@@ -47,7 +47,7 @@ export const env = createEnv({
       .default("false"),
     PUBLIC_URL: z.string().optional(),
     REVALIDATE_SECRET: z.string(),
-    SALESFORCE_PREFRENCE_BASE_URL: z.string(),
+    SALESFORCE_PREFERENCE_BASE_URL: z.string(),
     SEAMLESS_LOGIN_DA: z.string(),
     SEAMLESS_LOGIN_DE: z.string(),
     SEAMLESS_LOGIN_EN: z.string(),
@@ -105,7 +105,7 @@ export const env = createEnv({
     PRINT_QUERY: process.env.PRINT_QUERY,
     PUBLIC_URL: process.env.PUBLIC_URL,
     REVALIDATE_SECRET: process.env.REVALIDATE_SECRET,
-    SALESFORCE_PREFRENCE_BASE_URL: process.env.SALESFORCE_PREFRENCE_BASE_URL,
+    SALESFORCE_PREFERENCE_BASE_URL: process.env.SALESFORCE_PREFERENCE_BASE_URL,
     SEAMLESS_LOGIN_DA: process.env.SEAMLESS_LOGIN_DA,
     SEAMLESS_LOGIN_DE: process.env.SEAMLESS_LOGIN_DE,
     SEAMLESS_LOGIN_EN: process.env.SEAMLESS_LOGIN_EN,

lib/api/endpoints.ts

@@ -21,8 +21,6 @@ export namespace endpoints {
     upcomingStays = "booking/v1/Stays/future",
     rewards = `${profile}/reward`,
     tierRewards = `${profile}/TierRewards`,
-    intiateSaveCard = `${creditCards}/initiateSaveCard`,
-    deleteCreditCard = `${profile}/creditCards`,
     subscriberId = `${profile}/SubscriberId`,
   }
 }

next-env.d.ts

@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/app/building-your-application/configuring/typescript for more information.
+// see https://nextjs.org/docs/basic-features/typescript for more information.

server/routers/contentstack/loyaltyLevel/query.ts

@@ -31,6 +31,17 @@ const getAllLoyaltyLevelFailCounter = meter.createCounter(
   "trpc.contentstack.loyaltyLevel.all-fail"
 )
 
+const getByLevelLoyaltyLevelCounter = meter.createCounter(
+  "trpc.contentstack.loyaltyLevel.byLevel"
+)
+
+const getByLevelLoyaltyLevelSuccessCounter = meter.createCounter(
+  "trpc.contentstack.loyaltyLevel.byLevel-success"
+)
+const getByLevelLoyaltyLevelFailCounter = meter.createCounter(
+  "trpc.contentstack.loyaltyLevel.byLevel-fail"
+)
+
 export async function getAllLoyaltyLevels(ctx: Context) {
   getAllLoyaltyLevelCounter.add(1)
 
@@ -87,7 +98,9 @@ export async function getAllLoyaltyLevels(ctx: Context) {
 }
 
 export async function getLoyaltyLevel(ctx: Context, level_id: MembershipLevel) {
-  getAllLoyaltyLevelCounter.add(1)
+  getByLevelLoyaltyLevelCounter.add(1, {
+    query: JSON.stringify({ lang: ctx.lang, level_id }),
+  })
 
   const loyaltyLevelsConfigResponse = await request<LoyaltyLevelsResponse>(
     GetLoyaltyLevel,
@@ -103,10 +116,10 @@ export async function getLoyaltyLevel(ctx: Context, level_id: MembershipLevel) {
     !loyaltyLevelsConfigResponse.data ||
     !loyaltyLevelsConfigResponse.data.all_loyalty_level.items.length
   ) {
-    getAllLoyaltyLevelFailCounter.add(1)
+    getByLevelLoyaltyLevelFailCounter.add(1)
     const notFoundError = notFound(loyaltyLevelsConfigResponse)
     console.error(
-      "contentstack.loyaltyLevels not found error",
+      "contentstack.loyaltyLevel not found error",
       JSON.stringify({
         query: { lang: ctx.lang, level_id },
         error: { code: notFoundError.code },
@@ -119,10 +132,10 @@ export async function getLoyaltyLevel(ctx: Context, level_id: MembershipLevel) {
     loyaltyLevelsConfigResponse.data
   )
   if (!validatedLoyaltyLevels.success) {
-    getAllLoyaltyLevelFailCounter.add(1)
+    getByLevelLoyaltyLevelFailCounter.add(1)
     console.error(validatedLoyaltyLevels.error)
     console.error(
-      "contentstack.rewards validation error",
+      "contentstack.loyaltyLevel validation error",
       JSON.stringify({
         query: { lang: ctx.lang, level_id },
         error: validatedLoyaltyLevels.error,
@@ -131,7 +144,7 @@ export async function getLoyaltyLevel(ctx: Context, level_id: MembershipLevel) {
     return null
   }
 
-  getAllLoyaltyLevelSuccessCounter.add(1)
+  getByLevelLoyaltyLevelSuccessCounter.add(1)
   return validatedLoyaltyLevels.data[0]
 }
 

server/routers/user/mutation.ts

@@ -197,7 +197,7 @@ export const userMutationRouter = router({
 
       return null
     }
-    const preferencesLink = new URL(env.SALESFORCE_PREFRENCE_BASE_URL)
+    const preferencesLink = new URL(env.SALESFORCE_PREFERENCE_BASE_URL)
     preferencesLink.searchParams.set("subKey", validatedData.data.subscriberId)
 
     generatePreferencesLinkSuccessCounter.add(1)

types/components/header/myPagesMenu.ts

@@ -3,6 +3,7 @@ import { navigationQueryRouter } from "@/server/routers/contentstack/myPages/nav
 import { FriendsMembership } from "@/utils/user"
 
 import type { User } from "@/types/user"
+import type { LoyaltyLevel } from "@/server/routers/contentstack/loyaltyLevel/output"
 
 type MyPagesNavigation = Awaited<
   ReturnType<(typeof navigationQueryRouter)["get"]>
@@ -12,6 +13,7 @@ export interface MyPagesMenuProps {
   navigation: MyPagesNavigation
   user: Pick<User, "firstName" | "lastName">
   membership?: FriendsMembership | null
+  membershipLevel: LoyaltyLevel | null
 }
 
 export interface MyPagesMenuContentProps extends MyPagesMenuProps {