feat: support monochrome tray icon

src-tauri/src/config/verge.rs

@@ -42,6 +42,10 @@ pub struct IVerge {
     /// common tray icon
     pub common_tray_icon: Option<bool>,
 
+    /// tray icon
+    #[cfg(target_os = "macos")]
+    pub tray_icon: Option<String>,
+
     /// menu icon
     pub menu_icon: Option<String>,
 
@@ -198,6 +202,8 @@ impl IVerge {
             traffic_graph: Some(true),
             enable_memory_usage: Some(true),
             enable_group_icon: Some(true),
+            #[cfg(target_os = "macos")]
+            tray_icon: Some("monochrome".into()),
             menu_icon: Some("monochrome".into()),
             common_tray_icon: Some(false),
             sysproxy_tray_icon: Some(false),
@@ -255,6 +261,8 @@ impl IVerge {
         patch!(traffic_graph);
         patch!(enable_memory_usage);
         patch!(enable_group_icon);
+        #[cfg(target_os = "macos")]
+        patch!(tray_icon);
         patch!(menu_icon);
         patch!(common_tray_icon);
         patch!(sysproxy_tray_icon);

src-tauri/src/core/tray.rs

@@ -172,14 +172,31 @@ impl Tray {
         let verge = verge.latest();
         let system_proxy = verge.enable_system_proxy.as_ref().unwrap_or(&false);
         let tun_mode = verge.enable_tun_mode.as_ref().unwrap_or(&false);
+        #[cfg(target_os = "macos")]
+        let tray_icon = verge.tray_icon.clone().unwrap_or("monochrome".to_string());
         let common_tray_icon = verge.common_tray_icon.as_ref().unwrap_or(&false);
         let sysproxy_tray_icon = verge.sysproxy_tray_icon.as_ref().unwrap_or(&false);
         let tun_tray_icon = verge.tun_tray_icon.as_ref().unwrap_or(&false);
-
+        #[cfg(target_os = "macos")]
+        match tray_icon.as_str() {
+            "monochrome" => {
+                let _ = tray.set_icon_as_template(true);
+            }
+            "colorful" => {
+                let _ = tray.set_icon_as_template(false);
+            }
+            _ => {}
+        }
         let mut indication_icon = if *system_proxy {
             #[cfg(target_os = "macos")]
-            let _ = tray.set_icon_as_template(false);
+            let mut icon = match tray_icon.as_str() {
+                "monochrome" => include_bytes!("../../icons/tray-icon-sys-mono.ico").to_vec(),
+                "colorful" => include_bytes!("../../icons/tray-icon-sys.ico").to_vec(),
+                _ => include_bytes!("../../icons/tray-icon-sys-mono.ico").to_vec(),
+            };
+            #[cfg(not(target_os = "macos"))]
             let mut icon = include_bytes!("../../icons/tray-icon-sys.ico").to_vec();
+
             if *sysproxy_tray_icon {
                 let icon_dir_path = dirs::app_home_dir()?.join("icons");
                 let png_path = icon_dir_path.join("sysproxy.png");
@@ -193,9 +210,11 @@ impl Tray {
             icon
         } else {
             #[cfg(target_os = "macos")]
-            let _ = tray.set_icon_as_template(true);
+            let mut icon = match tray_icon.as_str() {
-            #[cfg(target_os = "macos")]
+                "monochrome" => include_bytes!("../../icons/tray-icon-mono.ico").to_vec(),
-            let mut icon = include_bytes!("../../icons/mac-tray-icon.png").to_vec();
+                "colorful" => include_bytes!("../../icons/tray-icon.ico").to_vec(),
+                _ => include_bytes!("../../icons/tray-icon-mono.ico").to_vec(),
+            };
             #[cfg(not(target_os = "macos"))]
             let mut icon = include_bytes!("../../icons/tray-icon.ico").to_vec();
             if *common_tray_icon {
@@ -213,7 +232,12 @@ impl Tray {
 
         if *tun_mode {
             #[cfg(target_os = "macos")]
-            let _ = tray.set_icon_as_template(false);
+            let mut icon = match tray_icon.as_str() {
+                "monochrome" => include_bytes!("../../icons/tray-icon-tun-mono.ico").to_vec(),
+                "colorful" => include_bytes!("../../icons/tray-icon-tun.ico").to_vec(),
+                _ => include_bytes!("../../icons/tray-icon-tun-mono.ico").to_vec(),
+            };
+            #[cfg(not(target_os = "macos"))]
             let mut icon = include_bytes!("../../icons/tray-icon-tun.ico").to_vec();
             if *tun_tray_icon {
                 let icon_dir_path = dirs::app_home_dir()?.join("icons");

src-tauri/src/feat.rs

@@ -180,6 +180,8 @@ pub async fn patch_verge(patch: IVerge) -> Result<()> {
     let proxy_bypass = patch.system_proxy_bypass;
     let language = patch.language;
     let port = patch.verge_mixed_port;
+    #[cfg(target_os = "macos")]
+    let tray_icon = patch.tray_icon;
     let common_tray_icon = patch.common_tray_icon;
     let sysproxy_tray_icon = patch.sysproxy_tray_icon;
     let tun_tray_icon = patch.tun_tray_icon;
@@ -240,6 +242,10 @@ pub async fn patch_verge(patch: IVerge) -> Result<()> {
         {
             handle::Handle::update_systray_part()?;
         }
+        #[cfg(target_os = "macos")]
+        if tray_icon.is_some() {
+            handle::Handle::update_systray_part()?;
+        }
 
         <Result<()>>::Ok(())
     } {

src-tauri/tauri.macos.conf.json

@@ -2,7 +2,7 @@
   "$schema": "../node_modules/@tauri-apps/cli/schema.json",
   "tauri": {
     "systemTray": {
-      "iconPath": "icons/mac-tray-icon.png",
+      "iconPath": "icons/tray-icon-mono.ico",
       "iconAsTemplate": true
     },
     "bundle": {

src/components/setting/mods/layout-viewer.tsx

@@ -10,6 +10,9 @@ import { convertFileSrc } from "@tauri-apps/api/tauri";
 import { copyIconFile, getAppDir } from "@/services/cmds";
 import { join } from "@tauri-apps/api/path";
 import { exists } from "@tauri-apps/api/fs";
+import getSystem from "@/utils/get-system";
+
+const OS = getSystem();
 
 export const LayoutViewer = forwardRef<DialogRef>((props, ref) => {
   const { t } = useTranslation();
@@ -128,6 +131,25 @@ export const LayoutViewer = forwardRef<DialogRef>((props, ref) => {
             </Select>
           </GuardState>
         </SettingItem>
+        {OS === "macos" && (
+          <SettingItem label={t("Tray Icon")}>
+            <GuardState
+              value={verge?.tray_icon ?? "monochrome"}
+              onCatch={onError}
+              onFormat={(e: any) => e.target.value}
+              onChange={(e) => onChangeData({ tray_icon: e })}
+              onGuard={(e) => patchVerge({ tray_icon: e })}
+            >
+              <Select
+                size="small"
+                sx={{ width: 140, "> div": { py: "7.5px" } }}
+              >
+                <MenuItem value="monochrome">{t("Monochrome")}</MenuItem>
+                <MenuItem value="colorful">{t("Colorful")}</MenuItem>
+              </Select>
+            </GuardState>
+          </SettingItem>
+        )}
 
         <SettingItem label={t("Common Tray Icon")}>
           <GuardState

src/locales/en.json

@@ -122,6 +122,7 @@
   "Traffic Graph": "Traffic Graph",
   "Memory Usage": "Memory Usage",
   "Proxy Group Icon": "Proxy Group Icon",
+  "Tray Icon": "Tray Icon",
   "Menu Icon": "Menu Icon",
   "Monochrome": "Monochrome",
   "Colorful": "Colorful",

src/locales/ru.json

@@ -122,6 +122,7 @@
   "Traffic Graph": "График трафика",
   "Memory Usage": "Использование памяти",
   "Proxy Group Icon": "Иконка Группы прокси",
+  "Tray Icon": "Иконка лотка",
   "Menu Icon": "Иконка меню",
   "Monochrome": "Монохромный",
   "Colorful": "Полноцветный",

src/locales/zh.json

@@ -122,6 +122,7 @@
   "Traffic Graph": "流量图显",
   "Memory Usage": "内存使用",
   "Proxy Group Icon": "代理组图标",
+  "Tray Icon": "托盘图标",
   "Menu Icon": "菜单图标",
   "Monochrome": "单色图标",
   "Colorful": "彩色图标",

src/services/types.d.ts

@@ -207,6 +207,7 @@ interface IVergeConfig {
   enable_memory_usage?: boolean;
   enable_group_icon?: boolean;
   menu_icon?: "monochrome" | "colorful" | "disable";
+  tray_icon?: "monochrome" | "colorful";
   common_tray_icon?: boolean;
   sysproxy_tray_icon?: boolean;
   tun_tray_icon?: boolean;