fix: refactor tracking requests

components/ContentType/LoyaltyPage/LoyaltyPage.tsx

@@ -11,14 +11,14 @@ import styles from "./loyaltyPage.module.css"
 import type { LangParams } from "@/types/params"
 
 export default async function LoyaltyPage({ lang }: LangParams) {
-  const loyaltyPage = await serverClient().contentstack.loyaltyPage.get()
+  const loyaltyPageRes = await serverClient().contentstack.loyaltyPage.get()
 
-  if (!loyaltyPage) {
+  if (!loyaltyPageRes) {
     return null
   }
 
-  const loyaltyPageTracking = serverClient().contentstack.loyaltyPage.tracking()
-  const userTracking = serverClient().user.tracking()
+  const { tracking, loyaltyPage } = loyaltyPageRes
+
   return (
     <section className={styles.content}>
       {loyaltyPage.sidebar.length ? (
@@ -31,10 +31,7 @@ export default async function LoyaltyPage({ lang }: LangParams) {
           <Blocks blocks={loyaltyPage.blocks} lang={lang} />
         ) : null}
       </MaxWidth>
-      <TrackingSDK
-        pageDataPromise={loyaltyPageTracking}
-        userDataPromise={userTracking}
-      />
+      <TrackingSDK pageData={tracking} />
     </section>
   )
 }

components/ContentType/Webviews/AccountPage.tsx

@@ -14,14 +14,13 @@ import styles from "./accountPage.module.css"
 import { LangParams } from "@/types/params"
 
 export default async function MyPages({ lang }: LangParams) {
-  const accountPage = await serverClient().contentstack.accountPage.get()
+  const accountPageRes = await serverClient().contentstack.accountPage.get()
 
-  if (!accountPage) {
+  if (!accountPageRes) {
     return null
   }
 
-  const accountPageTracking = serverClient().contentstack.accountPage.tracking()
-  const userTrackingData = serverClient().user.tracking()
+  const { tracking, accountPage } = accountPageRes
 
   const linkToOverview = `/${lang}/webview${accountPage.url}` !== overview[lang]
 
@@ -29,10 +28,7 @@ export default async function MyPages({ lang }: LangParams) {
     <MaxWidth className={styles.blocks} tag="main">
       {linkToOverview ? <LinkToOverview lang={lang} /> : null}
       <Content lang={lang} content={accountPage.content} />
-      <TrackingSDK
-        pageDataPromise={accountPageTracking}
-        userDataPromise={userTrackingData}
-      />
+      <TrackingSDK pageData={tracking} />
     </MaxWidth>
   )
 }

components/ContentType/Webviews/LoyaltyPage.tsx

@@ -11,15 +11,13 @@ import styles from "./loyaltyPage.module.css"
 import { LangParams } from "@/types/params"
 
 export default async function AboutScandicFriends({ lang }: LangParams) {
-  const loyaltyPage = await serverClient().contentstack.loyaltyPage.get()
+  const loyaltyPageRes = await serverClient().contentstack.loyaltyPage.get()
 
-  if (!loyaltyPage) {
+  if (!loyaltyPageRes) {
     return null
   }
 
-  const loyaltyPageTracking = serverClient().contentstack.loyaltyPage.tracking()
-  const userTrackingData = serverClient().user.tracking()
-
+  const { tracking, loyaltyPage } = loyaltyPageRes
   return (
     <section className={styles.content}>
       <LinkToOverview lang={lang} />
@@ -27,10 +25,7 @@ export default async function AboutScandicFriends({ lang }: LangParams) {
         <Title>{loyaltyPage.heading}</Title>
         <Blocks blocks={loyaltyPage.blocks} lang={lang} />
       </MaxWidth>
-      <TrackingSDK
-        pageDataPromise={loyaltyPageTracking}
-        userDataPromise={userTrackingData}
-      />
+      <TrackingSDK pageData={tracking} />
     </section>
   )
 }

components/TrackingSDK/index.tsx

@@ -1,16 +1,19 @@
+import { serverClient } from "@/lib/trpc/server"
+
 import TrackingSDKClient from "./Client"
 
-import { TrackingSDKProps } from "@/types/components/tracking"
+import { TrackingSDKPageData } from "@/types/components/tracking"
+
+export const preloadUserTracking = () => {
+  void serverClient().user.tracking()
+}
 
 export default async function TrackingSDK({
-  pageDataPromise,
-  userDataPromise,
+  pageData,
 }: {
-  pageDataPromise: Promise<TrackingSDKProps["pageData"]>
-  userDataPromise: Promise<TrackingSDKProps["userData"]>
+  pageData: TrackingSDKPageData
 }) {
-  const pageData = await pageDataPromise
-  const userData = await userDataPromise
+  const userTrackingData = await serverClient().user.tracking()
 
-  return <TrackingSDKClient pageData={pageData} userData={userData} />
+  return <TrackingSDKClient pageData={pageData} userData={userTrackingData} />
 }