From 0caeedd0f5470b0d713c8b9c8a657260b6d579eb Mon Sep 17 00:00:00 2001
From: Elziy <elziy6@163.com>
Date: Mon, 26 Aug 2024 15:46:36 +0800
Subject: [PATCH] sing box fit: rule provider

---
 .../rules/RuleProviderItem.module.scss        |   1 +
 src/components/rules/RuleProviderItem.tsx     | 141 +++++++++++-------
 src/components/rules/Rules.tsx                |   2 +-
 3 files changed, 85 insertions(+), 59 deletions(-)

diff --git a/src/components/rules/RuleProviderItem.module.scss b/src/components/rules/RuleProviderItem.module.scss
index ad0da568e..a6e6579c3 100644
--- a/src/components/rules/RuleProviderItem.module.scss
+++ b/src/components/rules/RuleProviderItem.module.scss
@@ -4,6 +4,7 @@
   display: grid;
   grid-template-columns: 40px 1fr 95px;
   height: 100%;
+  font-weight: bold;
 }
 
 .left {
diff --git a/src/components/rules/RuleProviderItem.tsx b/src/components/rules/RuleProviderItem.tsx
index 61f004c9a..d6c928fdf 100644
--- a/src/components/rules/RuleProviderItem.tsx
+++ b/src/components/rules/RuleProviderItem.tsx
@@ -15,18 +15,18 @@ import ShowCodeModal from '~/components/rules/ShowCodeModal';
 import { notifyError, notifySuccess } from '~/misc/message';
 import { useStoreActions } from '~/components/StateProvider';
 
-export function RuleProviderItem(
-  {
-    idx,
-    name,
-    vehicleType,
-    behavior,
-    updatedAt,
-    ruleCount,
-    apiConfig,
-    utilsApiUrl,
-    unReloadConfig
-  }) {
+export function RuleProviderItem({
+  idx,
+  name,
+  vehicleType,
+  behavior,
+  updatedAt,
+  ruleCount,
+  apiConfig,
+  utilsApiUrl,
+  unReloadConfig,
+  sing_box,
+}) {
   const [onClickRefreshButton, isRefreshing] = useUpdateRuleProviderItem(name, apiConfig);
   const [data, setData] = useState(null);
   const [isModalOpen, setIsModalOpen] = useState(false);
@@ -39,77 +39,102 @@ export function RuleProviderItem(
     fetch(utilsApiUrl + '/delete_rule_set', {
       method: 'DELETE',
       headers: {
-        'Content-Type': 'application/json'
+        'Content-Type': 'application/json',
       },
-      body: JSON.stringify({ name })
-    }).then(async (res) => {
-      const response = await res.json();
-      if (response.code === 200) {
-        notifySuccess(response.message);
-        unReloadConfig?.push('删除规则资源 : ' + name);
-        updateAppConfig('unReloadConfig', unReloadConfig);
-        setDeleteModal(false);
-      } else {
-        notifyError(response.message);
-      }
-    }).catch(() => {
-      notifyError('网络错误');
-    });
+      body: JSON.stringify({ name }),
+    })
+      .then(async (res) => {
+        const response = await res.json();
+        if (response.code === 200) {
+          notifySuccess(response.message);
+          unReloadConfig?.push('删除规则资源 : ' + name);
+          updateAppConfig('unReloadConfig', unReloadConfig);
+          setDeleteModal(false);
+        } else {
+          notifyError(response.message);
+        }
+      })
+      .catch(() => {
+        notifyError('网络错误');
+      });
   };
 
   function get_rule_set() {
+    if (sing_box) {
+      return;
+    }
     setIsModalOpen(true);
     fetch(utilsApiUrl + '/get_rule_set?name=' + name, {
       method: 'GET',
       headers: {
-        'Content-Type': 'application/json'
-      }
-    }).then(async (res) => {
-      const response = await res.json();
-      if (response.code === 200) {
-        setData(response.data);
-      } else {
+        'Content-Type': 'application/json',
+      },
+    })
+      .then(async (res) => {
+        const response = await res.json();
+        if (response.code === 200) {
+          setData(response.data);
+        } else {
+          setIsModalOpen(false);
+          notifyError(response.message);
+        }
+      })
+      .catch(() => {
         setIsModalOpen(false);
-        notifyError(response.message);
-      }
-    }).catch(() => {
-      setIsModalOpen(false);
-      notifyError('网络错误');
-    });
+        notifyError('网络错误');
+      });
   }
 
   return (
     <div className={s.RuleProviderItem}>
       <span className={s.left}>{idx}</span>
       <div className={s.middle}>
-        <SectionNameType name={name} type={`${vehicleType} / ${behavior}`} now={undefined} icon={undefined} nowProxy={undefined} />
+        <SectionNameType
+          name={name}
+          type={`${vehicleType} / ${behavior}`}
+          now={undefined}
+          icon={undefined}
+          nowProxy={undefined}
+        />
         <div style={{ paddingRight: '0.5em' }}>
-          <span onClick={get_rule_set} className={s0.qty}>{ruleCount}</span>
+          <span onClick={get_rule_set} className={s0.qty}>
+            {ruleCount}
+          </span>
         </div>
         {/*<div style={{ paddingLeft: '1em' }} className={s.gray}>{`${ruleCount}条规则`}</div>*/}
-        <div className={s.update_time}><span>{`更新于${timeAgo}`}</span></div>
+        <div className={s.update_time}>
+          <span>{`更新于${timeAgo}`}</span>
+        </div>
       </div>
       <span className={s.refreshButtonWrapper}>
-        <Button className={s.button} onClick={() => setDeleteModal(true)
-        }>
-          <HiX size={18} />
-        </Button>
+        { !sing_box &&
+          <Button className={s.button} onClick={() => setDeleteModal(true)}>
+            <HiX size={18} />
+          </Button>
+        }
         <Button className={s.button} onClick={onClickRefreshButton} disabled={isRefreshing}>
           <RotateIcon isRotating={isRefreshing} />
         </Button>
       </span>
 
-      <ModalCloseAllConnections
-        confirm={'delete_rule'}
-        isOpen={delete_modal}
-        primaryButtonOnTap={() => delete_rule_set(name)}
-        onRequestClose={() => setDeleteModal(false)}
-      />
-
-      <ShowCodeModal isOpen={isModalOpen} onRequestClose={() => {
-        setIsModalOpen(false);
-        setData(null);
-      }} data={data} />
+      {!sing_box && (
+        <>
+          <ModalCloseAllConnections
+            confirm={'delete_rule'}
+            isOpen={delete_modal}
+            primaryButtonOnTap={() => delete_rule_set(name)}
+            onRequestClose={() => setDeleteModal(false)}
+          />
+          <ShowCodeModal
+            isOpen={isModalOpen}
+            onRequestClose={() => {
+              setIsModalOpen(false);
+              setData(null);
+            }}
+            data={data}
+          />
+        </>
+      )}
     </div>
   );
 }
diff --git a/src/components/rules/Rules.tsx b/src/components/rules/Rules.tsx
index 0bab915e8..5a62453d6 100644
--- a/src/components/rules/Rules.tsx
+++ b/src/components/rules/Rules.tsx
@@ -290,7 +290,7 @@ function Rules({ dispatch, apiConfig, groups, utilsApiUrl, unReloadConfig }) {
                   const item = provider.byName[name];
                   return (
                     <div key={index} className={s.RuleProviderItemWrapper}>
-                      <RuleProviderItem apiConfig={apiConfig} utilsApiUrl={utilsApiUrl} {...item} unReloadConfig={unReloadConfig} />
+                      <RuleProviderItem sing_box={version.premium && version.meta} apiConfig={apiConfig} utilsApiUrl={utilsApiUrl} {...item} unReloadConfig={unReloadConfig} />
                     </div>
                   );
                 })}