feat(detail): link genre and tag chips to the filtered catalogue
Genre chips now deep-link to /?genres=<id> and user-tag chips to /?tags=<id>, reusing the homepage catalogue's existing filter params — turning the detail page's metadata into one-tap discovery. Tag chips keep their remove affordance (the Chip's href branch preventDefaults the remove button). e2e asserts both chip hrefs. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2
backend/Cargo.lock
generated
2
backend/Cargo.lock
generated
@@ -1558,7 +1558,7 @@ checksum = "c41e0c4fef86961ac6d6f8a82609f55f31b05e4fce149ac5710e439df7619ba4"
|
||||
|
||||
[[package]]
|
||||
name = "mangalord"
|
||||
version = "0.97.0"
|
||||
version = "0.98.0"
|
||||
dependencies = [
|
||||
"anyhow",
|
||||
"argon2",
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
[package]
|
||||
name = "mangalord"
|
||||
version = "0.97.0"
|
||||
version = "0.98.0"
|
||||
edition = "2021"
|
||||
default-run = "mangalord"
|
||||
|
||||
|
||||
60
frontend/e2e/chip-catalog-links.spec.ts
Normal file
60
frontend/e2e/chip-catalog-links.spec.ts
Normal file
@@ -0,0 +1,60 @@
|
||||
import { test, expect, type Page } from './fixtures';
|
||||
|
||||
// Genre and user-tag chips on the manga detail page deep-link into the
|
||||
// homepage catalogue pre-filtered by that genre / tag.
|
||||
|
||||
const mangaId = 'a1111111-1111-1111-1111-111111111111';
|
||||
const genreId = 'g0000000-0000-0000-0000-000000000005';
|
||||
const tagId = 't0000000-0000-0000-0000-000000000042';
|
||||
|
||||
async function mockDetail(page: Page) {
|
||||
await page.route('**/api/v1/auth/config', (r) =>
|
||||
r.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ self_register_enabled: true, private_mode: false }) })
|
||||
);
|
||||
await page.route('**/api/v1/auth/me', (r) =>
|
||||
r.fulfill({ status: 401, contentType: 'application/json', body: JSON.stringify({ error: { code: 'unauthenticated', message: 'no' } }) })
|
||||
);
|
||||
await page.route('**/api/v1/auth/me/preferences', (r) =>
|
||||
r.fulfill({ status: 401, contentType: 'application/json', body: '{}' })
|
||||
);
|
||||
await page.route('**/api/v1/me/bookmarks*', (r) =>
|
||||
r.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ items: [], page: { limit: 50, offset: 0, total: 0 } }) })
|
||||
);
|
||||
await page.route(`**/api/v1/mangas/${mangaId}/chapters*`, (r) =>
|
||||
r.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ items: [], page: { limit: 50, offset: 0, total: 0 } }) })
|
||||
);
|
||||
await page.route(`**/api/v1/mangas/${mangaId}/similar`, (r) =>
|
||||
r.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ items: [] }) })
|
||||
);
|
||||
await page.route(`**/api/v1/me/read-progress/${mangaId}`, (r) =>
|
||||
r.fulfill({ status: 404, contentType: 'application/json', body: JSON.stringify({ error: { code: 'not_found', message: 'no' } }) })
|
||||
);
|
||||
await page.route(`**/api/v1/mangas/${mangaId}`, (r) =>
|
||||
r.fulfill({
|
||||
status: 200,
|
||||
contentType: 'application/json',
|
||||
body: JSON.stringify({
|
||||
id: mangaId, title: 'Berserk', status: 'ongoing', alt_titles: [], description: null,
|
||||
cover_image_path: null, created_at: '2026-01-01T00:00:00Z', updated_at: '2026-01-01T00:00:00Z',
|
||||
authors: [],
|
||||
genres: [{ id: genreId, name: 'Fantasy' }],
|
||||
tags: [{ id: tagId, name: 'isekai', added_by: null }],
|
||||
content_warnings: [], chapter_storage_bytes: 0
|
||||
})
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
test('genre and tag chips link to the filtered catalogue', async ({ page }) => {
|
||||
await mockDetail(page);
|
||||
await page.goto(`/manga/${mangaId}`);
|
||||
|
||||
await expect(page.getByTestId(`genre-chip-${genreId}`)).toHaveAttribute(
|
||||
'href',
|
||||
`/?genres=${genreId}`
|
||||
);
|
||||
await expect(page.getByTestId(`tag-chip-${tagId}`)).toHaveAttribute(
|
||||
'href',
|
||||
`/?tags=${tagId}`
|
||||
);
|
||||
});
|
||||
4
frontend/package-lock.json
generated
4
frontend/package-lock.json
generated
@@ -1,12 +1,12 @@
|
||||
{
|
||||
"name": "mangalord-frontend",
|
||||
"version": "0.97.0",
|
||||
"version": "0.98.0",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "mangalord-frontend",
|
||||
"version": "0.97.0",
|
||||
"version": "0.98.0",
|
||||
"devDependencies": {
|
||||
"@lucide/svelte": "^1.16.0",
|
||||
"@playwright/test": "^1.48.0",
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "mangalord-frontend",
|
||||
"version": "0.97.0",
|
||||
"version": "0.98.0",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
|
||||
@@ -426,7 +426,7 @@
|
||||
<div class="chip-row" data-testid="manga-genres">
|
||||
<span class="chip-row-label">Genres</span>
|
||||
{#each genres as g (g.id)}
|
||||
<Chip label={g.name} />
|
||||
<Chip label={g.name} href={`/?genres=${g.id}`} testid={`genre-chip-${g.id}`} />
|
||||
{/each}
|
||||
</div>
|
||||
{/if}
|
||||
@@ -436,6 +436,8 @@
|
||||
{#each tags as t (t.id)}
|
||||
<Chip
|
||||
label={t.name}
|
||||
href={`/?tags=${t.id}`}
|
||||
testid={`tag-chip-${t.id}`}
|
||||
variant="soft"
|
||||
onRemove={session.user && t.added_by === session.user.id
|
||||
? () => removeTag(t)
|
||||
|
||||
Reference in New Issue
Block a user