From d63e8856ec6205f53ed5dac9f49ef676e770e922 Mon Sep 17 00:00:00 2001
From: Erik Tiekstra <erik.tiekstra@scandichotels.com>
Date: Tue, 8 Oct 2024 12:54:30 +0200
Subject: [PATCH] feat(SW-441): Added dynamic values for activities and faq to
 tabNavigation

---
 .../HotelPage/TabNavigation/index.tsx         | 35 +++++++++++++------
 components/ContentType/HotelPage/index.tsx    |  2 ++
 types/components/hotelPage/tabNavigation.ts   |  2 ++
 3 files changed, 29 insertions(+), 10 deletions(-)

diff --git a/components/ContentType/HotelPage/TabNavigation/index.tsx b/components/ContentType/HotelPage/TabNavigation/index.tsx
index 3e40280bb..8e80459b4 100644
--- a/components/ContentType/HotelPage/TabNavigation/index.tsx
+++ b/components/ContentType/HotelPage/TabNavigation/index.tsx
@@ -1,4 +1,5 @@
 "use client"
+
 import { useRouter } from "next/navigation"
 import { useEffect } from "react"
 import { useIntl } from "react-intl"
@@ -14,13 +15,16 @@ import {
   type TabNavigationProps,
 } from "@/types/components/hotelPage/tabNavigation"
 
-export default function TabNavigation({ restaurantTitle }: TabNavigationProps) {
+export default function TabNavigation({
+  restaurantTitle,
+  hasActivities,
+  hasFAQ,
+}: TabNavigationProps) {
   const hash = useHash()
   const intl = useIntl()
   const router = useRouter()
-  // const [isObserverActive, setIsObserverActive] = useState<boolean>(true)
 
-  const hotelTabLinks: { hash: HotelHashValues | string; text: string }[] = [
+  const tabLinks: { hash: HotelHashValues; text: string }[] = [
     {
       hash: HotelHashValues.overview,
       text: intl.formatMessage({ id: "Overview" }),
@@ -38,15 +42,26 @@ export default function TabNavigation({ restaurantTitle }: TabNavigationProps) {
       hash: HotelHashValues.wellness,
       text: intl.formatMessage({ id: "Wellness & Exercise" }),
     },
-    {
-      hash: HotelHashValues.activities,
-      text: intl.formatMessage({ id: "Activities" }),
-    },
-    { hash: HotelHashValues.faq, text: intl.formatMessage({ id: "FAQ" }) },
+    ...(hasActivities
+      ? [
+          {
+            hash: HotelHashValues.activities,
+            text: intl.formatMessage({ id: "Activities" }),
+          },
+        ]
+      : []),
+    ...(hasFAQ
+      ? [
+          {
+            hash: HotelHashValues.faq,
+            text: intl.formatMessage({ id: "FAQ" }),
+          },
+        ]
+      : []),
   ]
 
   const { activeSectionId, pauseScrollSpy } = useScrollSpy(
-    hotelTabLinks.map(({ hash }) => hash)
+    tabLinks.map(({ hash }) => hash)
   )
 
   useEffect(() => {
@@ -58,7 +73,7 @@ export default function TabNavigation({ restaurantTitle }: TabNavigationProps) {
   return (
     <div className={styles.stickyWrapper}>
       <nav className={styles.tabsContainer}>
-        {hotelTabLinks.map((link) => {
+        {tabLinks.map((link) => {
           const isActive =
             hash === link.hash ||
             (!hash && link.hash === HotelHashValues.overview)
diff --git a/components/ContentType/HotelPage/index.tsx b/components/ContentType/HotelPage/index.tsx
index 1bbaf4162..5e2106421 100644
--- a/components/ContentType/HotelPage/index.tsx
+++ b/components/ContentType/HotelPage/index.tsx
@@ -63,6 +63,8 @@ export default async function HotelPage() {
       </div>
       <TabNavigation
         restaurantTitle={getRestaurantHeading(hotelDetailedFacilities)}
+        hasActivities={!!activitiesCard}
+        hasFAQ={false}
       />
       <main className={styles.mainSection}>
         <div id={HotelHashValues.overview} className={styles.introContainer}>
diff --git a/types/components/hotelPage/tabNavigation.ts b/types/components/hotelPage/tabNavigation.ts
index 32afb0e56..f44404ea6 100644
--- a/types/components/hotelPage/tabNavigation.ts
+++ b/types/components/hotelPage/tabNavigation.ts
@@ -10,4 +10,6 @@ export enum HotelHashValues {
 
 export type TabNavigationProps = {
   restaurantTitle: string
+  hasActivities: boolean
+  hasFAQ: boolean
 }