feat(SW-880): refactor variables

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

@@ -10,26 +10,16 @@ import { FacilityProps } from "@/types/components/hotelPage/sidepeek/facility"
 
 export default async function Facility({ data }: FacilityProps) {
   const intl = await getIntl()
-  const imgUrl = data.content.images[0]?.imageSizes.medium
-  const imgAltText = data.content.images[0]?.metaData.altText
-  const facilityType = data.type
-  const ordinaryOpeningTimes = {
-    alwaysOpen: data.openingDetails.openingHours.ordinary.alwaysOpen,
-    openingTime: data.openingDetails.openingHours.ordinary.openingTime,
-    closingTime: data.openingDetails.openingHours.ordinary.closingTime,
-  }
-  const weekendOpeningTimes = {
-    alwaysOpen: data.openingDetails.openingHours.weekends.alwaysOpen,
-    openingTime: data.openingDetails.openingHours.weekends.openingTime,
-    closingTime: data.openingDetails.openingHours.weekends.closingTime,
-  }
+  const image = data.content.images[0]
+  const ordinaryOpeningTimes = data.openingDetails.openingHours.ordinary
+  const weekendOpeningTimes = data.openingDetails.openingHours.weekends
 
   return (
     <div className={styles.content}>
-      {imgUrl && (
+      {image.imageSizes.medium && (
         <Image
-          src={imgUrl}
-          alt={imgAltText || ""}
+          src={image.imageSizes.medium}
+          alt={image.metaData.altText || ""}
           className={styles.image}
           height={400}
           width={200}
@@ -37,9 +27,7 @@ export default async function Facility({ data }: FacilityProps) {
       )}
       <div className={styles.information}>
         <Subtitle color="burgundy" asChild type="one">
-          <Title level="h3">
-            {intl.formatMessage({ id: `${facilityType}` })}
-          </Title>
+          <Title level="h3">{intl.formatMessage({ id: `${data.type}` })}</Title>
         </Subtitle>
         <div>
           <Subtitle type="two" color="uiTextHighContrast">