diff options
| author | Armand Philippot <git@armandphilippot.com> | 2021-12-15 17:08:00 +0100 |
|---|---|---|
| committer | Armand Philippot <git@armandphilippot.com> | 2021-12-15 17:08:00 +0100 |
| commit | 516f8256a4f72c7a01752d9aa4e035276fb08b51 (patch) | |
| tree | 791a83b4f6cc2963246752a8ae6efbac62ebcd85 /src/pages/blog/index.tsx | |
| parent | 0fa8ae55c52852c34c9143a6ec43c954c6404df1 (diff) | |
chore: add pagination (load more) to blog page
Diffstat (limited to 'src/pages/blog/index.tsx')
| -rw-r--r-- | src/pages/blog/index.tsx | 15 |
1 files changed, 9 insertions, 6 deletions
diff --git a/src/pages/blog/index.tsx b/src/pages/blog/index.tsx index 7057982..083ad97 100644 --- a/src/pages/blog/index.tsx +++ b/src/pages/blog/index.tsx @@ -10,10 +10,9 @@ import { NextPageWithLayout } from '@ts/types/app'; import { BlogPageProps } from '@ts/types/blog'; import { loadTranslation } from '@utils/helpers/i18n'; import PostsList from '@components/PostsList/PostsList'; +import { SWRConfig } from 'swr'; -const Blog: NextPageWithLayout<BlogPageProps> = ({ data }) => { - const { posts, pageInfo } = data; - +const Blog: NextPageWithLayout<BlogPageProps> = ({ fallback }) => { return ( <> <Head> @@ -21,7 +20,9 @@ const Blog: NextPageWithLayout<BlogPageProps> = ({ data }) => { <meta name="description" content={seo.blog.description} /> </Head> <h1>{t`Blog`}</h1> - <PostsList posts={posts} titleLevel={2} /> + <SWRConfig value={{ fallback }}> + <PostsList titleLevel={2} /> + </SWRConfig> </> ); }; @@ -35,11 +36,13 @@ export const getStaticProps: GetStaticProps = async (context) => { context.locale!, process.env.NODE_ENV === 'production' ); - const data = await getPublishedPosts(config.postsPerPage); + const data = await getPublishedPosts({ first: config.postsPerPage }); return { props: { - data, + fallback: { + '/api/posts': data, + }, translation, }, }; |