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

src/routes/list/+page.svelte

@@ -11,9 +11,13 @@
 	import {
 		MalAnimeListQuerySchema,
 		MalAnimeListResponseSchema,
+		MalAnimeListStatusEnum,
 	} from "$lib/types/mal";
 
+	const LIST_QUERY_LIMIT = 1000;
+
 	const ListSearchSchema = MalAnimeListQuerySchema.extend({
+		status: MalAnimeListStatusEnum.or(z.literal("")).default(""),
 		mal: z.string().default(""),
 	}).strict();
 
@@ -44,25 +48,25 @@
 	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.
 	 */
 	async function fetchMalAnimeList(username: string) {
 		const u = username.trim();
 		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(
 			`/api/mal/animelist/${encodeURIComponent(u)}`,
 			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.sort) upstream.searchParams.set("sort", params.sort);
 		if (params.offset !== undefined)
 			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);
 		if (!res.ok) {
@@ -161,8 +165,8 @@
 <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"
 		>/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>
 
 {#if status === "loading"}
@@ -192,7 +196,7 @@
 				{#if isLoadingMal}
 					Fetching MAL list…
 				{:else}
-					MAL entries: {malEntries.length} (limited to 20)
+					MAL entries: {malEntries.length} (limited to {LIST_QUERY_LIMIT})
 				{/if}
 				{" • "}
 				{#if isLoadingDb}