web/apps/scandic-web/utils/metadata/image.ts

import type { RawMetadataSchema } from "@scandic-hotels/trpc/routers/contentstack/metadata/output"

export function getImage(data: RawMetadataSchema) {
  const metadataImage = data.web?.seo_metadata?.seo_image
  const heroImage =
    data.hero_image || data.header?.hero_image || data.images?.[0]

  // Currently we don't have the possibility to get smaller images from ImageVault (2024-11-15)
  if (metadataImage) {
    return {
      url: metadataImage.url,
      alt: metadataImage.meta.alt || undefined,
      width: metadataImage.dimensions.width,
      height: metadataImage.dimensions.height,
    }
  }

  if (data.system.content_type_uid === "hotel_page" && data.hotelData) {
    if (data.subpageUrl) {
      let subpageImage: { url: string; alt: string } | undefined
      const restaurantSubPage = data.hotelRestaurants?.find(
        (restaurant) => restaurant.nameInUrl === data.subpageUrl
      )
      const restaurantImage = restaurantSubPage?.content?.images?.[0]
      if (restaurantImage) {
        subpageImage = {
          url: restaurantImage.imageSizes.small,
          alt:
            restaurantImage.metaData.altText ||
            restaurantImage.metaData.altText_En ||
            "",
        }
      }

      switch (data.subpageUrl) {
        case data.additionalHotelData?.hotelParking.nameInUrl:
          const parkingImage =
            data.additionalHotelData?.parkingImages?.heroImages[0]
          if (parkingImage) {
            subpageImage = {
              url: parkingImage.imageSizes.small,
              alt:
                parkingImage.metaData.altText ||
                parkingImage.metaData.altText_En ||
                "",
            }
          }
          break
        case data.additionalHotelData?.healthAndFitness.nameInUrl:
          const wellnessImage = data.hotelData.healthFacilities.find(
            (fac) => fac.content.images.length
          )?.content.images[0]
          if (wellnessImage) {
            subpageImage = {
              url: wellnessImage.imageSizes.small,
              alt:
                wellnessImage.metaData.altText ||
                wellnessImage.metaData.altText_En ||
                "",
            }
          }
          break
        case data.additionalHotelData?.hotelSpecialNeeds.nameInUrl:
          const accessibilityImage =
            data.additionalHotelData?.accessibility?.heroImages[0]
          if (accessibilityImage) {
            subpageImage = {
              url: accessibilityImage.imageSizes.small,
              alt:
                accessibilityImage.metaData.altText ||
                accessibilityImage.metaData.altText_En ||
                "",
            }
          }
          break
        case data.additionalHotelData?.meetingRooms.nameInUrl:
          const meetingImage =
            data.additionalHotelData?.conferencesAndMeetings?.heroImages[0]
          if (meetingImage) {
            subpageImage = {
              url: meetingImage.imageSizes.small,
              alt:
                meetingImage.metaData.altText ||
                meetingImage.metaData.altText_En ||
                "",
            }
          }
          break
        default:
          break
      }

      if (subpageImage) {
        return subpageImage
      }
    }

    const hotelImage =
      data.additionalHotelData?.gallery?.heroImages?.[0] ||
      data.additionalHotelData?.gallery?.smallerImages?.[0]
    if (hotelImage) {
      return {
        url: hotelImage.imageSizes.small,
        alt: hotelImage.metaData.altText || undefined,
      }
    }
  }
  if (heroImage) {
    return {
      url: heroImage.url,
      alt: heroImage.meta.alt || undefined,
      width: heroImage.dimensions.width,
      height: heroImage.dimensions.height,
    }
  }
  return undefined
}