download: Show in-app notification on downlaoding a file.

Fixes #1371.
We do not accept a filePath from the web app when recieving the event to
show the file in a folder, since that could introduce securithy
vulnerabilies. We store the latest downloaded file path instead in a
variable. Only one in-app notification is active at a time, so storing
the latest file path is enough for out use case.

Author: shubham-padia

app/common/typed-ipc.ts

@@ -13,6 +13,7 @@ export type MainMessage = {
   "realm-icon-changed": (serverURL: string, iconURL: string) => void;
   "realm-name-changed": (serverURL: string, realmName: string) => void;
   "reload-full-app": () => void;
+  "show-downloaded-file-in-folder": () => void;
   "save-last-tab": (index: number) => void;
   "switch-server-tab": (index: number) => void;
   "toggle-app": () => void;
@@ -59,6 +60,7 @@ export type RendererMessage = {
   "reload-proxy": (showAlert: boolean) => void;
   "reload-viewer": () => void;
   "render-taskbar-icon": (messageCount: number) => void;
+  "show-download-success": (title: string, description: string) => void;
   "set-active": () => void;
   "set-idle": () => void;
   "show-keyboard-shortcuts": () => void;

app/main/handle-external-link.ts

@@ -15,6 +15,12 @@ import * as t from "../common/translation-util.ts";
 
 import {send} from "./typed-ipc-main.ts";
 
+let latestDownloadPath: string | undefined;
+
+export function getLatestDownloadPath(): string | undefined {
+  return latestDownloadPath;
+}
+
 function isUploadsUrl(server: string, url: URL): boolean {
   return url.origin === server && url.pathname.startsWith("/user_uploads/");
 }
@@ -125,16 +131,33 @@ export default function handleExternalLink(
       url: url.href,
       downloadPath,
       async completed(filePath: string, fileName: string) {
+        const notificationTitle = t.__("Download complete");
+        const notificationBody = t.__(
+          "Click to view the folder where the file ({{{fileName}}}) was downloaded.",
+          {
+            fileName,
+          },
+        );
+        // Show native notification
         const downloadNotification = new Notification({
-          title: t.__("Download Complete"),
-          body: t.__("Click to show {{{fileName}}} in folder", {fileName}),
+          title: notificationTitle,
+          body: notificationBody,
           silent: true, // We'll play our own sound - ding.ogg
         });
         downloadNotification.on("click", () => {
           // Reveal file in download folder
           shell.showItemInFolder(filePath);
         });
         downloadNotification.show();
+        latestDownloadPath = filePath;
+        // Event to show in-app notification in addition to the native
+        // notification.
+        send(
+          contents,
+          "show-download-success",
+          notificationTitle,
+          notificationBody,
+        );
 
         // Play sound to indicate download complete
         if (!ConfigUtil.getConfigItem("silent", false)) {
@@ -150,7 +173,7 @@ export default function handleExternalLink(
         if (state !== "cancelled") {
           if (ConfigUtil.getConfigItem("promptDownload", false)) {
             new Notification({
-              title: t.__("Download Complete"),
+              title: t.__("Download complete"),
               body: t.__("Download failed"),
             }).show();
           } else {

app/main/index.ts

@@ -1,4 +1,4 @@
-import {clipboard} from "electron/common";
+import {clipboard, shell} from "electron/common";
 import {
   BrowserWindow,
   type IpcMainEvent,
@@ -25,7 +25,9 @@ import type {MenuProperties} from "../common/types.ts";
 
 import {appUpdater, shouldQuitForUpdate} from "./autoupdater.ts";
 import * as BadgeSettings from "./badge-settings.ts";
-import handleExternalLink from "./handle-external-link.ts";
+import handleExternalLink, {
+  getLatestDownloadPath,
+} from "./handle-external-link.ts";
 import * as AppMenu from "./menu.ts";
 import {_getServerSettings, _isOnline, _saveServerIcon} from "./request.ts";
 import {sentryInit} from "./sentry.ts";
@@ -452,6 +454,13 @@ function createMainWindow(): BrowserWindow {
     },
   );
 
+  ipcMain.on("show-downloaded-file-in-folder", () => {
+    const filePath = getLatestDownloadPath();
+    if (filePath !== undefined) {
+      shell.showItemInFolder(filePath);
+    }
+  });
+
   ipcMain.on("save-last-tab", (_event, index: number) => {
     ConfigUtil.setConfigItem("lastActiveTab", index);
   });

app/renderer/js/electron-bridge.ts

@@ -103,6 +103,11 @@ bridgeEvents.addEventListener("realm_icon_url", (event) => {
   );
 });
 
+bridgeEvents.addEventListener("show-downloaded-file-in-folder", (event) => {
+  z.tuple([]).parse(z.instanceof(BridgeEvent).parse(event).arguments_);
+  ipcRenderer.send("show-downloaded-file-in-folder");
+});
+
 // Set user as active and update the time of last activity
 ipcRenderer.on("set-active", () => {
   idle = false;

app/renderer/js/preload.ts

@@ -18,6 +18,15 @@ ipcRenderer.on("show-notification-settings", () => {
   bridgeEvents.dispatchEvent(new BridgeEvent("show-notification-settings"));
 });
 
+ipcRenderer.on(
+  "show-download-success",
+  (_event, title: string, description: string) => {
+    bridgeEvents.dispatchEvent(
+      new BridgeEvent("show-download-success", [title, description]),
+    );
+  },
+);
+
 window.addEventListener("load", () => {
   if (!location.href.includes("app/renderer/network.html")) {
     return;