feat: add reload config-file & flush fake-ip pool to config page

5 files changed, 111 insertions, 4 deletions

diff --git a/src/api/configs.ts b/src/api/configs.ts
index 69b02d4..e084261 100644
--- a/src/api/configs.ts
+++ b/src/api/configs.ts
@@ -3,6 +3,7 @@ import { ClashGeneralConfig } from 'src/store/types';
 import { ClashAPIConfig } from 'src/types';
 
 const endpoint = '/configs';
+const flushFakeIPPoolEndpoint = '/cache/fakeip/flush';
 
 export async function fetchConfigs(apiConfig: ClashAPIConfig) {
   const { url, init } = getURLAndInit(apiConfig);
@@ -30,3 +31,18 @@ export async function updateConfigs(
   const body = JSON.stringify(configsPatchWorkaround(o));
   return await fetch(url + endpoint, { ...init, body, method: 'PATCH' });
 }
+
+export async function reloadConfigs(
+    apiConfig: ClashAPIConfig
+) {
+  const { url, init } = getURLAndInit(apiConfig);
+  const body = '{"path": "", "payload": ""}';
+  return await fetch(url + endpoint + '?force=true', { ...init, body, method: 'PUT' });
+}
+
+export async function flushFakeIPPool(
+    apiConfig: ClashAPIConfig
+) {
+  const { url, init } = getURLAndInit(apiConfig);
+  return await fetch(url + flushFakeIPPoolEndpoint, { ...init, method: 'POST' });
+}
diff --git a/src/components/Config.tsx b/src/components/Config.tsx
index 34bb20a..5035a86 100644
--- a/src/components/Config.tsx
+++ b/src/components/Config.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { LogOut } from 'react-feather';
+import { LogOut, RotateCw, Trash2 } from 'react-feather';
 import { useTranslation } from 'react-i18next';
 import * as logsApi from 'src/api/logs';
 import Select from 'src/components/shared/Select';
@@ -11,7 +11,7 @@ import {
   getLatencyTestUrl,
   getSelectedChartStyleIndex,
 } from '../store/app';
-import { fetchConfigs, getConfigs, updateConfigs } from '../store/configs';
+import { fetchConfigs, getConfigs, updateConfigs, reloadConfigs, flushFakeIPPool } from '../store/configs';
 import { openModal } from '../store/modals';
 import Button from './Button';
 import s0 from './Config.module.scss';
@@ -29,8 +29,8 @@ const propsList = [{ id: 0 }, { id: 1 }, { id: 2 }, { id: 3 }];
 
 const logLeveOptions = [
   ['debug', 'Debug'],
-  ['warning', 'Warning'],
   ['info', 'Info'],
+  ['warning', 'Warning'],
   ['error', 'Error'],
   ['silent', 'Silent'],
 ];
@@ -40,6 +40,8 @@ const portFields = [
   { key: 'socks-port', label: 'SOCKS5 Proxy Port' },
   { key: 'mixed-port', label: 'Mixed Port' },
   { key: 'redir-port', label: 'Redir Port' },
+  { key: 'tproxy-port', label: 'tProxy Port' },
+  { key: 'mitm-port', label: 'MITM Port' },
 ];
 
 const langOptions = [
@@ -50,6 +52,7 @@ const langOptions = [
 const modeOptions = [
   ['Global', 'Global'],
   ['Rule', 'Rule'],
+  ['Script', 'Script'],
   ['Direct', 'Direct'],
 ];
 
@@ -130,6 +133,8 @@ function ConfigImpl({
             logsApi.reconnect({ ...apiConfig, logLevel: value });
           }
           break;
+        case 'mitm-port':
+        case 'tproxy-port':
         case 'redir-port':
         case 'socks-port':
         case 'mixed-port':
@@ -162,7 +167,9 @@ function ConfigImpl({
         case 'port':
         case 'socks-port':
         case 'mixed-port':
-        case 'redir-port': {
+        case 'redir-port':
+        case 'tproxy-port':
+        case 'mitm-port': {
           const num = parseInt(value, 10);
           if (num < 0 || num > 65535) return;
           dispatch(updateConfigs(apiConfig, { [name]: num }));
@@ -179,6 +186,14 @@ function ConfigImpl({
     [apiConfig, dispatch, updateAppConfig]
   );
 
+  const handleReloadConfigs = useCallback(() => {
+    dispatch(reloadConfigs(apiConfig));
+  },[apiConfig, dispatch]);
+
+  const handleFlushFakeIPPool = useCallback(() => {
+    dispatch(flushFakeIPPool(apiConfig));
+  },[apiConfig, dispatch]);
+
   const mode = useMemo(() => {
     const m = configState.mode;
     return typeof m === 'string' && m[0].toUpperCase() + m.slice(1);
@@ -283,6 +298,32 @@ function ConfigImpl({
           />
         </div>
       </div>
+
+      <div className={s0.sep}>
+        <div />
+      </div>
+
+      <div className={s0.section}>
+        <div>
+          <div className={s0.label}>Reload</div>
+          <Button
+              start={<RotateCw size={16} />}
+              label={t('reload_config_file')}
+              onClick={handleReloadConfigs}
+          />
+        </div>
+      </div>
+
+      <div className={s0.section}>
+        <div>
+          <div className={s0.label}>FakeIP</div>
+          <Button
+              start={<Trash2 size={16} />}
+              label={t('flush_fake_ip_pool')}
+              onClick={handleFlushFakeIPPool}
+          />
+        </div>
+      </div>
     </div>
   );
 }
diff --git a/src/i18n/en.ts b/src/i18n/en.ts
index fcdf253..f20e4b8 100644
--- a/src/i18n/en.ts
+++ b/src/i18n/en.ts
@@ -36,4 +36,6 @@ export const data = {
   lang: 'Language',
   update_all_rule_provider: 'Update all rule providers',
   update_all_proxy_provider: 'Update all proxy providers',
+  reload_config_file: 'Reload config file',
+  flush_fake_ip_pool: 'Flush fake-ip data',
 };
diff --git a/src/i18n/zh.ts b/src/i18n/zh.ts
index e92f9ff..dead6c4 100644
--- a/src/i18n/zh.ts
+++ b/src/i18n/zh.ts
@@ -36,4 +36,6 @@ export const data = {
   lang: '语言',
   update_all_rule_provider: '更新所有 rule provider',
   update_all_proxy_provider: '更新所有 proxy providers',
+  reload_config_file: '重载配置文件',
+  flush_fake_ip_pool: '清除FakeIP数据库',
 };
diff --git a/src/store/configs.ts b/src/store/configs.ts
index c533508..b0ae2a7 100644
--- a/src/store/configs.ts
+++ b/src/store/configs.ts
@@ -89,6 +89,52 @@ export function updateConfigs(
   };
 }
 
+export function reloadConfigs(apiConfig: ClashAPIConfig) {
+  return async (dispatch: DispatchFn) => {
+    configsAPI
+        .reloadConfigs(apiConfig)
+        .then(
+            (res) => {
+              if (res.ok === false) {
+                // eslint-disable-next-line no-console
+                console.log('Error update configs', res.statusText);
+              }
+            },
+            (err) => {
+              // eslint-disable-next-line no-console
+              console.log('Error update configs', err);
+              throw err;
+            }
+        )
+        .then(() => {
+          dispatch(fetchConfigs(apiConfig));
+        });
+  };
+}
+
+export function flushFakeIPPool(apiConfig: ClashAPIConfig) {
+  return async (dispatch: DispatchFn) => {
+    configsAPI
+        .flushFakeIPPool(apiConfig)
+        .then(
+            (res) => {
+              if (res.ok === false) {
+                // eslint-disable-next-line no-console
+                console.log('Error update configs', res.statusText);
+              }
+            },
+            (err) => {
+              // eslint-disable-next-line no-console
+              console.log('Error update configs', err);
+              throw err;
+            }
+        )
+        .then(() => {
+          dispatch(fetchConfigs(apiConfig));
+        });
+  };
+}
+
 export const initialState: StateConfigs = {
   configs: {
     port: 7890,