feat: Add upgrade ui config button

Elziy · Jun 4, 2024 · 7204768 · 7204768
1 parent 5ff62fb
commit 7204768
Show file tree

Hide file tree

Showing 7 changed files with 69 additions and 2 deletions.
diff --git a/src/api/configs.ts b/src/api/configs.ts
@@ -52,6 +52,11 @@ export async function restartCore(apiConfig: ClashAPIConfig) {
   return await fetch(url + restartCoreEndpoint, { ...init, body, method: 'POST' });
 }
 
+export async function upgradeUI(apiConfig: ClashAPIConfig) {
+  const { url, init } = getURLAndInit(apiConfig);
+  return await fetch(url + upgradeCoreEndpoint, { ...init, method: 'POST' });
+}
+
 export async function upgradeCore(apiConfig: ClashAPIConfig) {
   const { url, init } = getURLAndInit(apiConfig);
   const body = '{"path": "", "payload": ""}';

diff --git a/src/components/configs/Config.tsx b/src/components/configs/Config.tsx
@@ -18,7 +18,7 @@ import {
   restartCore,
   updateConfigs,
   updateGeoDatabasesFile,
-  upgradeCore
+  upgradeCore, upgradeUI
 } from '~/store/configs';
 import { openModal } from '~/store/modals';
 import Button from '../shared/Button';
@@ -244,6 +244,10 @@ function ConfigImpl({
     dispatch(upgradeCore(apiConfig));
   }, [apiConfig, dispatch]);
 
+  const handleUpgradeUI = useCallback(() => {
+    dispatch(upgradeUI(apiConfig));
+  }, [apiConfig, dispatch]);
+
   const handleUpdateGeoDatabasesFile = useCallback(() => {
     dispatch(updateGeoDatabasesFile(apiConfig));
   }, [apiConfig, dispatch]);
@@ -273,6 +277,7 @@ function ConfigImpl({
   const [userIpFilterModel, setUserIpFilterModel] = useState(false);
   const [restartCoreModel, setRestartCoreModel] = useState(false);
   const [upgradeCoreModel, setUpgradeCoreModel] = useState(false);
+  const [updateUIModel, setUpdateUIModel] = useState(false);
 
 
   return (
@@ -521,6 +526,27 @@ function ConfigImpl({
                 />
               </div>
             )}
+            {version.meta && !version.premium && (
+              <div>
+                <div className={s0.label}> 升级UI</div>
+                <Button
+                  start={<RotateCw size={16} />}
+                  label={t('upgrade_ui')}
+                  onClick={() => {
+                    setUpdateUIModel(true);
+                  }}
+                />
+                <ModalCloseAllConnections
+                  confirm={'upgrade_ui'}
+                  isOpen={updateUIModel}
+                  primaryButtonOnTap={() => {
+                    handleUpgradeUI();
+                    setUpdateUIModel(false);
+                  }}
+                  onRequestClose={() => setUpdateUIModel(false)}
+                />
+              </div>
+            )}
           </div>
           <div className={s0.sep}>
             <div />

diff --git a/src/i18n/en.ts b/src/i18n/en.ts
@@ -62,6 +62,7 @@ export const data = {
   edit_proxy_provider: 'Edit Proxy Provider',
   restart_core: 'Restart clash core',
   upgrade_core: 'Upgrade Alpha core',
+  upgrade_ui: 'Upgrade UI',
   update_geo_databases_file: 'Update GEO Databases ',
   flush_fake_ip_pool: 'Flush fake-ip data',
   flush_traffic_statistic: 'Flush traffic statistic',

diff --git a/src/i18n/vi.ts b/src/i18n/vi.ts
@@ -62,6 +62,7 @@ export const data = {
   edit_proxy_provider: 'Chỉnh sửa nhà cung cấp proxy',
   restart_core: 'Khởi động lõi lại Clash',
   upgrade_core: 'Nâng cấp lõi Clash',
+  upgrade_ui: 'Nâng cấp giao diện',
   update_geo_databases_file: 'Cập nhật tệp cơ sở dữ liệu GEO',
   flush_fake_ip_pool: 'Xóa bộ nhớ đệm fake-ip',
   flush_traffic_statistic: 'Xóa thống kê lưu lượng',

diff --git a/src/i18n/zh-cn.ts b/src/i18n/zh-cn.ts
@@ -88,6 +88,7 @@ export const data = {
   c_ctrl: '关闭',
   restart_core: '重启 clash 核心',
   upgrade_core: '更新 Alpha 核心',
+  upgrade_ui: '更新面板界面',
   close_all_confirm: '确定关闭所有连接？',
   close_all_confirm_yes: '确定',
   close_all_confirm_no: '取消',

diff --git a/src/i18n/zh-tw.ts b/src/i18n/zh-tw.ts
@@ -85,6 +85,7 @@ export const data = {
   c_ctrl: '關閉',
   restart_core: '重新啟動 clash 核心',
   upgrade_core: '更新 Alpha 核心',
+  upgrade_ui: '更新面板介面',
   close_all_confirm: '確定關閉所有連接？',
   close_all_confirm_yes: '確定',
   close_all_confirm_no: '取消',

diff --git a/src/store/configs.ts b/src/store/configs.ts
@@ -4,7 +4,7 @@ import { ClashAPIConfig } from '~/types';
 import * as configsAPI from '../api/configs';
 import * as trafficAPI from '../api/traffic';
 import { openModal } from './modals';
-import { notifySuccess } from '~/misc/message';
+import { notifyError, notifySuccess } from '~/misc/message';
 import { resetUnReloadConfig } from '~/store/app';
 
 export const getConfigs = (s: State) => s.configs.configs;
@@ -165,6 +165,38 @@ export function upgradeCore(apiConfig: ClashAPIConfig) {
   };
 }
 
+export function upgradeUI(apiConfig: ClashAPIConfig) {
+  return async (dispatch: DispatchFn) => {
+    configsAPI
+      .upgradeUI(apiConfig)
+      .then(
+        async (res) => {
+          if (res.ok === false) {
+            // eslint-disable-next-line no-console
+            console.log('Error upgrade UI', res.statusText);
+            if (res.status === 500) {
+              const json = await res.json();
+              if ("update error: already using latest version" === json.message) {
+                notifyError('面板界面已经是最新版本');
+              }
+            }
+          } else {
+            notifySuccess('面板界面已升级');
+          }
+        },
+        (err) => {
+          // eslint-disable-next-line no-console
+          console.log('Error upgrade UI', err);
+          notifyError('面板界面升级失败');
+          throw err;
+        }
+      )
+      .then(() => {
+        dispatch(fetchConfigs(apiConfig));
+      });
+  };
+}
+
 export function updateGeoDatabasesFile(apiConfig: ClashAPIConfig) {
   return async (dispatch: DispatchFn) => {
     configsAPI