group and proxy count

Author: pompurin404

src/renderer/src/components/connections/connection-item.tsx

@@ -29,7 +29,7 @@ const ConnectionItem: React.FC<Props> = (props) => {
               })
             }}
           >
-            <IoClose className="text-[20px]" />
+            <IoClose className="text-[24px]" />
           </Button>
         </div>
       </CardBody>

src/renderer/src/components/sider/proxy-card.tsx

@@ -1,6 +1,7 @@
 import { Button, Card, CardBody, CardFooter, Chip } from '@nextui-org/react'
 import { mihomoProxies } from '@renderer/utils/ipc'
-import { SiNginxproxymanager } from 'react-icons/si'
+import { useMemo } from 'react'
+import { MdTableChart } from 'react-icons/md'
 import { useLocation, useNavigate } from 'react-router-dom'
 import useSWR from 'swr'
 
@@ -9,6 +10,11 @@ const ProxyCard: React.FC = () => {
   const location = useLocation()
   const match = location.pathname.includes('/proxies')
   const { data: proxies = { proxies: {} } } = useSWR('mihomoProxies', mihomoProxies)
+
+  const filtered = useMemo(() => {
+    return Object.keys(proxies.proxies).filter((key) => 'all' in proxies.proxies[key])
+  }, [proxies])
+
   return (
     <Card
       fullWidth
@@ -24,7 +30,7 @@ const ProxyCard: React.FC = () => {
             variant="flat"
             color="default"
           >
-            <SiNginxproxymanager
+            <MdTableChart
               className={`${match ? 'text-white' : 'text-foreground'} text-[24px] font-bold`}
             />
           </Button>
@@ -44,7 +50,7 @@ const ProxyCard: React.FC = () => {
             variant="bordered"
             className="mr-3 mt-2"
           >
-            {Object.keys(proxies.proxies).length ?? 0}
+            {filtered.length}
           </Chip>
         </div>
       </CardBody>

src/renderer/src/pages/proxies.tsx

@@ -1,4 +1,4 @@
-import { Avatar, Button, Card, CardBody } from '@nextui-org/react'
+import { Avatar, Button, Card, CardBody, Chip } from '@nextui-org/react'
 import BasePage from '@renderer/components/base/base-page'
 import { useAppConfig } from '@renderer/hooks/use-app-config'
 import { mihomoChangeProxy, mihomoProxies, mihomoProxyDelay } from '@renderer/utils/ipc'
@@ -134,7 +134,9 @@ const Proxies: React.FC = () => {
         groupCounts={groupCounts}
         groupContent={(index) => {
           return (
-            <div className={`w-full pt-2 ${index === groupCounts.length - 1 ? 'pb-2' : ''} px-2`}>
+            <div
+              className={`w-full pt-2 ${index === groupCounts.length - 1 && !isOpen[index] ? 'pb-2' : ''} px-2`}
+            >
               <Card
                 isPressable
                 fullWidth
@@ -171,7 +173,12 @@ const Proxies: React.FC = () => {
                         )}
                       </div>
                     </div>
-                    <div className="flex">
+                    <div className="flex ">
+                      {proxyDisplayMode === 'full' && (
+                        <Chip size="sm" className="my-1 mr-2">
+                          {groups[index].all.length}
+                        </Chip>
+                      )}
                       <Button
                         title="定位到当前节点"
                         variant="light"