Fix item loading

web/app/products/page.js

@@ -2,6 +2,7 @@
 
 import { useState, useEffect } from "react";
 import ProductCard from "@/components/ProductCard";
+import { fetchAllPages } from "@/lib/fetchAllPages";
 
 const API_BASE = "";
 
@@ -12,24 +13,25 @@ export default function ProductsPage() {
   const [search, setSearch] = useState("");
   const [query, setQuery] = useState("");
 
-  const PAGE_SIZE = 200;
+  const PAGE_SIZE = 100;
 
   useEffect(() => {
-    const params = new URLSearchParams({ page: 0, size: PAGE_SIZE, sort: "prodId,asc" });
-    if (query) {
-      params.set("q", query);
-    }
+    setLoading(true);
+    setError(null);
 
-    fetch(`${API_BASE}/api/v1/products?${params}`)
-      .then((res) => {
-        if (!res.ok) {
-          throw new Error(`HTTP ${res.status} – ${res.statusText}`);
-        }
-        
-        return res.json();
-      })
-      .then((data) => {
-        setProducts(data.content ?? []);
+    fetchAllPages((page) => {
+      const params = new URLSearchParams({
+        page: String(page),
+        size: String(PAGE_SIZE),
+        sort: "prodId,asc",
+      });
+      if (query) {
+        params.set("q", query);
+      }
+      return `${API_BASE}/api/v1/products?${params}`;
+    })
+      .then((allProducts) => {
+        setProducts(allProducts);
       })
       .catch((err) => setError(err.message))
       .finally(() => setLoading(false));