fix(frontend): update pagination param

SocialGouv · Dec 10, 2020 · baa06b9 · baa06b9
1 parent 6e31fba
commit baa06b9
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 19 deletions.
diff --git a/targets/frontend/src/components/pagination/index.js b/targets/frontend/src/components/pagination/index.js
@@ -100,31 +100,34 @@ PaginationList.propTypes = {
 
 function PageButton({ currentPage, pageIndex }) {
   const router = useRouter();
-  const qs = Object.entries(router.query)
-    .flatMap(([key, value]) => {
-      if (key === "page") {
-        return [];
-      }
-      if (new RegExp(`[([...)?${key}]?]`).test(router.route)) {
-        return [];
-      }
-      return [`${key}=${value}`];
-    })
-    .join("&");
 
   return (
-    <Link
-      href={`${router.asPath.replace(/\?.*$/, "")}?${qs}&page=${pageIndex}`}
-      passHref
-      shallow
-    >
+    <Link href={addPaginationParam(router.asPath, pageIndex)} passHref shallow>
       <NavButton variant={pageIndex === currentPage ? "accent" : "secondary"}>
         {pageIndex + 1}
       </NavButton>
     </Link>
   );
 }
 
+/**
+ * add pagination param to a given url
+ * 3 cases:
+ *  - querystring param with a page param
+ *  - querystring without page param
+ *  - no querystring param
+ */
+function addPaginationParam(url, pageIndex) {
+  if (url.includes("?")) {
+    if (/page=(\d+)/.test(url)) {
+      return url.replace(/(&|\?)page=(\d+)(&|$)/, `$1page=${pageIndex}$3`);
+    } else {
+      return `${url}&page=${pageIndex}`;
+    }
+  }
+  return `${url}?page=${pageIndex}`;
+}
+
 PageButton.propTypes = {
   currentPage: PropTypes.number.isRequired,
   pageIndex: PropTypes.number.isRequired,

diff --git a/targets/frontend/src/pages/contenus/index.js b/targets/frontend/src/pages/contenus/index.js
@@ -117,9 +117,9 @@ export function DocumentsPage() {
   }
 
   const facets = {
-    currentPage: parseInt(router.query.page, 10) || 0,
     itemsPerPage:
       parseInt(router.query.itemsPerPage, 10) || DEFAULT_ITEMS_PER_PAGE,
+    page: parseInt(router.query.page, 10) || 0,
     published: router.query.published || "all",
     q: router.query.q?.trim() || "",
     source: router.query.source || null,
@@ -129,7 +129,7 @@ export function DocumentsPage() {
     query: searchDocumentQuery,
     variables: {
       limit: facets.itemsPerPage,
-      offset: facets.currentPage * facets.itemsPerPage,
+      offset: facets.page * facets.itemsPerPage,
       published:
         facets.published === "yes"
           ? [true]
@@ -279,7 +279,7 @@ export function DocumentsPage() {
           </table>
           <Pagination
             count={data.documents_aggregate.aggregate.count}
-            currentPage={facets.currentPage}
+            currentPage={facets.page}
             pageSize={facets.itemsPerPage}
           />
         </>