From 16f343be52bf85dd765d1064ac5ad3b40a0694d7 Mon Sep 17 00:00:00 2001
From: Vendicated <vendicated@riseup.net>
Date: Wed, 17 Dec 2025 22:56:07 +0100
Subject: [PATCH] FixImageQuality: fix videos & don't animate gifs if app
 unfocused

---
 src/plugins/fixImagesQuality/index.tsx | 40 +++++++++++++++++---------
 1 file changed, 27 insertions(+), 13 deletions(-)

diff --git a/src/plugins/fixImagesQuality/index.tsx b/src/plugins/fixImagesQuality/index.tsx
index 4c3e6eeb3..fc9859d9b 100644
--- a/src/plugins/fixImagesQuality/index.tsx
+++ b/src/plugins/fixImagesQuality/index.tsx
@@ -7,6 +7,7 @@
 import { definePluginSettings } from "@api/Settings";
 import { Card } from "@components/Card";
 import { Flex } from "@components/Flex";
+import { Margins } from "@components/margins";
 import { Paragraph } from "@components/Paragraph";
 import { Devs } from "@utils/constants";
 import { Logger } from "@utils/Logger";
@@ -15,7 +16,7 @@ import definePlugin, { OptionType } from "@utils/types";
 const settings = definePluginSettings({
     originalImagesInChat: {
         type: OptionType.BOOLEAN,
-        description: "Also load the original image in Chat",
+        description: "Also load the original image in Chat. WARNING: Read the caveats above",
         default: false,
     }
 });
@@ -31,7 +32,7 @@ export default definePlugin({
             find: ".handleImageLoad)",
             replacement: {
                 match: /getSrc\(\i\)\{/,
-                replace: "$&var _vcSrc=$self.getSrc(this.props);if(_vcSrc)return _vcSrc;"
+                replace: "$&var _vcSrc=$self.getSrc(this.props,arguments[1]);if(_vcSrc)return _vcSrc;"
             }
         }
     ],
@@ -47,36 +48,49 @@ export default definePlugin({
                             <li>&mdash; In the image modal, the original image will be loaded.</li>
                         </ul>
                     </Paragraph>
+                    <Paragraph size="md" weight="semibold" className={Margins.top8}>You can also enable original image in chat, but beware of the following caveats:</Paragraph>
                     <Paragraph>
-                        You can also enable original image in chat, but this may cause performance issues!
+                        <ul>
+                            <li>&mdash; Animated images (GIF, WebP, etc.) in chat will always animate, regardless of if the App is focused.</li>
+                            <li>&mdash; May cause lag.</li>
+                        </ul>
                     </Paragraph>
                 </Flex>
             </Card>
         );
     },
 
-    getSrc(props: { src: string; mediaLayoutType: string; width: number; height: number; }) {
-        if (!props) return;
+    getSrc(props: { src: string; mediaLayoutType: string; width: number; height: number; contentType: string; }, freeze?: boolean) {
+        if (!props?.src) return;
 
         try {
-            if (!settings.store.originalImagesInChat && props.mediaLayoutType === "MOSAIC") {
+            const { contentType, height, mediaLayoutType, src, width } = props;
+            if (!contentType?.startsWith("image/") || src.startsWith("data:")) return;
+
+            console.log({ src, freeze });
+            const url = new URL(src);
+            url.searchParams.set("animated", String(!freeze));
+
+            if (!settings.store.originalImagesInChat && mediaLayoutType === "MOSAIC") {
                 // make sure the image is not too large
-                const pixels = props.width * props.height;
+                const pixels = width * height;
                 const limit = 2000 * 1200;
 
-                if (pixels <= limit) return props.src;
+                if (pixels <= limit)
+                    return url.toString();
 
                 const scale = Math.sqrt(pixels / limit);
-                const url = new URL(props.src);
-                url.searchParams.set("width", Math.round(props.width / scale).toString());
-                url.searchParams.set("height", Math.round(props.height / scale).toString());
+
+                url.searchParams.set("width", Math.round(width / scale).toString());
+                url.searchParams.set("height", Math.round(height / scale).toString());
                 return url.toString();
             }
 
-            return props.src?.replace("https://media.discordapp.net/attachments/", "https://cdn.discordapp.com/attachments/");
+            url.hostname = "cdn.discordapp.com";
+            return url.toString();
         } catch (e) {
             new Logger("FixImagesQuality").error("Failed to make image src", e);
-            return props.src;
+            return;
         }
     }
 });