From cdc729001ea413f8580ead0e1aee19b614c066f1 Mon Sep 17 00:00:00 2001
From: Chuma McPhoy <chuma.mcphoy@scandichotels.com>
Date: Thu, 11 Jul 2024 16:38:13 +0200
Subject: [PATCH] chore: move stub sidepeek to AmenitiesList

---
 .../HotelPage/AmenitiesList/index.tsx         | 23 +++++++++----
 .../ContentType/HotelPage/HotelPage.tsx       | 32 -------------------
 i18n/dictionaries/en.json                     |  1 +
 i18n/dictionaries/sv.json                     |  1 +
 4 files changed, 19 insertions(+), 38 deletions(-)

diff --git a/components/ContentType/HotelPage/AmenitiesList/index.tsx b/components/ContentType/HotelPage/AmenitiesList/index.tsx
index 5d458f4fe..970485e52 100644
--- a/components/ContentType/HotelPage/AmenitiesList/index.tsx
+++ b/components/ContentType/HotelPage/AmenitiesList/index.tsx
@@ -1,10 +1,13 @@
 import { mapFacilityToIcon } from "@/components/ContentType/HotelPage/data"
 import { ChevronRightIcon } from "@/components/Icons"
-import Button from "@/components/TempDesignSystem/Button"
+import Link from "@/components/TempDesignSystem/Link"
+import SidePeekContent from "@/components/TempDesignSystem/SidePeek/Content"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import { getIntl } from "@/i18n"
 
+import SidePeekContainer from "../SidePeekContainer"
+
 import styles from "./amenitiesList.module.css"
 
 import { HotelData } from "@/types/hotel"
@@ -20,8 +23,9 @@ export default async function AmenitiesList({
     .slice(0, 5)
   return (
     <section className={styles.amenitiesContainer}>
-      {/*TODO: Update to "Subtitle 2" once we have the new tokens. */}
-      <Subtitle color="black">{formatMessage({ id: "At the hotel" })}</Subtitle>
+      <Subtitle type="two" color="black">
+        {formatMessage({ id: "At the hotel" })}
+      </Subtitle>
       <div className={styles.amenityItemList}>
         {sortedAmenities.map((facility) => {
           const IconComponent = mapFacilityToIcon(facility.name)
@@ -33,11 +37,18 @@ export default async function AmenitiesList({
           )
         })}
       </div>
-      {/*TODO: This should open a side peek. Add once the Side Peek component has been merged. */}
-      <Button theme="base" variant="icon" intent="text">
+      <Link href={"?sidepeek=amenities"} color="burgundy" variant="icon">
         {formatMessage({ id: "Show all amenities" })}
         <ChevronRightIcon />
-      </Button>
+      </Link>
+      <SidePeekContainer>
+        <SidePeekContent
+          contentKey={"amenities"}
+          title={formatMessage({ id: "Amenities" })}
+        >
+          {/* TODO: Render amenities as per the design. */}
+        </SidePeekContent>
+      </SidePeekContainer>
     </section>
   )
 }
diff --git a/components/ContentType/HotelPage/HotelPage.tsx b/components/ContentType/HotelPage/HotelPage.tsx
index f6f011c0c..31907ff5e 100644
--- a/components/ContentType/HotelPage/HotelPage.tsx
+++ b/components/ContentType/HotelPage/HotelPage.tsx
@@ -5,9 +5,6 @@ import { serverClient } from "@/lib/trpc/server"
 import AmenitiesList from "./AmenitiesList"
 import IntroSection from "./IntroSection"
 import { Rooms } from "./Rooms"
-import SidePeek from "@/components/TempDesignSystem/SidePeek"
-import SidePeekContent from "@/components/TempDesignSystem/SidePeek/Content"
-import SidePeekContainer from "./SidePeekContainer"
 
 import styles from "./hotelPage.module.css"
 
@@ -40,35 +37,6 @@ export default async function HotelPage({ lang }: LangParams) {
         <AmenitiesList detailedFacilities={attributes.detailedFacilities} />
       </div>
       <Rooms rooms={roomCategories} />
-
-      <Link href={"?sidepeek=restaurantbar"} scroll={false}>
-        Restaurant and bar
-      </Link>
-      <Link href={"?sidepeek=gym"} scroll={false}>
-        Gym
-      </Link>
-      <Link href={"?sidepeek=meetings"} scroll={false}>
-        Meetings
-      </Link>
-      <SidePeekContainer>
-        <SidePeekContent contentKey={"restaurantbar"} title={"Food and drinks"}>
-          Food
-        </SidePeekContent>
-        <SidePeekContent contentKey={"gym"} title={"Gym and Wellness"}>
-          <ul>
-            <li>Some</li>
-            <li>JSX</li>
-            <li>Conent</li>
-            <li>here</li>
-          </ul>
-        </SidePeekContent>
-        <SidePeekContent
-          contentKey={"meetings"}
-          title={"Meetings and conferences"}
-        >
-          Meetings
-        </SidePeekContent>
-      </SidePeekContainer>
     </main>
   )
 }
diff --git a/i18n/dictionaries/en.json b/i18n/dictionaries/en.json
index 1f5fd43d8..f81ded718 100644
--- a/i18n/dictionaries/en.json
+++ b/i18n/dictionaries/en.json
@@ -4,6 +4,7 @@
   "Address": "Address",
   "All rooms comes with standard amenities": "All rooms comes with standard amenities",
   "Already a friend?": "Already a friend?",
+  "Amenities": "Amenities",
   "Arrival date": "Arrival date",
   "as of today": "as of today",
   "As our": "As our",
diff --git a/i18n/dictionaries/sv.json b/i18n/dictionaries/sv.json
index b59a2fd50..8649f315e 100644
--- a/i18n/dictionaries/sv.json
+++ b/i18n/dictionaries/sv.json
@@ -4,6 +4,7 @@
   "Address": "Adress",
   "All rooms comes with standard amenities": "Alla rum har standardbekvämligheter",
   "Already a friend?": "Redan en vän?",
+  "Amenities": "Bekvämligheter",
   "Arrival date": "Ankomstdatum",
   "as of today": "från och med idag",
   "As our": "Som vår",