agatha
781be909bc
Page size changes from 50 to 24. Library now shows discrete page navigation with a "Page N of M" indicator, total image count, and URL state (?page=N) so pages are bookmarkable and the browser Back button works. Tag filter resets to page 1. Out-of-range page params are clamped silently. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
42 lines
1.4 KiB
Markdown
42 lines
1.4 KiB
Markdown
# Quickstart: Library Pagination UI
|
|
|
|
## Happy Path — Navigating Pages
|
|
|
|
**Setup**: Library contains more than 24 images.
|
|
|
|
1. Open `http://localhost:4200/`
|
|
2. Confirm the image grid shows 24 images (not 50).
|
|
3. Confirm "Page 1 of N" indicator and total count are visible above or below the grid.
|
|
4. Confirm "Previous" button is absent or disabled.
|
|
5. Click "Next" → grid replaces with the next 24 images; indicator updates to "Page 2 of N".
|
|
6. Click "Previous" → first 24 images return; indicator shows "Page 1 of N".
|
|
7. Navigate to the last page → "Next" is absent or disabled.
|
|
|
|
## Happy Path — URL State
|
|
|
|
1. Navigate to page 3 via "Next" button twice.
|
|
2. Copy URL from address bar (should contain `?page=3`).
|
|
3. Open URL in a new tab → page 3 loads directly.
|
|
4. Press browser Back → page 2 loads.
|
|
|
|
## Happy Path — Tag Filter Resets Page
|
|
|
|
1. Navigate to page 2.
|
|
2. Add a tag filter.
|
|
3. Confirm page resets to 1; URL shows `?page=1&tags=<tag>` (or just `?tags=<tag>`).
|
|
|
|
## Edge Case — Single Page
|
|
|
|
1. Filter to a tag with fewer than 25 images.
|
|
2. Confirm no pagination controls are rendered.
|
|
|
|
## Edge Case — Out-of-Range URL
|
|
|
|
1. Manually enter `/?page=9999` in the address bar.
|
|
2. Confirm page 1 loads with no error message.
|
|
|
|
## Edge Case — Empty Library
|
|
|
|
1. With no images uploaded, open `/`.
|
|
2. Confirm the existing empty state is shown; no pagination controls visible.
|