diff --git a/detroit-ui-components/src/blocks/ImageCard.tsx b/detroit-ui-components/src/blocks/ImageCard.tsx index 82b9a7f937..a4a8bc6a9f 100644 --- a/detroit-ui-components/src/blocks/ImageCard.tsx +++ b/detroit-ui-components/src/blocks/ImageCard.tsx @@ -101,6 +101,16 @@ const ImageCard = (props: ImageCardProps) => { return props.images?.slice(0, 3) }, [props.images]) + const getAltText = (index: number, displayedImages?: ImageItem[], description?: string) => { + if (description) { + return description + } + if (displayedImages && displayedImages.length > 1) { + return `${props.description} - ${index + 1}` + } + return props.description || "" + } + const image = ( <>
))} diff --git a/sites/public/src/components/listing/ListingView.tsx b/sites/public/src/components/listing/ListingView.tsx index 6dd4c5b744..fec09c8003 100644 --- a/sites/public/src/components/listing/ListingView.tsx +++ b/sites/public/src/components/listing/ListingView.tsx @@ -499,6 +499,7 @@ export const ListingView = (props: ListingProps) => { } } )} + description={listing.name} tags={getImageCardTag(listing)} moreImagesLabel={t("listings.moreImagesLabel")} moreImagesDescription={t("listings.moreImagesAltDescription", { diff --git a/sites/public/src/lib/helpers.tsx b/sites/public/src/lib/helpers.tsx index f2e4c34940..05cee8eb5e 100644 --- a/sites/public/src/lib/helpers.tsx +++ b/sites/public/src/lib/helpers.tsx @@ -234,6 +234,7 @@ export const getListings = (listings) => { imageUrl: imageUrlFromListing(listing, parseInt(process.env.listingPhotoSize))[0], href: `/listing/${listing.id}/${listing.urlSlug}`, tags: getImageCardTag(listing), + description: listing.name, }} tableProps={{ headers: unitSummariesHeaders,