feat: icon success color when updating

MetaCubeX · Sep 5, 2023 · 6575e73 · 6575e73
1 parent e6facf1
commit 6575e73
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 16 deletions.
diff --git a/src/pages/Proxies.tsx b/src/pages/Proxies.tsx
@@ -64,15 +64,16 @@ export default () => {
                   >
                     <IconBrandSpeedtest
                       class={twMerge(
-                        speedTestingMap()[proxy.name] && 'animate-pulse',
+                        speedTestingMap()[proxy.name] &&
+                          'animate-pulse text-success',
                       )}
                     />
                   </Button>
                 </div>
                 <div class="text-sm text-slate-500">
                   {proxy.type} {proxy.now?.length > 0 && ` :: ${proxy.now}`}
                 </div>
-                <Show when={!collapsedMap()[`group-${proxy.name}`]}>
+                <Show when={!collapsedMap()[proxy.name]}>
                   <ProxyNodePreview
                     proxyNameList={sortedProxyNames}
                     now={proxy.now}
@@ -93,12 +94,10 @@ export default () => {
 
             return (
               <Collapse
-                isOpen={collapsedMap()[`group-${proxy.name}`]}
+                isOpen={collapsedMap()[proxy.name]}
                 title={title}
                 content={content}
-                onCollapse={(val) =>
-                  setCollapsedMap(`group-${proxy.name}`, val)
-                }
+                onCollapse={(val) => setCollapsedMap(proxy.name, val)}
               />
             )
           })}

diff --git a/src/pages/ProxyProvider.tsx b/src/pages/ProxyProvider.tsx
@@ -63,7 +63,9 @@ export default () => {
           onClick={(e) => onUpdateAllProviderClick(e)}
         >
           <IconReload
-            class={twMerge(allProviderIsUpdating() && 'animate-spin')}
+            class={twMerge(
+              allProviderIsUpdating() && 'animate-spin text-success',
+            )}
           />
         </Button>
       </h1>
@@ -88,7 +90,8 @@ export default () => {
                   >
                     <IconReload
                       class={twMerge(
-                        updateingMap()[proxyProvider.name] && 'animate-spin',
+                        updateingMap()[proxyProvider.name] &&
+                          'animate-spin text-success',
                       )}
                     />
                   </Button>
@@ -100,7 +103,7 @@ export default () => {
                     <IconBrandSpeedtest
                       class={twMerge(
                         healthCheckingMap()[proxyProvider.name] &&
-                          'animate-pulse',
+                          'animate-pulse text-success',
                       )}
                     />
                   </Button>
@@ -113,7 +116,7 @@ export default () => {
                 {proxyProvider.vehicleType} :: {t('updated')}{' '}
                 {formatTimeFromNow(proxyProvider.updatedAt)}
               </div>
-              <Show when={!collapsedMap()[`provider-${proxyProvider.name}`]}>
+              <Show when={!collapsedMap()[proxyProvider.name]}>
                 <ProxyNodePreview proxyNameList={sortedProxyNames} />
               </Show>
             </>
@@ -123,12 +126,10 @@ export default () => {
 
           return (
             <Collapse
-              isOpen={collapsedMap()[`provider-${proxyProvider.name}`]}
+              isOpen={collapsedMap()[proxyProvider.name]}
               title={title}
               content={content}
-              onCollapse={(val) =>
-                setCollapsedMap(`provider-${proxyProvider.name}`, val)
-              }
+              onCollapse={(val) => setCollapsedMap(proxyProvider.name, val)}
             />
           )
         })}

diff --git a/src/pages/Rules.tsx b/src/pages/Rules.tsx
@@ -74,7 +74,9 @@ export default () => {
               onClick={(e) => onUpdateAllProviderClick(e)}
             >
               <IconReload
-                class={twMerge(allProviderIsUpdating() && 'animate-spin')}
+                class={twMerge(
+                  allProviderIsUpdating() && 'animate-spin text-success',
+                )}
               />
             </Button>
           </h1>
@@ -95,7 +97,8 @@ export default () => {
                     >
                       <IconReload
                         class={twMerge(
-                          updatingMap()[rulesProvider.name] && 'animate-spin',
+                          updatingMap()[rulesProvider.name] &&
+                            'animate-spin text-success',
                         )}
                       />
                     </Button>