feat(SW-750): add HotelLocation type

components/ContentType/HotelPage/SidePeeks/AboutTheHotel/ContactInformation/contactInformation.module.css

@@ -34,6 +34,7 @@
 .socialIcons {
   display: flex;
   gap: var(--Spacing-x1);
+  align-items: center;
 }
 
 .email {

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

@@ -10,10 +10,7 @@ import { getLang } from "@/i18n/serverContext"
 
 import styles from "./contactInformation.module.css"
 
-import {
-  type ContactInformationProps,
-  GoogleMapsDirections,
-} from "@/types/components/hotelPage/sidepeek/contactInformation"
+import type { ContactInformationProps } from "@/types/components/hotelPage/sidepeek/contactInformation"
 
 export default async function ContactInformation({
   hotelAddress,
@@ -24,6 +21,9 @@ export default async function ContactInformation({
 }: ContactInformationProps) {
   const intl = await getIntl()
   const lang = getLang()
+  const { latitude, longitude } = coordinates
+  const directionsUrl = `https://www.google.com/maps/dir/?api=1&destination=${latitude},${longitude}`
+
   return (
     <div className={styles.wrapper}>
       <Subtitle color="burgundy" asChild>
@@ -44,7 +44,7 @@ export default async function ContactInformation({
             {intl.formatMessage({ id: "Driving directions" })}
           </Body>
           <Link
-            href={`${GoogleMapsDirections.BASE_URL}${coordinates.lat},${coordinates.lng}`}
+            href={directionsUrl}
             target="_blank"
             color="peach80"
             textDecoration="underline"

components/ContentType/HotelPage/SidePeeks/index.ts

@@ -0,0 +1,2 @@
+export { default as AboutTheHotelSidePeek } from "./AboutTheHotel"
+export { default as WellnessAndExerciseSidePeek } from "./WellnessAndExercise"

components/ContentType/HotelPage/index.tsx

@@ -16,13 +16,12 @@ import MapCard from "./Map/MapCard"
 import MapWithCardWrapper from "./Map/MapWithCard"
 import MobileMapToggle from "./Map/MobileMapToggle"
 import StaticMap from "./Map/StaticMap"
-import AboutTheHotelSidePeek from "./SidePeeks/AboutTheHotel"
-import WellnessAndExerciseSidePeek from "./SidePeeks/WellnessAndExercise"
 import AmenitiesList from "./AmenitiesList"
 import Facilities from "./Facilities"
 import IntroSection from "./IntroSection"
 import PreviewImages from "./PreviewImages"
 import { Rooms } from "./Rooms"
+import { AboutTheHotelSidePeek, WellnessAndExerciseSidePeek } from "./SidePeeks"
 import TabNavigation from "./TabNavigation"
 
 import styles from "./hotelPage.module.css"
@@ -140,7 +139,7 @@ export default async function HotelPage() {
         </SidePeek>
         <AboutTheHotelSidePeek
           hotelAddress={hotelAddress}
-          coordinates={coordinates}
+          coordinates={hotelLocation}
           contact={contact}
           socials={socials}
           ecoLabels={ecoLabels}

types/components/hotelPage/sidepeek/aboutTheHotel.ts

@@ -1,11 +1,8 @@
-import type { Hotel, HotelAddress } from "@/types/hotel"
+import type { Hotel, HotelAddress, HotelLocation } from "@/types/hotel"
 
 export type AboutTheHotelSidePeekProps = {
   hotelAddress: HotelAddress
-  coordinates: {
-    lat: number
-    lng: number
-  }
+  coordinates: HotelLocation
   contact: Hotel["contactInformation"]
   socials: Hotel["socialMedia"]
   ecoLabels: Hotel["hotelFacts"]["ecoLabels"]

types/components/hotelPage/sidepeek/contactInformation.ts

@@ -1,9 +1,5 @@
 import type { AboutTheHotelSidePeekProps } from "./aboutTheHotel"
 
-export enum GoogleMapsDirections {
-  BASE_URL = "https://www.google.com/maps/dir/?api=1&destination=",
-}
-
 export type ContactInformationProps = Omit<
   AboutTheHotelSidePeekProps,
   "descriptions"