timlrx / tailwind-nextjs-starter-blog

This is a Next.js, Tailwind CSS blogging starter template. Comes out of the box configured with the latest technologies to make technical writing a breeze. Easily configurable and customizable. Perfect as a replacement to existing Jekyll and Hugo individual blogs.
https://tailwind-nextjs-starter-blog.vercel.app/
MIT License
7.43k stars 1.87k forks source link

Add pagination to the tags page #869

Open Adriel-M opened 4 months ago

Adriel-M commented 4 months ago

Since the blog page has pagination, the tags should also paginate to keep the same functionality in that page.

I did something similar to my site: https://github.com/Adriel-M/adriel.dev/pull/80 (no demo on my actual site since I don't have enough posts 😓 )

I had to:

  1. Create app/tags/[tag]/page/[page]/page.tsx to support the paging.
  2. Create a component layouts/PagedListLayoutWithTags.tsx that just populates the right fields to ListLayout
  3. Modify ListLayoutWithTags.tsx to handle finding out current tag and the base path since there's multiple levels now.

Let me know if this is something wanted and I can try sending a PR

ray-android commented 4 months ago

Thanks for raising this issue. Previously, someone raised a similar question https://github.com/timlrx/tailwind-nextjs-starter-blog/issues/190 and I tried to adapt the existing code but to no avail.

Your code seems ok to me except the pagination is in decimal points which resulted in the last page not being able to show. I have fixed it by including Math.ceil in the return code for the getTotalPages function.

Adriel-M commented 4 months ago

Ah good catch.

Thanks!

PxlSyl commented 2 months ago

Hi! I made a similar proposal a few months ago for my i18n version. And I finally just got to work and so I coded it! Being an i18n version, this requires some adaptations for the normal version, but in any case it works :)