v0.0.26

chore: update log
fix: close dialog after save
2022-03-28 01:30:54 +08:00 · 2022-03-28 01:18:18 +08:00 · 2022-03-28 01:09:34 +08:00 · 2022-03-28 01:07:14 +08:00 · 2022-03-28 00:56:48 +08:00 · 2022-03-27 20:36:13 +08:00
61 changed files with 1796 additions and 479 deletions
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -10,7 +10,7 @@ jobs:
  release:
    strategy:
      matrix:
-        os: [windows-latest, macos-11]
+        os: [windows-latest, ubuntu-latest, macos-latest]
    runs-on: ${{ matrix.os }}
    if: |
      startsWith(github.repository, 'zzzgydi') &&
@@ -34,6 +34,12 @@ jobs:
        with:
          node-version: 14

+      - name: Install Dependencies (ubuntu only)
+        if: matrix.os == 'ubuntu-latest'
+        run: |
+          sudo apt-get update
+          sudo apt-get install -y libgtk-3-dev webkit2gtk-4.0 libappindicator3-dev librsvg2-dev patchelf
+
      - name: Get yarn cache dir path
        id: yarn-cache-dir-path
        run: echo "::set-output name=dir::$(yarn cache dir)"
@@ -53,9 +59,9 @@ jobs:
          yarn run check

      - name: Tauri build
-        uses: tauri-apps/tauri-action@b9ce5d7dc68082d21d30a60103b0ab8c5ddae3a1
+        uses: tauri-apps/tauri-action@0e558392ccadcb49bcc89e7df15a400e8f0c954d
        # enable cache even though failed
-        continue-on-error: true
+        # continue-on-error: true
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          TAURI_PRIVATE_KEY: ${{ secrets.TAURI_PRIVATE_KEY }}
@@ -67,9 +73,16 @@ jobs:
          releaseDraft: false
          prerelease: true

+      - name: Green zip bundle
+        if: matrix.os == 'windows-latest'
+        run: |
+          yarn run green
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
  release-update:
    needs: release
-    runs-on: macos-11
+    runs-on: macos-latest
    if: |
      startsWith(github.repository, 'zzzgydi') &&
      startsWith(github.ref, 'refs/tags/v')
@@ -91,7 +104,7 @@ jobs:
            ${{ runner.os }}-yarn-

      - name: Yarn install
-        run: yarn
+        run: yarn install

      - name: Release update.json
        run: yarn run release
--- a/README.md
+++ b/README.md
@@ -11,7 +11,17 @@ A <a href="https://github.com/Dreamacro/clash">Clash</a> GUI based on <a href="h

 ## Features

