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}