chore: UI adjustment, add translation, fix CI

.github/workflows/dev.yaml

@@ -45,7 +45,7 @@ jobs:
         if: startsWith(matrix.os, 'ubuntu-')
         uses: mknejp/delete-release-assets@v1
         with:
-          token: ${{ secrets.GH_TOKEN }}
+          token: ${{ secrets.GITHUB_TOKEN }}
           tag: dev
           fail-if-no-assets: false
           fail-if-no-release: false
@@ -74,7 +74,7 @@ jobs:
       - name: Tauri build
         uses: tauri-apps/tauri-action@v0
         env:
-          GITHUB_TOKEN: ${{ secrets.GH_TOKEN }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           TAURI_PRIVATE_KEY: ${{ secrets.TAURI_PRIVATE_KEY }}
           TAURI_KEY_PASSWORD: ${{ secrets.TAURI_KEY_PASSWORD }}
         with:
@@ -92,7 +92,7 @@ jobs:
           pnpm portable
         env:
           TAG_NAME: dev
-          GITHUB_TOKEN: ${{ secrets.GH_TOKEN }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           TAURI_PRIVATE_KEY: ${{ secrets.TAURI_PRIVATE_KEY }}
           TAURI_KEY_PASSWORD: ${{ secrets.TAURI_KEY_PASSWORD }}
           VITE_WIN_PORTABLE: 1

.github/workflows/release.yml

@@ -67,7 +67,7 @@ jobs:
         # continue-on-error: true
         if: matrix.portable == false
         env:
-          GITHUB_TOKEN: ${{ secrets.GH_TOKEN }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           TAURI_PRIVATE_KEY: ${{ secrets.TAURI_PRIVATE_KEY }}
           TAURI_KEY_PASSWORD: ${{ secrets.TAURI_KEY_PASSWORD }}
         with:
@@ -84,7 +84,7 @@ jobs:
         run: |
           pnpm portable
         env:
-          GITHUB_TOKEN: ${{ secrets.GH_TOKEN }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           TAURI_PRIVATE_KEY: ${{ secrets.TAURI_PRIVATE_KEY }}
           TAURI_KEY_PASSWORD: ${{ secrets.TAURI_KEY_PASSWORD }}
           VITE_WIN_PORTABLE: 1
@@ -116,4 +116,4 @@ jobs:
       - name: Release updater file
         run: pnpm updater
         env:
-          GITHUB_TOKEN: ${{ secrets.GH_TOKEN }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/updater.yaml

@@ -28,4 +28,4 @@ jobs:
       - name: Release updater file
         run: pnpm updater
         env:
-          GITHUB_TOKEN: ${{ secrets.GH_TOKEN }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

scripts/updater.mjs

@@ -41,6 +41,7 @@ async function resolveUpdater() {
       win64: { signature: "", url: "" }, // compatible with older formats
       linux: { signature: "", url: "" }, // compatible with older formats
       darwin: { signature: "", url: "" }, // compatible with older formats
+      "darwin-aarch64": { signature: "", url: "" },
       "darwin-intel": { signature: "", url: "" },
       "darwin-x86_64": { signature: "", url: "" },
       "linux-x86_64": { signature: "", url: "" },
@@ -77,6 +78,16 @@ async function resolveUpdater() {
       updateData.platforms["darwin-x86_64"].signature = sig;
     }
 
+    // darwin url (aarch)
+    if (name.endsWith("aarch64.app.tar.gz")) {
+      updateData.platforms["darwin-aarch64"].url = browser_download_url;
+    }
+    // darwin signature (aarch)
+    if (name.endsWith("aarch64.app.tar.gz.sig")) {
+      const sig = await getSignature(browser_download_url);
+      updateData.platforms["darwin-aarch64"].signature = sig;
+    }
+
     // linux url
     if (name.endsWith(".AppImage.tar.gz")) {
       updateData.platforms.linux.url = browser_download_url;

src-tauri/src/config/clash.rs

@@ -46,7 +46,7 @@ impl IClashTemp {
         map.insert("unified-delay".into(), true.into());
         #[cfg(feature = "default-meta")]
         map.insert("tcp-concurrent".into(), true.into());
-        map.insert("ipv6".into(), false.into());
+        // map.insert("ipv6".into(), false.into());
 
         Self(map)
     }

src/assets/styles/layout.scss

@@ -10,7 +10,7 @@
     height: 100%;
     max-width: 225px;
     min-width: 125px;
-    padding: 36px 0 28px;
+    padding: 16px 0 8px;
     position: relative;
     flex-direction: column;
     box-sizing: border-box;
@@ -90,8 +90,8 @@
       position: absolute;
       top: 0;
       left: 0;
-      right: 28px;
-      bottom: 28px;
+      right: 2px;
+      bottom: 10px;
     }
   }
 }

src/assets/styles/page.scss

@@ -6,7 +6,7 @@
 
   > header {
     flex: 0 0 58px;
-    width: 100%;
+    width: 95%;
     // max-width: 850px;
     margin: 0 auto;
     padding-right: 4px;
@@ -16,38 +16,32 @@
     justify-content: space-between;
   }
 
-  .base-container {
+  > section {
+    position: relative;
+    flex: 1 1 100%;
+    width: 100%;
     height: 100%;
-    overflow: hidden;
-    border-radius: var(--border-radius);
-
-    > section {
-      position: relative;
-      flex: 1 1 100%;
-      width: 100%;
-      height: 100%;
-      overflow: auto;
-      padding: 28px 0;
-      box-sizing: border-box;
-      scrollbar-gutter: stable;
-      background-color: var(--background-color);
+    overflow: auto;
+    padding: 8px 0;
+    box-sizing: border-box;
+    scrollbar-gutter: stable;
+    // background-color: var(--background-color);
 
-      .base-content {
-        width: 90%;
-        // max-width: 850px;
-        margin: 0 auto;
-        animation: baseContentIn 0.3s normal 1 forwards;
+    .base-content {
+      width: 95%;
+      // max-width: 850px;
+      margin: 0 auto;
+      animation: baseContentIn 0.3s normal 1 forwards;
 
-        @keyframes baseContentIn {
-          0% {
-            opacity: 0;
-            transform: translateY(50%) scale(0.9);
-          }
+      @keyframes baseContentIn {
+        0% {
+          opacity: 0;
+          transform: translateY(50%) scale(0.9);
+        }
 
-          100% {
-            opacity: 1;
-            transform: translateY(0) scale(1);
-          }
+        100% {
+          opacity: 1;
+          transform: translateY(0) scale(1);
         }
       }
     }

src/components/base/base-page.tsx

@@ -23,13 +23,11 @@ export const BasePage: React.FC<Props> = (props) => {
           {header}
         </header>
 
-        <div className="base-container">
-          <section>
-            <div className="base-content" style={contentStyle} data-windrag>
-              {children}
-            </div>
-          </section>
-        </div>
+        <section>
+          <div className="base-content" style={contentStyle} data-windrag>
+            {children}
+          </div>
+        </section>
       </div>
     </BaseErrorBoundary>
   );

src/components/layout/layout-item.tsx

@@ -15,7 +15,7 @@ export const LayoutItem = (props: LinkProps) => {
         selected={!!match}
         sx={[
           {
-            borderRadius: 8,
+            borderRadius: 2,
             textAlign: "center",
             "& .MuiListItemText-primary": { color: "text.secondary" },
           },

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

@@ -142,19 +142,19 @@ export const SysproxyViewer = forwardRef<DialogRef>((props, ref) => {
         </Typography>
 
         <FlexBox>
-          <Typography className="label">Enable:</Typography>
+          <Typography className="label">{t("Enable status")}</Typography>
           <Typography className="value">
             {(!!sysproxy?.enable).toString()}
           </Typography>
         </FlexBox>
 
         <FlexBox>
-          <Typography className="label">Server:</Typography>
+          <Typography className="label">{t("Server Addr")}</Typography>
           <Typography className="value">{sysproxy?.server || "-"}</Typography>
         </FlexBox>
 
         <FlexBox>
-          <Typography className="label">Bypass:</Typography>
+          <Typography className="label">{t("Bypass")}</Typography>
           <Typography className="value">{sysproxy?.bypass || "-"}</Typography>
         </FlexBox>
       </Box>

src/locales/en.json

@@ -7,9 +7,6 @@
   "Label-Settings": "Settings",
 
   "Connections": "Connections",
-  "Upload Total": "Upload Total",
-  "Download Total": "Download Total",
-  "Active Connections": "Active Connections",
   "Logs": "Logs",
   "Clear": "Clear",
   "Proxies": "Proxies",
@@ -52,6 +49,7 @@
   "Filter": "Filter",
   "Filter conditions": "Filter conditions",
   "Refresh profiles": "Refresh profiles",
+  "Rules": "Rules",
 
   "Type": "Type",
   "Name": "Name",
@@ -80,6 +78,9 @@
   "Proxy Guard": "Proxy Guard",
   "Guard Duration": "Guard Duration",
   "Proxy Bypass": "Proxy Bypass",
+  "Enable status": "Enable status",
+  "Server Addr": "Server Addr",
+  "Bypass": "Bypass",
   "Current System Proxy": "Current System Proxy",
   "Theme Mode": "Theme Mode",
   "Theme Blur": "Theme Blur",

src/locales/zh.json

@@ -7,9 +7,6 @@
   "Label-Settings": "设 置",
 
   "Connections": "连接",
-  "Upload Total": "上传总量",
-  "Download Total": "下载总量",
-  "Active Connections": "活动连接",
   "Logs": "日志",
   "Clear": "清除",
   "Proxies": "代理",
@@ -52,6 +49,7 @@
   "Filter": "过滤节点",
   "Filter conditions": "过滤条件",
   "Refresh profiles": "刷新订阅",
+  "Rules": "规则",
 
   "Type": "类型",
   "Name": "名称",
@@ -79,8 +77,11 @@
   "System Proxy Setting": "系统代理设置",
   "Proxy Guard": "系统代理守卫",
   "Guard Duration": "代理守卫间隔",
-  "Proxy Bypass": "Proxy Bypass",
+  "Proxy Bypass": "代理绕过",
   "Current System Proxy": "当前系统代理",
+  "Enable status": "开启状态：",
+  "Server Addr": "服务地址：",
+  "Bypass": "当前绕过：",
   "Theme Mode": "主题模式",
   "Theme Blur": "背景模糊",
   "Theme Setting": "主题设置",

src/pages/connections.tsx

@@ -3,24 +3,16 @@ import { useLockFn } from "ahooks";
 import {
   Box,
   Button,
-  Grid,
   IconButton,
   MenuItem,
   Paper,
   Select,
   TextField,
-  Typography,
 } from "@mui/material";
 import { useRecoilState } from "recoil";
 import { Virtuoso } from "react-virtuoso";
 import { useTranslation } from "react-i18next";
-import {
-  ArrowDownward,
-  ArrowUpward,
-  Link,
-  TableChartRounded,
-  TableRowsRounded,
-} from "@mui/icons-material";
+import { TableChartRounded, TableRowsRounded } from "@mui/icons-material";
 import { closeAllConnections } from "@/services/api";
 import { atomConnectionSetting } from "@/services/states";
 import { useClashInfo } from "@/hooks/use-clash";
@@ -32,7 +24,6 @@ import {
   ConnectionDetail,
   ConnectionDetailRef,
 } from "@/components/connection/connection-detail";
-import parseTraffic from "@/utils/parse-traffic";
 
 const initConn = { uploadTotal: 0, downloadTotal: 0, connections: [] };
 
@@ -57,10 +48,6 @@ const ConnectionsPage = () => {
       list.sort((a, b) => b.curDownload! - a.curDownload!),
   };
 
-  const uploadTotal = connData.uploadTotal;
-
-  const downloadTotal = connData.downloadTotal;
-
   const filterConn = useMemo(() => {
     const orderFunc = orderOpts[curOrderOpt];
     const connections = connData.connections.filter((conn) =>
@@ -125,24 +112,6 @@ const ConnectionsPage = () => {
 
   const detailRef = useRef<ConnectionDetailRef>(null!);
 
-  const connectionItems = [
-    {
-      icon: <ArrowUpward />,
-      label: t("Upload Total"),
-      value: parseTraffic(uploadTotal).join(" "),
-    },
-    {
-      icon: <ArrowDownward />,
-      label: t("Download Total"),
-      value: parseTraffic(downloadTotal).join(" "),
-    },
-    {
-      icon: <Link />,
-      label: t("Active Connections"),
-      value: filterConn.length,
-    },
-  ];
-
   return (
     <BasePage
       title={t("Connections")}
@@ -173,21 +142,7 @@ const ConnectionsPage = () => {
         </Box>
       }
     >
-      <Paper sx={{ padding: 2, mb: 2 }}>
-        <Grid container>
-          {connectionItems.map((item, index) => (
-            <Grid item xs={4} key={index}>
-              <Box display="flex" alignItems="center" whiteSpace="nowrap">
-                {item.icon}
-                <Typography sx={{ ml: 1, mr: 1 }}>{item.label}</Typography>
-                <Typography>{item.value}</Typography>
-              </Box>
-            </Grid>
-          ))}
-        </Grid>
-      </Paper>
-
-      <Paper sx={{ boxShadow: 2, height: "calc(100% - 56px - 16px)" }}>
+      <Paper sx={{ boxShadow: 0, height: "100%" }}>
         <Box
           sx={{
             pt: 1,

src/pages/logs.tsx

@@ -67,7 +67,7 @@ const LogPage = () => {
       <Paper
         sx={{
           boxSizing: "border-box",
-          boxShadow: 2,
+          boxShadow: 0,
           height: "100%",
           userSelect: "text",
         }}

src/pages/proxies.tsx

@@ -75,7 +75,7 @@ const ProxyPage = () => {
       <Paper
         sx={{
           borderRadius: 1,
-          boxShadow: 2,
+          boxShadow: 0,
           height: "100%",
           boxSizing: "border-box",
           py: 1,

src/pages/rules.tsx

@@ -19,7 +19,7 @@ const RulesPage = () => {
 
   return (
     <BasePage title={t("Rules")} contentStyle={{ height: "100%" }}>
-      <Paper sx={{ boxSizing: "border-box", boxShadow: 2, height: "100%" }}>
+      <Paper sx={{ boxSizing: "border-box", boxShadow: 0, height: "100%" }}>
         <Box
           sx={{
             pt: 1,

src/pages/settings.tsx

@@ -35,17 +35,13 @@ const SettingPage = () => {
     >
       <Grid container spacing={{ xs: 2, lg: 3 }}>
         <Grid item xs={12} md={6}>
-          <Paper sx={{ borderRadius: 1, boxShadow: 2 }}>
-            <SettingClash onError={onError} />
+          <Paper sx={{ borderRadius: 1, boxShadow: 2, marginBottom: 2 }}>
+            <SettingSystem onError={onError} />
           </Paper>
-        </Grid>
-
-        <Grid item xs={12} md={6}>
           <Paper sx={{ borderRadius: 1, boxShadow: 2 }}>
-            <SettingSystem onError={onError} />
+            <SettingClash onError={onError} />
           </Paper>
         </Grid>
-
         <Grid item xs={12} md={6}>
           <Paper sx={{ borderRadius: 1, boxShadow: 2 }}>
             <SettingVerge onError={onError} />