Merge pull request Expensify#54982 from linhvovan29546/fix/53881-png-…

…attachment-shown-with-background-color

src/components/HTMLEngineProvider/HTMLRenderers/ImageRenderer.tsx

@@ -59,6 +59,10 @@ function ImageRenderer({tnode}: ImageRendererProps) {
 
     // Files created/uploaded/hosted by App should resolve from API ROOT. Other URLs aren't modified
     const previewSource = tryResolveUrlFromApiRoot(htmlAttribs.src);
+    // The backend always returns these thumbnails with a .jpg extension, even for .png images.
+    // As a workaround, we remove the .1024.jpg or .320.jpg suffix only for .png images,
+    // For other image formats, we retain the thumbnail as is to avoid unnecessary modifications.
+    const processedPreviewSource = typeof previewSource === 'string' ? previewSource.replace(/\.png\.(1024|320)\.jpg$/, '.png') : previewSource;
     const source = tryResolveUrlFromApiRoot(isAttachmentOrReceipt ? attachmentSourceAttribute : htmlAttribs.src);
 
     const alt = htmlAttribs.alt;
@@ -78,7 +82,7 @@ function ImageRenderer({tnode}: ImageRendererProps) {
 
     const thumbnailImageComponent = (
         <ThumbnailImage
-            previewSourceURL={previewSource}
+            previewSourceURL={processedPreviewSource}
             style={styles.webViewStyles.tagStyles.img}
             isAuthTokenRequired={isAttachmentOrReceipt}
             fallbackIcon={fallbackIcon}