chore(SW-303): fetch activity card from CS

components/ContentType/HotelPage/Facilities/mockData.ts

@@ -141,19 +141,4 @@ export const MOCK_FACILITIES: Facilities = [
       columnSpan: "one",
     },
   ],
-  [
-    {
-      id: "activities",
-      theme: "primaryDark",
-      scriptedTopTitle: "Activities",
-      heading: "Upcoming activities at DownTown Camper",
-      bodyText: "Lorem ipsum dolor sit amet, consectetur adipiscing elit",
-      secondaryButton: {
-        href: `?s=${activities[lang]}`,
-        title: "Discover activities",
-        isExternal: false,
-      },
-      columnSpan: "three",
-    },
-  ],
 ]

components/ContentType/HotelPage/Facilities/utils.ts

@@ -0,0 +1,44 @@
+import type { Facility } from "@/types/components/hotelPage/facilities"
+import type { ImageVaultAsset } from "@/types/components/imageVault"
+
+type ActivityCard = {
+  background_image?: ImageVaultAsset
+  scripted_title?: string
+  heading: string
+  body_text: string
+  cta_text: string
+  contentPage: Array<{ href: string }>
+}
+
+export function setActivityCard(activitiesCard: ActivityCard): Facility {
+  const hasImage = activitiesCard.background_image
+  return [
+    {
+      id: "activities",
+      theme: hasImage ? "image" : "primaryDark",
+      scriptedTopTitle: activitiesCard.scripted_title,
+      heading: activitiesCard.heading,
+      bodyText: activitiesCard.body_text,
+      backgroundImage: hasImage ? activitiesCard.background_image : undefined,
+      primaryButton: hasImage
+        ? {
+            href: activitiesCard.contentPage[0].href,
+            title: activitiesCard.cta_text,
+            isExternal: false,
+          }
+        : undefined,
+      secondaryButton: hasImage
+        ? undefined
+        : {
+            href: activitiesCard.contentPage[0].href,
+            title: activitiesCard.cta_text,
+            isExternal: false,
+          },
+      columnSpan: "three",
+    },
+  ]
+}
+
+export function getCardTheme() {
+  // TODO
+}

components/ContentType/HotelPage/TabNavigation/index.tsx

@@ -12,6 +12,7 @@ export default function TabNavigation() {
   const hash = useHash()
   const intl = useIntl()
   const hotelTabLinks: { href: HotelHashValues; text: string }[] = [
+    // TODO these titles will need to reflect the facility card titles, which will vary between hotels
     { href: HotelHashValues.overview, text: "Overview" },
     { href: HotelHashValues.rooms, text: "Rooms" },
     { href: HotelHashValues.restaurant, text: "Restaurant & Bar" },

components/ContentType/HotelPage/index.tsx

@@ -1,6 +1,7 @@
 import { serverClient } from "@/lib/trpc/server"
 
 import { MOCK_FACILITIES } from "./Facilities/mockData"
+import { setActivityCard } from "./Facilities/utils"
 import AmenitiesList from "./AmenitiesList"
 import Facilities from "./Facilities"
 import IntroSection from "./IntroSection"
@@ -28,8 +29,11 @@ export default async function HotelPage() {
     hotelDetailedFacilities,
     hotelImages,
     roomCategories,
+    activitiesCard,
   } = hotelData
 
+  MOCK_FACILITIES.push(setActivityCard(activitiesCard))
+
   return (
     <div className={styles.pageContainer}>
       <div className={styles.topSection}>