code100x / daily-code

https://projects.100xdevs.com/
834 stars 1.02k forks source link

Implement Pagination for Tracks #659

Open javed-ak opened 2 months ago

javed-ak commented 2 months ago

Description:

This PR introduces pagination functionality for the Tracks component, ensuring that the content is properly paginated and displayed in a user-friendly way. The main objective was to display a set number of tracks per page (10 in this case) and provide pagination controls to navigate through different pages of content.

PR Fixes:

  1. Pagination Logic:
  1. State Management:
    • Added state to handle the current page (currentPage), filtered tracks (filteredTracks), and visible tracks (visibleTracks).
    • Pagination re-renders the visible tracks based on the selected page.

Resolves #609, #651

Before

https://github.com/user-attachments/assets/17d7ff68-e537-49f3-9495-4036d188e68e

After

https://github.com/user-attachments/assets/a9c0f92b-a89d-468f-8f72-9eca247f12e2

Checklist before requesting a review

jals413 commented 2 months ago

In my view, implementing pagination on the frontend doesn’t add value or improve code efficiency. If pagination is required, it’s more efficient to handle it in the backend to optimize performance and manage resources effectively.

javed-ak commented 2 months ago

In my view, implementing pagination on the frontend doesn’t add value or improve code efficiency. If pagination is required, it’s more efficient to handle it in the backend to optimize performance and manage resources effectively.

I think if there were some problems then you would have been absolutely right but there are a lot of problems and they will keep getting added in the future if I am not wrong. And even now if you visit on the website you see lot of problems there, there is also a filter option so anyone can filter according to their need.