CaZzzer/amqtrain
1
0
Fork 0
Code Issues 13 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

list page pt. 3 up list query limit and enable filtering by status

Browse Source
This commit is contained in:
Yura
2026-02-05 20:23:39 -08:00
parent ffc3bbfa37
commit fe48d3dbf7
1 changed files with 11 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/routes/list/+page.svelte
View File

@@ -11,9 +11,13 @@
import { import {
MalAnimeListQuerySchema, MalAnimeListQuerySchema,
MalAnimeListResponseSchema, MalAnimeListResponseSchema,
MalAnimeListStatusEnum,
} from "$lib/types/mal"; } from "$lib/types/mal";
const LIST_QUERY_LIMIT = 1000;
const ListSearchSchema = MalAnimeListQuerySchema.extend({ const ListSearchSchema = MalAnimeListQuerySchema.extend({
status: MalAnimeListStatusEnum.or(z.literal("")).default(""),
mal: z.string().default(""), mal: z.string().default(""),
}).strict(); }).strict();
@@ -44,25 +48,25 @@
let songRows = $state<SongRow[]>([]); let songRows = $state<SongRow[]>([]);
/** /**
* Fetch MAL animelist (limited to 20 for now). * Fetch MAL animelist (limited to LIST_QUERY_LIMIT for now).
* Uses zod schema parsing to avoid redefining types. * Uses zod schema parsing to avoid redefining types.
*/ */
async function fetchMalAnimeList(username: string) { async function fetchMalAnimeList(username: string) {
const u = username.trim(); const u = username.trim();
if (!u) return null; if (!u) return null;
// Always limit to 20 for now; we'll add pagination later. // Always limit to LIST_QUERY_LIMIT for now; we'll add pagination later.
const upstream = new URL( const upstream = new URL(
`/api/mal/animelist/${encodeURIComponent(u)}`, `/api/mal/animelist/${encodeURIComponent(u)}`,
window.location.origin, window.location.origin,
); );
// Forward optional query params (status/sort/offset) while forcing limit=20 // Forward optional query params (status/sort/offset) while forcing limit=LIST_QUERY_LIMIT
if (params.status) upstream.searchParams.set("status", params.status); if (params.status) upstream.searchParams.set("status", params.status);
if (params.sort) upstream.searchParams.set("sort", params.sort); if (params.sort) upstream.searchParams.set("sort", params.sort);
if (params.offset !== undefined) if (params.offset !== undefined)
upstream.searchParams.set("offset", String(params.offset)); upstream.searchParams.set("offset", String(params.offset));
upstream.searchParams.set("limit", "20"); upstream.searchParams.set("limit", LIST_QUERY_LIMIT.toString());
const res = await fetch(upstream); const res = await fetch(upstream);
if (!res.ok) { if (!res.ok) {
@@ -161,8 +165,8 @@
<p class="mt-2 text-sm text-muted-foreground"> <p class="mt-2 text-sm text-muted-foreground">
Enter a MAL username in the URL as <code class="rounded bg-muted px-1 py-0.5" Enter a MAL username in the URL as <code class="rounded bg-muted px-1 py-0.5"
>/list?mal=USERNAME</code >/list?mal=USERNAME</code
>. This will fetch up to 20 anime from MAL (for now) and then query your local >. This will fetch up to {LIST_QUERY_LIMIT} anime from MAL (for now) and then query
client DB for related songs. your local client DB for related songs.
</p> </p>
{#if status === "loading"} {#if status === "loading"}
@@ -192,7 +196,7 @@
{#if isLoadingMal} {#if isLoadingMal}
Fetching MAL list… Fetching MAL list…
{:else} {:else}
MAL entries: {malEntries.length} (limited to 20) MAL entries: {malEntries.length} (limited to {LIST_QUERY_LIMIT})
{/if} {/if}
{" • "} {" • "}
{#if isLoadingDb} {#if isLoadingDb}