From 2efbcf4c0b8cefb85adc7d443eb7b0664cf5a101 Mon Sep 17 00:00:00 2001
From: "xan.lol" <xan@xan.lol>
Date: Sun, 20 Sep 2026 21:48:14 -0700
Subject: [PATCH] fix image thumbnail reuse & ios previews

---
 .../Post/Embed/ImageContextMenu.tsx           | 21 +++++++++++++++++--
 src/components/Post/Embed/ImageEmbed.tsx      |  2 +-
 src/lib/media/embed-image-formats.ts          |  6 ++++--
 src/lib/media/image-formats.test.ts           |  9 ++++++++
 4 files changed, 33 insertions(+), 5 deletions(-)

diff --git a/src/components/Post/Embed/ImageContextMenu.tsx b/src/components/Post/Embed/ImageContextMenu.tsx
index 3aadb5690..4cc34d7e8 100644
--- a/src/components/Post/Embed/ImageContextMenu.tsx
+++ b/src/components/Post/Embed/ImageContextMenu.tsx
@@ -4,6 +4,12 @@ import {useLingui} from '@lingui/react/macro'
 
 import {shareImageModal} from '#/lib/media/manip'
 import {useSaveImageToMediaLibrary} from '#/lib/media/save-image'
+import {useFullsizeFormat} from '#/state/preferences/fullsize-format'
+import {
+  applyImageTransforms,
+  useImageCdnHost,
+} from '#/state/preferences/image-cdn-host'
+import {useThumbnailFormat} from '#/state/preferences/thumbnail-format'
 import {ArrowShareRight_Stroke2_Corner2_Rounded as ShareIcon} from '#/components/icons/ArrowShareRight'
 import {Download_Stroke2_Corner0_Rounded as DownloadIcon} from '#/components/icons/Download'
 import * as PeekMenu from '#/components/PeekMenu'
@@ -39,6 +45,9 @@ export function ImageContextMenu({
 }) {
   const {t: l} = useLingui()
   const saveImage = useSaveImageToMediaLibrary()
+  const imageCdnHost = useImageCdnHost()
+  const thumbnailFormat = useThumbnailFormat()
+  const fullsizeFormat = useFullsizeFormat()
 
   if (!IS_IOS) {
     return children
@@ -56,8 +65,16 @@ export function ImageContextMenu({
       <PeekMenu.Trigger
         preview={{
           type: 'image',
-          uri: fullsizeUri,
-          thumbUri,
+          uri: applyImageTransforms(fullsizeUri, {
+            imageCdnHost,
+            format: fullsizeFormat ?? 'webp',
+          }),
+          thumbUri: thumbUri
+            ? applyImageTransforms(thumbUri, {
+                imageCdnHost,
+                format: thumbnailFormat,
+              })
+            : undefined,
           aspectRatio: aspectRatio && aspectRatio > 0 ? aspectRatio : 1,
         }}
         borderRadius={borderRadius}
diff --git a/src/components/Post/Embed/ImageEmbed.tsx b/src/components/Post/Embed/ImageEmbed.tsx
index d3c4f6103..3c59b71e9 100644
--- a/src/components/Post/Embed/ImageEmbed.tsx
+++ b/src/components/Post/Embed/ImageEmbed.tsx
@@ -81,7 +81,7 @@ export function ImageEmbed({
   if (images.length > 0) {
     const items = images.map(img => {
       const {fullsize, thumb} = resolveEmbedImageUris(img, {
-        thumbnailFormat: thumbnailFormat ?? 'webp',
+        thumbnailFormat,
         fullsizeFormat: fullsizeFormat ?? 'webp',
         loadAsPngs: loadAsPngs ?? true,
       })
diff --git a/src/lib/media/embed-image-formats.ts b/src/lib/media/embed-image-formats.ts
index 83bbccc9b..2e01099af 100644
--- a/src/lib/media/embed-image-formats.ts
+++ b/src/lib/media/embed-image-formats.ts
@@ -12,7 +12,7 @@ export function resolveEmbedImageUris(
     fullsizeFormat,
     loadAsPngs,
   }: {
-    thumbnailFormat: string
+    thumbnailFormat?: string
     fullsizeFormat: string
     loadAsPngs: boolean
   },
@@ -26,7 +26,9 @@ export function resolveEmbedImageUris(
   const resolvedFullsizeFormat =
     pngSized && fullsizeFormat === 'webp' ? 'png' : fullsizeFormat
   const fullsize = modifyImageFormat(img.fullsize, resolvedFullsizeFormat)
-  const thumb = modifyImageFormat(img.thumb, thumbnailFormat)
+  const thumb = thumbnailFormat
+    ? modifyImageFormat(img.thumb, thumbnailFormat)
+    : img.thumb
 
   return {fullsize, thumb}
 }
diff --git a/src/lib/media/image-formats.test.ts b/src/lib/media/image-formats.test.ts
index 5f31aed56..02e04527c 100644
--- a/src/lib/media/image-formats.test.ts
+++ b/src/lib/media/image-formats.test.ts
@@ -47,3 +47,12 @@ it('does not override an explicitly chosen full-size format with PNG', () => {
   )
   expect(result.fullsize).toBe(image.replace('@jpeg', '@ico'))
 })
+
+it('reuses the feed thumbnail URL when no thumbnail format is selected', () => {
+  const thumb = image.replace('/feed_fullsize/', '/feed_thumbnail/')
+  const result = resolveEmbedImageUris(
+    {fullsize: image, thumb},
+    {fullsizeFormat: 'webp', loadAsPngs: true},
+  )
+  expect(result.thumb).toBe(thumb)
+})
-- 
2.51.2