also handle boundaries on mobile

codedazur · Oct 1, 2024 · 12a855c · 12a855c
1 parent ffb2888
commit 12a855c
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 5 deletions.
diff --git a/packages/react-pagination/hooks/usePagination.test.ts b/packages/react-pagination/hooks/usePagination.test.ts
@@ -67,7 +67,7 @@ describe("usePagination ", () => {
           pages: 20,
           initialPage: 1,
           siblings: 1,
-          boundaries: 1,
+          boundaries: 2,
           isMobile: true,
         }),
       );

diff --git a/packages/react-pagination/hooks/usePagination.ts b/packages/react-pagination/hooks/usePagination.ts
@@ -105,26 +105,30 @@ export function usePagination<T>(
   const { boundaries = 1, siblings = 1, gapSize = 1 } = props;
 
   const responsiveSiblings = props.isMobile ? 0 : siblings;
+  const responsiveBoundaries = props.isMobile ? 1 : boundaries;
 
   const range = useMemo(() => {
     const segments: [number[], number[], number[]] = [
       boundaries ? clampedSequence(1, boundaries) : [],
       clampedSequence(page - responsiveSiblings, page + responsiveSiblings),
-      boundaries
-        ? clampedSequence(computedPages + 1 - boundaries, computedPages)
+      responsiveBoundaries
+        ? clampedSequence(
+            computedPages + 1 - responsiveBoundaries,
+            computedPages,
+          )
         : [],
     ];
 
     return formatSegments(
       segments,
       computedPages,
       responsiveSiblings,
-      boundaries,
+      responsiveBoundaries,
       gapSize,
     );
   }, [
     page,
-    boundaries,
+    responsiveBoundaries,
     responsiveSiblings,
     clampedSequence,
     computedPages,
@@ -145,6 +149,8 @@ export function usePagination<T>(
   const next = () => setPage(page + 1);
   const previous = () => setPage(page - 1);
 
+  console.log("RANGE", range);
+
   return {
     page,
     setPage,