From ebc95fe58592a6f187f733ea1da3b56d738a7406 Mon Sep 17 00:00:00 2001
From: kunish <kunish.butt@gmail.com>
Date: Sat, 16 Sep 2023 00:24:45 +0800
Subject: [PATCH] fix: failed to resolve import solid-infinite-scroll

---
 src/components/ProxyCardGroups.tsx | 14 +++-----------
 src/pages/Proxies.tsx              | 24 ++++++++++--------------
 2 files changed, 13 insertions(+), 25 deletions(-)

diff --git a/src/components/ProxyCardGroups.tsx b/src/components/ProxyCardGroups.tsx
index a1e8dd8..371de6d 100644
--- a/src/components/ProxyCardGroups.tsx
+++ b/src/components/ProxyCardGroups.tsx
@@ -1,5 +1,4 @@
-import InfiniteScroll from 'solid-infinite-scroll'
-import { createMemo, createSignal } from 'solid-js'
+import { For } from 'solid-js'
 import { ProxyNodeCard } from '~/components'
 
 export const ProxyCardGroups = (props: {
@@ -7,15 +6,8 @@ export const ProxyCardGroups = (props: {
   now?: string
   onClick?: (name: string) => void
 }) => {
-  const [maxRender, setMaxRender] = createSignal(100)
-  const proxyNames = createMemo(() => props.proxyNames.slice(0, maxRender()))
-
   return (
-    <InfiniteScroll
-      each={proxyNames()}
-      hasMore={proxyNames().length < props.proxyNames.length}
-      next={() => setMaxRender(maxRender() + 30)}
-    >
+    <For each={props.proxyNames}>
       {(proxy) => (
         <ProxyNodeCard
           proxyName={proxy}
@@ -23,6 +15,6 @@ export const ProxyCardGroups = (props: {
           onClick={props.onClick && (() => props.onClick?.(proxy))}
         />
       )}
-    </InfiniteScroll>
+    </For>
   )
 }
diff --git a/src/pages/Proxies.tsx b/src/pages/Proxies.tsx
index d380d62..b36303f 100644
--- a/src/pages/Proxies.tsx
+++ b/src/pages/Proxies.tsx
@@ -224,13 +224,11 @@ export default () => {
                 </>
               )
 
-              const content = <ProxyCardGroups proxyNames={sortedProxyNames} />
-
               return (
                 <Collapse
                   isOpen={collapsedMap()[proxyProvider.name]}
                   title={title}
-                  content={content}
+                  content={<ProxyCardGroups proxyNames={sortedProxyNames} />}
                   onCollapse={(val) => setCollapsedMap(proxyProvider.name, val)}
                 />
               )
@@ -286,21 +284,19 @@ export default () => {
                 </>
               )
 
-              const content = (
-                <ProxyCardGroups
-                  proxyNames={sortedProxyNames}
-                  now={proxy.now}
-                  onClick={(name) => {
-                    void onProxyNodeClick(proxy, name)
-                  }}
-                />
-              )
-
               return (
                 <Collapse
                   isOpen={collapsedMap()[proxy.name]}
                   title={title}
-                  content={content}
+                  content={
+                    <ProxyCardGroups
+                      proxyNames={sortedProxyNames}
+                      now={proxy.now}
+                      onClick={(name) => {
+                        void onProxyNodeClick(proxy, name)
+                      }}
+                    />
+                  }
                   onCollapse={(val) => setCollapsedMap(proxy.name, val)}
                 />
               )