-Now it's no different from the others, maybe fewer. (WIP)
+- Full `clash` config supported, Partial `clash premium` config supported.
+- Profiles management and enhancement (by yaml and Javascript).
+- System proxy setting and guard.
+
+## Install
+
+Download from [release](https://github.com/zzzgydi/clash-verge/releases). Supports Windows x64, Linux x86_64 and macOS 11+
+
+Or you can build it yourself. Supports Windows, Linux and macOS 10.15+
+
+Notes: If you could not start the app on Windows, please check that you have [Webview2](https://developer.microsoft.com/en-us/microsoft-edge/webview2/#download-section) installed.

 ## Development

@@ -33,6 +43,12 @@ Then run
 yarn dev
 ```

+Or you can build it
+
+```shell
+yarn build
+```
+
 ## Todos

 > This keng is a little big...
--- a/UPDATELOG.md
+++ b/UPDATELOG.md
@@ -0,0 +1,62 @@
+## v0.0.26
+
+### Features
+
+- silent start
+- profile editor
+- profile enhance mode supports more fields
+- optimize profile enhance mode strategy
+
+### Bug Fixes
+
+- fix csp restriction on macOS
+- window controllers on Linux
+
+---
+
+## v0.0.25
+
+### Features
+
+- update clash core version
+
+### Bug Fixes
+
+- app updater error
+- display window controllers on Linux
+
+### Notes
+
+If you can't update the app properly, please consider downloading the latest version from github release.
+
+---
+
+## v0.0.24
+
+### Features
+
+- Connections page
+- add wintun.dll (Windows)
+- supports create local profile with selected file (Windows)
+- system tray enable set system proxy
+
+### Bug Fixes
+
+- open dir error
+- auto launch path (Windows)
+- fix some clash config error
+- reduce the impact of the enhanced mode
+
+---
+
+## v0.0.23
+
+### Features
+
+- i18n supports
+- Remote profile User Agent supports
+
+### Bug Fixes
+
+- clash config file case ignore
+- clash `external-controller` only port
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "clash-verge",
-  "version": "0.0.22",
+  "version": "0.0.26",
  "license": "GPL-3.0",
  "scripts": {
    "dev": "tauri dev",
@@ -10,6 +10,7 @@
    "web:build": "tsc && vite build",
    "web:serve": "vite preview",
    "check": "node scripts/check.mjs",
+    "green": "node scripts/green.mjs",
    "publish": "node scripts/publish.mjs",
    "release": "node scripts/release.mjs",
    "prepare": "husky install"
@@ -23,11 +24,15 @@
    "ahooks": "^3.1.13",
    "axios": "^0.26.0",
    "dayjs": "^1.10.8",
+    "i18next": "^21.6.14",
+    "monaco-editor": "^0.33.0",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
+    "react-i18next": "^11.15.6",
    "react-router-dom": "^6.2.2",
    "react-virtuoso": "^2.7.0",
    "recoil": "^0.6.1",
+    "snarkdown": "^2.0.0",
    "swr": "^1.2.1"
  },
  "devDependencies": {
@@ -45,7 +50,8 @@
    "pretty-quick": "^3.1.3",
    "sass": "^1.49.7",
    "typescript": "^4.5.5",
-    "vite": "^2.8.6"
+    "vite": "^2.8.6",
+    "vite-plugin-monaco-editor": "^1.0.10"
  },
  "prettier": {
    "tabWidth": 2,
--- a/scripts/check.mjs
+++ b/scripts/check.mjs
@@ -8,16 +8,16 @@ import { execSync } from "child_process";
 const cwd = process.cwd();
 const FORCE = process.argv.includes("--force");

-const CLASH_URL_PREFIX =
-  "https://github.com/Dreamacro/clash/releases/download/premium/";
-const CLASH_LATEST_DATE = "2022.01.27";
-
 /**
 * get the correct clash release infomation
 */
 function resolveClash() {
  const { platform, arch } = process;

+  const CLASH_URL_PREFIX =
+    "https://github.com/Dreamacro/clash/releases/download/premium/";
+  const CLASH_LATEST_DATE = "2022.03.21";
+
  // todo
  const map = {
    "win32-x64": "clash-windows-amd64",
@@ -84,13 +84,55 @@ async function resolveSidecar() {
        console.log(`[INFO]: gunzip finished`);
        execSync(`chmod 755 ${sidecarPath}`);
        console.log(`[INFO]: chmod binary finished`);
-      });
+      })
+      .on("error", (error) => console.error(error));
  }

  // delete temp dir
  await fs.remove(tempDir);
 }

+/**
+ * only Windows
+ * get the wintun.dll (not required)
+ */
+async function resolveWintun() {
+  const { platform } = process;
+
+  if (platform !== "win32") return;
+
+  const url = "https://www.wintun.net/builds/wintun-0.14.1.zip";
+
+  const tempDir = path.join(cwd, "pre-dev-temp-1");
+  const tempZip = path.join(tempDir, "wintun.zip");
+
+  const wintunPath = path.join(tempDir, "wintun/bin/amd64/wintun.dll");
+  const targetPath = path.join(cwd, "src-tauri/resources", "wintun.dll");
+
+  if (!FORCE && (await fs.pathExists(targetPath))) return;
+
+  await fs.mkdirp(tempDir);
+
+  if (!(await fs.pathExists(tempZip))) {
+    await downloadFile(url, tempZip);
+  }
+
+  // unzip
+  const zip = new AdmZip(tempZip);
+  zip.extractAllTo(tempDir, true);
+
+  if (!(await fs.pathExists(wintunPath))) {
+    throw new Error(`path not found "${wintunPath}"`);
+  }
+
+  // move wintun.dll to resources
+  await fs.rename(wintunPath, targetPath);
+  // delete temp dir
+  await fs.remove(tempDir);
+
+  console.log(`[INFO]: resolve wintun.dll finished`);
+}
+
 /**
 * get the Country.mmdb (not required)
 */
@@ -123,4 +165,5 @@ async function downloadFile(url, path) {

 /// main
 resolveSidecar().catch(console.error);
+resolveWintun().catch(console.error);
 resolveMmdb().catch(console.error);
--- a/scripts/green.mjs
+++ b/scripts/green.mjs
@@ -0,0 +1,56 @@
+import fs from "fs-extra";
+import path from "path";
+import AdmZip from "adm-zip";
+import { createRequire } from "module";
+import { getOctokit, context } from "@actions/github";
+
+/// Script for ci
+/// 打包绿色版/便携版 (only Windows)
+async function resolveGreen() {
+  if (process.platform !== "win32") return;
+
+  const releaseDir = "./src-tauri/target/release";
+
+  if (!(await fs.pathExists(releaseDir))) {
+    throw new Error("could not found the release dir");
+  }
+
+  const zip = new AdmZip();
+
+  zip.addLocalFile(path.join(releaseDir, "Clash Verge.exe"));
+  zip.addLocalFile(path.join(releaseDir, "clash.exe"));
+  zip.addLocalFolder(path.join(releaseDir, "resources"), "resources");
+
+  const require = createRequire(import.meta.url);
+  const packageJson = require("../package.json");
+  const { version } = packageJson;
+
+  const zipFile = `Clash.Verge_${version}_x64_green.zip`;
+  zip.writeZip(zipFile);
+
+  console.log("[INFO]: create green zip successfully");
+
+  // push release assets
+  if (process.env.GITHUB_TOKEN === undefined) {
+    throw new Error("GITHUB_TOKEN is required");
+  }
+
+  const options = { owner: context.repo.owner, repo: context.repo.repo };
+  const github = getOctokit(process.env.GITHUB_TOKEN);
+
+  const { data: release } = await github.rest.repos.getReleaseByTag({
+    ...options,
+    tag: `v${version}`,
+  });
+
+  console.log(release.name);
+
+  await github.rest.repos.uploadReleaseAsset({
+    ...options,
+    release_id: release.id,
+    name: zipFile,
+    data: zip.toBuffer(),
+  });
+}
+
+resolveGreen().catch(console.error);
--- a/scripts/publish.mjs
+++ b/scripts/publish.mjs
@@ -1,9 +1,11 @@
 import fs from "fs-extra";
 import { createRequire } from "module";
 import { execSync } from "child_process";
+import { resolveUpdateLog } from "./updatelog.mjs";

 const require = createRequire(import.meta.url);

+// publish
 async function resolvePublish() {
  const flag = process.argv[2] ?? "patch";
  const packageJson = require("../package.json");
@@ -26,6 +28,10 @@ async function resolvePublish() {
  packageJson.version = nextVersion;
  tauriJson.package.version = nextVersion;

+  // 发布更新前先写更新日志
+  const nextTag = `v${nextVersion}`;
+  await resolveUpdateLog(nextTag);
+
  await fs.writeFile(
    "./package.json",
    JSON.stringify(packageJson, undefined, 2)
--- a/scripts/release.mjs
+++ b/scripts/release.mjs
@@ -1,8 +1,10 @@
 import fetch from "node-fetch";
 import { getOctokit, context } from "@actions/github";
+import { resolveUpdateLog } from "./updatelog.mjs";

 const UPDATE_TAG_NAME = "updater";
 const UPDATE_JSON_FILE = "update.json";
+const UPDATE_JSON_PROXY = "update-proxy.json";

 /// generate update.json
 /// upload to update tag's release asset
@@ -33,10 +35,11 @@ async function resolveRelease() {

  const updateData = {
    name: tag.name,
-    notes: latestRelease.body, // use the release body directly
+    notes: await resolveUpdateLog(tag.name), // use updatelog.md
    pub_date: new Date().toISOString(),
    platforms: {
      win64: { signature: "", url: "" },
+      linux: { signature: "", url: "" },
      darwin: { signature: "", url: "" },
    },
  };
@@ -48,29 +51,41 @@ async function resolveRelease() {
    if (/\.msi\.zip$/.test(name)) {
      updateData.platforms.win64.url = browser_download_url;
    }
-    // darwin url
-    if (/\.app\.tar\.gz$/.test(name)) {
-      updateData.platforms.darwin.url = browser_download_url;
-    }
    // win64 signature
    if (/\.msi\.zip\.sig$/.test(name)) {
      updateData.platforms.win64.signature = await getSignature(
        browser_download_url
      );
    }
+
+    // darwin url
+    if (/\.app\.tar\.gz$/.test(name)) {
+      updateData.platforms.darwin.url = browser_download_url;
+    }
    // darwin signature
    if (/\.app\.tar\.gz\.sig$/.test(name)) {
      updateData.platforms.darwin.signature = await getSignature(
        browser_download_url
      );
    }
+
+    // linux url
+    if (/\.AppImage\.tar\.gz$/.test(name)) {
+      updateData.platforms.linux.url = browser_download_url;
+    }
+    // linux signature
+    if (/\.AppImage\.tar\.gz\.sig$/.test(name)) {
+      updateData.platforms.linux.signature = await getSignature(
+        browser_download_url
+      );
+    }
  });

  await Promise.allSettled(promises);
  console.log(updateData);

  // maybe should test the signature as well
-  const { darwin, win64 } = updateData.platforms;
+  const { darwin, win64, linux } = updateData.platforms;
  if (!darwin.url) {
    console.log(`[Error]: failed to parse release for darwin`);
    delete updateData.platforms.darwin;
@@ -79,6 +94,24 @@ async function resolveRelease() {
    console.log(`[Error]: failed to parse release for win64`);
    delete updateData.platforms.win64;
  }
+  if (!linux.url) {
+    console.log(`[Error]: failed to parse release for linux`);
+    delete updateData.platforms.linux;
+  }
+
+  // 生成一个代理github的更新文件
+  // 使用 https://hub.fastgit.xyz/ 做github资源的加速
+  const updateDataNew = JSON.parse(JSON.stringify(updateData));
+
+  Object.keys(updateDataNew.platforms).forEach((key) => {
+    if (updateDataNew.platforms[key]) {
+      updateDataNew.platforms[key].url = updateDataNew.platforms[
+        key
+      ].url.replace("https://github.com/", "https://hub.fastgit.xyz/");
+    } else {
+      console.log(`[Error]: updateDataNew.platforms.${key} is null`);
+    }
+  });

  // update the update.json
  const { data: updateRelease } = await github.rest.repos.getReleaseByTag({
@@ -86,22 +119,36 @@ async function resolveRelease() {
    tag: UPDATE_TAG_NAME,
  });

+  // delete the old assets
  for (let asset of updateRelease.assets) {
    if (asset.name === UPDATE_JSON_FILE) {
      await github.rest.repos.deleteReleaseAsset({
        ...options,
        asset_id: asset.id,
      });
-      break;
+    }
+
+    if (asset.name === UPDATE_JSON_PROXY) {
+      await github.rest.repos
+        .deleteReleaseAsset({ ...options, asset_id: asset.id })
+        .catch(console.error); // do not break the pipeline
    }
  }

+  // upload assets
  await github.rest.repos.uploadReleaseAsset({
    ...options,
    release_id: updateRelease.id,
    name: UPDATE_JSON_FILE,
    data: JSON.stringify(updateData, null, 2),
  });
+
+  await github.rest.repos.uploadReleaseAsset({
+    ...options,
+    release_id: updateRelease.id,
+    name: UPDATE_JSON_PROXY,
+    data: JSON.stringify(updateDataNew, null, 2),
+  });
 }

 // get the signature file content
--- a/scripts/updatelog.mjs
+++ b/scripts/updatelog.mjs
@@ -0,0 +1,44 @@
+import fs from "fs-extra";
+import path from "path";
+
+const UPDATE_LOG = "UPDATELOG.md";
+
+// parse the UPDATELOG.md
+export async function resolveUpdateLog(tag) {
+  const cwd = process.cwd();
+
+  const reTitle = /^## v[\d\.]+/;
+  const reEnd = /^---/;
+
+  const file = path.join(cwd, UPDATE_LOG);
+
+  if (!(await fs.pathExists(file))) {
+    throw new Error("could not found UPDATELOG.md");
+  }
+
+  const data = await fs.readFile(file).then((d) => d.toString("utf8"));
+
+  const map = {};
+  let p = "";
+
+  data.split("\n").forEach((line) => {
+    if (reTitle.test(line)) {
+      p = line.slice(3).trim();
+      if (!map[p]) {
+        map[p] = [];
+      } else {
+        throw new Error(`Tag ${p} dup`);
+      }
+    } else if (reEnd.test(line)) {
+      p = "";
+    } else if (p) {
+      map[p].push(line);
+    }
+  });
+
+  if (!map[tag]) {
+    throw new Error(`could not found "${tag}" in UPDATELOG.md`);
+  }
+
+  return map[tag].join("\n").trim();
+}
--- a/src-tauri/.gitignore
+++ b/src-tauri/.gitignore
@@ -2,5 +2,5 @@
 # will have compiled files and executables
 /target/
 WixTools
-resources/Country.mmdb
+resources
 sidecar
--- a/src-tauri/Cargo.lock
+++ b/src-tauri/Cargo.lock
@@ -441,6 +441,7 @@ dependencies = [
 "log",
 "log4rs",
 "nanoid",
+ "open",
 "port_scanner",
 "reqwest",
 "serde",
--- a/src-tauri/Cargo.toml
+++ b/src-tauri/Cargo.toml
@@ -15,13 +15,14 @@ tauri-build = { version = "1.0.0-rc.4", features = [] }
 [dependencies]
 anyhow = "1.0"
 dirs = "4.0.0"
+open = "2.1.1"
 dunce = "1.0.2"
 nanoid = "0.4.0"
 chrono = "0.4.19"
 serde_json = "1.0"
 serde_yaml = "0.8"
 serde = { version = "1.0", features = ["derive"] }
-tauri = { version = "1.0.0-rc.4", features = ["shell-all", "system-tray", "updater", "window-all"] }
+tauri = { version = "1.0.0-rc.4", features = ["process-all", "shell-all", "system-tray", "updater", "window-all"] }
 window-shadows = { git = "https://github.com/tauri-apps/window-shadows" }
 window-vibrancy = { git = "https://github.com/tauri-apps/window-vibrancy" }

@@ -40,3 +41,10 @@ winreg = { version = "0.10", features = ["transactions"] }
 [features]
 default = [ "custom-protocol" ]
 custom-protocol = [ "tauri/custom-protocol" ]
+verge-dev = []
+
+[profile.release]
+panic = "abort"
+codegen-units = 1
+lto = true
+opt-level = "s"
--- a/src-tauri/src/cmds.rs
+++ b/src-tauri/src/cmds.rs
@@ -6,7 +6,7 @@ use crate::{
 use crate::{ret_err, wrap_err};
 use anyhow::Result;
 use serde_yaml::Mapping;
-use std::{path::PathBuf, process::Command};
+use std::process::Command;
 use tauri::{api, Manager, State};

 /// get all profiles from `profiles.yaml`
@@ -43,9 +43,10 @@ pub async fn import_profile(
 #[tauri::command]
 pub async fn create_profile(
  item: PrfItem, // partial
+  file_data: Option<String>,
  profiles_state: State<'_, ProfilesState>,
 ) -> Result<(), String> {
-  let item = wrap_err!(PrfItem::from(item).await)?;
+  let item = wrap_err!(PrfItem::from(item, file_data).await)?;
  let mut profiles = profiles_state.0.lock().unwrap();

  wrap_err!(profiles.append_item(item))
@@ -59,19 +60,27 @@ pub async fn update_profile(
  clash_state: State<'_, ClashState>,
  profiles_state: State<'_, ProfilesState>,
 ) -> Result<(), String> {
-  let url = {
+  let (url, opt) = {
    // must release the lock here
    let profiles = profiles_state.0.lock().unwrap();
    let item = wrap_err!(profiles.get_item(&index))?;

+    // check the profile type
+    if let Some(typ) = item.itype.as_ref() {
+      if *typ != "remote" {
+        ret_err!(format!("could not update the `{typ}` profile"));
+      }
+    }
+
    if item.url.is_none() {
      ret_err!("failed to get the item url");
    }

-    item.url.clone().unwrap()
+    (item.url.clone().unwrap(), item.option.clone())
  };

-  let item = wrap_err!(PrfItem::from_url(&url, None, None, option).await)?;
+  let fetch_opt = PrfOption::merge(opt, option);
+  let item = wrap_err!(PrfItem::from_url(&url, None, None, fetch_opt).await)?;

  let mut profiles = profiles_state.0.lock().unwrap();
  wrap_err!(profiles.update_item(index.clone(), item))?;
@@ -79,7 +88,7 @@ pub async fn update_profile(
  // reactivate the profile
  if Some(index) == profiles.get_current() {
    let clash = clash_state.0.lock().unwrap();
-    wrap_err!(clash.activate(&profiles, false))?;
+    wrap_err!(clash.activate_enhanced(&profiles, false, false))?;
  }

  Ok(())
@@ -96,7 +105,7 @@ pub fn select_profile(
  wrap_err!(profiles.put_current(index))?;

  let clash = clash_state.0.lock().unwrap();
-  wrap_err!(clash.activate(&profiles, false))
+  wrap_err!(clash.activate_enhanced(&profiles, false, false))
 }

 /// change the profile chain
@@ -113,7 +122,7 @@ pub fn change_profile_chain(
  profiles.put_chain(chain);
  clash.set_window(app_handle.get_window("main"));

-  wrap_err!(clash.activate_enhanced(&profiles, false))
+  wrap_err!(clash.activate_enhanced(&profiles, false, false))
 }

 /// manually exec enhanced profile
@@ -128,7 +137,7 @@ pub fn enhance_profiles(

  clash.set_window(app_handle.get_window("main"));

-  wrap_err!(clash.activate_enhanced(&profiles, false))
+  wrap_err!(clash.activate_enhanced(&profiles, false, false))
 }

 /// delete profile item
@@ -142,7 +151,7 @@ pub fn delete_profile(

  if wrap_err!(profiles.delete_item(index))? {
    let clash = clash_state.0.lock().unwrap();
-    wrap_err!(clash.activate(&profiles, false))?;
+    wrap_err!(clash.activate_enhanced(&profiles, false, false))?;
  }

  Ok(())
@@ -186,21 +195,50 @@ pub fn view_profile(index: String, profiles_state: State<'_, ProfilesState>) ->
        .arg(path)
        .spawn()
      {
-        log::error!("{err}");
+        log::error!("failed to open file by VScode for {err}");
        return Err("failed to open file by VScode".into());
      }
    }

    #[cfg(not(target_os = "windows"))]
    if let Err(err) = Command::new(code).arg(path).spawn() {
-      log::error!("{err}");
+      log::error!("failed to open file by VScode for {err}");
      return Err("failed to open file by VScode".into());
    }

    return Ok(());
  }

-  open_path_cmd(path, "failed to open file by `open`")
+  wrap_err!(open::that(path))
+}
+
+/// read the profile item file data
+#[tauri::command]
+pub fn read_profile_file(
+  index: String,
+  profiles_state: State<'_, ProfilesState>,
+) -> Result<String, String> {
+  let profiles = profiles_state.0.lock().unwrap();
+  let item = wrap_err!(profiles.get_item(&index))?;
+  let data = wrap_err!(item.read_file())?;
+
+  Ok(data)
+}
+
+/// save the profile item file data
+#[tauri::command]
+pub fn save_profile_file(
+  index: String,
+  file_data: Option<String>,
+  profiles_state: State<'_, ProfilesState>,
+) -> Result<(), String> {
+  if file_data.is_none() {
+    return Ok(());
+  }
+
+  let profiles = profiles_state.0.lock().unwrap();
+  let item = wrap_err!(profiles.get_item(&index))?;
+  wrap_err!(item.save_file(file_data.unwrap()))
 }

 /// restart the sidecar
@@ -271,14 +309,13 @@ pub fn get_verge_config(verge_state: State<'_, VergeState>) -> Result<VergeConfi
 #[tauri::command]
 pub fn patch_verge_config(
  payload: VergeConfig,
+  app_handle: tauri::AppHandle,
  clash_state: State<'_, ClashState>,
  verge_state: State<'_, VergeState>,
  profiles_state: State<'_, ProfilesState>,
 ) -> Result<(), String> {
  let tun_mode = payload.enable_tun_mode.clone();
-
-  let mut verge = verge_state.0.lock().unwrap();
-  wrap_err!(verge.patch_config(payload))?;
+  let system_proxy = payload.enable_system_proxy.clone();

  // change tun mode
  if tun_mode.is_some() {
@@ -287,7 +324,19 @@ pub fn patch_verge_config(

    wrap_err!(clash.tun_mode(tun_mode.unwrap()))?;
    clash.update_config();
-    wrap_err!(clash.activate(&profiles, false))?;
+    wrap_err!(clash.activate_enhanced(&profiles, false, false))?;
+  }
+
+  let mut verge = verge_state.0.lock().unwrap();
+  wrap_err!(verge.patch_config(payload))?;
+
+  // change system tray
+  if system_proxy.is_some() {
+    app_handle
+      .tray_handle()
+      .get_item("system_proxy")
+      .set_selected(system_proxy.unwrap())
+      .unwrap();
  }

  Ok(())
@@ -303,37 +352,12 @@ pub fn kill_sidecars() {
 #[tauri::command]
 pub fn open_app_dir() -> Result<(), String> {
  let app_dir = dirs::app_home_dir();
-  open_path_cmd(app_dir, "failed to open app dir")
+  wrap_err!(open::that(app_dir))
 }

 /// open logs dir
 #[tauri::command]
 pub fn open_logs_dir() -> Result<(), String> {
  let log_dir = dirs::app_logs_dir();
-  open_path_cmd(log_dir, "failed to open logs dir")
-}
-
-/// get open/explorer command
-fn open_path_cmd(dir: PathBuf, err_str: &str) -> Result<(), String> {
-  #[cfg(target_os = "windows")]
-  {
-    use std::os::windows::process::CommandExt;
-
-    if let Err(err) = Command::new("explorer")
-      .creation_flags(0x08000000)
-      .arg(dir)
-      .spawn()
-    {
-      log::error!("{err}");
-      return Err(err_str.into());
-    }
-  }
-
-  #[cfg(not(target_os = "windows"))]
-  if let Err(err) = Command::new("open").arg(dir).spawn() {
-    log::error!("{err}");
-    return Err(err_str.into());
-  }
-
-  return Ok(());
+  wrap_err!(open::that(log_dir))
 }
--- a/src-tauri/src/core/clash.rs
+++ b/src-tauri/src/core/clash.rs
@@ -1,4 +1,5 @@
 use super::{PrfEnhancedResult, Profiles, Verge};
+use crate::log_if_err;
 use crate::utils::{config, dirs, help};
 use anyhow::{bail, Result};
 use reqwest::header::HeaderMap;
@@ -95,7 +96,18 @@ impl Clash {

    let server = match clash_config.get(&key_server) {
      Some(value) => match value {
-        Value::String(val_str) => Some(val_str.clone()),
+        Value::String(val_str) => {
+          // `external-controller` could be
+          // "127.0.0.1:9090" or ":9090"
+          // Todo: maybe it could support single port
+          let server = val_str.clone();
+          let server = match server.starts_with(":") {
+            true => format!("127.0.0.1{server}"),
+            false => server,
+          };
+
+          Some(server)
+        }
        _ => None,
      },
      _ => None,
@@ -165,7 +177,8 @@ impl Clash {
    self.update_config();
    self.drop_sidecar()?;
    self.run_sidecar()?;
-    self.activate(profiles, false)
+    self.activate(profiles)?;
+    self.activate_enhanced(profiles, false, true)
  }

  /// update the clash info
@@ -181,71 +194,109 @@ impl Clash {
    verge: &mut Verge,
    profiles: &mut Profiles,
  ) -> Result<()> {
-    for (key, value) in patch.iter() {
+    let mix_port_key = Value::from("mixed-port");
+    let mut port = None;
+
+    for (key, value) in patch.into_iter() {
      let value = value.clone();
-      let key_str = key.as_str().clone().unwrap_or("");

-      // restart the clash
-      if key_str == "mixed-port" {
-        self.restart_sidecar(profiles)?;
-
-        let port = if value.is_number() {
-          match value.as_i64().clone() {
-            Some(num) => Some(format!("{num}")),
-            None => None,
-          }
+      // check whether the mix_port is changed
+      if key == mix_port_key {
+        if value.is_number() {
+          port = value.as_i64().as_ref().map(|n| n.to_string());
        } else {
-          match value.as_str().clone() {
-            Some(num) => Some(num.into()),
-            None => None,
-          }
-        };
-        verge.init_sysproxy(port);
+          port = value.as_str().as_ref().map(|s| s.to_string());
+        }
      }

      self.config.insert(key.clone(), value);
    }
-    self.save_config()
+
+    self.save_config()?;
+
+    if let Some(port) = port {
+      self.restart_sidecar(profiles)?;
+      verge.init_sysproxy(Some(port));
+    }
+
+    Ok(())
  }

  /// enable tun mode
-  /// only revise the config and restart the
+  /// only revise the config
  pub fn tun_mode(&mut self, enable: bool) -> Result<()> {
-    let tun_key = Value::String("tun".into());
-    let tun_val = self.config.get(&tun_key);
-
-    let mut new_val = Mapping::new();
-
-    if tun_val.is_some() && tun_val.as_ref().unwrap().is_mapping() {
-      new_val = tun_val.as_ref().unwrap().as_mapping().unwrap().clone();
+    // Windows 需要wintun.dll文件
+    #[cfg(target_os = "windows")]
+    if enable {
+      let wintun_dll = dirs::app_home_dir().join("wintun.dll");
+      if !wintun_dll.exists() {
+        bail!("failed to enable TUN for missing `wintun.dll`");
+      }
    }

    macro_rules! revise {
      ($map: expr, $key: expr, $val: expr) => {
        let ret_key = Value::String($key.into());
-        if $map.contains_key(&ret_key) {
-          $map[&ret_key] = $val;
-        } else {
-          $map.insert(ret_key, $val);
-        }
+        $map.insert(ret_key, Value::from($val));
      };
    }

+    // if key not exists then append value
    macro_rules! append {
      ($map: expr, $key: expr, $val: expr) => {
        let ret_key = Value::String($key.into());
        if !$map.contains_key(&ret_key) {
-          $map.insert(ret_key, $val);
+          $map.insert(ret_key, Value::from($val));
        }
      };
    }

-    revise!(new_val, "enable", Value::from(enable));
-    append!(new_val, "stack", Value::from("gvisor"));
-    append!(new_val, "auto-route", Value::from(true));
-    append!(new_val, "auto-detect-interface", Value::from(true));
+    // tun config
+    let tun_val = self.config.get(&Value::from("tun"));
+    let mut new_tun = Mapping::new();

-    revise!(self.config, "tun", Value::from(new_val));
+    if tun_val.is_some() && tun_val.as_ref().unwrap().is_mapping() {
+      new_tun = tun_val.as_ref().unwrap().as_mapping().unwrap().clone();
+    }
+
+    revise!(new_tun, "enable", enable);
+    append!(new_tun, "stack", "gvisor");
+    append!(new_tun, "dns-hijack", vec!["198.18.0.2:53"]);
+    append!(new_tun, "auto-route", true);
+    append!(new_tun, "auto-detect-interface", true);
+
+    revise!(self.config, "tun", new_tun);
+
+    // dns config
+    let dns_val = self.config.get(&Value::from("dns"));
+    let mut new_dns = Mapping::new();
+
+    if dns_val.is_some() && dns_val.as_ref().unwrap().is_mapping() {
+      new_dns = dns_val.as_ref().unwrap().as_mapping().unwrap().clone();
+    }
+
+    // 借鉴cfw的默认配置
+    revise!(new_dns, "enable", enable);
+    append!(new_dns, "enhanced-mode", "fake-ip");
+    append!(
+      new_dns,
+      "nameserver",
+      vec!["114.114.114.114", "223.5.5.5", "8.8.8.8"]
+    );
+    append!(new_dns, "fallback", vec![] as Vec<&str>);
+
+    #[cfg(target_os = "windows")]
+    append!(
+      new_dns,
+      "fake-ip-filter",
+      vec![
+        "dns.msftncsi.com",
+        "www.msftncsi.com",
+        "www.msftconnecttest.com"
+      ]
+    );
+
+    revise!(self.config, "dns", new_dns);

    self.save_config()
  }
@@ -253,19 +304,13 @@ impl Clash {
  /// activate the profile
  /// generate a new profile to the temp_dir
  /// then put the path to the clash core
-  fn _activate(info: ClashInfo, config: Mapping) -> Result<()> {
+  fn _activate(info: ClashInfo, config: Mapping, window: Option<Window>) -> Result<()> {
    let temp_path = dirs::profiles_temp_path();
    config::save_yaml(temp_path.clone(), &config, Some("# Clash Verge Temp File"))?;

    tauri::async_runtime::spawn(async move {
-      // `external-controller` could be
-      // "127.0.0.1:9090" or ":9090"
-      // Todo: maybe it could support single port
      let server = info.server.unwrap();
-      let server = match server.starts_with(":") {
-        true => format!("http://127.0.0.1{server}/configs"),
-        false => format!("http://{server}/configs"),
-      };
+      let server = format!("http://{server}/configs");

      let mut headers = HeaderMap::new();
      headers.insert("Content-Type", "application/json".parse().unwrap());
@@ -289,6 +334,12 @@ impl Clash {
                if resp.status() != 204 {
                  log::error!("failed to activate clash for status \"{}\"", resp.status());
                }
+
+                // emit the window to update something
+                if let Some(window) = window {
+                  window.emit("verge://refresh-clash-config", "yes").unwrap();
+                }
+
                // do not retry
                break;
              }
@@ -305,55 +356,57 @@ impl Clash {
  }

  /// enhanced profiles mode
-  /// only change the enhanced profiles
-  pub fn activate_enhanced(&self, profiles: &Profiles, delay: bool) -> Result<()> {
+  /// - (sync) refresh config if enhance chain is null
+  /// - (async) enhanced config
+  pub fn activate_enhanced(&self, profiles: &Profiles, delay: bool, skip: bool) -> Result<()> {
    if self.window.is_none() {
      bail!("failed to get the main window");
    }

-    let win = self.window.clone().unwrap();
    let event_name = help::get_uid("e");
    let event_name = format!("enhanced-cb-{event_name}");

-    let info = self.info.clone();
-    let mut config = self.config.clone();
-
    // generate the payload
    let payload = profiles.gen_enhanced(event_name.clone())?;

-    win.once(&event_name, move |event| {
+    let info = self.info.clone();
+
+    // do not run enhanced
+    if payload.chain.len() == 0 {
+      if skip {
+        return Ok(());
+      }
+
+      let mut config = self.config.clone();
+      let filter_data = Clash::strict_filter(payload.current);
+
+      for (key, value) in filter_data.into_iter() {
+        config.insert(key, value);
+      }
+
+      return Clash::_activate(info, config, self.window.clone());
+    }
+
+    let window = self.window.clone().unwrap();
+    let window_move = self.window.clone();
+
+    window.once(&event_name, move |event| {
      if let Some(result) = event.payload() {
        let result: PrfEnhancedResult = serde_json::from_str(result).unwrap();

        if let Some(data) = result.data {
-          // all of these can not be revised by script
-          // http/https/socks port should be under control
-          let not_allow: Vec<Value> = vec![
-            "port",
-            "socks-port",
-            "mixed-port",
-            "allow-lan",
-            "mode",
-            "external-controller",
-            "secret",
-            "log-level",
-          ]
-          .iter()
-          .map(|&i| Value::from(i))
-          .collect();
+          let mut config = Clash::read_config();
+          let filter_data = Clash::loose_filter(data); // loose filter

-          for (key, value) in data.into_iter() {
-            if not_allow.iter().find(|&i| i == &key).is_none() {
-              config.insert(key, value);
-            }
+          for (key, value) in filter_data.into_iter() {
+            config.insert(key, value);
          }

-          Self::_activate(info, config).unwrap();
+          log_if_err!(Clash::_activate(info, config, window_move));
+          log::info!("profile enhanced status {}", result.status);
        }

-        log::info!("profile enhanced status {}", result.status);
-
-        result.error.map(|error| log::error!("{error}"));
+        result.error.map(|err| log::error!("{err}"));
      }
    });

@@ -362,7 +415,7 @@ impl Clash {
      if delay {
        sleep(Duration::from_secs(2)).await;
      }
-      win.emit("script-handler", payload).unwrap();
+      window.emit("script-handler", payload).unwrap();
    });

    Ok(())
@@ -370,17 +423,83 @@ impl Clash {

  /// activate the profile
  /// auto activate enhanced profile
-  pub fn activate(&self, profiles: &Profiles, delay: bool) -> Result<()> {
-    let gen_map = profiles.gen_activate()?;
+  pub fn activate(&self, profiles: &Profiles) -> Result<()> {
+    let data = profiles.gen_activate()?;
+    let data = Clash::strict_filter(data);
+
    let info = self.info.clone();
    let mut config = self.config.clone();

-    for (key, value) in gen_map.into_iter() {
+    for (key, value) in data.into_iter() {
      config.insert(key, value);
    }

-    Self::_activate(info, config)?;
-    self.activate_enhanced(profiles, delay)
+    Clash::_activate(info, config, self.window.clone())
+  }
+
+  /// only 5 default fields available (clash config fields)
+  /// convert to lowercase
+  fn strict_filter(config: Mapping) -> Mapping {
+    // Only the following fields are allowed:
+    // proxies/proxy-providers/proxy-groups/rule-providers/rules
+    let valid_keys = vec![
+      "proxies",
+      "proxy-providers",
+      "proxy-groups",
+      "rules",
+      "rule-providers",
+    ];
+
+    let mut new_config = Mapping::new();
+
+    for (key, value) in config.into_iter() {
+      key.as_str().map(|key_str| {
+        // change to lowercase
+        let mut key_str = String::from(key_str);
+        key_str.make_ascii_lowercase();
+
+        // filter
+        if valid_keys.contains(&&*key_str) {
+          new_config.insert(Value::String(key_str), value);
+        }
+      });
+    }
+
+    new_config
+  }
+
+  /// more clash config fields available
+  /// convert to lowercase
+  fn loose_filter(config: Mapping) -> Mapping {
+    // all of these can not be revised by script or merge
+    // http/https/socks port should be under control
+    let not_allow = vec![
+      "port",
+      "socks-port",
+      "mixed-port",
+      "allow-lan",
+      "mode",
+      "external-controller",
+      "secret",
+      "log-level",
+    ];
+
+    let mut new_config = Mapping::new();
+
+    for (key, value) in config.into_iter() {
+      key.as_str().map(|key_str| {
+        // change to lowercase
+        let mut key_str = String::from(key_str);
+        key_str.make_ascii_lowercase();
+
+        // filter
+        if !not_allow.contains(&&*key_str) {
+          new_config.insert(Value::String(key_str), value);
+        }
+      });
+    }
+
+    new_config
  }
 }

--- a/src-tauri/src/core/profiles.rs
+++ b/src-tauri/src/core/profiles.rs
@@ -1,7 +1,7 @@
 use crate::utils::{config, dirs, help, tmpl};
 use anyhow::{bail, Context, Result};
 use serde::{Deserialize, Serialize};
-use serde_yaml::{Mapping, Value};
+use serde_yaml::Mapping;
 use std::{fs, io::Write};

 #[derive(Debug, Clone, Deserialize, Serialize)]
@@ -73,6 +73,31 @@ pub struct PrfOption {
  pub with_proxy: Option<bool>,
 }

+impl PrfOption {
+  pub fn merge(one: Option<Self>, other: Option<Self>) -> Option<Self> {
+    if one.is_some() && other.is_some() {
+      let mut one = one.unwrap();
+      let other = other.unwrap();
+
+      if let Some(val) = other.user_agent {
+        one.user_agent = Some(val);
+      }
+
+      if let Some(val) = other.with_proxy {
+        one.with_proxy = Some(val);
+      }
+
+      return Some(one);
+    }
+
+    if one.is_none() {
+      return other;
+    }
+
+    return one;
+  }
+}
+
 impl Default for PrfItem {
  fn default() -> Self {
    PrfItem {
@@ -94,7 +119,7 @@ impl Default for PrfItem {
 impl PrfItem {
  /// From partial item
  /// must contain `itype`
-  pub async fn from(item: PrfItem) -> Result<PrfItem> {
+  pub async fn from(item: PrfItem, file_data: Option<String>) -> Result<PrfItem> {
    if item.itype.is_none() {
      bail!("type should not be null");
    }
@@ -112,7 +137,7 @@ impl PrfItem {
      "local" => {
        let name = item.name.unwrap_or("Local File".into());
        let desc = item.desc.unwrap_or("".into());
-        PrfItem::from_local(name, desc)
+        PrfItem::from_local(name, desc, file_data)
      }
      "merge" => {
        let name = item.name.unwrap_or("Merge".into());
@@ -130,7 +155,7 @@ impl PrfItem {

  /// ## Local type
  /// create a new item from name/desc
-  pub fn from_local(name: String, desc: String) -> Result<PrfItem> {
+  pub fn from_local(name: String, desc: String, file_data: Option<String>) -> Result<PrfItem> {
    let uid = help::get_uid("l");
    let file = format!("{uid}.yaml");

@@ -145,7 +170,7 @@ impl PrfItem {
      extra: None,
      option: None,
      updated: Some(help::get_now()),
-      file_data: Some(tmpl::ITEM_LOCAL.into()),
+      file_data: Some(file_data.unwrap_or(tmpl::ITEM_LOCAL.into())),
    })
  }

@@ -254,6 +279,28 @@ impl PrfItem {
      file_data: Some(tmpl::ITEM_SCRIPT.into()),
    })
  }
+
+  /// get the file data
+  pub fn read_file(&self) -> Result<String> {
+    if self.file.is_none() {
+      bail!("could not find the file");
+    }
+
+    let file = self.file.clone().unwrap();
+    let path = dirs::app_profiles_dir().join(file);
+    fs::read_to_string(path).context("failed to read the file")
+  }
+
+  /// save the file data
+  pub fn save_file(&self, data: String) -> Result<()> {
+    if self.file.is_none() {
+      bail!("could not find the file");
+    }
+
+    let file = self.file.clone().unwrap();
+    let path = dirs::app_profiles_dir().join(file);
+    fs::write(path, data.as_bytes()).context("failed to save the file")
+  }
 }

 ///
@@ -414,9 +461,7 @@ impl Profiles {
        patch!(each, item, selected);
        patch!(each, item, extra);
        patch!(each, item, updated);
-
-        // can be removed
-        each.option = item.option;
+        patch!(each, item, option);

        self.items = Some(items);
        return self.save_file();
@@ -530,28 +575,7 @@ impl Profiles {
          bail!("failed to read the file \"{}\"", file_path.display());
        }

-        let mut new_config = Mapping::new();
-        let def_config = config::read_yaml::<Mapping>(file_path.clone());
-
-        // Only the following fields are allowed:
-        // proxies/proxy-providers/proxy-groups/rule-providers/rules
-        let valid_keys = vec![
-          "proxies",
-          "proxy-providers",
-          "proxy-groups",
-          "rule-providers",
-          "rules",
-        ];
-
-        valid_keys.iter().for_each(|key| {
-          let key = Value::String(key.to_string());
-          if def_config.contains_key(&key) {
-            let value = def_config[&key].clone();
-            new_config.insert(key, value);
-          }
-        });
-
-        return Ok(new_config);
+        return Ok(config::read_yaml::<Mapping>(file_path.clone()));
      }
    }

@@ -585,11 +609,11 @@ impl Profiles {

 #[derive(Default, Debug, Clone, Serialize, Deserialize)]
 pub struct PrfEnhanced {
-  current: Mapping,
+  pub current: Mapping,

-  chain: Vec<PrfData>,
+  pub chain: Vec<PrfData>,

-  callback: String,
+  pub callback: String,
 }

 #[derive(Default, Debug, Clone, Serialize, Deserialize)]
--- a/src-tauri/src/core/verge.rs
+++ b/src-tauri/src/core/verge.rs
@@ -1,6 +1,6 @@
+use crate::log_if_err;
 use crate::{
  core::Clash,
-  log_if_err,
  utils::{config, dirs, sysopt::SysProxyConfig},
 };
 use anyhow::{bail, Result};
@@ -12,6 +12,9 @@ use tauri::{async_runtime::Mutex, utils::platform::current_exe};
 /// ### `verge.yaml` schema
 #[derive(Default, Debug, Clone, Deserialize, Serialize)]
 pub struct VergeConfig {
+  // i18n
+  pub language: Option<String>,
+
  /// `light` or `dark`
  pub theme_mode: Option<String>,

@@ -28,6 +31,9 @@ pub struct VergeConfig {
  /// can the app auto startup
  pub enable_auto_launch: Option<bool>,

+  /// not show the window on launch
+  pub enable_silent_start: Option<bool>,
+
  /// set system proxy
  pub enable_system_proxy: Option<bool>,

@@ -130,37 +136,31 @@ impl Verge {
  }

  /// init the auto launch
-  pub fn init_launch(&mut self) {
+  pub fn init_launch(&mut self) -> Result<()> {
    let app_exe = current_exe().unwrap();
    let app_exe = dunce::canonicalize(app_exe).unwrap();
    let app_name = app_exe.file_stem().unwrap().to_str().unwrap();
    let app_path = app_exe.as_os_str().to_str().unwrap();

+    // fix issue #26
+    #[cfg(target_os = "windows")]
+    let app_path = format!("\"{app_path}\"");
+    #[cfg(target_os = "windows")]
+    let app_path = app_path.as_str();
+
    let auto = AutoLaunchBuilder::new()
      .set_app_name(app_name)
      .set_app_path(app_path)
      .build();

+    if let Some(enable) = self.config.enable_auto_launch.as_ref() {
+      // fix issue #26
+      if *enable {
+        auto.enable()?;
+      }
+    }
+
    self.auto_launch = Some(auto);
-  }
-
-  /// sync the startup when run the app
-  pub fn sync_launch(&self) -> Result<()> {
-    let enable = self.config.enable_auto_launch.clone().unwrap_or(false);
-    if !enable {
-      return Ok(());
-    }
-
-    if self.auto_launch.is_none() {
-      bail!("should init the auto launch first");
-    }
-
-    let auto_launch = self.auto_launch.clone().unwrap();
-
-    let is_enabled = auto_launch.is_enabled().unwrap_or(false);
-    if !is_enabled {
-      auto_launch.enable()?;
-    }

    Ok(())
  }
@@ -188,6 +188,9 @@ impl Verge {
  /// so call the save_file at the end is savely
  pub fn patch_config(&mut self, patch: VergeConfig) -> Result<()> {
    // only change it
+    if patch.language.is_some() {
+      self.config.language = patch.language;
+    }
    if patch.theme_mode.is_some() {
      self.config.theme_mode = patch.theme_mode;
    }
@@ -197,6 +200,9 @@ impl Verge {
    if patch.traffic_graph.is_some() {
      self.config.traffic_graph = patch.traffic_graph;
    }
+    if patch.enable_silent_start.is_some() {
+      self.config.enable_silent_start = patch.enable_silent_start;
+    }

    // should update system startup
    if patch.enable_auto_launch.is_some() {
--- a/src-tauri/src/main.rs
+++ b/src-tauri/src/main.rs
@@ -8,7 +8,10 @@ mod core;
 mod states;
 mod utils;

-use crate::utils::{resolve, server};
+use crate::{
+  core::VergeConfig,
+  utils::{resolve, server},
+};
 use tauri::{
  api, CustomMenuItem, Manager, SystemTray, SystemTrayEvent, SystemTrayMenu, SystemTrayMenuItem,
 };
@@ -21,6 +24,7 @@ fn main() -> std::io::Result<()> {

  let tray_menu = SystemTrayMenu::new()
    .add_item(CustomMenuItem::new("open_window", "Show"))
+    .add_item(CustomMenuItem::new("system_proxy", "System Proxy"))
    .add_item(CustomMenuItem::new("restart_clash", "Restart Clash"))
    .add_native_item(SystemTrayMenuItem::Separator)
    .add_item(CustomMenuItem::new("quit", "Quit").accelerator("CmdOrControl+Q"));
@@ -40,18 +44,38 @@ fn main() -> std::io::Result<()> {
          window.show().unwrap();
          window.set_focus().unwrap();
        }
+        "system_proxy" => {
+          let verge_state = app_handle.state::<states::VergeState>();
+          let mut verge = verge_state.0.lock().unwrap();
+
+          let old_value = verge.config.enable_system_proxy.clone().unwrap_or(false);
+          let new_value = !old_value;
+
+          match verge.patch_config(VergeConfig {
+            enable_system_proxy: Some(new_value),
+            ..VergeConfig::default()
+          }) {
+            Ok(_) => {
+              app_handle
+                .tray_handle()
+                .get_item(id.as_str())
+                .set_selected(new_value)
+                .unwrap();
+
+              // update verge config
+              let window = app_handle.get_window("main").unwrap();
+              window.emit("verge://refresh-verge-config", "yes").unwrap();
+            }
+            Err(err) => log::error!("{err}"),
+          }
+        }
        "restart_clash" => {
          let clash_state = app_handle.state::<states::ClashState>();
          let profiles_state = app_handle.state::<states::ProfilesState>();
          let mut clash = clash_state.0.lock().unwrap();
          let mut profiles = profiles_state.0.lock().unwrap();
-          match clash.restart_sidecar(&mut profiles) {
-            Ok(_) => {
-              let window = app_handle.get_window("main").unwrap();
-              window.emit("restart_clash", "yes").unwrap();
-            }
-            Err(err) => log::error!("{}", err),
-          }
+
+          crate::log_if_err!(clash.restart_sidecar(&mut profiles));
        }
        "quit" => {
          resolve::resolve_reset(app_handle);
@@ -60,13 +84,12 @@ fn main() -> std::io::Result<()> {
        }
        _ => {}
      },
+      #[cfg(target_os = "windows")]
      SystemTrayEvent::LeftClick { .. } => {
-        if cfg![target_os = "windows"] {
-          let window = app_handle.get_window("main").unwrap();
-          window.unminimize().unwrap();
-          window.show().unwrap();
-          window.set_focus().unwrap();
-        }
+        let window = app_handle.get_window("main").unwrap();
+        window.unminimize().unwrap();
+        window.show().unwrap();
+        window.set_focus().unwrap();
      }
      _ => {}
    })
@@ -95,7 +118,9 @@ fn main() -> std::io::Result<()> {
      cmds::get_profiles,
      cmds::sync_profiles,
      cmds::enhance_profiles,
-      cmds::change_profile_chain
+      cmds::change_profile_chain,
+      cmds::read_profile_file,
+      cmds::save_profile_file
    ]);

  #[cfg(target_os = "macos")]
--- a/src-tauri/src/utils/dirs.rs
+++ b/src-tauri/src/utils/dirs.rs
@@ -5,12 +5,22 @@ use tauri::{
  Env, PackageInfo,
 };

+#[cfg(not(feature = "verge-dev"))]
+static APP_DIR: &str = "clash-verge";
+#[cfg(feature = "verge-dev")]
+static APP_DIR: &str = "clash-verge-dev";
+
+static CLASH_CONFIG: &str = "config.yaml";
+static VERGE_CONFIG: &str = "verge.yaml";
+static PROFILE_YAML: &str = "profiles.yaml";
+static PROFILE_TEMP: &str = "clash-verge-runtime.yaml";
+
 /// get the verge app home dir
 pub fn app_home_dir() -> PathBuf {
  home_dir()
    .unwrap()
    .join(Path::new(".config"))
-    .join(Path::new("clash-verge"))
+    .join(Path::new(APP_DIR))
 }

 /// get the resources dir
@@ -30,11 +40,6 @@ pub fn app_logs_dir() -> PathBuf {
  app_home_dir().join("logs")
 }

-static CLASH_CONFIG: &str = "config.yaml";
-static VERGE_CONFIG: &str = "verge.yaml";
-static PROFILE_YAML: &str = "profiles.yaml";
-static PROFILE_TEMP: &str = "clash-verge-runtime.yaml";
-
 pub fn clash_path() -> PathBuf {
  app_home_dir().join(CLASH_CONFIG)
 }
--- a/src-tauri/src/utils/help.rs
+++ b/src-tauri/src/utils/help.rs
@@ -68,7 +68,7 @@ macro_rules! wrap_err {
 /// return the string literal error
 #[macro_export]
 macro_rules! ret_err {
-  ($str: literal) => {
+  ($str: expr) => {
    return Err($str.into())
  };
 }
--- a/src-tauri/src/utils/init.rs
+++ b/src-tauri/src/utils/init.rs
@@ -87,4 +87,14 @@ pub fn init_app(package_info: &PackageInfo) {
  if !mmdb_path.exists() && mmdb_tmpl.exists() {
    fs::copy(mmdb_tmpl, mmdb_path).unwrap();
  }
+
+  // copy the wintun.dll
+  #[cfg(target_os = "windows")]
+  {
+    let wintun_path = app_dir.join("wintun.dll");
+    let wintun_tmpl = res_dir.join("wintun.dll");
+    if !wintun_path.exists() && wintun_tmpl.exists() {
+      fs::copy(wintun_tmpl, wintun_path).unwrap();
+    }
+  }
 }
--- a/src-tauri/src/utils/resolve.rs
+++ b/src-tauri/src/utils/resolve.rs
@@ -4,8 +4,6 @@ use tauri::{App, AppHandle, Manager};

 /// handle something when start app
 pub fn resolve_setup(app: &App) {
-  resolve_window(app);
-
  // setup a simple http server for singleton
  server::embed_server(&app.handle());

@@ -26,7 +24,8 @@ pub fn resolve_setup(app: &App) {
  *profiles = Profiles::read_file();

  clash.set_window(app.get_window("main"));
-  log_if_err!(clash.activate(&profiles, true));
+  log_if_err!(clash.activate(&profiles));
+  log_if_err!(clash.activate_enhanced(&profiles, true, true));

  verge.init_sysproxy(clash.info.port.clone());
  // enable tun mode
@@ -38,8 +37,16 @@ pub fn resolve_setup(app: &App) {
    clash.tun_mode(true).unwrap();
  }

-  verge.init_launch();
-  log_if_err!(verge.sync_launch());
+  log_if_err!(verge.init_launch());
+
+  verge.config.enable_system_proxy.map(|enable| {
+    log_if_err!(app
+      .tray_handle()
+      .get_item("system_proxy")
+      .set_selected(enable));
+  });
+
+  resolve_window(app, verge.config.enable_silent_start.clone());
 }

 /// reset system proxy
@@ -51,9 +58,16 @@ pub fn resolve_reset(app_handle: &AppHandle) {
 }

 /// customize the window theme
-fn resolve_window(app: &App) {
+fn resolve_window(app: &App, hide: Option<bool>) {
  let window = app.get_window("main").unwrap();

+  // silent start
+  hide.map(|hide| {
+    if hide {
+      window.hide().unwrap();
+    }
+  });
+
  #[cfg(target_os = "windows")]
  {
    use window_shadows::set_shadow;
--- a/src-tauri/src/utils/server.rs
+++ b/src-tauri/src/utils/server.rs
@@ -4,7 +4,10 @@ use port_scanner::local_port_available;
 use tauri::{AppHandle, Manager};
 use warp::Filter;

+#[cfg(not(feature = "verge-dev"))]
 const SERVER_PORT: u16 = 33333;
+#[cfg(feature = "verge-dev")]
+const SERVER_PORT: u16 = 11233;

 /// check whether there is already exists
 pub fn check_singleton() -> Result<(), ()> {
--- a/src-tauri/src/utils/tmpl.rs
+++ b/src-tauri/src/utils/tmpl.rs
@@ -21,6 +21,7 @@ items: ~
 /// template for `verge.yaml`
 pub const VERGE_CONFIG: &[u8] = b"# Defaulf Config For Clash Verge

+language: en
 theme_mode: light
 theme_blur: false
 traffic_graph: true
--- a/src-tauri/tauri.conf.json
+++ b/src-tauri/tauri.conf.json
@@ -1,7 +1,7 @@
 {
  "package": {
    "productName": "Clash Verge",
-    "version": "0.0.22"
+    "version": "0.0.26"
  },
  "build": {
    "distDir": "../dist",
@@ -52,7 +52,8 @@
    "updater": {
      "active": true,
      "endpoints": [
-        "https://github.com/zzzgydi/clash-verge/releases/download/updater/update.json"
+        "https://github.com/zzzgydi/clash-verge/releases/download/updater/update.json",
+        "https://hub.fastgit.xyz/zzzgydi/clash-verge/releases/download/updater/update-proxy.json"
      ],
      "dialog": false,
      "pubkey": "dW50cnVzdGVkIGNvbW1lbnQ6IG1pbmlzaWduIHB1YmxpYyBrZXk6IDExNUFBNTBBN0FDNEFBRTUKUldUbHFzUjZDcVZhRVRJM25NS3NkSFlFVElxUkNZMzZ6bHUwRVJjb2F3alJXVzRaeDdSaTA2YWYK"
@@ -63,6 +64,9 @@
      },
      "window": {
        "all": true
+      },
+      "process": {
+        "all": true
      }
    },
    "windows": [
@@ -79,7 +83,7 @@
      }
    ],
    "security": {
-      "csp": "default-src blob: data: filesystem: ws: wss: http: https: tauri: 'unsafe-eval' 'unsafe-inline' 'self' img-src: 'self'"
+      "csp": "script-src 'unsafe-eval' 'self'; default-src blob: data: filesystem: ws: wss: http: https: tauri: 'unsafe-eval' 'unsafe-inline' 'self'; img-src 'self';"
    }
  }
 }
--- a/src/assets/styles/layout.scss
+++ b/src/assets/styles/layout.scss
@@ -72,7 +72,7 @@

    .the-content {
      position: absolute;
-      top: 30px;
+      top: 0;
      left: 0;
      right: 2px;
      bottom: 10px;
@@ -80,8 +80,12 @@
  }
 }

-.macos.layout {
-  .layout__right .the-content {
-    top: 0;
+.linux,
+.windows,
+.unknown {
+  &.layout {
+    .layout__right .the-content {
+      top: 30px;
+    }
  }
 }
--- a/src/components/connection/connection-item.tsx
+++ b/src/components/connection/connection-item.tsx
@@ -1,4 +1,20 @@
+import dayjs from "dayjs";
+import { useLockFn } from "ahooks";
+import { styled, ListItem, IconButton, ListItemText } from "@mui/material";
+import { CloseRounded } from "@mui/icons-material";
 import { ApiType } from "../../services/types";
+import { deleteConnection } from "../../services/api";
+
+const Tag = styled("span")(({ theme }) => ({
+  display: "inline-block",
+  fontSize: "12px",
+  padding: "0 4px",
+  lineHeight: 1.375,
+  border: "1px solid #ccc",
+  borderRadius: 4,
+  marginRight: "0.1em",
+  transform: "scale(0.92)",
+}));

 interface Props {
  value: ApiType.ConnectionsItem;
@@ -7,7 +23,37 @@ interface Props {
 const ConnectionItem = (props: Props) => {
  const { value } = props;

-  return <div>{value.metadata.host || value.metadata.destinationIP}</div>;
+  const onDelete = useLockFn(async () => deleteConnection(value.id));
+
+  return (
+    <ListItem
+      dense
+      secondaryAction={
+        <IconButton edge="end" onClick={onDelete}>
+          <CloseRounded />
+        </IconButton>
+      }
+    >
+      <ListItemText
+        primary={value.metadata.host || value.metadata.destinationIP}
+        secondary={
+          <>
+            <Tag sx={{ textTransform: "uppercase", color: "success" }}>
+              {value.metadata.network}
+            </Tag>
+
+            <Tag>{value.metadata.type}</Tag>
+
+            {value.chains.length > 0 && (
+              <Tag>{value.chains[value.chains.length - 1]}</Tag>
+            )}
+
+            <Tag>{dayjs(value.start).fromNow()}</Tag>
+          </>
+        }
+      />
+    </ListItem>
+  );
 };

 export default ConnectionItem;
--- a/src/components/layout/layout-traffic.tsx
+++ b/src/components/layout/layout-traffic.tsx
@@ -12,6 +12,7 @@ import useLogSetup from "./use-log-setup";
 import useTrafficGraph from "./use-traffic-graph";
 import parseTraffic from "../../utils/parse-traffic";

+// setup the traffic
 const LayoutTraffic = () => {
  const portValue = useRecoilValue(atomClashPort);
  const [traffic, setTraffic] = useState({ up: 0, down: 0 });
@@ -26,12 +27,14 @@ const LayoutTraffic = () => {
  useLogSetup();

  useEffect(() => {
-    let unlisten: () => void = null!;
-
    // should reconnect the traffic ws
-    listen("restart_clash", () => setRefresh({})).then((fn) => (unlisten = fn));
+    const unlisten = listen("verge://refresh-clash-config", () =>
+      setRefresh({})
+    );

-    return () => unlisten?.();
+    return () => {
+      unlisten.then((fn) => fn());
+    };
  }, []);

  useEffect(() => {
--- a/src/components/layout/update-button.tsx
+++ b/src/components/layout/update-button.tsx
@@ -32,7 +32,9 @@ const UpdateButton = (props: Props) => {
        New
      </Button>

-      <UpdateDialog open={dialogOpen} onClose={() => setDialogOpen(false)} />
+      {dialogOpen && (
+        <UpdateDialog open={dialogOpen} onClose={() => setDialogOpen(false)} />
+      )}
    </>
  );
 };
--- a/src/components/layout/update-dialog.tsx
+++ b/src/components/layout/update-dialog.tsx
@@ -1,16 +1,20 @@
 import useSWR from "swr";
-import { useState } from "react";
+import snarkdown from "snarkdown";
+import { useMemo } from "react";
+import { useRecoilState } from "recoil";
 import {
+  Box,
  Button,
  Dialog,
  DialogActions,
  DialogContent,
-  DialogContentText,
  DialogTitle,
+  styled,
 } from "@mui/material";
 import { relaunch } from "@tauri-apps/api/process";
 import { checkUpdate, installUpdate } from "@tauri-apps/api/updater";
 import { killSidecars, restartSidecar } from "../../services/cmds";
+import { atomUpdateState } from "../../services/states";
 import Notice from "../base/base-notice";

 interface Props {
@@ -18,7 +22,9 @@ interface Props {
  onClose: () => void;
 }

-let uploadingState = false;
+const UpdateLog = styled(Box)(() => ({
+  "h1,h2,h3,ul,ol,p": { margin: "0.5em 0", color: "inherit" },
+}));

 const UpdateDialog = (props: Props) => {
  const { open, onClose } = props;
@@ -27,38 +33,48 @@ const UpdateDialog = (props: Props) => {
    revalidateIfStale: false,
    focusThrottleInterval: 36e5, // 1 hour
  });
-  const [uploading, setUploading] = useState(uploadingState);
+
+  const [updateState, setUpdateState] = useRecoilState(atomUpdateState);

  const onUpdate = async () => {
-    setUploading(true);
-    uploadingState = true;
+    if (updateState) return;
+    setUpdateState(true);

    try {
-      await installUpdate();
      await killSidecars();
+      await installUpdate();
      await relaunch();
    } catch (err: any) {
      await restartSidecar();
      Notice.error(err?.message || err.toString());
    } finally {
-      setUploading(false);
-      uploadingState = false;
+      setUpdateState(false);
    }
  };

+  // markdown parser
+  const parseContent = useMemo(() => {
+    if (!updateInfo?.manifest?.body) {
+      return "New Version is available";
+    }
+    return snarkdown(updateInfo?.manifest?.body);
+  }, [updateInfo]);
+
  return (
    <Dialog open={open} onClose={onClose}>
      <DialogTitle>New Version v{updateInfo?.manifest?.version}</DialogTitle>
+
      <DialogContent sx={{ minWidth: 360, maxWidth: 400, maxHeight: "50vh" }}>
-        <DialogContentText>{updateInfo?.manifest?.body}</DialogContentText>
+        <UpdateLog dangerouslySetInnerHTML={{ __html: parseContent }} />
      </DialogContent>
+
      <DialogActions>
        <Button onClick={onClose}>Cancel</Button>
        <Button
-          variant="contained"
          autoFocus
+          variant="contained"
+          disabled={updateState}
          onClick={onUpdate}
-          disabled={uploading}
        >
          Update
        </Button>
--- a/src/components/layout/use-log-setup.ts
+++ b/src/components/layout/use-log-setup.ts
@@ -1,5 +1,5 @@
 import dayjs from "dayjs";
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { useSetRecoilState } from "recoil";
 import { listen } from "@tauri-apps/api/event";
 import { ApiType } from "../../services/types";
@@ -10,11 +10,11 @@ const MAX_LOG_NUM = 1000;

 // setup the log websocket
 export default function useLogSetup() {
+  const [refresh, setRefresh] = useState({});
  const setLogData = useSetRecoilState(atomLogData);

  useEffect(() => {
    let ws: WebSocket = null!;
-    let unlisten: () => void = null!;

    const handler = (event: MessageEvent<any>) => {
      const data = JSON.parse(event.data) as ApiType.LogItem;
@@ -25,25 +25,19 @@ export default function useLogSetup() {
      });
    };

-    (async () => {
-      const { server = "", secret = "" } = await getInfomation();
-
+    getInfomation().then((info) => {
+      const { server = "", secret = "" } = info;
      ws = new WebSocket(`ws://${server}/logs?token=${secret}`);
      ws.addEventListener("message", handler);
+    });

