(feat): improve tray icon

(qol): update todo

apps/electron/src/main/main.ts

@@ -12,10 +12,11 @@ import {
 import { checkForUpdates } from "./updates.js";
 import {
   ipcChannels,
+  type DesktopCallStatus,
   type DesktopScreenShareAudioOutput,
   type DesktopScreenShareCapabilities,
 } from "../shared/ipc.js";
-import { initTray } from "./tray.js";
+import { initTray, setTrayCallStatus } from "./tray.js";
 
 const __dirname = dirname(fileURLToPath(import.meta.url));
 const verbose = process.argv.includes("--verbose");
@@ -189,6 +190,25 @@ function registerIpc() {
   );
   ipcMain.handle(ipcChannels.getVersion, () => app.getVersion());
   ipcMain.handle(ipcChannels.checkForUpdates, checkForUpdates);
+  ipcMain.handle(ipcChannels.setCallStatus, (_event, status: unknown) => {
+    if (
+      typeof status !== "object" ||
+      status === null ||
+      typeof (status as DesktopCallStatus).inCall !== "boolean" ||
+      typeof (status as DesktopCallStatus).speaking !== "boolean" ||
+      ((status as DesktopCallStatus).iconDataUrl !== undefined &&
+        (typeof (status as DesktopCallStatus).iconDataUrl !== "string" ||
+          !(status as DesktopCallStatus).iconDataUrl?.startsWith(
+            "data:image/png;base64,",
+          ) ||
+          (status as DesktopCallStatus).iconDataUrl!.length > 16_384))
+    ) {
+      throw new Error("Invalid call status.");
+    }
+
+    const { inCall, iconDataUrl } = status as DesktopCallStatus;
+    setTrayCallStatus(inCall, iconDataUrl);
+  });
   ipcMain.handle(ipcChannels.minimizeWindow, () => {
     verboseLog("window:minimize");
     mainWindow?.minimize();
@@ -311,7 +331,7 @@ async function start() {
   verboseLog("app ready");
   registerIpc();
   registerDisplayMediaHandler();
-  initTray();
+  initTray(() => mainWindow);
   await createWindow();
 }
 

apps/electron/src/main/tray.ts

@@ -1,4 +1,4 @@
-import { Tray, Menu } from "electron";
+import { app, BrowserWindow, Menu, nativeImage, Tray } from "electron";
 import path from "node:path";
 import { fileURLToPath } from "node:url";
 
@@ -7,19 +7,56 @@ let tray: Tray | null = null;
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 
-export function initTray() {
-  const iconPath = path.join(__dirname, "../../build/icons/32x32.png");
+function getTrayIconPath(filename: string) {
+  if (app.isPackaged) return path.join(process.resourcesPath, "icons", filename);
+  return path.resolve(__dirname, "../../build/icons", filename);
+}
 
-  tray = new Tray(iconPath); // keep reference alive
+export function setTrayCallStatus(
+  inCall: boolean,
+  iconDataUrl?: string,
+) {
+  if (!tray) return;
+
+  if (inCall && iconDataUrl) {
+    const image = nativeImage.createFromDataURL(iconDataUrl);
+    if (!image.isEmpty()) {
+      tray.setImage(image);
+      return;
+    }
+  }
+
+  tray.setImage(getTrayIconPath("32x32.png"));
+}
+
+export function initTray(getMainWindow: () => BrowserWindow | null) {
+  tray = new Tray(getTrayIconPath("32x32.png")); // keep reference alive
 
   const contextMenu = Menu.buildFromTemplate([
-    { label: "Restart", type: "normal" },
-    { label: "Quit", type: "normal" },
+    {
+      label: "Restart",
+      type: "normal",
+      click: () => {
+        app.relaunch();
+        app.quit();
+      },
+    },
+    { label: "Quit", type: "normal", click: () => app.quit() },
   ]);
 
   tray.setContextMenu(contextMenu);
 
-  tray.on("click", (event) => {
-    console.log(event);
+  tray.on("click", () => {
+    const mainWindow = getMainWindow();
+    if (!mainWindow) return;
+
+    if (mainWindow.isVisible()) {
+      mainWindow.hide();
+      return;
+    }
+
+    if (mainWindow.isMinimized()) mainWindow.restore();
+    mainWindow.show();
+    mainWindow.focus();
   });
 }