diff --git a/src/components/customerCases/customerCase/sections/image/ImageSection.tsx b/src/components/customerCases/customerCase/sections/image/ImageSection.tsx index e38dd0e34..2a6ba0fad 100644 --- a/src/components/customerCases/customerCase/sections/image/ImageSection.tsx +++ b/src/components/customerCases/customerCase/sections/image/ImageSection.tsx @@ -13,16 +13,9 @@ export default function ImageSection({ section }: ImageSectionProps) {
- {section.images?.map((image) => ( -
-
- -
-
- ))} +
+ +
); diff --git a/src/components/customerCases/customerCase/sections/image/imageSection.module.css b/src/components/customerCases/customerCase/sections/image/imageSection.module.css index 0be775a9c..fddd1fc74 100644 --- a/src/components/customerCases/customerCase/sections/image/imageSection.module.css +++ b/src/components/customerCases/customerCase/sections/image/imageSection.module.css @@ -19,12 +19,6 @@ max-width: unset; } -.imageWrapper { - display: flex; - flex-direction: column; - align-items: center; -} - .imageContent { height: 100%; } diff --git a/studioShared/lib/interfaces/imageBlock.ts b/studioShared/lib/interfaces/imageBlock.ts index cd1ff43cc..eb6f81542 100644 --- a/studioShared/lib/interfaces/imageBlock.ts +++ b/studioShared/lib/interfaces/imageBlock.ts @@ -3,6 +3,6 @@ import { IImage } from "studio/lib/interfaces/media"; export interface ImageBlock { _key: string; _type: "imageBlock"; - images: IImage[]; + image: IImage; fullWidth?: boolean; } diff --git a/studioShared/lib/queries/customerCases.ts b/studioShared/lib/queries/customerCases.ts index fd9347e43..1bc2fd2e8 100644 --- a/studioShared/lib/queries/customerCases.ts +++ b/studioShared/lib/queries/customerCases.ts @@ -34,9 +34,7 @@ export const BASE_SECTIONS_FRAGMENT = groq` highlighted }, _type == "imageBlock" => { - "images": images[] { - ${INTERNATIONALIZED_IMAGE_FRAGMENT} - }, + "image": image {${INTERNATIONALIZED_IMAGE_FRAGMENT}}, fullWidth }, _type == "quoteBlock" => { diff --git a/studioShared/schemas/objects/imageBlock.ts b/studioShared/schemas/objects/imageBlock.ts index 715b28058..610879f33 100644 --- a/studioShared/schemas/objects/imageBlock.ts +++ b/studioShared/schemas/objects/imageBlock.ts @@ -10,42 +10,36 @@ const imageBlock = defineField({ type: "object", fields: [ { - name: "images", - title: "Images", - type: "array", - of: [internationalizedImage], + title: "Image", + ...internationalizedImage, }, { name: "fullWidth", title: "Full Width", - description: "Should these images occupy the full width of the page?", + description: + "Should the image occupy the full width of the page? (Only works if the image is not a part of a split section)", type: "boolean", }, ], preview: { select: { - images: "images", + image: "image", fullWidth: "fullWidth", }, - prepare: ({ images, fullWidth }) => { - const count = Object.keys(images).length; - const firstImage = count > 0 ? images[0] : undefined; - let firstImageAlt = null; - if (firstImage !== undefined) { - const imageAlt = firstImage.alt; - if (imageAlt !== undefined) { - if (!isInternationalizedString(imageAlt)) { - throw new TypeError( - `Expected image 'alt' to be InternationalizedString, was ${typeof firstImage.alt}`, - ); - } - firstImageAlt = firstTranslation(imageAlt); - } + prepare: ({ image, fullWidth }) => { + const imageAlt = image.alt; + if (!isInternationalizedString(imageAlt)) { + throw new TypeError( + `Expected image 'alt' to be InternationalizedString, was ${typeof image.alt}`, + ); } return { - title: count > 1 ? `${count} images` : (firstImageAlt ?? undefined), + title: + imageAlt !== undefined + ? (firstTranslation(imageAlt) ?? undefined) + : undefined, subtitle: fullWidth ? "Full Width" : undefined, - media: firstImage, + media: image, }; }, },