Anujcodecraft/notes-online

## 🐞 Bug: "Next" Button Enabled Even When No More Data is Available (Pagination)

Open

#23 opened on Jul 4, 2025

 (5 comments) (0 reactions) (1 assignee)JavaScript (7 forks)auto 404
NodeJSReactJsbuggood first issuehelp wanted

Repository metrics

Stars
 (7 stars)
PR merge metrics
 (PR metrics pending)

Description

📋 Description

On paginated pages (e.g., PYQs and Notes), when the user is not on the last page by number, but the remaining items to show are already fewer than the page size, the "Next" button is still enabled.

  • This leads to the next page showing no content, creating a poor user experience.

🔁 Steps to Reproduce

  1. Have a dataset with, for example, 11 items, and pagination limit is 6 per page.
  2. Page 1 shows 6 items.
  3. Page 2 shows remaining 5 items.
  4. Page 3 should not exist, but the "Next" button is still enabled.
  5. Clicking "Next" shows an empty page.
  6. Do check 🌐 Live Demo here for live bug

❌ Current Behavior

  • "Next" button is enabled even when there are no more items to show.
  • Clicking it leads to a blank or empty result.

✅ Expected Behavior

  • Backend should return a flag (e.g., isLastPage: true) when the current set of items is the last.
  • Frontend should check this flag and disable the "Next" button accordingly.
  • Alternatively, the frontend can calculate based on total count and limit, but a backend flag would be cleaner and more reliable.

💡 Suggested Fix

  • Backend: Add a field like isLastPage: true/false in controller of getting items (notes and pyqs)
  • Frontend: Disable the "Next" button if isLastPage === true

📂 Affected Areas

  • Backend pagination API logic
  • Client pagination button state

🏷️ Labels

bug pagination backend frontend good first issue

Contributor guide