Merged in fix/remove-translated-slugs (pull request #1390)

Fix(SW-1467): Remove translation of hotel page sidepeek slugs

* fix(SW-1467): remove translation of sidepeek slugs

* fix: update enums


Approved-by: Erik Tiekstra
Approved-by: Fredrik Thorsson

components/ContentType/HotelPage/AmenitiesList/index.tsx

@@ -1,23 +1,21 @@
-import { amenities } from "@/constants/routes/hotelPageParams"
-
 import { mapFacilityToIcon } from "@/components/ContentType/HotelPage/data"
 import { ChevronRightSmallIcon } from "@/components/Icons"
 import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import { getIntl } from "@/i18n"
-import { getLang } from "@/i18n/serverContext"
 
 import styles from "./amenitiesList.module.css"
 
 import type { AmenitiesListProps } from "@/types/components/hotelPage/amenities"
+import { SidepeekSlugs } from "@/types/components/hotelPage/hotelPage"
 
 export default async function AmenitiesList({
   detailedFacilities,
 }: AmenitiesListProps) {
   const intl = await getIntl()
   const facilities = detailedFacilities.slice(0, 5)
-  const lang = getLang()
+
   return (
     <section className={styles.amenitiesContainer}>
       <Subtitle type="two" color="black">
@@ -43,7 +41,7 @@ export default async function AmenitiesList({
       </div>
       <Link
         scroll={false}
-        href={`#s-${amenities[lang]}`}
+        href={`#s-${SidepeekSlugs.amenities}`}
         color="burgundy"
         variant="icon"
         className={styles.showAllAmenities}

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

@@ -1,22 +1,19 @@
-import { activities } from "@/constants/routes/hotelPageParams"
-
 import Card from "@/components/TempDesignSystem/Card"
 import CardImage from "@/components/TempDesignSystem/Card/CardImage"
 import Grids from "@/components/TempDesignSystem/Grids"
-import { getLang } from "@/i18n/serverContext"
 
 import styles from "./cardGrid.module.css"
 
+import { HotelHashValues } from "@/types/components/hotelPage/tabNavigation"
 import type { ActivityCard } from "@/types/trpc/routers/contentstack/hotelPage"
 import type { CardProps } from "@/components/TempDesignSystem/Card/card"
 
 export default function ActivitiesCardGrid(activitiesCard: ActivityCard) {
-  const lang = getLang()
   const hasImage = activitiesCard.backgroundImage
 
   const updatedCard: CardProps = {
     ...activitiesCard,
-    id: activities[lang],
+    id: HotelHashValues.activities,
     theme: hasImage ? "image" : "primaryDark",
     primaryButton: hasImage
       ? {

components/ContentType/HotelPage/IntroSection/index.tsx

@@ -1,5 +1,3 @@
-import { about } from "@/constants/routes/hotelPageParams"
-
 import { ChevronRightSmallIcon, TripAdvisorIcon } from "@/components/Icons"
 import Link from "@/components/TempDesignSystem/Link"
 import BiroScript from "@/components/TempDesignSystem/Text/BiroScript"
@@ -7,11 +5,11 @@ import Body from "@/components/TempDesignSystem/Text/Body"
 import Preamble from "@/components/TempDesignSystem/Text/Preamble"
 import Title from "@/components/TempDesignSystem/Text/Title"
 import { getIntl } from "@/i18n"
-import { getLang } from "@/i18n/serverContext"
 import { getSingleDecimal } from "@/utils/numberFormatting"
 
 import styles from "./introSection.module.css"
 
+import { SidepeekSlugs } from "@/types/components/hotelPage/hotelPage"
 import type { IntroSectionProps } from "./types"
 
 export default async function IntroSection({
@@ -28,7 +26,7 @@ export default async function IntroSection({
     { id: "{number} km to city center" },
     { number: getSingleDecimal(distanceToCentre / 1000) }
   )
-  const lang = getLang()
+
   const formattedLocationText = `${streetAddress}, ${city} (${formattedDistanceText})`
   const hasTripAdvisorData = !!(
     tripAdvisor?.rating &&
@@ -72,7 +70,7 @@ export default async function IntroSection({
           className={styles.introLink}
           color="burgundy"
           variant="icon"
-          href={`#s-${about[lang]}`}
+          href={`#s-${SidepeekSlugs.about}`}
           scroll={false}
         >
           {intl.formatMessage({ id: "Read more about the hotel" })}

components/ContentType/HotelPage/SidePeeks/AboutTheHotel/index.tsx

@@ -1,16 +1,14 @@
-import { about } from "@/constants/routes/hotelPageParams"
-
 import Divider from "@/components/TempDesignSystem/Divider"
 import SidePeek from "@/components/TempDesignSystem/SidePeek"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Preamble from "@/components/TempDesignSystem/Text/Preamble"
 import { getIntl } from "@/i18n"
-import { getLang } from "@/i18n/serverContext"
 
 import ContactInformation from "./ContactInformation"
 
 import styles from "./aboutTheHotel.module.css"
 
+import { SidepeekSlugs } from "@/types/components/hotelPage/hotelPage"
 import type { AboutTheHotelSidePeekProps } from "@/types/components/hotelPage/sidepeek/aboutTheHotel"
 
 export default async function AboutTheHotelSidePeek({
@@ -21,12 +19,11 @@ export default async function AboutTheHotelSidePeek({
   ecoLabels,
   descriptions,
 }: AboutTheHotelSidePeekProps) {
-  const lang = getLang()
   const intl = await getIntl()
 
   return (
     <SidePeek
-      contentKey={about[lang]}
+      contentKey={SidepeekSlugs.about}
       title={intl.formatMessage({ id: "About the hotel" })}
     >
       <section className={styles.wrapper}>

components/ContentType/HotelPage/SidePeeks/Amenities/index.tsx

@@ -1,9 +1,6 @@
-import { amenities } from "@/constants/routes/hotelPageParams"
-
 import Accordion from "@/components/TempDesignSystem/Accordion"
 import SidePeek from "@/components/TempDesignSystem/SidePeek"
 import { getIntl } from "@/i18n"
-import { getLang } from "@/i18n/serverContext"
 
 import {
   AccessibilityAmenity,
@@ -13,6 +10,7 @@ import {
 } from "./AccordionAmenities"
 import FilteredAmenities from "./FilteredAmenities"
 
+import { SidepeekSlugs } from "@/types/components/hotelPage/hotelPage"
 import type { AmenitiesSidePeekProps } from "@/types/components/hotelPage/sidepeek/amenities"
 import { FacilityEnum } from "@/types/enums/facilities"
 
@@ -23,7 +21,6 @@ export default async function AmenitiesSidePeek({
   accessibility,
   restaurants,
 }: AmenitiesSidePeekProps) {
-  const lang = getLang()
   const intl = await getIntl()
 
   const amenitiesToRemove = [
@@ -54,7 +51,7 @@ export default async function AmenitiesSidePeek({
 
   return (
     <SidePeek
-      contentKey={amenities[lang]}
+      contentKey={SidepeekSlugs.amenities}
       title={intl.formatMessage({ id: "Amenities" })}
     >
       <Accordion>

components/ContentType/HotelPage/SidePeeks/MeetingsAndConferences/index.tsx

@@ -1,5 +1,3 @@
-import { meetingsAndConferences } from "@/constants/routes/hotelPageParams"
-
 import Image from "@/components/Image"
 import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"
@@ -8,12 +6,12 @@ import Body from "@/components/TempDesignSystem/Text/Body"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import Title from "@/components/TempDesignSystem/Text/Title"
 import { getIntl } from "@/i18n"
-import { getLang } from "@/i18n/serverContext"
 
 import { getConferenceRoomTexts } from "./util"
 
 import styles from "./meetingsAndConferences.module.css"
 
+import { SidepeekSlugs } from "@/types/components/hotelPage/hotelPage"
 import type { MeetingsAndConferencesSidePeekProps } from "@/types/components/hotelPage/sidepeek/meetingsAndConferences"
 
 export default async function MeetingsAndConferencesSidePeek({
@@ -22,7 +20,6 @@ export default async function MeetingsAndConferencesSidePeek({
   meetingRooms,
   meetingPageUrl,
 }: MeetingsAndConferencesSidePeekProps) {
-  const lang = getLang()
   const intl = await getIntl()
   const { seatingText, roomText } = await getConferenceRoomTexts(meetingRooms)
 
@@ -38,7 +35,7 @@ export default async function MeetingsAndConferencesSidePeek({
 
   return (
     <SidePeek
-      contentKey={meetingsAndConferences[lang]}
+      contentKey={SidepeekSlugs.meetings}
       title={intl.formatMessage({ id: "Meetings & Conferences" })}
     >
       <div className={styles.wrapper}>

components/ContentType/HotelPage/SidePeeks/RestaurantBar/index.tsx

@@ -1,24 +1,21 @@
-import { restaurantAndBar } from "@/constants/routes/hotelPageParams"
-
 import SidePeek from "@/components/TempDesignSystem/SidePeek"
 import { getIntl } from "@/i18n"
-import { getLang } from "@/i18n/serverContext"
 
 import RestaurantBarItem from "./RestaurantBarItem"
 
 import styles from "./restaurantBar.module.css"
 
+import { SidepeekSlugs } from "@/types/components/hotelPage/hotelPage"
 import type { RestaurantBarSidePeekProps } from "@/types/components/hotelPage/sidepeek/restaurantBar"
 
 export default async function RestaurantBarSidePeek({
   restaurants,
 }: RestaurantBarSidePeekProps) {
   const intl = await getIntl()
-  const lang = getLang()
 
   return (
     <SidePeek
-      contentKey={restaurantAndBar[lang]}
+      contentKey={SidepeekSlugs.restaurant}
       title={intl.formatMessage({ id: "Restaurant & Bar" })}
     >
       <div className={styles.content}>

components/ContentType/HotelPage/SidePeeks/Room/index.tsx

@@ -25,6 +25,7 @@ export default async function RoomSidePeek({ room }: RoomSidePeekProps) {
   const ctaUrl = ""
 
   const galleryImages = mapApiImagesToGalleryImages(images)
+
   return (
     <SidePeek contentKey={getRoomNameAsParam(room.name)} title={room.name}>
       <div className={styles.content}>

components/ContentType/HotelPage/SidePeeks/WellnessAndExercise/index.tsx

@@ -1,15 +1,13 @@
-import { wellnessAndExercise } from "@/constants/routes/hotelPageParams"
-
 import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"
 import SidePeek from "@/components/TempDesignSystem/SidePeek"
 import { getIntl } from "@/i18n"
-import { getLang } from "@/i18n/serverContext"
 
 import Facility from "./Facility"
 
 import styles from "./wellnessAndExercise.module.css"
 
+import { SidepeekSlugs } from "@/types/components/hotelPage/hotelPage"
 import type { WellnessAndExerciseSidePeekProps } from "@/types/components/hotelPage/sidepeek/wellnessAndExercise"
 
 export default async function WellnessAndExerciseSidePeek({
@@ -18,11 +16,10 @@ export default async function WellnessAndExerciseSidePeek({
   spaPage,
 }: WellnessAndExerciseSidePeekProps) {
   const intl = await getIntl()
-  const lang = getLang()
 
   return (
     <SidePeek
-      contentKey={wellnessAndExercise[lang]}
+      contentKey={SidepeekSlugs.wellness}
       title={intl.formatMessage({ id: "Wellness & Exercise" })}
     >
       <div className={styles.wrapper}>

components/ContentType/HotelPage/utils.ts

@@ -11,7 +11,12 @@ import type { HotelPage } from "@/types/trpc/routers/contentstack/hotelPage"
 import type { Lang } from "@/constants/languages"
 
 export function getRoomNameAsParam(roomName: string) {
-  return roomName.replace(/[()]/g, "").replaceAll(" ", "-").toLowerCase()
+  return roomName
+    .replace(/\s?\(.*\)$/, "")
+    .trim()
+    .replace(/[()]/g, "")
+    .replaceAll(" ", "-")
+    .toLowerCase()
 }
 
 export function getTrackingPageData(