From 599b70cd2390d08ce26ee44174b3f39c6587110c Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Mon, 13 Nov 2023 12:37:50 +0100
Subject: refactor(hooks): rewrite usePagination hook

* replace `isLoadingInitialData` with `isLoading` & `isRefreshing`
* rename `fallbackData` prop to `fallback`
* replace `setSize` return with a `loadMore` callback
* add tests
---
 src/pages/blog/index.tsx | 14 +++++---------
 1 file changed, 5 insertions(+), 9 deletions(-)

(limited to 'src/pages/blog/index.tsx')

diff --git a/src/pages/blog/index.tsx b/src/pages/blog/index.tsx
index accd314..d74124e 100644
--- a/src/pages/blog/index.tsx
+++ b/src/pages/blog/index.tsx
@@ -3,7 +3,6 @@ import type { GetStaticProps } from 'next';
 import Head from 'next/head';
 import { useRouter } from 'next/router';
 import Script from 'next/script';
-import { useCallback } from 'react';
 import { useIntl } from 'react-intl';
 import {
   getLayout,
@@ -108,20 +107,17 @@ const BlogPage: NextPageWithLayout<BlogPageProps> = ({
   const {
     data,
     error,
-    isLoadingInitialData,
+    isLoading,
     isLoadingMore,
+    isRefreshing,
     hasNextPage,
-    setSize,
+    loadMore,
   } = usePagination<RawArticle>({
-    fallbackData: [articles],
+    fallback: [articles],
     fetcher: getArticles,
     perPage: blog.postsPerPage,
   });
 
-  const loadMore = useCallback(() => {
-    setSize((prevSize) => prevSize + 1);
-  }, [setSize]);
-
   const thematicsListTitle = intl.formatMessage({
     defaultMessage: 'Thematics',
     description: 'BlogPage: thematics list widget title',
@@ -214,7 +210,7 @@ const BlogPage: NextPageWithLayout<BlogPageProps> = ({
           <PostsList
             baseUrl={postsListBaseUrl}
             byYear={true}
-            isLoading={isLoadingMore ?? isLoadingInitialData}
+            isLoading={isLoading || isLoadingMore || isRefreshing}
             loadMore={loadMore}
             posts={getPostsList(data)}
             showLoadMoreBtn={hasNextPage}
-- 
cgit v1.2.3