From 9db2d746e8f921480928e126238cc233861e80b3 Mon Sep 17 00:00:00 2001
From: oma <57739965+Eazvy@users.noreply.github.com>
Date: Mon, 2 Mar 2026 13:59:17 -0500
Subject: [PATCH] fix PictureInPicture render on image files (#841)

* fix(pictureInPicture): gate button for video media only

* PictureInPicture: simplify media gating checks

* PictureInPicture: guard mime check in shouldShowButton

* fix replace & typeof

* fix ugh

* fix(pictureInPicture): handle array-shaped mimeType values

* pictureInPicture: simplify mime type handling with join
---
 src/plugins/pictureInPicture/index.tsx | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/plugins/pictureInPicture/index.tsx b/src/plugins/pictureInPicture/index.tsx
index ff8c00ebb..d1324dc82 100644
--- a/src/plugins/pictureInPicture/index.tsx
+++ b/src/plugins/pictureInPicture/index.tsx
@@ -30,12 +30,20 @@ export default definePlugin({
         {
             find: '["VIDEO","CLIP","AUDIO"]',
             replacement: {
-                match: /(\[\i>0&&\i\.length>0.{0,150}?children:)(\i.slice\(\i\))(?<=showDownload:(\i).+?isVisualMediaType:(\i).+?)/,
-                replace: (_, rest, origChildren, showDownload, isVisualMediaType) => `${rest}[${showDownload}&&${isVisualMediaType}&&$self.PictureInPictureButton(),...${origChildren}]`
+                match: /(\[\i>0&&\i\.length>0.{0,150}?children:)(\i.slice\(\i\))(?<=mimeType:(\i),downloadURL:(\i).+?showDownload:(\i).+?isVisualMediaType:(\i).+?)/,
+                replace: (_, rest, origChildren, mimeType, downloadURL, showDownload, isVisualMediaType) =>
+                    `${rest}[${showDownload}&&${isVisualMediaType}&&$self.shouldShowButton(${mimeType},${downloadURL})&&$self.PictureInPictureButton(),...${origChildren}]`
             }
         }
     ],
 
+    shouldShowButton(mimeType: string[] = [], downloadURL?: string) {
+        const normalizedMimeType = mimeType.join("/");
+        if (normalizedMimeType.startsWith("video/")) return true;
+        if (!downloadURL) return false;
+        return /\.(mp4|webm|mov|m4v|ogv|avi)(?:$|[?#])/i.test(downloadURL);
+    },
+
     PictureInPictureButton: ErrorBoundary.wrap(() => {
         return (
             <Tooltip text="Toggle Picture in Picture">