Add new context menu item to download images (#935)

2 files changed, 31 insertions, 20 deletions

diff --git a/src/electron/ipc-api/download.ts b/src/electron/ipc-api/download.ts
index 518a7091c..851bff4c3 100644
--- a/src/electron/ipc-api/download.ts
+++ b/src/electron/ipc-api/download.ts
@@ -1,6 +1,5 @@
 import { ipcMain, dialog, BrowserWindow } from 'electron';
 import { download } from 'electron-dl';
-import mime from 'mime-types';
 import { writeFileSync } from 'fs-extra';
 import { PathLike } from 'fs';
 
@@ -24,12 +23,9 @@ export default (params: { mainWindow: BrowserWindow }) => {
 
       try {
         if (content) {
-          const extension = mime.extension(fileOptions.mime);
-          const filename = `${fileOptions.name}.${extension}`;
-
           try {
             const saveDialog = await dialog.showSaveDialog(params.mainWindow, {
-              defaultPath: filename,
+              defaultPath: fileOptions.name,
             });
 
             if (saveDialog.canceled) return;
diff --git a/src/webview/contextMenuBuilder.ts b/src/webview/contextMenuBuilder.ts
index 2e64977c1..6d904eee3 100644
--- a/src/webview/contextMenuBuilder.ts
+++ b/src/webview/contextMenuBuilder.ts
@@ -633,27 +633,42 @@ export class ContextMenuBuilder {
     menu.append(copyImageUrl);
 
     // TODO: This doesn't seem to work on linux, so, limiting to Mac for now
-    if (isMac && menuInfo.srcURL.startsWith('blob:')) {
-      const downloadImage = new MenuItem({
-        label: this.stringTable.downloadImage(),
-        click: () => {
-          const urlWithoutBlob = menuInfo.srcURL.slice(5);
-          this.convertImageToBase64(menuInfo.srcURL, (dataURL: any) => {
-            const url = new window.URL(urlWithoutBlob);
+    if (isMac) {
+      const clickHandler = menuInfo.srcURL.startsWith('blob:')
+        ? () => {
+            const urlWithoutBlob = menuInfo.srcURL.slice(5);
+            this.convertImageToBase64(menuInfo.srcURL, (dataURL: any) => {
+              const url = new window.URL(urlWithoutBlob);
+              const fileName = url.pathname.slice(1);
+              ipcRenderer.send('download-file', {
+                content: dataURL,
+                fileOptions: {
+                  name: `${fileName}.png`,
+                },
+              });
+            });
+            this._sendNotificationOnClipboardEvent(
+              menuInfo.clipboardNotifications,
+              () => `Image downloaded: ${urlWithoutBlob}`,
+            );
+          }
+        : () => {
+            const url = new window.URL(menuInfo.srcURL);
             const fileName = url.pathname.slice(1);
             ipcRenderer.send('download-file', {
-              content: dataURL,
+              url: menuInfo.srcURL,
               fileOptions: {
                 name: fileName,
-                mime: 'image/png',
               },
             });
-          });
-          this._sendNotificationOnClipboardEvent(
-            menuInfo.clipboardNotifications,
-            () => `Image downloaded: ${urlWithoutBlob}`,
-          );
-        },
+            this._sendNotificationOnClipboardEvent(
+              menuInfo.clipboardNotifications,
+              () => `Image downloaded: ${menuInfo.srcURL}`,
+            );
+          };
+      const downloadImage = new MenuItem({
+        label: this.stringTable.downloadImage(),
+        click: clickHandler,
       });
 
       menu.append(downloadImage);