-      // reconnect the websocket
-      unlisten = await listen("restart_clash", async () => {
-        const { server = "", secret = "" } = await getInfomation();
-
-        ws?.close();
-        ws = new WebSocket(`ws://${server}/logs?token=${secret}`);
-        ws.addEventListener("message", handler);
-      });
-    })();
+    const unlisten = listen("verge://refresh-clash-config", () =>
+      setRefresh({})
+    );

    return () => {
      ws?.close();
-      unlisten?.();
+      unlisten?.then((fn) => fn());
    };
-  }, []);
+  }, [refresh]);
 }
--- a/src/components/log/log-item.tsx
+++ b/src/components/log/log-item.tsx
@@ -6,6 +6,8 @@ const Item = styled(Box)(({ theme }) => ({
  margin: "0 12px",
  lineHeight: 1.35,
  borderBottom: `1px solid ${theme.palette.divider}`,
+  fontSize: "0.875rem",
+  userSelect: "text",
  "& .time": {},
  "& .type": {
    display: "inline-block",
--- a/src/components/profile/file-editor.tsx
+++ b/src/components/profile/file-editor.tsx
@@ -0,0 +1,98 @@
+import useSWR from "swr";
+import { useEffect, useRef } from "react";
+import { useLockFn } from "ahooks";
+import { useTranslation } from "react-i18next";
+import {
+  Button,
+  Dialog,
+  DialogActions,
+  DialogContent,
+  DialogTitle,
+} from "@mui/material";
+import {
+  getVergeConfig,
+  readProfileFile,
+  saveProfileFile,
+} from "../../services/cmds";
+import Notice from "../base/base-notice";
+
+import "monaco-editor/esm/vs/basic-languages/javascript/javascript.contribution.js";
+import "monaco-editor/esm/vs/basic-languages/yaml/yaml.contribution.js";
+import "monaco-editor/esm/vs/editor/contrib/folding/browser/folding.js";
+import { editor } from "monaco-editor/esm/vs/editor/editor.api";
+
+interface Props {
+  uid: string;
+  open: boolean;
+  mode: "yaml" | "javascript";
+  onClose: () => void;
+  onChange?: () => void;
+}
+
+const FileEditor = (props: Props) => {
+  const { uid, open, mode, onClose, onChange } = props;
+
+  const { t } = useTranslation();
+  const editorRef = useRef<any>();
+  const instanceRef = useRef<editor.IStandaloneCodeEditor | null>(null);
+  const { data: vergeConfig } = useSWR("getVergeConfig", getVergeConfig);
+  const { theme_mode } = vergeConfig ?? {};
+
+  useEffect(() => {
+    if (!open) return;
+
+    readProfileFile(uid).then((data) => {
+      const dom = editorRef.current;
+
+      if (!dom) return;
+      if (instanceRef.current) instanceRef.current.dispose();
+
+      instanceRef.current = editor.create(editorRef.current, {
+        value: data,
+        language: mode,
+        theme: theme_mode === "light" ? "vs" : "vs-dark",
+        minimap: { enabled: false },
+      });
+    });
+
+    return () => {
+      if (instanceRef.current) {
+        instanceRef.current.dispose();
+        instanceRef.current = null;
+      }
+    };
+  }, [open]);
+
+  const onSave = useLockFn(async () => {
+    const value = instanceRef.current?.getValue();
+
+    if (value == null) return;
+
+    try {
+      await saveProfileFile(uid, value);
+      onChange?.();
+      onClose();
+    } catch (err: any) {
+      Notice.error(err.message || err.toString());
+    }
+  });
+
+  return (
+    <Dialog open={open} onClose={onClose}>
+      <DialogTitle>{t("Edit File")}</DialogTitle>
+
+      <DialogContent sx={{ width: 520, pb: 1 }}>
+        <div style={{ width: "100%", height: "420px" }} ref={editorRef} />
+      </DialogContent>
+
+      <DialogActions>
+        <Button onClick={onClose}>{t("Cancel")}</Button>
+        <Button onClick={onSave} variant="contained">
+          {t("Save")}
+        </Button>
+      </DialogActions>
+    </Dialog>
+  );
+};
+
+export default FileEditor;
--- a/src/components/profile/file-input.tsx
+++ b/src/components/profile/file-input.tsx
@@ -0,0 +1,61 @@
+import { useRef, useState } from "react";
+import { useLockFn } from "ahooks";
+import { Box, Button, Typography } from "@mui/material";
+
+interface Props {
+  onChange: (value: string) => void;
+}
+
+const FileInput = (props: Props) => {
+  const { onChange } = props;
+
+  // file input
+  const inputRef = useRef<any>();
+  const [loading, setLoading] = useState(false);
+  const [fileName, setFileName] = useState("");
+
+  const onFileInput = useLockFn(async (e: any) => {
+    const file = e.target.files?.[0] as File;
+
+    if (!file) return;
+
+    setFileName(file.name);
+    setLoading(true);
+
+    return new Promise((resolve, reject) => {
+      const reader = new FileReader();
+      reader.onload = (event) => {
+        resolve(null);
+        onChange(event.target?.result as string);
+      };
+      reader.onerror = reject;
+      reader.readAsText(file);
+    }).finally(() => setLoading(false));
+  });
+
+  return (
+    <Box sx={{ mt: 2, mb: 1, display: "flex", alignItems: "center" }}>
+      <Button
+        variant="outlined"
+        sx={{ flex: "none" }}
+        onClick={() => inputRef.current?.click()}
+      >
+        Choose File
+      </Button>
+
+      <input
+        type="file"
+        accept=".yaml,.yml"
+        ref={inputRef}
+        style={{ display: "none" }}
+        onChange={onFileInput}
+      />
+
+      <Typography noWrap sx={{ ml: 1 }}>
+        {loading ? "Loading..." : fileName}
+      </Typography>
+    </Box>
+  );
+};
+
+export default FileInput;
--- a/src/components/profile/profile-edit.tsx
+++ b/src/components/profile/profile-edit.tsx
@@ -41,7 +41,7 @@ const ProfileEdit = (props: Props) => {
    try {
      const { uid } = itemData;
      const { name, desc, url } = form;
-      const option_ = showOpt ? option : undefined;
+      const option_ = itemData.type === "remote" ? option : undefined;

      if (itemData.type === "remote" && !url) {
        throw new Error("Remote URL should not be null");
--- a/src/components/profile/profile-item.tsx
+++ b/src/components/profile/profile-item.tsx
@@ -1,7 +1,9 @@
 import dayjs from "dayjs";
+import { useState } from "react";
 import { useLockFn } from "ahooks";
 import { useSWRConfig } from "swr";
-import { useEffect, useState } from "react";
+import { useRecoilState } from "recoil";
+import { useTranslation } from "react-i18next";
 import {
  alpha,
  Box,
@@ -15,14 +17,13 @@ import {
 } from "@mui/material";
 import { RefreshRounded } from "@mui/icons-material";
 import { CmdType } from "../../services/types";
+import { atomLoadingCache } from "../../services/states";
 import { updateProfile, deleteProfile, viewProfile } from "../../services/cmds";
-import relativeTime from "dayjs/plugin/relativeTime";
 import parseTraffic from "../../utils/parse-traffic";
 import ProfileEdit from "./profile-edit";
+import FileEditor from "./file-editor";
 import Notice from "../base/base-notice";

-dayjs.extend(relativeTime);
-
 const Wrapper = styled(Box)(({ theme }) => ({
  width: "100%",
  display: "block",
@@ -39,9 +40,6 @@ const round = keyframes`
  to { transform: rotate(360deg); }
 `;

-// save the state of each item loading
-const loadingCache: Record<string, boolean> = {};
-
 interface Props {
  selected: boolean;
  itemData: CmdType.ProfileItem;
@@ -51,12 +49,13 @@ interface Props {
 const ProfileItem = (props: Props) => {
  const { selected, itemData, onSelect } = props;

+  const { t } = useTranslation();
  const { mutate } = useSWRConfig();
-  const [loading, setLoading] = useState(loadingCache[itemData.uid] ?? false);
  const [anchorEl, setAnchorEl] = useState<any>(null);
  const [position, setPosition] = useState({ left: 0, top: 0 });
+  const [loadingCache, setLoadingCache] = useRecoilState(atomLoadingCache);

-  const { name = "Profile", extra, updated = 0 } = itemData;
+  const { uid, name = "Profile", extra, updated = 0 } = itemData;
  const { upload = 0, download = 0, total = 0 } = extra ?? {};
  const from = parseUrl(itemData.url);
  const expire = parseExpire(extra?.expire);
@@ -69,23 +68,19 @@ const ProfileItem = (props: Props) => {
  const hasUrl = !!itemData.url;
  const hasExtra = !!extra; // only subscription url has extra info

-  useEffect(() => {
-    loadingCache[itemData.uid] = loading;
-  }, [itemData, loading]);
+  const loading = loadingCache[itemData.uid] ?? false;

  const [editOpen, setEditOpen] = useState(false);
-  const onEdit = () => {
+  const [fileOpen, setFileOpen] = useState(false);
+
+  const onEditInfo = () => {
    setAnchorEl(null);
    setEditOpen(true);
  };

-  const onView = async () => {
+  const onEditFile = () => {
    setAnchorEl(null);
-    try {
-      await viewProfile(itemData.uid);
-    } catch (err: any) {
-      Notice.error(err?.message || err.toString());
-    }
+    setFileOpen(true);
  };

  const onForceSelect = () => {
@@ -93,19 +88,28 @@ const ProfileItem = (props: Props) => {
    onSelect(true);
  };

-  const onUpdateWrapper = (withProxy: boolean) => async () => {
+  const onOpenFile = useLockFn(async () => {
    setAnchorEl(null);
-    if (loading) return;
-    setLoading(true);
    try {
-      await updateProfile(itemData.uid, { with_proxy: withProxy });
-      setLoading(false);
-      mutate("getProfiles");
+      await viewProfile(itemData.uid);
    } catch (err: any) {
-      setLoading(false);
      Notice.error(err?.message || err.toString());
    }
-  };
+  });
+
+  const onUpdate = useLockFn(async (withProxy: boolean) => {
+    setAnchorEl(null);
+    setLoadingCache((cache) => ({ ...cache, [itemData.uid]: true }));
+
+    try {
+      await updateProfile(itemData.uid, { with_proxy: withProxy });
+      mutate("getProfiles");
+    } catch (err: any) {
+      Notice.error(err?.message || err.toString());
+    } finally {
+      setLoadingCache((cache) => ({ ...cache, [itemData.uid]: false }));
+    }
+  });

  const onDelete = useLockFn(async () => {
    setAnchorEl(null);
@@ -126,16 +130,18 @@ const ProfileItem = (props: Props) => {

  const urlModeMenu = [
    { label: "Select", handler: onForceSelect },
-    { label: "Edit", handler: onEdit },
-    { label: "File", handler: onView },
-    { label: "Update", handler: onUpdateWrapper(false) },
-    { label: "Update(Proxy)", handler: onUpdateWrapper(true) },
+    { label: "Edit Info", handler: onEditInfo },
+    { label: "Edit File", handler: onEditFile },
+    { label: "Open File", handler: onOpenFile },
+    { label: "Update", handler: () => onUpdate(false) },
+    { label: "Update(Proxy)", handler: () => onUpdate(true) },
    { label: "Delete", handler: onDelete },
  ];
  const fileModeMenu = [
    { label: "Select", handler: onForceSelect },
-    { label: "Edit", handler: onEdit },
-    { label: "File", handler: onView },
+    { label: "Edit Info", handler: onEditInfo },
+    { label: "Edit File", handler: onEditFile },
+    { label: "Open File", handler: onOpenFile },
    { label: "Delete", handler: onDelete },
  ];

@@ -200,7 +206,7 @@ const ProfileItem = (props: Props) => {
              disabled={loading}
              onClick={(e) => {
                e.stopPropagation();
-                onUpdateWrapper(false)();
+                onUpdate(false);
              }}
            >
              <RefreshRounded />
@@ -260,6 +266,7 @@ const ProfileItem = (props: Props) => {
        onClose={() => setAnchorEl(null)}
        anchorPosition={position}
        anchorReference="anchorPosition"
+        transitionDuration={225}
        onContextMenu={(e) => {
          setAnchorEl(null);
          e.preventDefault();
@@ -271,7 +278,7 @@ const ProfileItem = (props: Props) => {
            onClick={item.handler}
            sx={{ minWidth: 133 }}
          >
-            {item.label}
+            {t(item.label)}
          </MenuItem>
        ))}
      </Menu>
@@ -283,6 +290,15 @@ const ProfileItem = (props: Props) => {
          onClose={() => setEditOpen(false)}
        />
      )}
+
+      {fileOpen && (
+        <FileEditor
+          uid={uid}
+          open={fileOpen}
+          mode="yaml"
+          onClose={() => setFileOpen(false)}
+        />
+      )}
    </>
  );
 };
--- a/src/components/profile/profile-more.tsx
+++ b/src/components/profile/profile-more.tsx
@@ -1,5 +1,7 @@
 import dayjs from "dayjs";
 import { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { useLockFn } from "ahooks";
 import {
  alpha,
  Box,
@@ -11,12 +13,10 @@ import {
 } from "@mui/material";
 import { CmdType } from "../../services/types";
 import { viewProfile } from "../../services/cmds";
-import relativeTime from "dayjs/plugin/relativeTime";
-import ProfileEdit from "./profile-edit";
-import Notice from "../base/base-notice";
 import enhance from "../../services/enhance";
-
-dayjs.extend(relativeTime);
+import ProfileEdit from "./profile-edit";
+import FileEditor from "./file-editor";
+import Notice from "../base/base-notice";

 const Wrapper = styled(Box)(({ theme }) => ({
  width: "100%",
@@ -54,9 +54,12 @@ const ProfileMore = (props: Props) => {
  } = props;

  const { uid, type } = itemData;
+  const { t } = useTranslation();
+
  const [anchorEl, setAnchorEl] = useState<any>(null);
  const [position, setPosition] = useState({ left: 0, top: 0 });
  const [editOpen, setEditOpen] = useState(false);
+  const [fileOpen, setFileOpen] = useState(false);
  const [status, setStatus] = useState(enhance.status(uid));

  // unlisten when unmount
@@ -65,40 +68,47 @@ const ProfileMore = (props: Props) => {
  // error during enhanced mode
  const hasError = selected && status?.status === "error";

-  const onEdit = () => {
+  const onEditInfo = () => {
    setAnchorEl(null);
    setEditOpen(true);
  };

-  const onView = async () => {
+  const onEditFile = () => {
+    setAnchorEl(null);
+    setFileOpen(true);
+  };
+
+  const onOpenFile = useLockFn(async () => {
    setAnchorEl(null);
    try {
      await viewProfile(itemData.uid);
    } catch (err: any) {
      Notice.error(err?.message || err.toString());
    }
-  };
+  });

-  const closeWrapper = (fn: () => void) => () => {
+  const fnWrapper = (fn: () => void) => () => {
    setAnchorEl(null);
    return fn();
  };

  const enableMenu = [
-    { label: "Disable", handler: closeWrapper(onDisable) },
-    { label: "Refresh", handler: closeWrapper(onEnhance) },
-    { label: "Edit", handler: onEdit },
-    { label: "File", handler: onView },
-    { label: "To Top", show: !hasError, handler: closeWrapper(onMoveTop) },
-    { label: "To End", show: !hasError, handler: closeWrapper(onMoveEnd) },
-    { label: "Delete", handler: closeWrapper(onDelete) },
+    { label: "Disable", handler: fnWrapper(onDisable) },
+    { label: "Refresh", handler: fnWrapper(onEnhance) },
+    { label: "Edit Info", handler: onEditInfo },
+    { label: "Edit File", handler: onEditFile },
+    { label: "Open File", handler: onOpenFile },
+    { label: "To Top", show: !hasError, handler: fnWrapper(onMoveTop) },
+    { label: "To End", show: !hasError, handler: fnWrapper(onMoveEnd) },
+    { label: "Delete", handler: fnWrapper(onDelete) },
  ];

  const disableMenu = [
-    { label: "Enable", handler: closeWrapper(onEnable) },
-    { label: "Edit", handler: onEdit },
-    { label: "File", handler: onView },
-    { label: "Delete", handler: closeWrapper(onDelete) },
+    { label: "Enable", handler: fnWrapper(onEnable) },
+    { label: "Edit Info", handler: onEditInfo },
+    { label: "Edit File", handler: onEditFile },
+    { label: "Open File", handler: onOpenFile },
+    { label: "Delete", handler: fnWrapper(onDelete) },
  ];

  const boxStyle = {
@@ -208,6 +218,7 @@ const ProfileMore = (props: Props) => {
        onClose={() => setAnchorEl(null)}
        anchorPosition={position}
        anchorReference="anchorPosition"
+        transitionDuration={225}
        onContextMenu={(e) => {
          setAnchorEl(null);
          e.preventDefault();
@@ -221,7 +232,7 @@ const ProfileMore = (props: Props) => {
              onClick={item.handler}
              sx={{ minWidth: 133 }}
            >
-              {item.label}
+              {t(item.label)}
            </MenuItem>
          ))}
      </Menu>
@@ -233,6 +244,15 @@ const ProfileMore = (props: Props) => {
          onClose={() => setEditOpen(false)}
        />
      )}
+
+      {fileOpen && (
+        <FileEditor
+          uid={uid}
+          open={fileOpen}
+          mode={type === "merge" ? "yaml" : "javascript"}
+          onClose={() => setFileOpen(false)}
+        />
+      )}
    </>
  );
 };
--- a/src/components/profile/profile-new.tsx
+++ b/src/components/profile/profile-new.tsx
@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useRef, useState } from "react";
 import { useSWRConfig } from "swr";
 import { useLockFn, useSetState } from "ahooks";
 import {
@@ -17,6 +17,7 @@ import {
 import { Settings } from "@mui/icons-material";
 import { createProfile } from "../../services/cmds";
 import Notice from "../base/base-notice";
+import FileInput from "./file-input";

 interface Props {
  open: boolean;
@@ -37,9 +38,10 @@ const ProfileNew = (props: Props) => {
  });

  const [showOpt, setShowOpt] = useState(false);
-  const [option, setOption] = useSetState({
-    user_agent: "",
-  }); // able to add more option
+  // can add more option
+  const [option, setOption] = useSetState({ user_agent: "" });
+  // file input
+  const fileDataRef = useRef<string | null>(null);

  const onCreate = useLockFn(async () => {
    if (!form.type) {
@@ -54,11 +56,16 @@ const ProfileNew = (props: Props) => {
        throw new Error("The URL should not be null");
      }

-      const option_ = showOpt ? option : undefined;
-      await createProfile({ ...form, name, option: option_ });
+      const option_ = form.type === "remote" ? option : undefined;
+      const item = { ...form, name, option: option_ };
+      const fileData = form.type === "local" ? fileDataRef.current : null;
+
+      await createProfile(item, fileData);
+
      setForm({ type: "remote", name: "", desc: "", url: "" });
      setOption({ user_agent: "" });
      setShowOpt(false);
+      fileDataRef.current = null;

      mutate("getProfiles");
      onClose();
@@ -97,6 +104,7 @@ const ProfileNew = (props: Props) => {
        <TextField
          {...textFieldProps}
          label="Name"
+          autoComplete="off"
          value={form.name}
          onChange={(e) => setForm({ name: e.target.value })}
        />
@@ -104,6 +112,7 @@ const ProfileNew = (props: Props) => {
        <TextField
          {...textFieldProps}
          label="Descriptions"
+          autoComplete="off"
          value={form.desc}
          onChange={(e) => setForm({ desc: e.target.value })}
        />
@@ -112,15 +121,21 @@ const ProfileNew = (props: Props) => {
          <TextField
            {...textFieldProps}
            label="Subscription Url"
+            autoComplete="off"
            value={form.url}
            onChange={(e) => setForm({ url: e.target.value })}
          />
        )}

+        {form.type === "local" && (
+          <FileInput onChange={(val) => (fileDataRef.current = val)} />
+        )}
+
        {showOpt && (
          <TextField
            {...textFieldProps}
            label="User Agent"
+            autoComplete="off"
            value={option.user_agent}
            onChange={(e) => setOption({ user_agent: e.target.value })}
          />
--- a/src/components/proxy/proxy-global.tsx
+++ b/src/components/proxy/proxy-global.tsx
@@ -1,5 +1,5 @@
+import useSWR, { useSWRConfig } from "swr";
 import { useEffect, useRef, useState } from "react";
-import { useSWRConfig } from "swr";
 import { useLockFn } from "ahooks";
 import { Virtuoso } from "react-virtuoso";
 import { Box, IconButton, TextField } from "@mui/material";
@@ -13,6 +13,7 @@ import {
 } from "@mui/icons-material";
 import { ApiType } from "../../services/types";
 import { updateProxy } from "../../services/api";
+import { getProfiles, patchProfile } from "../../services/cmds";
 import delayManager from "../../services/delay";
 import useFilterProxy from "./use-filter-proxy";
 import ProxyItem from "./proxy-item";
@@ -23,6 +24,7 @@ interface Props {
  proxies: ApiType.ProxyItem[];
 }

+// this component will be used for DIRECT/GLOBAL
 const ProxyGlobal = (props: Props) => {
  const { groupName, curProxy, proxies } = props;

@@ -35,10 +37,27 @@ const ProxyGlobal = (props: Props) => {
  const virtuosoRef = useRef<any>();
  const filterProxies = useFilterProxy(proxies, groupName, filterText);

+  const { data: profiles } = useSWR("getProfiles", getProfiles);
+
  const onChangeProxy = useLockFn(async (name: string) => {
-    await updateProxy("GLOBAL", name);
-    mutate("getProxies");
+    await updateProxy(groupName, name);
    setNow(name);
+
+    if (groupName === "DIRECT") return;
+
+    // update global selected
+    const profile = profiles?.items?.find((p) => p.uid === profiles.current);
+    if (!profile) return;
+    if (!profile.selected) profile.selected = [];
+
+    const index = profile.selected.findIndex((item) => item.name === groupName);
+    if (index < 0) {
+      profile.selected.unshift({ name: groupName, now: name });
+    } else {
+      profile.selected[index] = { name: groupName, now: name };
+    }
+
+    await patchProfile(profiles!.current!, { selected: profile.selected });
  });

  const onLocation = (smooth = true) => {
@@ -72,8 +91,24 @@ const ProxyGlobal = (props: Props) => {

  useEffect(() => {
    if (groupName === "DIRECT") setNow("DIRECT");
-    if (groupName === "GLOBAL") setNow(curProxy || "DIRECT");
-  }, [groupName, curProxy]);
+    else if (groupName === "GLOBAL") {
+      if (profiles) {
+        const current = profiles.current;
+        const profile = profiles.items?.find((p) => p.uid === current);
+
+        profile?.selected?.forEach((item) => {
+          if (item.name === "GLOBAL") {
+            if (item.now && item.now !== curProxy) {
+              updateProxy("GLOBAL", item.now).then(() => setNow(item!.now!));
+              mutate("getProxies");
+            }
+          }
+        });
+      }
+
+      setNow(curProxy || "DIRECT");
+    }
+  }, [groupName, curProxy, profiles]);

  return (
    <>
--- a/src/components/setting/setting-clash.tsx
+++ b/src/components/setting/setting-clash.tsx
@@ -1,5 +1,6 @@
 import useSWR, { useSWRConfig } from "swr";
 import { useSetRecoilState } from "recoil";
+import { useTranslation } from "react-i18next";
 import {
  ListItemText,
  TextField,
@@ -21,15 +22,16 @@ interface Props {
 }

 const SettingClash = ({ onError }: Props) => {
+  const { t } = useTranslation();
  const { mutate } = useSWRConfig();
  const { data: clashConfig } = useSWR("getClashConfig", getClashConfig);
  const { data: versionData } = useSWR("getVersion", getVersion);

  const {
-    ipv6 = false,
-    "allow-lan": allowLan = false,
-    "log-level": logLevel = "silent",
-    "mixed-port": mixedPort = 0,
+    ipv6,
+    "allow-lan": allowLan,
+    "log-level": logLevel,
+    "mixed-port": mixedPort,
  } = clashConfig ?? {};

  const setGlobalClashPort = useSetRecoilState(atomClashPort);
@@ -64,11 +66,11 @@ const SettingClash = ({ onError }: Props) => {
    : versionData?.version || "-";

  return (
-    <SettingList title="Clash Setting">
+    <SettingList title={t("Clash Setting")}>
      <SettingItem>
-        <ListItemText primary="Allow Lan" />
+        <ListItemText primary={t("Allow Lan")} />
        <GuardState
-          value={allowLan}
+          value={allowLan ?? false}
          valueProps="checked"
          onCatch={onError}
          onFormat={onSwitchFormat}
@@ -80,9 +82,9 @@ const SettingClash = ({ onError }: Props) => {
      </SettingItem>

      <SettingItem>
-        <ListItemText primary="IPv6" />
+        <ListItemText primary={t("IPv6")} />
        <GuardState
-          value={ipv6}
+          value={ipv6 ?? false}
          valueProps="checked"
          onCatch={onError}
          onFormat={onSwitchFormat}
@@ -94,9 +96,9 @@ const SettingClash = ({ onError }: Props) => {
      </SettingItem>

      <SettingItem>
-        <ListItemText primary="Log Level" />
+        <ListItemText primary={t("Log Level")} />
        <GuardState
-          value={logLevel}
+          value={logLevel ?? "info"}
          onCatch={onError}
          onFormat={(e: any) => e.target.value}
          onChange={(e) => onChangeData({ "log-level": e })}
@@ -113,9 +115,9 @@ const SettingClash = ({ onError }: Props) => {
      </SettingItem>

      <SettingItem>
-        <ListItemText primary="Mixed Port" />
+        <ListItemText primary={t("Mixed Port")} />
        <GuardState
-          value={mixedPort!}
+          value={mixedPort ?? 0}
          onCatch={onError}
          onFormat={(e: any) => +e.target.value?.replace(/\D+/, "")}
          onChange={(e) => onChangeData({ "mixed-port": e })}
@@ -127,7 +129,7 @@ const SettingClash = ({ onError }: Props) => {
      </SettingItem>

      <SettingItem>
-        <ListItemText primary="Clash core" />
+        <ListItemText primary={t("Clash core")} />
        <Typography sx={{ py: 1 }}>{clashVer}</Typography>
      </SettingItem>
    </SettingList>
--- a/src/components/setting/setting-system.tsx
+++ b/src/components/setting/setting-system.tsx
@@ -1,4 +1,5 @@
 import useSWR, { useSWRConfig } from "swr";
+import { useTranslation } from "react-i18next";
 import { Box, ListItemText, Switch, TextField } from "@mui/material";
 import { getVergeConfig, patchVergeConfig } from "../../services/cmds";
 import { SettingList, SettingItem } from "./setting";
@@ -11,15 +12,17 @@ interface Props {
 }

 const SettingSystem = ({ onError }: Props) => {
+  const { t } = useTranslation();
  const { mutate } = useSWRConfig();
  const { data: vergeConfig } = useSWR("getVergeConfig", getVergeConfig);

  const {
-    enable_tun_mode = false,
-    enable_auto_launch = false,
-    enable_system_proxy = false,
-    system_proxy_bypass = "",
-    enable_proxy_guard = false,
+    enable_tun_mode,
+    enable_auto_launch,
+    enable_silent_start,
+    enable_system_proxy,
+    system_proxy_bypass,
+    enable_proxy_guard,
  } = vergeConfig ?? {};

  const onSwitchFormat = (_e: any, value: boolean) => value;
@@ -28,11 +31,11 @@ const SettingSystem = ({ onError }: Props) => {
  };

  return (
-    <SettingList title="System Setting">
+    <SettingList title={t("System Setting")}>
      <SettingItem>
-        <ListItemText primary="Tun Mode" />
+        <ListItemText primary={t("Tun Mode")} />
        <GuardState
-          value={enable_tun_mode}
+          value={enable_tun_mode ?? false}
          valueProps="checked"
          onCatch={onError}
          onFormat={onSwitchFormat}
@@ -44,9 +47,9 @@ const SettingSystem = ({ onError }: Props) => {
      </SettingItem>

      <SettingItem>
-        <ListItemText primary="Auto Launch" />
+        <ListItemText primary={t("Auto Launch")} />
        <GuardState
-          value={enable_auto_launch}
+          value={enable_auto_launch ?? false}
          valueProps="checked"
          onCatch={onError}
          onFormat={onSwitchFormat}
@@ -57,17 +60,31 @@ const SettingSystem = ({ onError }: Props) => {
        </GuardState>
      </SettingItem>

+      <SettingItem>
+        <ListItemText primary={t("Silent Start")} />
+        <GuardState
+          value={enable_silent_start ?? false}
+          valueProps="checked"
+          onCatch={onError}
+          onFormat={onSwitchFormat}
+          onChange={(e) => onChangeData({ enable_silent_start: e })}
+          onGuard={(e) => patchVergeConfig({ enable_silent_start: e })}
+        >
+          <Switch edge="end" />
+        </GuardState>
+      </SettingItem>
+
      <SettingItem>
        <ListItemText
          primary={
            <Box sx={{ display: "flex", alignItems: "center" }}>
-              System Proxy
+              {t("System Proxy")}
              <SysproxyTooltip />
            </Box>
          }
        />
        <GuardState
-          value={enable_system_proxy}
+          value={enable_system_proxy ?? false}
          valueProps="checked"
          onCatch={onError}
          onFormat={onSwitchFormat}
@@ -83,9 +100,9 @@ const SettingSystem = ({ onError }: Props) => {

      {enable_system_proxy && (
        <SettingItem>
-          <ListItemText primary="Proxy Guard" />
+          <ListItemText primary={t("Proxy Guard")} />
          <GuardState
-            value={enable_proxy_guard}
+            value={enable_proxy_guard ?? false}
            valueProps="checked"
            onCatch={onError}
            onFormat={onSwitchFormat}
@@ -99,7 +116,7 @@ const SettingSystem = ({ onError }: Props) => {

      {enable_system_proxy && (
        <SettingItem>
-          <ListItemText primary="Proxy Bypass" />
+          <ListItemText primary={t("Proxy Bypass")} />
          <GuardState
            value={system_proxy_bypass ?? ""}
            onCatch={onError}
--- a/src/components/setting/setting-verge.tsx
+++ b/src/components/setting/setting-verge.tsx
@@ -1,5 +1,13 @@
 import useSWR, { useSWRConfig } from "swr";
-import { IconButton, ListItemText, Switch, Typography } from "@mui/material";
+import { useTranslation } from "react-i18next";
+import {
+  IconButton,
+  ListItemText,
+  MenuItem,
+  Select,
+  Switch,
+  Typography,
+} from "@mui/material";
 import {
  getVergeConfig,
  openAppDir,
@@ -18,11 +26,11 @@ interface Props {
 }

 const SettingVerge = ({ onError }: Props) => {
+  const { t } = useTranslation();
  const { mutate } = useSWRConfig();
  const { data: vergeConfig } = useSWR("getVergeConfig", getVergeConfig);

-  const { theme_mode = "light", theme_blur = false, traffic_graph } =
-    vergeConfig ?? {};
+  const { theme_mode, theme_blur, traffic_graph, language } = vergeConfig ?? {};

  const onSwitchFormat = (_e: any, value: boolean) => value;
  const onChangeData = (patch: Partial<CmdType.VergeConfig>) => {
@@ -30,9 +38,9 @@ const SettingVerge = ({ onError }: Props) => {
  };

  return (
-    <SettingList title="Verge Setting">
+    <SettingList title={t("Verge Setting")}>
      <SettingItem>
-        <ListItemText primary="Theme Mode" />
+        <ListItemText primary={t("Theme Mode")} />
        <GuardState
          value={theme_mode === "dark"}
          valueProps="checked"
@@ -48,9 +56,9 @@ const SettingVerge = ({ onError }: Props) => {
      </SettingItem>

      <SettingItem>
-        <ListItemText primary="Theme Blur" />
+        <ListItemText primary={t("Theme Blur")} />
        <GuardState
-          value={theme_blur}
+          value={theme_blur ?? false}
          valueProps="checked"
          onCatch={onError}
          onFormat={onSwitchFormat}
@@ -62,7 +70,7 @@ const SettingVerge = ({ onError }: Props) => {
      </SettingItem>

      <SettingItem>
-        <ListItemText primary="Traffic Graph" />
+        <ListItemText primary={t("Traffic Graph")} />
        <GuardState
          value={traffic_graph ?? true}
          valueProps="checked"
@@ -76,21 +84,37 @@ const SettingVerge = ({ onError }: Props) => {
      </SettingItem>

      <SettingItem>
-        <ListItemText primary="Open App Dir" />
+        <ListItemText primary={t("Language")} />
+        <GuardState
+          value={language ?? "en"}
+          onCatch={onError}
+          onFormat={(e: any) => e.target.value}
+          onChange={(e) => onChangeData({ language: e })}
+          onGuard={(e) => patchVergeConfig({ language: e })}
+        >
+          <Select size="small" sx={{ width: 100 }}>
+            <MenuItem value="zh">中文</MenuItem>
+            <MenuItem value="en">English</MenuItem>
+          </Select>
+        </GuardState>
+      </SettingItem>
+
+      <SettingItem>
+        <ListItemText primary={t("Open App Dir")} />
        <IconButton color="inherit" size="small" onClick={openAppDir}>
          <ArrowForward />
        </IconButton>
      </SettingItem>

      <SettingItem>
-        <ListItemText primary="Open Logs Dir" />
+        <ListItemText primary={t("Open Logs Dir")} />
        <IconButton color="inherit" size="small" onClick={openLogsDir}>
          <ArrowForward />
        </IconButton>
      </SettingItem>

      <SettingItem>
-        <ListItemText primary="Version" />
+        <ListItemText primary={t("Version")} />
        <Typography sx={{ py: "6px" }}>v{version}</Typography>
      </SettingItem>
    </SettingList>
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -0,0 +1,59 @@
+{
+  "Label-Proxies": "Proxies",
+  "Label-Profiles": "Profiles",
+  "Label-Connections": "Connections",
+  "Label-Logs": "Logs",
+  "Label-Settings": "Settings",
+
+  "Connections": "Connections",
+  "Logs": "Logs",
+  "Clear": "Clear",
+  "Proxies": "Proxies",
+  "Proxy Groups": "Proxy Groups",
+  "rule": "rule",
+  "global": "global",
+  "direct": "direct",
+  "Profiles": "Profiles",
+  "Profile URL": "Profile URL",
+  "Import": "Import",
+  "New": "New",
+  "Close All": "Close All",
+  "Select": "Select",
+  "Edit Info": "Edit Info",
+  "Edit File": "Edit File",
+  "Open File": "Open File",
+  "Update": "Update",
+  "Update(Proxy)": "Update(Proxy)",
+  "Delete": "Delete",
+  "Enable": "Enable",
+  "Disable": "Disable",
+  "Refresh": "Refresh",
+  "To Top": "To Top",
+  "To End": "To End",
+
+  "Settings": "Settings",
+  "Clash Setting": "Clash Setting",
+  "System Setting": "System Setting",
+  "Verge Setting": "Verge Setting",
+  "Allow Lan": "Allow Lan",
+  "IPv6": "IPv6",
+  "Log Level": "Log Level",
+  "Mixed Port": "Mixed Port",
+  "Clash core": "Clash core",
+  "Tun Mode": "Tun Mode",
+  "Auto Launch": "Auto Launch",
+  "Silent Start": "Silent Start",
+  "System Proxy": "System Proxy",
+  "Proxy Guard": "Proxy Guard",
+  "Proxy Bypass": "Proxy Bypass",
+  "Theme Mode": "Theme Mode",
+  "Theme Blur": "Theme Blur",
+  "Traffic Graph": "Traffic Graph",
+  "Language": "Language",
+  "Open App Dir": "Open App Dir",
+  "Open Logs Dir": "Open Logs Dir",
+  "Version": "Version",
+
+  "Save": "Save",
+  "Cancel": "Cancel"
+}
--- a/src/locales/zh.json
+++ b/src/locales/zh.json
@@ -0,0 +1,59 @@
+{
+  "Label-Proxies": "代 理",
+  "Label-Profiles": "配 置",
+  "Label-Connections": "连 接",
+  "Label-Logs": "日 志",
+  "Label-Settings": "设 置",
+
+  "Connections": "连接",
+  "Logs": "日志",
+  "Clear": "清除",
+  "Proxies": "代理",
+  "Proxy Groups": "代理组",
+  "rule": "规则",
+  "global": "全局",
+  "direct": "直连",
+  "Profiles": "配置",
+  "Profile URL": "配置文件链接",
+  "Import": "导入",
+  "New": "新建",
+  "Close All": "关闭全部",
+  "Select": "使用",
+  "Edit Info": "编辑信息",
+  "Edit File": "编辑文件",
+  "Open File": "打开文件",
+  "Update": "更新",
+  "Update(Proxy)": "更新(代理)",
+  "Delete": "删除",
+  "Enable": "启用",
+  "Disable": "禁用",
+  "Refresh": "刷新",
+  "To Top": "移到最前",
+  "To End": "移到末尾",
+
+  "Settings": "设置",
+  "Clash Setting": "Clash 设置",
+  "System Setting": "系统设置",
+  "Verge Setting": "Verge 设置",
+  "Allow Lan": "局域网连接",
+  "IPv6": "IPv6",
+  "Log Level": "日志等级",
+  "Mixed Port": "端口设置",
+  "Clash core": "Clash 内核",
+  "Tun Mode": "Tun 模式",
+  "Auto Launch": "开机自启",
+  "Silent Start": "静默启动",
+  "System Proxy": "系统代理",
+  "Proxy Guard": "系统代理守卫",
+  "Proxy Bypass": "Proxy Bypass",
+  "Theme Mode": "暗夜模式",
+  "Theme Blur": "背景模糊",
+  "Traffic Graph": "流量图显",
+  "Language": "语言设置",
+  "Open App Dir": "应用目录",
+  "Open Logs Dir": "日志目录",
+  "Version": "版本",
+
+  "Save": "保存",
+  "Cancel": "取消"
+}
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -7,6 +7,7 @@ import { RecoilRoot } from "recoil";
 import { BrowserRouter } from "react-router-dom";
 import Layout from "./pages/_layout";
 import enhance from "./services/enhance";
+import "./services/i18n";

 enhance.setup();

--- a/src/pages/_layout.tsx
+++ b/src/pages/_layout.tsx
@@ -1,5 +1,9 @@
+import dayjs from "dayjs";
+import i18next from "i18next";
+import relativeTime from "dayjs/plugin/relativeTime";
 import useSWR, { SWRConfig, useSWRConfig } from "swr";
 import { useEffect, useMemo } from "react";
+import { useTranslation } from "react-i18next";
 import { Route, Routes } from "react-router-dom";
 import { alpha, createTheme, List, Paper, ThemeProvider } from "@mui/material";
 import { listen } from "@tauri-apps/api/event";
@@ -12,10 +16,15 @@ import LayoutItem from "../components/layout/layout-item";
 import LayoutControl from "../components/layout/layout-control";
 import LayoutTraffic from "../components/layout/layout-traffic";
 import UpdateButton from "../components/layout/update-button";
+import getSystem from "../utils/get-system";
+import "dayjs/locale/zh-cn";

-const isMacos = navigator.userAgent.includes("Mac OS X");
+dayjs.extend(relativeTime);
+
+const OS = getSystem();

 const Layout = () => {
+  const { t } = useTranslation();
  const { mutate } = useSWRConfig();
  const { data } = useSWR("getVergeConfig", getVergeConfig);

@@ -27,16 +36,24 @@ const Layout = () => {
      if (e.key === "Escape") appWindow.hide();
    });

-    listen("restart_clash", async () => {
+    listen("verge://refresh-clash-config", async () => {
      // the clash info may be updated
      await getAxios(true);
-      // make sure that the clash is ok
-      setTimeout(() => mutate("getProxies"), 1000);
-      setTimeout(() => mutate("getProxies"), 2000);
+      mutate("getProxies");
      mutate("getClashConfig");
    });
+
+    // update the verge config
+    listen("verge://refresh-verge-config", () => mutate("getVergeConfig"));
  }, []);

+  useEffect(() => {
+    if (data?.language) {
+      dayjs.locale(data.language === "zh" ? "zh-cn" : data.language);
+      i18next.changeLanguage(data.language);
+    }
+  }, [data?.language]);
+
  const theme = useMemo(() => {
    // const background = mode === "light" ? "#f5f5f5" : "#000";
    const selectColor = mode === "light" ? "#f5f5f5" : "#d5d5d5";
@@ -69,8 +86,12 @@ const Layout = () => {
        <Paper
          square
          elevation={0}
-          className={`${isMacos ? "macos " : ""}layout`}
+          className={`${OS} layout`}
          onPointerDown={onDragging}
+          onContextMenu={(e) => {
+            // only prevent it on Windows
+            if (OS === "windows") e.preventDefault();
+          }}
          sx={[
            (theme) => ({
              bgcolor: alpha(theme.palette.background.paper, blur ? 0.85 : 1),
@@ -87,7 +108,7 @@ const Layout = () => {
            <List className="the-menu" data-windrag>
              {routers.map((router) => (
                <LayoutItem key={router.label} to={router.link}>
-                  {router.label}
+                  {t(router.label)}
                </LayoutItem>
              ))}
            </List>
@@ -98,7 +119,7 @@ const Layout = () => {
          </div>

          <div className="layout__right" data-windrag>
-            {!isMacos && (
+            {OS !== "macos" && (
              <div className="the-bar">
                <LayoutControl />
              </div>
--- a/src/pages/_routers.tsx
+++ b/src/pages/_routers.tsx
@@ -6,27 +6,27 @@ import ConnectionsPage from "./connections";

 export const routers = [
  {
-    label: "Proxies",
+    label: "Label-Proxies",
    link: "/",
    ele: ProxiesPage,
  },
  {
-    label: "Profiles",
+    label: "Label-Profiles",
    link: "/profile",
    ele: ProfilesPage,
  },
  {
-    label: "Connections",
+    label: "Label-Connections",
    link: "/connections",
    ele: ConnectionsPage,
  },
  {
-    label: "Logs",
+    label: "Label-Logs",
    link: "/logs",
    ele: LogsPage,
  },
  {
-    label: "Settings",
+    label: "Label-Settings",
    link: "/settings",
    ele: SettingsPage,
  },
--- a/src/pages/connections.tsx
+++ b/src/pages/connections.tsx
@@ -1,14 +1,18 @@
 import { useEffect, useState } from "react";
-import { Paper } from "@mui/material";
+import { useLockFn } from "ahooks";
+import { Button, Paper } from "@mui/material";
 import { Virtuoso } from "react-virtuoso";
+import { useTranslation } from "react-i18next";
 import { ApiType } from "../services/types";
-import { getInfomation } from "../services/api";
+import { closeAllConnections, getInfomation } from "../services/api";
 import BasePage from "../components/base/base-page";
 import ConnectionItem from "../components/connection/connection-item";

 const ConnectionsPage = () => {
  const initConn = { uploadTotal: 0, downloadTotal: 0, connections: [] };
-  const [conn, setConn] = useState<ApiType.Connections>(initConn);
+
+  const { t } = useTranslation();
+  const [connData, setConnData] = useState<ApiType.Connections>(initConn);

  useEffect(() => {
    let ws: WebSocket | null = null;
@@ -19,18 +23,62 @@ const ConnectionsPage = () => {

      ws.addEventListener("message", (event) => {
        const data = JSON.parse(event.data) as ApiType.Connections;
-        setConn(data);
+        setConnData((old) => {
+          const oldConn = old.connections;
+          const oldList = oldConn.map((each) => each.id);
+          const maxLen = data.connections.length;
+
+          const connections: typeof oldConn = [];
+
+          // 与前一次连接的顺序尽量保持一致
+          data.connections
+            .filter((each) => {
+              const index = oldList.indexOf(each.id);
+
+              if (index >= 0 && index < maxLen) {
+                connections[index] = each;
+                return false;
+              }
+              return true;
+            })
+            .forEach((each) => {
+              for (let i = 0; i < maxLen; ++i) {
+                if (!connections[i]) {
+                  connections[i] = each;
+                  return;
+                }
+              }
+            });
+
+          return { ...data, connections };
+        });
      });
    });

    return () => ws?.close();
  }, []);

+  const onCloseAll = useLockFn(closeAllConnections);
+
  return (
-    <BasePage title="Connections" contentStyle={{ height: "100%" }}>
+    <BasePage
+      title={t("Connections")}
+      contentStyle={{ height: "100%" }}
+      header={
+        <Button
+          size="small"
+          sx={{ mt: 1 }}
+          variant="contained"
+          onClick={onCloseAll}
+        >
+          {t("Close All")}
+        </Button>
+      }
+    >
      <Paper sx={{ boxShadow: 2, height: "100%" }}>
        <Virtuoso
-          data={conn.connections}
+          initialTopMostItemIndex={999}
+          data={connData.connections}
          itemContent={(index, item) => <ConnectionItem value={item} />}
        />
      </Paper>
--- a/src/pages/logs.tsx
+++ b/src/pages/logs.tsx
@@ -1,16 +1,18 @@
 import { useRecoilState } from "recoil";
 import { Button, Paper } from "@mui/material";
 import { Virtuoso } from "react-virtuoso";
+import { useTranslation } from "react-i18next";
 import { atomLogData } from "../services/states";
 import BasePage from "../components/base/base-page";
 import LogItem from "../components/log/log-item";

 const LogPage = () => {
+  const { t } = useTranslation();
  const [logData, setLogData] = useRecoilState(atomLogData);

  return (
    <BasePage
-      title="Logs"
+      title={t("Logs")}
      contentStyle={{ height: "100%" }}
      header={
        <Button
@@ -19,7 +21,7 @@ const LogPage = () => {
          variant="contained"
          onClick={() => setLogData([])}
        >
-          Clear
+          {t("Clear")}
        </Button>
      }
    >
--- a/src/pages/profiles.tsx
+++ b/src/pages/profiles.tsx
@@ -2,6 +2,7 @@ import useSWR, { useSWRConfig } from "swr";
 import { useLockFn } from "ahooks";
 import { useEffect, useMemo, useState } from "react";
 import { Box, Button, Grid, TextField } from "@mui/material";
+import { useTranslation } from "react-i18next";
 import {
  getProfiles,
  patchProfile,
@@ -19,6 +20,7 @@ import ProfileItem from "../components/profile/profile-item";
 import ProfileMore from "../components/profile/profile-more";

 const ProfilePage = () => {
+  const { t } = useTranslation();
  const { mutate } = useSWRConfig();

  const [url, setUrl] = useState("");
@@ -27,6 +29,7 @@ const ProfilePage = () => {

  const { data: profiles = {} } = useSWR("getProfiles", getProfiles);

+  // distinguish type
  const { regularItems, enhanceItems } = useMemo(() => {
    const items = profiles.items || [];
    const chain = profiles.chain || [];
@@ -46,6 +49,7 @@ const ProfilePage = () => {
    return { regularItems, enhanceItems };
  }, [profiles]);

+  // sync selected proxy
  useEffect(() => {
    if (profiles.current == null) return;

@@ -63,9 +67,10 @@ const ProfilePage = () => {
        selected.map((each) => [each.name!, each.now!])
      );

-      // todo: enhance error handle
      let hasChange = false;
-      proxiesData.groups.forEach((group) => {
+
+      const { global, groups } = proxiesData;
+      [global, ...groups].forEach((group) => {
        const { name, now } = group;

        if (!now || selectedMap[name] === now) return;
@@ -76,15 +81,14 @@ const ProfilePage = () => {
          updateProxy(name, selectedMap[name]);
        }
      });
+
      // update profile selected list
      profile.selected = Object.entries(selectedMap).map(([name, now]) => ({
        name,
        now,
      }));

-      patchProfile(current!, { selected: profile.selected }).catch(
-        console.error
-      );
+      patchProfile(current!, { selected: profile.selected });
      // update proxies cache
      if (hasChange) mutate("getProxies", getProxies());
    }, 100);
@@ -175,12 +179,12 @@ const ProfilePage = () => {
  });

  return (
-    <BasePage title="Profiles">
+    <BasePage title={t("Profiles")}>
      <Box sx={{ display: "flex", mb: 2.5 }}>
        <TextField
          id="clas_verge_profile_url"
          name="profile_url"
-          label="Profile URL"
+          label={t("Profile URL")}
          size="small"
          fullWidth
          value={url}
@@ -193,10 +197,10 @@ const ProfilePage = () => {
          onClick={onImport}
          sx={{ mr: 1 }}
        >
-          Import
+          {t("Import")}
        </Button>
        <Button variant="contained" onClick={() => setDialogOpen(true)}>
-          New
+          {t("New")}
        </Button>
      </Box>

--- a/src/pages/proxies.tsx
+++ b/src/pages/proxies.tsx
@@ -1,6 +1,7 @@
 import useSWR, { useSWRConfig } from "swr";
 import { useEffect } from "react";
 import { useLockFn } from "ahooks";
+import { useTranslation } from "react-i18next";
 import { Button, ButtonGroup, List, Paper } from "@mui/material";
 import { getClashConfig, updateConfigs } from "../services/api";
 import { patchClashConfig } from "../services/cmds";
@@ -10,6 +11,7 @@ import ProxyGroup from "../components/proxy/proxy-group";
 import ProxyGlobal from "../components/proxy/proxy-global";

 const ProxyPage = () => {
+  const { t } = useTranslation();
  const { mutate } = useSWRConfig();
  const { data: proxiesData } = useSWR("getProxies", getProxies);
  const { data: clashConfig } = useSWR("getClashConfig", getClashConfig);
@@ -45,7 +47,7 @@ const ProxyPage = () => {
  return (
    <BasePage
      contentStyle={pageStyle}
-      title={showGroup ? "Proxy Groups" : "Proxies"}
+      title={showGroup ? t("Proxy Groups") : t("Proxies")}
      header={
        <ButtonGroup size="small">
          {modeList.map((mode) => (
@@ -55,7 +57,7 @@ const ProxyPage = () => {
              onClick={() => onChangeMode(mode)}
              sx={{ textTransform: "capitalize" }}
            >
-              {mode}
+              {t(mode)}
            </Button>
          ))}
        </ButtonGroup>
--- a/src/pages/settings.tsx
+++ b/src/pages/settings.tsx
@@ -1,4 +1,5 @@
 import { Paper } from "@mui/material";
+import { useTranslation } from "react-i18next";
 import Notice from "../components/base/base-notice";
 import BasePage from "../components/base/base-page";
 import SettingVerge from "../components/setting/setting-verge";
@@ -6,12 +7,14 @@ import SettingClash from "../components/setting/setting-clash";
 import SettingSystem from "../components/setting/setting-system";

 const SettingPage = () => {
-  const onError = (error: any) => {
-    error && Notice.error(error.toString());
+  const { t } = useTranslation();
+
+  const onError = (err: any) => {
+    Notice.error(err?.message || err.toString());
  };

  return (
-    <BasePage title="Settings">
+    <BasePage title={t("Settings")}>
      <Paper sx={{ borderRadius: 1, boxShadow: 2, mb: 3 }}>
        <SettingClash onError={onError} />
      </Paper>
--- a/src/services/api.ts
+++ b/src/services/api.ts
@@ -141,3 +141,15 @@ export async function getProviders() {
  const response = await instance.get<any, any>("/providers/proxies");
  return response.providers as any;
 }
+
+// Close specific connection
+export async function deleteConnection(id: string) {
+  const instance = await getAxios();
+  await instance.delete<any, any>(`/connections/${encodeURIComponent(id)}`);
+}
+
+// Close all connections
+export async function closeAllConnections() {
+  const instance = await getAxios();
+  await instance.delete<any, any>(`/connections`);
+}
--- a/src/services/cmds.ts
+++ b/src/services/cmds.ts
@@ -1,5 +1,6 @@
 import { invoke } from "@tauri-apps/api/tauri";
 import { ApiType, CmdType } from "./types";
+import Notice from "../components/base/base-notice";

 export async function getProfiles() {
  return invoke<CmdType.ProfilesConfig>("get_profiles");
@@ -13,14 +14,25 @@ export async function enhanceProfiles() {
  return invoke<void>("enhance_profiles");
 }

-export async function createProfile(item: Partial<CmdType.ProfileItem>) {
-  return invoke<void>("create_profile", { item });
+export async function createProfile(
+  item: Partial<CmdType.ProfileItem>,
+  fileData?: string | null
+) {
+  return invoke<void>("create_profile", { item, fileData });
 }

 export async function viewProfile(index: string) {
  return invoke<void>("view_profile", { index });
 }

+export async function readProfileFile(index: string) {
+  return invoke<string>("read_profile_file", { index });
+}
+
+export async function saveProfileFile(index: string, fileData: string) {
+  return invoke<void>("save_profile_file", { index, fileData });
+}
+
 export async function importProfile(url: string) {
  return invoke<void>("import_profile", {
    url,
@@ -83,9 +95,13 @@ export async function killSidecars() {
 }

 export async function openAppDir() {
-  return invoke<void>("open_app_dir");
+  return invoke<void>("open_app_dir").catch((err) =>
+    Notice.error(err?.message || err.toString(), 1500)
+  );
 }

 export async function openLogsDir() {
-  return invoke<void>("open_logs_dir");
+  return invoke<void>("open_logs_dir").catch((err) =>
+    Notice.error(err?.message || err.toString(), 1500)
+  );
 }
--- a/src/services/enhance.ts
+++ b/src/services/enhance.ts
@@ -1,48 +1,80 @@
 import { emit, listen } from "@tauri-apps/api/event";
 import { CmdType } from "./types";
+import ignoreCase from "../utils/ignore-case";
+
+const DEFAULT_FIELDS = [
+  "rules",
+  "proxies",
+  "proxy-groups",
+  "proxy-providers",
+  "rule-providers",
+] as const;
+
+const USE_FLAG_FIELDS = [
+  "tun",
+  "dns",
+  "hosts",
+  "script",
+  "profile",
+  "payload",
+  "interface-name",
+  "routing-mark",
+] as const;

 /**
 * process the merge mode
 */
-function toMerge(
-  merge: CmdType.ProfileMerge,
-  data: CmdType.ProfileData
-): CmdType.ProfileData {
-  if (!merge) return data;
+function toMerge(merge: CmdType.ProfileMerge, data: CmdType.ProfileData) {
+  if (!merge) return { data, use: [] };

-  const newData = { ...data };
+  const {
+    use,
+    "prepend-rules": preRules,
+    "append-rules": postRules,
+    "prepend-proxies": preProxies,
+    "append-proxies": postProxies,
+    "prepend-proxy-groups": preProxyGroups,
+    "append-proxy-groups": postProxyGroups,
+    ...mergeConfig
+  } = merge;
+
+  [...DEFAULT_FIELDS, ...USE_FLAG_FIELDS].forEach((key) => {
+    // the value should not be null
+    if (mergeConfig[key] != null) {
+      data[key] = mergeConfig[key];
+    }
+  });
+
+  // init
+  if (!data.rules) data.rules = [];
+  if (!data.proxies) data.proxies = [];
+  if (!data["proxy-groups"]) data["proxy-groups"] = [];

  // rules
-  if (Array.isArray(merge["prepend-rules"])) {
-    if (!newData.rules) newData.rules = [];
-    newData.rules.unshift(...merge["prepend-rules"]);
+  if (Array.isArray(preRules)) {
+    data.rules.unshift(...preRules);
  }
-  if (Array.isArray(merge["append-rules"])) {
-    if (!newData.rules) newData.rules = [];
-    newData.rules.push(...merge["append-rules"]);
+  if (Array.isArray(postRules)) {
+    data.rules.push(...postRules);
  }

  // proxies
-  if (Array.isArray(merge["prepend-proxies"])) {
-    if (!newData.proxies) newData.proxies = [];
-    newData.proxies.unshift(...merge["prepend-proxies"]);
+  if (Array.isArray(preProxies)) {
+    data.proxies.unshift(...preProxies);
  }
-  if (Array.isArray(merge["append-proxies"])) {
-    if (!newData.proxies) newData.proxies = [];
-    newData.proxies.push(...merge["append-proxies"]);
+  if (Array.isArray(postProxies)) {
+    data.proxies.push(...postProxies);
  }

  // proxy-groups
-  if (Array.isArray(merge["prepend-proxy-groups"])) {
-    if (!newData["proxy-groups"]) newData["proxy-groups"] = [];
-    newData["proxy-groups"].unshift(...merge["prepend-proxy-groups"]);
+  if (Array.isArray(preProxyGroups)) {
+    data["proxy-groups"].unshift(...preProxyGroups);
  }
-  if (Array.isArray(merge["append-proxy-groups"])) {
-    if (!newData["proxy-groups"]) newData["proxy-groups"] = [];
-    newData["proxy-groups"].push(...merge["append-proxy-groups"]);
+  if (Array.isArray(postProxyGroups)) {
+    data["proxy-groups"].push(...postProxyGroups);
  }

-  return newData;
+  return { data, use: Array.isArray(use) ? use : [] };
 }

 /**
@@ -99,44 +131,75 @@ class Enhance {

    listen("script-handler", async (event) => {
      const payload = event.payload as CmdType.EnhancedPayload;
-      let pdata = payload.current || {};

-      for (const each of payload.chain) {
-        const { uid, type = "" } = each.item;
+      const result = await this.runner(payload).catch((err: any) => ({
+        data: null,
+        status: "error",
+        error: err.message,
+      }));

-        try {
-          // process script
-          if (type === "script") {
-            // support async main function
-            pdata = await toScript(each.script!, { ...pdata });
-          }
-
-          // process merge
-          else if (type === "merge") {
-            pdata = toMerge(each.merge!, { ...pdata });
-          }
-
-          // invalid type
-          else {
-            throw new Error(`invalid enhanced profile type "${type}"`);
-          }
-
-          this.exec(uid, { status: "ok" });
-        } catch (err: any) {
-          this.exec(uid, {
-            status: "error",
-            message: err.message || err.toString(),
-          });
-
-          console.error(err);
-        }
-      }
-
-      const result = { data: pdata, status: "ok" };
      emit(payload.callback, JSON.stringify(result)).catch(console.error);
    });
  }

+  // enhanced mode runner
+  private async runner(payload: CmdType.EnhancedPayload) {
+    const chain = payload.chain || [];
+
+    if (!Array.isArray(chain)) throw new Error("unhandle error");
+
+    let pdata = payload.current || {};
+    let useList = [] as string[];
+
+    for (const each of chain) {
+      const { uid, type = "" } = each.item;
+
+      try {
+        // process script
+        if (type === "script") {
+          // support async main function
+          pdata = await toScript(each.script!, ignoreCase(pdata));
+        }
+
+        // process merge
+        else if (type === "merge") {
+          const temp = toMerge(each.merge!, ignoreCase(pdata));
+          pdata = temp.data;
+          useList = useList.concat(temp.use || []);
+        }
+
+        // invalid type
+        else {
+          throw new Error(`invalid enhanced profile type "${type}"`);
+        }
+
+        this.exec(uid, { status: "ok" });
+      } catch (err: any) {
+        console.error(err);
+
+        this.exec(uid, {
+          status: "error",
+          message: err.message || err.toString(),
+        });
+      }
+    }
+
+    pdata = ignoreCase(pdata);
+
+    // filter the data
+    const filterData: typeof pdata = {};
+    Object.keys(pdata).forEach((key: any) => {
+      if (
+        DEFAULT_FIELDS.includes(key) ||
+        (USE_FLAG_FIELDS.includes(key) && useList.includes(key))
+      ) {
+        filterData[key] = pdata[key];
+      }
+    });
+
+    return { data: filterData, status: "ok" };
+  }
+
  // exec the listener
  private exec(uid: string, status: EStatus) {
    this.resultMap.set(uid, status);
--- a/src/services/i18n.ts
+++ b/src/services/i18n.ts
@@ -0,0 +1,17 @@
+import i18n from "i18next";
+import { initReactI18next } from "react-i18next";
+import en from "../locales/en.json";
+import zh from "../locales/zh.json";
+
+const resources = {
+  en: { translation: en },
+  zh: { translation: zh },
+};
+
+i18n.use(initReactI18next).init({
+  resources,
+  lng: "en",
+  interpolation: {
+    escapeValue: false,
+  },
+});
--- a/src/services/states.ts
+++ b/src/services/states.ts
@@ -10,3 +10,15 @@ export const atomLogData = atom<ApiType.LogItem[]>({
  key: "atomLogData",
  default: [],
 });
+
+// save the state of each profile item loading
+export const atomLoadingCache = atom<Record<string, boolean>>({
+  key: "atomLoadingCache",
+  default: {},
+});
+
+// save update state
+export const atomUpdateState = atom<boolean>({
+  key: "atomUpdateState",
+  default: false,
+});
--- a/src/services/types.ts
+++ b/src/services/types.ts
@@ -120,17 +120,45 @@ export namespace CmdType {
  }

  export interface VergeConfig {
+    language?: string;
    theme_mode?: "light" | "dark";
    theme_blur?: boolean;
    traffic_graph?: boolean;
    enable_tun_mode?: boolean;
    enable_auto_launch?: boolean;
+    enable_silent_start?: boolean;
    enable_system_proxy?: boolean;
    enable_proxy_guard?: boolean;
    system_proxy_bypass?: string;
  }

-  export type ProfileMerge = Record<string, any>;
+  type ClashConfigValue = any;
+
+  export interface ProfileMerge {
+    // clash config fields (default supports)
+    rules?: ClashConfigValue;
+    proxies?: ClashConfigValue;
+    "proxy-groups"?: ClashConfigValue;
+    "proxy-providers"?: ClashConfigValue;
+    "rule-providers"?: ClashConfigValue;
+    // clash config fields (use flag)
+    tun?: ClashConfigValue;
+    dns?: ClashConfigValue;
+    hosts?: ClashConfigValue;
+    script?: ClashConfigValue;
+    profile?: ClashConfigValue;
+    payload?: ClashConfigValue;
+    "interface-name"?: ClashConfigValue;
+    "routing-mark"?: ClashConfigValue;
+    // functional fields
+    use?: string[];
+    "prepend-rules"?: any[];
+    "append-rules"?: any[];
+    "prepend-proxies"?: any[];
+    "append-proxies"?: any[];
+    "prepend-proxy-groups"?: any[];
+    "append-proxy-groups"?: any[];
+  }

  // partial of the clash config
  export type ProfileData = Partial<{
@@ -139,6 +167,8 @@ export namespace CmdType {
    "proxy-groups": any[];
    "proxy-providers": any[];
    "rule-providers": any[];
+
+    [k: string]: any;
  }>;

  export interface ChainItem {
--- a/src/utils/get-system.ts
+++ b/src/utils/get-system.ts
@@ -0,0 +1,13 @@
+// get the system os
+// according to UA
+export default function getSystem() {
+  const ua = navigator.userAgent;
+
+  if (ua.includes("Mac OS X")) return "macos";
+
+  if (/win64|win32/i.test(ua)) return "windows";
+
+  if (/linux/i.test(ua)) return "linux";
+
+  return "unknown";
+}
--- a/src/utils/ignore-case.ts
+++ b/src/utils/ignore-case.ts
@@ -0,0 +1,14 @@
+// Deep copy and change all keys to lowercase
+type TData = Record<string, any>;
+
+export default function ignoreCase(data: TData): TData {
+  if (!data) return data;
+
+  const newData = {} as TData;
+
+  Object.entries(data).forEach(([key, value]) => {
+    newData[key.toLowerCase()] = JSON.parse(JSON.stringify(value));
+  });
+
+  return newData;
+}
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,10 +1,11 @@
 import { defineConfig } from "vite";
 import react from "@vitejs/plugin-react";
+import monaco from "vite-plugin-monaco-editor";

 // https://vitejs.dev/config/
 export default defineConfig({
  root: "src",
-  plugins: [react()],
+  plugins: [react(), monaco()],
  build: {
    outDir: "../dist",
    emptyOutDir: true,
--- a/yarn.lock
+++ b/yarn.lock
@@ -227,7 +227,7 @@
    "@babel/plugin-syntax-jsx" "^7.16.7"
    "@babel/types" "^7.17.0"

-"@babel/runtime@^7.13.10", "@babel/runtime@^7.17.2", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.7.6", "@babel/runtime@^7.8.7":
+"@babel/runtime@^7.13.10", "@babel/runtime@^7.14.5", "@babel/runtime@^7.17.2", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.7.6", "@babel/runtime@^7.8.7":
  version "7.17.2"
  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.17.2.tgz#66f68591605e59da47523c631416b18508779941"
  integrity sha512-hzeyJyMA1YGdJTuWU0e/j4wKXrU4OMFvY2MSlaI9B7VQb0r5cxTE3EAIS2Q7Tn2RIcDkRvTA/v2JsAEhxe99uw==
@@ -1291,6 +1291,18 @@ hoist-non-react-statics@^3.3.1, hoist-non-react-statics@^3.3.2:
  dependencies:
    react-is "^16.7.0"

+html-escaper@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/html-escaper/-/html-escaper-2.0.2.tgz#dfd60027da36a36dfcbe236262c00a5822681453"
+  integrity sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==
+
+html-parse-stringify@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/html-parse-stringify/-/html-parse-stringify-3.0.1.tgz#dfc1017347ce9f77c8141a507f233040c59c55d2"
+  integrity sha512-KknJ50kTInJ7qIScF3jeaFRpMpE8/lfiTdzf/twXyPBLAGrLRTmkz3AdTnKeh40X8k9L2fdYwEp/42WGXIRGcg==
+  dependencies:
+    void-elements "3.1.0"
+
 human-signals@^1.1.1:
  version "1.1.1"
  resolved "https://registry.yarnpkg.com/human-signals/-/human-signals-1.1.1.tgz#c5b1cd14f50aeae09ab6c59fe63ba3395fe4dfa3"
@@ -1301,6 +1313,13 @@ husky@^7.0.0:
  resolved "https://registry.yarnpkg.com/husky/-/husky-7.0.4.tgz#242048245dc49c8fb1bf0cc7cfb98dd722531535"
  integrity sha512-vbaCKN2QLtP/vD4yvs6iz6hBEo6wkSzs8HpRah1Z6aGmF2KW5PdYuAd7uX5a+OyBZHBhd+TFLqgjUgytQr4RvQ==

+i18next@^21.6.14:
+  version "21.6.14"
+  resolved "https://registry.yarnpkg.com/i18next/-/i18next-21.6.14.tgz#2bc199fba7f4da44b5952d7df0a3814a6e5c3943"
+  integrity sha512-XL6WyD+xlwQwbieXRlXhKWoLb/rkch50/rA+vl6untHnJ+aYnkQ0YDZciTWE78PPhOpbi2gR0LTJCJpiAhA+uQ==
+  dependencies:
+    "@babel/runtime" "^7.17.2"
+
 ignore@^5.1.4:
  version "5.2.0"
  resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.2.0.tgz#6d3bac8fa7fe0d45d9f9be7bac2fc279577e345a"
@@ -1457,6 +1476,11 @@ minimist@^1.2.5:
  resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.5.tgz#67d66014b66a6a8aaa0c083c5fd58df4e4e97602"
  integrity sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==

+monaco-editor@^0.33.0:
+  version "0.33.0"
+  resolved "https://registry.yarnpkg.com/monaco-editor/-/monaco-editor-0.33.0.tgz#842e244f3750a2482f8a29c676b5684e75ff34af"
+  integrity sha512-VcRWPSLIUEgQJQIE0pVT8FcGBIgFoxz7jtqctE+IiCxWugD0DwgyQBcZBhdSrdMC84eumoqMZsGl2GTreOzwqw==
+
 mri@^1.1.5:
  version "1.2.0"
  resolved "https://registry.yarnpkg.com/mri/-/mri-1.2.0.tgz#6721480fec2a11a4889861115a48b6cbe7cc8f0b"
@@ -1653,6 +1677,15 @@ react-dom@^17.0.2:
    object-assign "^4.1.1"
    scheduler "^0.20.2"

+react-i18next@^11.15.6:
+  version "11.15.6"
+  resolved "https://registry.yarnpkg.com/react-i18next/-/react-i18next-11.15.6.tgz#693430fbee5ac7d0774bd88683575d62adb24afb"
+  integrity sha512-OUWcFdNgIA9swVx3JGIreuquglAinpRwB/HYrCprTN+s9BQDt9LSiY7x5DGc2JzVpwqtpoTV7oRUTOxEPNyUPw==
+  dependencies:
+    "@babel/runtime" "^7.14.5"
+    html-escaper "^2.0.2"
+    html-parse-stringify "^3.0.1"
+
 react-is@^16.13.1, react-is@^16.7.0:
  version "16.13.1"
  resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
@@ -1803,6 +1836,11 @@ signal-exit@^3.0.2:
  resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.7.tgz#a9a1767f8af84155114eaabd73f99273c8f59ad9"
  integrity sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==

+snarkdown@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/snarkdown/-/snarkdown-2.0.0.tgz#b1feb4db91b9f94a8ebbd7a50f3e99aee18b1e03"
+  integrity sha512-MgL/7k/AZdXCTJiNgrO7chgDqaB9FGM/1Tvlcenenb7div6obaDATzs16JhFyHHBGodHT3B7RzRc5qk8pFhg3A==
+
 "source-map-js@>=0.6.2 <2.0.0", source-map-js@^1.0.2:
  version "1.0.2"
  resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c"
@@ -1889,6 +1927,11 @@ universalify@^2.0.0:
  resolved "https://registry.yarnpkg.com/universalify/-/universalify-2.0.0.tgz#75a4984efedc4b08975c5aeb73f530d02df25717"
  integrity sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==

+vite-plugin-monaco-editor@^1.0.10:
+  version "1.0.10"
+  resolved "https://registry.yarnpkg.com/vite-plugin-monaco-editor/-/vite-plugin-monaco-editor-1.0.10.tgz#cd370f68d4121bced6f902c6284649cc8eca4170"
+  integrity sha512-7yTAFIE0SefjCmfnjrvXOl53wkxeSASc/ZIcB5tZeEK3vAmHhveV8y3f90Vp8b+PYdbUipjqf91mbFbSENkpcw==
+
 vite@^2.8.6:
  version "2.8.6"
  resolved "https://registry.yarnpkg.com/vite/-/vite-2.8.6.tgz#32d50e23c99ca31b26b8ccdc78b1d72d4d7323d3"
@@ -1901,6 +1944,11 @@ vite@^2.8.6:
  optionalDependencies:
    fsevents "~2.3.2"

+void-elements@3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/void-elements/-/void-elements-3.1.0.tgz#614f7fbf8d801f0bb5f0661f5b2f5785750e4f09"
+  integrity sha1-YU9/v42AHwu18GYfWy9XhXUOTwk=
+
 web-streams-polyfill@^3.0.3:
  version "3.2.0"
  resolved "https://registry.yarnpkg.com/web-streams-polyfill/-/web-streams-polyfill-3.2.0.tgz#a6b74026b38e4885869fb5c589e90b95ccfc7965"
Author	SHA1	Message	Date
GyDi	5c3696123a	v0.0.26	2022-03-28 01:30:54 +08:00
GyDi	4140fc86ee	chore: update log	2022-03-28 01:18:18 +08:00
GyDi	2ad771e7fd	fix: close dialog after save	2022-03-28 01:09:34 +08:00
GyDi	5a38468144	refactor: optimize enhance mode strategy	2022-03-28 01:07:14 +08:00
GyDi	0a9c81772f	fix: change to deep copy	2022-03-28 00:56:48 +08:00
GyDi	c9649ac501	feat: enhanced mode supports more fields	2022-03-27 20:36:13 +08:00
GyDi	6ea567742b	chore: profile release	2022-03-27 01:38:40 +08:00
GyDi	f31349eaa0	feat: supports edit profile file	2022-03-27 00:58:17 +08:00
GyDi	9d44668d5f	feat: supports silent start	2022-03-26 18:56:16 +08:00
GyDi	a12f58c1c7	feat: use crate open	2022-03-23 23:00:14 +08:00
GyDi	b5283eaaed	fix: window style close #45	2022-03-23 21:43:13 +08:00
GyDi	4b6189af5f	feat: enhance connections display order	2022-03-23 14:02:08 +08:00
GyDi	5d0ffbe453	chore: adjust style	2022-03-23 13:58:57 +08:00
GyDi	502706931e	fix: manage global proxy correctly	2022-03-23 12:49:34 +08:00
GyDi	57c411288f	fix: tauri csp	2022-03-23 01:47:35 +08:00
GyDi	b09b7b11a1	feat: save global selected	2022-03-22 12:38:59 +08:00
GyDi	1a7b3c7294	v0.0.25	2022-03-22 01:51:06 +08:00
GyDi	4678fc7dde	chore: update log	2022-03-22 01:50:24 +08:00
GyDi	9f492fad49	chore: update clash core	2022-03-22 01:50:15 +08:00
GyDi	bd0a959e18	fix: windows style	2022-03-22 01:36:06 +08:00
GyDi	dd605e2610	fix: update state	2022-03-22 01:27:22 +08:00
inRm3D	9910f6b817	chore: readme (#43 )	2022-03-21 21:55:45 +08:00
GyDi	991897aff4	chore: tauri feature	2022-03-21 11:40:52 +08:00
GyDi	3cde019208	fix: profile item loading state	2022-03-21 11:40:27 +08:00
GyDi	2f6efbed63	chore: tauri allowList	2022-03-20 13:16:50 +08:00
GyDi	5cff4e299b	chore: update clash version	2022-03-20 12:37:55 +08:00
GyDi	bce33639da	v0.0.24	2022-03-20 01:50:39 +08:00
GyDi	366c465cad	chore: update log	2022-03-20 01:50:15 +08:00
GyDi	acc6e05bdc	feat: system tray supports system proxy setting	2022-03-20 01:36:43 +08:00
GyDi	4ce15577cd	feat: prevent context menu on Windows close #22	2022-03-19 19:28:53 +08:00
GyDi	98fa4d5e65	feat: create local profile with selected file	2022-03-19 19:21:55 +08:00
GyDi	7fe94076c7	feat: reduce the impact of the enhanced mode	2022-03-19 16:02:47 +08:00
GyDi	b8b0c8fa63	fix: adjust windows style	2022-03-19 15:35:59 +08:00
GyDi	e585e87bec	feat: parse update log	2022-03-19 15:31:58 +08:00
GyDi	6a4924bb16	chore: update log supports	2022-03-19 14:04:58 +08:00
GyDi	ab0d516d91	chore: updater proxy	2022-03-19 11:14:12 +08:00
GyDi	b756ae39d0	chore: ci support linux	2022-03-19 10:50:44 +08:00
GyDi	c15c38ea8f	chore: readme	2022-03-18 19:02:53 +08:00
GyDi	743963318f	feat: fill i18n	2022-03-18 14:59:23 +08:00
GyDi	ed3fc50858	feat: dayjs i18n	2022-03-18 14:45:24 +08:00
GyDi	5b886fe6be	feat: connections page simply support	2022-03-18 14:43:22 +08:00
GyDi	7074bbc405	feat: add wintun.dll by default	2022-03-18 11:49:00 +08:00
GyDi	ef314c1707	fix: change mixed port error	2022-03-18 11:39:02 +08:00
GyDi	a3e7626dd9	chore: add dev feature	2022-03-18 10:59:35 +08:00
GyDi	5cb5d74eed	chore: rename temp dir	2022-03-18 10:20:24 +08:00
GyDi	6eee10d46d	chore: resolve wintun.dll	2022-03-17 19:29:30 +08:00
GyDi	2d95f2b0d6	fix: auto launch path	2022-03-16 18:44:25 +08:00
GyDi	ec41bb9c70	fix: tun mode config	2022-03-15 14:23:57 +08:00
GyDi	2d1780b1cf	fix: adjsut open cmd error	2022-03-15 12:51:39 +08:00
GyDi	d9ce99887c	chore: fix ci env	2022-03-15 00:00:20 +08:00
GyDi	9b9cc90414	v0.0.23	2022-03-14 01:34:26 +08:00
GyDi	c1eb539a5c	feat: event emit when clash config update	2022-03-13 01:37:41 +08:00
GyDi	e1793f57ef	chore: fix ci	2022-03-13 00:59:42 +08:00
GyDi	dbd09a8743	chore: update tauri action	2022-03-13 00:58:49 +08:00
GyDi	0d189ca617	chore: green version bundle	2022-03-13 00:52:31 +08:00
GyDi	dc9bcc40ee	chore: rm then	2022-03-12 23:58:20 +08:00
GyDi	4991f7ff39	feat: i18n supports	2022-03-12 23:07:45 +08:00
GyDi	a393b8b122	fix: parse external-controller	2022-03-12 21:35:20 +08:00
GyDi	c73b354386	fix: config file case close #18	2022-03-12 21:03:17 +08:00
GyDi	392ecee3ff	chore: merge	2022-03-12 18:45:07 +08:00
ttyS3	bae721c49e	chore: show open app and log dir failed message	2022-03-12 18:04:56 +08:00
GyDi	4e806e21a6	chore: adjust error log	2022-03-12 15:57:16 +08:00
GyDi	ec0fdf83b2	feat: change open command on linux refactor(logging): refine open dir failed log message, add Linux support	2022-03-12 15:40:23 +08:00
ttyS3	cb94d8414f	feat: add Linux open dir support refactor(logging): refine open dir failed log message	2022-03-12 03:18:25 +08:00
GyDi	8890051c17	fix: patch item option	2022-03-11 19:56:56 +08:00
GyDi	cf00c9476f	fix: user agent not works	2022-03-11 19:50:51 +08:00