feat/SW-689-image-gallery-sizes (pull request #781)

Feat/SW-689 image gallery sizes

* feat(SW-689): initial gallery changes

* feat(SW-689): remove console.log

* feat(SW-689): remove unneccessary code

* feat(SW-689): change sizes

* feat(SW-689): change size

* feat(SW-689): add design for ipad for fullview

* feat(SW-689): fix import type

* feat(SW-689): fix tripAdvisor placement

* feat(SW-689): fix image gallery type

* feat(SW-689): fix check gallery length


Approved-by: Christian Andolf
Approved-by: Matilda Landström

server/routers/hotels/output.ts

@@ -163,30 +163,20 @@ export const facilitySchema = z.object({
   ),
 })
 
+export const imageSchema = z.object({
+  metaData: imageMetaDataSchema,
+  imageSizes: imageSizesSchema,
+})
+
 export const gallerySchema = z.object({
-  heroImages: z.array(
-    z.object({
-      metaData: imageMetaDataSchema,
-      imageSizes: imageSizesSchema,
-    })
-  ),
-  smallerImages: z.array(
-    z.object({
-      metaData: imageMetaDataSchema,
-      imageSizes: imageSizesSchema,
-    })
-  ),
+  heroImages: z.array(imageSchema),
+  smallerImages: z.array(imageSchema),
 })
 
 const healthFacilitySchema = z.object({
   type: z.string(),
   content: z.object({
-    images: z.array(
-      z.object({
-        metaData: imageMetaDataSchema,
-        imageSizes: imageSizesSchema,
-      })
-    ),
+    images: z.array(imageSchema),
     texts: z.object({
       facilityInformation: z.string().optional(),
       surroundingInformation: z.string().optional(),

server/routers/hotels/query.ts

@@ -9,7 +9,6 @@ import {
   notFound,
   serverErrorByStatus,
 } from "@/server/errors/trpc"
-import { extractHotelImages } from "@/server/routers/utils/hotels"
 import {
   contentStackUidWithServiceProcedure,
   publicProcedure,
@@ -230,7 +229,7 @@ export const hotelQueryRouter = router({
       const included = validatedHotelData.data.included || []
 
       const hotelAttributes = validatedHotelData.data.data.attributes
-      const images = extractHotelImages(hotelAttributes)
+      const images = hotelAttributes.gallery?.smallerImages
       const hotelAlerts = hotelAttributes.meta?.specialAlerts || []
 
       const roomCategories = included

server/routers/utils/hotels.ts

@@ -1,30 +0,0 @@
-import type { ImageItem } from "@/types/components/lightbox/lightbox"
-import type { Hotel } from "@/types/hotel"
-
-export function extractHotelImages(hotelData: Hotel): ImageItem[] {
-  const images: ImageItem[] = []
-
-  if (hotelData.hotelContent?.images) {
-    images.push({
-      url: hotelData.hotelContent.images.imageSizes.large,
-      alt: hotelData.hotelContent.images.metaData.altText,
-      title:
-        hotelData.hotelContent.images.metaData.title ||
-        hotelData.hotelContent.images.metaData.altText,
-    })
-  }
-
-  if (hotelData.healthFacilities) {
-    hotelData.healthFacilities.forEach((facility) => {
-      facility.content.images.forEach((image) => {
-        images.push({
-          url: image.imageSizes.large,
-          alt: image.metaData.altText,
-          title: image.metaData.title || image.metaData.altText,
-        })
-      })
-    })
-  }
-
-  return images
-}