Merged in feat/SW-826-sidebar-updates (pull request #888)

Feat/SW-826 sidebar updates

Approved-by: Niclas Edenvin

components/HotelReservation/Contact/contact.module.css

@@ -46,3 +46,9 @@
   flex-direction: column;
   justify-content: center;
 }
+
+.googleMaps {
+  text-decoration: none;
+  font-family: var(--typography-Body-Regular-fontFamily);
+  color: var(--Base-Text-Medium-contrast);
+}

components/HotelReservation/Contact/index.tsx

@@ -32,9 +32,13 @@ export default function Contact({ hotel }: ContactProps) {
             <span className={styles.heading}>
               {intl.formatMessage({ id: "Driving directions" })}
             </span>
-            <Link href="#" color="peach80">
+            <a
+              href={`https://www.google.com/maps/dir/?api=1&destination=${hotel.location.latitude},${hotel.location.longitude}`}
+              className={styles.googleMaps}
+              target="_blank"
+            >
               Google Maps
-            </Link>
+            </a>
           </li>
           <li>
             <span className={styles.heading}>

components/HotelReservation/HotelCard/index.tsx

@@ -108,6 +108,7 @@ export default function HotelCard({
           label={intl.formatMessage({ id: "See hotel details" })}
           hotelId={hotelData.operaId}
           hotel={hotelData}
+          showCTA={true}
         />
       </section>
       <section className={styles.prices}>

components/HotelReservation/ReadMore/index.tsx

@@ -10,12 +10,12 @@ import styles from "./readMore.module.css"
 import { ReadMoreProps } from "@/types/components/hotelReservation/selectHotel/selectHotel"
 import { SidePeekEnum } from "@/types/components/hotelReservation/sidePeek"
 
-export default function ReadMore({ label, hotelId }: ReadMoreProps) {
+export default function ReadMore({ label, hotelId, showCTA }: ReadMoreProps) {
   const openSidePeek = useSidePeekStore((state) => state.openSidePeek)
   return (
     <Button
       onPress={() => {
-        openSidePeek({ key: SidePeekEnum.hotelDetails, hotelId })
+        openSidePeek({ key: SidePeekEnum.hotelDetails, hotelId, showCTA })
       }}
       intent="text"
       theme="base"

components/HotelReservation/SelectRate/HotelInfoCard/index.tsx

@@ -81,6 +81,7 @@ export default function HotelInfoCard({ hotelData }: HotelInfoCardProps) {
                 label={intl.formatMessage({ id: "Show all amenities" })}
                 hotelId={hotelAttributes.operaId}
                 hotel={hotelAttributes}
+                showCTA={false}
               />
             </div>
           </div>

components/HotelReservation/SidePeek/index.tsx

@@ -17,6 +17,7 @@ export default function HotelReservationSidePeek({
   const activeSidePeek = useSidePeekStore((state) => state.activeSidePeek)
   const hotelId = useSidePeekStore((state) => state.hotelId)
   const roomTypeCode = useSidePeekStore((state) => state.roomTypeCode)
+  const showCTA = useSidePeekStore((state) => state.showCTA)
   const close = useSidePeekStore((state) => state.closeSidePeek)
   const lang = useLang()
 
@@ -43,6 +44,7 @@ export default function HotelReservationSidePeek({
             hotel={hotelData.data?.attributes}
             activeSidePeek={activeSidePeek}
             close={close}
+            showCTA={showCTA}
           />
         )}
         {selectedRoom && (