Collapse encoded media in editable fields too (#534)

apps/yaak-client/lib/largeValue.ts

@@ -60,10 +60,23 @@ export function largeValueActions({
     });
   }
 
+  // Two ways to copy a picture, because either can be the one you wanted: the image to paste
+  // somewhere that takes one, or the text to paste back into a request
+  const image = isCopyableImage(sniffed);
+  if (image) {
+    items.push({
+      label: "Copy Image",
+      leftSlot: createElement(Icon, { icon: "copy" }),
+      onSelect: () => copyImage(value(), sniffed, copyText()),
+    });
+  }
+
   items.push({
-    label: sniffed?.mime.startsWith("image/") ? "Copy Image" : "Copy",
-    leftSlot: createElement(Icon, { icon: "copy" }),
-    onSelect: () => copyValue(value(), sniffed, copyText()),
+    label: sniffed?.encoding === "base64" ? "Copy Base64" : "Copy",
+    // Second of a pair reads as one thing with two options, so it keeps the indent without
+    // repeating the icon above it
+    leftSlot: createElement(Icon, { icon: image ? "empty" : "copy" }),
+    onSelect: () => copyToClipboard(copyText()),
   });
 
   items.push({
@@ -167,15 +180,15 @@ async function toPngBlob(text: string, sniffed: SniffedValue): Promise<Blob> {
 }
 
 /**
- * Copies the value: the picture itself when it is one, and the text it stands for otherwise.
+ * Puts the picture on the clipboard, so it can be pasted anywhere that takes an image.
  *
  * Not awaited, and deliberately so. The webview only allows a clipboard write that starts inside
  * the click that asked for it, and decoding a few megabytes takes longer than that lasts — so
  * the item is handed the still-pending promise rather than a finished blob.
  */
-export function copyValue(text: string, sniffed: SniffedValue | null, hidden: string) {
-  if (!isCopyableImage(sniffed) || typeof ClipboardItem === "undefined") {
-    copyToClipboard(hidden);
+export function copyImage(text: string, sniffed: SniffedValue, fallback: string) {
+  if (typeof ClipboardItem === "undefined") {
+    copyToClipboard(fallback);
     return;
   }
 
@@ -195,7 +208,7 @@ export function copyValue(text: string, sniffed: SniffedValue | null, hidden: st
       // Anything from a webview that won't take an image to a file we couldn't decode. The
       // encoded text is always there to fall back on.
       console.error("Failed to copy image, copying text instead", err);
-      copyToClipboard(hidden);
+      copyToClipboard(fallback);
     });
 }