refactor(SW-296)

components/ContentType/HotelPage/AmenitiesList/index.tsx

@@ -10,13 +10,11 @@ import { getLang } from "@/i18n/serverContext"
 
 import styles from "./amenitiesList.module.css"
 
-import type { Amenities } from "@/types/hotel"
+import type { AmentiesListProps } from "@/types/components/hotelPage/amenities"
 
 export default async function AmenitiesList({
   detailedFacilities,
-}: {
-  detailedFacilities: Amenities
-}) {
+}: AmentiesListProps) {
   const intl = await getIntl()
   const sortedAmenities = detailedFacilities
     .sort((a, b) => b.sortOrder - a.sortOrder)

components/ContentType/HotelPage/Facilities/CardGrid/index.tsx

@@ -24,15 +24,10 @@ export default async function CardGrid({ facilities }: CardGridProps) {
   return (
     <section id={imageCard.card?.id}>
       <Grids.Stackable className={styles.desktopGrid}>
-        {facilities.map((card: CardProps, idx: number) => (
+        {facilities.map((card: CardProps) => (
           <Card
             theme={card.theme || "primaryDark"}
-            key={
-              card.id ||
-              (card.title && `${card.title}-${idx}`) ||
-              (card.heading && `${card.heading}-${idx}`) ||
-              idx
-            }
+            key={card.id}
             scriptedTopTitle={card.scriptedTopTitle}
             heading={card.heading}
             bodyText={card.bodyText}

components/ContentType/HotelPage/Facilities/index.tsx

@@ -17,16 +17,16 @@ export default async function Facilities({ facilities }: FacilityProps) {
 
   // Put activities card at the end
   const activitiesIdx = facilities.findIndex(
-    (facility) => facility[0].id == activities[lang]
+    (facility) => facility[0].id === activities[lang]
   )
-  if (activitiesIdx != -1) {
+  if (activitiesIdx !== -1) {
     facilities.push(facilities.splice(activitiesIdx, 1)[0])
   }
 
   return (
     <SectionContainer className={styles.grid}>
-      {facilities.map((facilityCards: FacilityCards, idx: number) => (
-        <CardGrid key={`grid_${idx}`} facilities={facilityCards} />
+      {facilities.map((facilityCards: FacilityCards) => (
+        <CardGrid key={facilityCards[0].id} facilities={facilityCards} />
       ))}
     </SectionContainer>
   )

components/ContentType/HotelPage/index.tsx

@@ -51,9 +51,9 @@ export default async function HotelPage() {
     facilityCards,
   } = hotelData
 
-  const facilities = setFacilityCards(facilityCards, hotelDetailedFacilities)
-
+  const facilities = setFacilityCards(facilityCards)
   activitiesCard && facilities.push(setActivityCard(activitiesCard))
+
   const topThreePois = pointsOfInterest.slice(0, 3)
 
   const coordinates = {