feat(mangas): per-field sort options + direction toggle on the catalog (0.88.0)
Sort the manga catalog by created / updated / title / author with an independent asc/desc direction control. An omitted `order` defaults per field (dates newest-first, text A→Z), matching the UI, so a bare `?sort=<field>` means the same thing in the browser and over the API; `sort=recent` remains a back-compat alias for `created`. - Backend: SortField/SortOrder parsed with validation (structured 422 on bad input), per-field default_order, NULLS LAST only on the nullable author key, and migration 0033 indexing mangas(updated_at DESC, id) to back the default sort and its id tie-break. - Frontend: catalog sort field + direction (SegmentedControl) on desktop and a mobile bottom sheet; pure helpers in $lib/mangaSort; keyboard-accessible direction control; visible Direction labels and a sheet "Done" button. - Tests: backend integration coverage (defaults, alias, invalid input, ascending-id tie-break), frontend unit + e2e. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -149,14 +149,16 @@ test.describe('mobile catalog chrome', () => {
|
||||
await expect(page).toHaveURL((url) => !url.search.includes('genres='));
|
||||
});
|
||||
|
||||
test('phone viewport: Sort sheet swaps the sort and dismisses on pick', async ({
|
||||
test('phone viewport: Sort sheet swaps field + direction, staying open', async ({
|
||||
page
|
||||
}) => {
|
||||
let lastSortParam: string | null = null;
|
||||
let lastOrderParam: string | null = null;
|
||||
await mockAnonymous(page);
|
||||
await mockCatalog(page, {
|
||||
capture: (url) => {
|
||||
lastSortParam = url.searchParams.get('sort');
|
||||
lastOrderParam = url.searchParams.get('order');
|
||||
}
|
||||
});
|
||||
await page.setViewportSize(MOBILE);
|
||||
@@ -166,13 +168,27 @@ test.describe('mobile catalog chrome', () => {
|
||||
await page.getByTestId('sort-chip').click();
|
||||
await expect(page.getByTestId('sort-sheet')).toBeVisible();
|
||||
|
||||
// Use click(), not check(): the onchange handler closes the sheet
|
||||
// synchronously so the radio is gone before check() can verify the
|
||||
// `checked` state.
|
||||
await page.getByTestId('sort-sheet').getByRole('radio', { name: /Title/ }).click();
|
||||
|
||||
await expect(page.getByTestId('sort-sheet')).toBeHidden();
|
||||
// Picking a field reloads but keeps the sheet open so the direction
|
||||
// can be adjusted in the same interaction.
|
||||
await page.getByTestId('sort-sheet').getByRole('radio', { name: /^Title$/ }).click();
|
||||
await expect(page.getByTestId('sort-sheet')).toBeVisible();
|
||||
await expect(page).toHaveURL(/sort=title/);
|
||||
expect(lastSortParam).toBe('title');
|
||||
// The API call always carries an explicit direction; Title's natural
|
||||
// default is A→Z (asc)...
|
||||
expect(lastOrderParam).toBe('asc');
|
||||
// ...but the browser URL omits it since it's the default.
|
||||
await expect(page).not.toHaveURL(/order=/);
|
||||
|
||||
// Flipping the direction to Z→A surfaces an explicit order param both
|
||||
// on the wire and in the URL.
|
||||
await page.getByTestId('sort-order-mobile-desc').click();
|
||||
await expect(page).toHaveURL(/order=desc/);
|
||||
expect(lastOrderParam).toBe('desc');
|
||||
|
||||
// The Done button gives an explicit dismissal affordance once the
|
||||
// field + direction are set.
|
||||
await page.getByTestId('sort-done').click();
|
||||
await expect(page.getByTestId('sort-sheet')).toBeHidden();
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user