From f557fd42756e788eac2e707341e0bbfc6fcdf25a Mon Sep 17 00:00:00 2001 From: Ike Saunders <ikesau@protonmail.com> Date: Mon, 19 Aug 2024 15:27:28 -0400 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20handle=20extra=20cases=20with=20dat?= =?UTF-8?q?a=20insights=20atom=20feed=20images?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- site/gdocs/components/AtomArticleBlocks.tsx | 20 ++++++++++++++++++-- 1 file changed, 18 insertions(+), 2 deletions(-) diff --git a/site/gdocs/components/AtomArticleBlocks.tsx b/site/gdocs/components/AtomArticleBlocks.tsx index 7a074c86090..28c529e6955 100644 --- a/site/gdocs/components/AtomArticleBlocks.tsx +++ b/site/gdocs/components/AtomArticleBlocks.tsx @@ -7,9 +7,10 @@ import { useImage } from "../utils.js" import ArticleBlock, { Container, getLayout } from "./ArticleBlock.js" import { BlockErrorFallback } from "./BlockErrorBoundary.js" import { - LARGEST_IMAGE_WIDTH, getFilenameExtension, getFilenameWithoutExtension, + isNull, + LARGEST_IMAGE_WIDTH, } from "@ourworldindata/utils" export default function AtomArticleBlocks({ @@ -82,10 +83,25 @@ function Image({ const filenameWithoutExtension = encodeURIComponent( getFilenameWithoutExtension(image.filename) ) + const resizedWidth = match(image.originalWidth) + .when( + (width) => isNull(width), + () => "" + ) + .when( + (width) => width <= LARGEST_IMAGE_WIDTH, + () => "" + ) + .when( + (width) => width > LARGEST_IMAGE_WIDTH, + () => `_${LARGEST_IMAGE_WIDTH}` + ) + .otherwise(() => "") + const extension = getFilenameExtension(image.filename) return ( <img - src={`${BAKED_BASE_URL}${IMAGES_DIRECTORY}${filenameWithoutExtension}_${LARGEST_IMAGE_WIDTH}.${extension}`} + src={`${BAKED_BASE_URL}${IMAGES_DIRECTORY}${filenameWithoutExtension}${resizedWidth}.${extension}`} alt={alt ?? image.defaultAlt} width={image.originalWidth ?? undefined} height={image.originalHeight ?? undefined}