From 85302f0607a5d43bc4f2265354888bf16deff182 Mon Sep 17 00:00:00 2001
From: Kentai Radiquum <kentai.waah@gmail.com>
Date: Mon, 29 Apr 2024 03:45:27 +0500
Subject: [PATCH] feat(next-page-loading): disable load more button when length
 of fetched page is less than 25 on all pages

---
 frontend/app/bookmarks/page.js                |  9 +++++++
 .../ReleasesOverview/ReleasesOverview.jsx     | 24 ++++++++++---------
 frontend/app/history/page.js                  | 15 +++++++++++-
 frontend/app/page.js                          |  9 +++++++
 frontend/app/search/page.js                   | 14 ++++++++++-
 5 files changed, 58 insertions(+), 13 deletions(-)

diff --git a/frontend/app/bookmarks/page.js b/frontend/app/bookmarks/page.js
index 7d4300f..ace585d 100644
--- a/frontend/app/bookmarks/page.js
+++ b/frontend/app/bookmarks/page.js
@@ -18,6 +18,8 @@ export default function Bookmarks() {
   const [releases, setReleases] = useState();
   const [page, setPage] = useState(0);
 
+  const [isNextPage, setIsNextPage] = useState(true);
+
   const searchParams = useSearchParams();
   const createQueryString = useCallback(
     (name, value) => {
@@ -45,6 +47,12 @@ export default function Bookmarks() {
       const url = `${endpoints.user.bookmarks[list]}?page=${page}&token=${userStore.token}`;
       const data = await getData(url);
 
+      if (data.content.length < 25) {
+        setIsNextPage(false);
+      } else {
+        setIsNextPage(true);
+      }
+
       // Handle initial load (page 0) or subsequent pagination
       if (page === 0) {
         setReleases(data.content);
@@ -106,6 +114,7 @@ export default function Bookmarks() {
           setPage={setPage}
           list={list}
           releases={releases}
+          isNextPage={isNextPage}
         />
       )}
     </>
diff --git a/frontend/app/components/ReleasesOverview/ReleasesOverview.jsx b/frontend/app/components/ReleasesOverview/ReleasesOverview.jsx
index 37cfb1e..9856e31 100644
--- a/frontend/app/components/ReleasesOverview/ReleasesOverview.jsx
+++ b/frontend/app/components/ReleasesOverview/ReleasesOverview.jsx
@@ -27,17 +27,19 @@ export default function ReleasesOverview(props) {
             <CardList data={props.releases} />
           </div>
 
-          <nav className="large-margin center-align">
-            <button
-              className="large"
-              onClick={() => {
-                props.setPage(props.page + 1);
-              }}
-            >
-              <i>add</i>
-              <span>загрузить ещё</span>
-            </button>
-          </nav>
+          {props.isNextPage && (
+            <nav className="large-margin center-align">
+              <button
+                className="large"
+                onClick={() => {
+                  props.setPage(props.page + 1);
+                }}
+              >
+                <i>add</i>
+                <span>загрузить ещё</span>
+              </button>
+            </nav>
+          )}
         </>
       ) : (
         <progress className="s1"></progress>
diff --git a/frontend/app/history/page.js b/frontend/app/history/page.js
index 845adf8..fb7322b 100644
--- a/frontend/app/history/page.js
+++ b/frontend/app/history/page.js
@@ -13,11 +13,19 @@ export default function History() {
   const [releases, setReleases] = useState();
   const [page, setPage] = useState(0);
 
+  const [isNextPage, setIsNextPage] = useState(true);
+
   async function fetchData(page = 0) {
     if (userStore.token) {
       const url = `${endpoints.user.history}?page=${page}&token=${userStore.token}`;
       const data = await getData(url);
 
+      if (data.content.length < 25) {
+        setIsNextPage(false);
+      } else {
+        setIsNextPage(true);
+      }
+
       // Handle initial load (page 0) or subsequent pagination
       if (page === 0) {
         setReleases(data.content);
@@ -44,7 +52,12 @@ export default function History() {
       {!userStore.isAuth ? (
         <LogInNeeded />
       ) : (
-        <ReleasesOverview page={page} setPage={setPage} releases={releases} />
+        <ReleasesOverview
+          page={page}
+          setPage={setPage}
+          releases={releases}
+          isNextPage={isNextPage}
+        />
       )}
     </>
   );
diff --git a/frontend/app/page.js b/frontend/app/page.js
index 3c2df44..ad02abf 100644
--- a/frontend/app/page.js
+++ b/frontend/app/page.js
@@ -15,6 +15,8 @@ export default function Home() {
   const [releases, setReleases] = useState();
   const [page, setPage] = useState(0);
 
+  const [isNextPage, setIsNextPage] = useState(true);
+
   const searchParams = useSearchParams();
   const createQueryString = useCallback(
     (name, value) => {
@@ -41,6 +43,12 @@ export default function Home() {
     const url = `${endpoints.index[list]}?page=${page}`;
     const data = await getData(url);
 
+    if (data.content.length < 25) {
+      setIsNextPage(false);
+    } else {
+      setIsNextPage(true);
+    }
+
     // Handle initial load (page 0) or subsequent pagination
     if (page === 0) {
       setReleases(data.content);
@@ -93,6 +101,7 @@ export default function Home() {
       setPage={setPage}
       list={list}
       releases={releases}
+      isNextPage={isNextPage}
     />
   );
 }
diff --git a/frontend/app/search/page.js b/frontend/app/search/page.js
index 3c3099d..966045b 100644
--- a/frontend/app/search/page.js
+++ b/frontend/app/search/page.js
@@ -21,6 +21,7 @@ export default function Search() {
   const [releases, setReleases] = useState();
   const [page, setPage] = useState(0);
   const [query, setQuery] = useState("");
+  const [isNextPage, setIsNextPage] = useState(true);
 
   const [searches, setSearches] = useState(JSON.parse(getSearches()));
 
@@ -39,6 +40,12 @@ export default function Search() {
     const url = `${endpoints.search}?query=${query}&page=${page}`;
     const data = await getData(url);
 
+    if (data.content.length < 25) {
+      setIsNextPage(false);
+    } else {
+      setIsNextPage(true);
+    }
+
     // Handle initial load (page 0) or subsequent pagination
     if (page === 0) {
       setReleases(data.content);
@@ -118,7 +125,12 @@ export default function Search() {
 
       {releases ? (
         releases.length > 0 ? (
-          <ReleasesOverview page={page} setPage={setPage} releases={releases} />
+          <ReleasesOverview
+            page={page}
+            setPage={setPage}
+            releases={releases}
+            isNextPage={isNextPage}
+          />
         ) : (
           <div className="absolute padding primary center middle small-round">
             <i className="extra">search</i>