From 1f62c008d97676a998aa9e1c4154ced151cc7343 Mon Sep 17 00:00:00 2001
From: izayl <izayl@163.com>
Date: Mon, 8 May 2023 22:12:01 +0800
Subject: [PATCH] fix: add reach end status (#12)

---
 .changeset/loud-lies-yawn.md |  5 +++++
 src/components/result.tsx    | 10 ++++++----
 src/hooks/useDependents.ts   |  1 +
 3 files changed, 12 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/loud-lies-yawn.md

diff --git a/.changeset/loud-lies-yawn.md b/.changeset/loud-lies-yawn.md
new file mode 100644
index 0000000..e41254c
--- /dev/null
+++ b/.changeset/loud-lies-yawn.md
@@ -0,0 +1,5 @@
+---
+"useful-dependents": patch
+---
+
+fix: add reach end status to show correctly end status
diff --git a/src/components/result.tsx b/src/components/result.tsx
index fd60587..d6f960e 100644
--- a/src/components/result.tsx
+++ b/src/components/result.tsx
@@ -17,7 +17,7 @@ export const Result: React.FC = () => {
   const repo = searchParams.get('repo')
   const packageId = searchParams.get('package_id')
   const [loadPage, setLoadPage] = useState(5)
-  const { data, setSize, packages, size, isLoading } = useDependents(repo as string, packageId as string)
+  const { data, setSize, packages, size, isLoading, isFinished } = useDependents(repo as string, packageId as string)
   const [ignoreZeroStar, setIgnoreZeroStar] = useState(true)
   const sortedData = useMemo(() => {
     const filteredData = ignoreZeroStar ? data.filter(d => d.stars > 0) : data
@@ -25,8 +25,9 @@ export const Result: React.FC = () => {
   }, [data, ignoreZeroStar])
   const isFetching = useMemo(() => {
     const last = 30 * (loadPage - 1)
+    if (isFinished) return false
     return size > 0 && data && typeof data[last] === 'undefined'
-  }, [size, data, loadPage])
+  }, [size, data, loadPage, isFinished])
 
   useEffect(() => {
     if (repo && !isLoading) {
@@ -83,7 +84,8 @@ export const Result: React.FC = () => {
         <div className="rounded-b-md border text-center p-2">
           {isFetching ? (
             <Icons.loading className="animate-spin h-4 w-4 my-2 mx-auto " />
-          ) : (
+          ) : null}
+          {!isFetching && !isFinished ? (
             <Button
               className=" font-semibold"
               variant="link"
@@ -91,7 +93,7 @@ export const Result: React.FC = () => {
             >
               Load More
             </Button>
-          )}
+          ) : null}
         </div>
       </div>
     </>
diff --git a/src/hooks/useDependents.ts b/src/hooks/useDependents.ts
index 5011cdd..77f6f52 100644
--- a/src/hooks/useDependents.ts
+++ b/src/hooks/useDependents.ts
@@ -44,6 +44,7 @@ export const useDependents = (repo: string, packageId?: string) => {
 
   return {
     ...response,
+    isFinished: response.data?.some(d => !d?.nextURL),
     data: data.filter(Boolean),
     packages: response.data ? response.data[0]?.packages : [],
   }