refactor: use paths instead of filenames

src/main/ipc.ts

@@ -161,7 +161,7 @@ watch(
 );
 
 handle(IpcEvents.SET_TRAY_ICON, (_, iconURI) => setTrayIcon(iconURI));
-handle(IpcEvents.GET_TRAY_ICON, (_, iconName) => getTrayIconFile(iconName));
+handle(IpcEvents.GET_TRAY_ICON, (_, iconPath) => getTrayIconFile(iconPath));
 handle(IpcEvents.GET_SYSTEM_ACCENT_COLOR, () => `#${systemPreferences.getAccentColor?.() || ""}`);
 handle(IpcEvents.CREATE_TRAY_ICON_RESPONSE, (_, iconName, dataURL) => createTrayIcon(iconName, dataURL));
 handle(IpcEvents.GENERATE_TRAY_ICONS, () => generateTrayIcons());

src/main/mainWindow.ts

@@ -18,7 +18,7 @@ import {
 } from "electron";
 import { mkdirSync, writeFileSync } from "fs";
 import { readFile, rm } from "fs/promises";
-import { join } from "path";
+import { join, parse } from "path";
 import { IpcEvents } from "shared/IpcEvents";
 import { isTruthy } from "shared/utils/guards";
 import { once } from "shared/utils/once";
@@ -517,17 +517,18 @@ export async function setTrayIcon(iconName: string) {
     tray.setImage(join(STATIC_DIR, "icon.png"));
 }
 
-export async function getTrayIconFile(iconName: string) {
+export async function getTrayIconFile(iconPath: string) {
     const Icons = new Set(["speaking", "muted", "deafened", "idle"]);
-    // add here checks for user-defined icons
+    if (!Icons.has(parse(iconPath).name)) {
-    if (!Icons.has(iconName)) {
+        iconPath = "icon";
-        iconName = "icon";
         return readFile(join(STATIC_DIR, "icon.png"));
     }
-    return readFile(join(STATIC_DIR, iconName + ".svg"), "utf8");
+    return readFile(iconPath, "utf8");
 }
 
 export async function createTrayIcon(iconName: string, iconDataURL: string) {
+    // creates .png at config/TrayIcons/iconName.png from given iconDataURL
+    // primarily called from renderer using CREATE_TRAY_ICON_RESPONSE IPC call
     iconDataURL = iconDataURL.replace(/^data:image\/png;base64,/, "");
     writeFileSync(join(DATA_DIR, "TrayIcons", iconName + ".png"), iconDataURL, "base64");
     mainWin.webContents.send(IpcEvents.SET_CURRENT_VOICE_TRAY_ICON);
@@ -539,7 +540,7 @@ export async function generateTrayIcons(force = false) {
     if (force || !Settings.store.trayCustom) {
         const Icons = ["speaking", "muted", "deafened", "idle"];
         for (const icon of Icons) {
-            mainWin.webContents.send(IpcEvents.CREATE_TRAY_ICON_REQUEST, icon);
+            mainWin.webContents.send(IpcEvents.CREATE_TRAY_ICON_REQUEST, join(STATIC_DIR, icon + ".svg"));
         }
     }
     mainWin.webContents.send(IpcEvents.SET_CURRENT_VOICE_TRAY_ICON);

src/preload/VesktopNative.ts

@@ -82,11 +82,11 @@ export const VesktopNative = {
     },
     tray: {
         setIcon: (iconURI: string) => invoke<void>(IpcEvents.SET_TRAY_ICON, iconURI),
-        getIcon: (iconName: string) => invoke<string>(IpcEvents.GET_TRAY_ICON, iconName),
+        getIcon: (iconPath: string) => invoke<string>(IpcEvents.GET_TRAY_ICON, iconPath),
         createIconResponse: (iconName: string, iconDataURL: string) =>
             invoke<void>(IpcEvents.CREATE_TRAY_ICON_RESPONSE, iconName, iconDataURL),
         createIconRequest: (listener: (iconName: string) => void) => {
-            ipcRenderer.on(IpcEvents.CREATE_TRAY_ICON_REQUEST, (_, iconName: string) => listener(iconName));
+            ipcRenderer.on(IpcEvents.CREATE_TRAY_ICON_REQUEST, (_, iconPath: string) => listener(iconPath));
         },
         generateTrayIcons: () => invoke<void>(IpcEvents.GENERATE_TRAY_ICONS),
         setCurrentVoiceIcon: (listener: (...args: any[]) => void) => {

src/renderer/patches/tray.ts

@@ -25,12 +25,12 @@ export function setCurrentTrayIcon() {
     }
 }
 
-VesktopNative.tray.createIconRequest(async (iconName: string) => {
+VesktopNative.tray.createIconRequest(async (iconPath: string) => {
     const pickedColor = VesktopNative.settings.get().trayColor;
     const fillColor = VesktopNative.settings.get().trayAutoFill ?? "auto";
 
     try {
-        var svg = await VesktopNative.tray.getIcon(iconName);
+        var svg = await VesktopNative.tray.getIcon(iconPath);
         svg = svg.replace(/#f6bfac/gim, "#" + (pickedColor ?? "3DB77F"));
         if (fillColor !== "auto") {
             svg = svg.replace(/black/gim, fillColor);
@@ -47,7 +47,9 @@ VesktopNative.tray.createIconRequest(async (iconName: string) => {
             if (ctx) {
                 ctx.drawImage(img, 0, 0);
                 const dataURL = canvas.toDataURL("image/png");
-                VesktopNative.tray.createIconResponse(iconName, dataURL);
+                const fileNameExt = iconPath.replace(/^.*[\\/]/, "");
+                const fileName = fileNameExt.substring(0, fileNameExt.lastIndexOf("."));
+                VesktopNative.tray.createIconResponse(fileName, dataURL);
             }
         };
         img.src = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svg)}`;