From f6febfdb5e1ec221c892803a781a6309b8ad0adc Mon Sep 17 00:00:00 2001
From: Admin <admin@kalekber.cc>
Date: Wed, 4 Mar 2026 00:40:46 +0500
Subject: [PATCH] fix(ui/browse): use value prop on select elements to fix
 filter state
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Replace selected={data.x === opt.value} on individual <option> elements
with value={data.x} on the <select> — the idiomatic Svelte approach that
ensures correct hydration and form submission of the current filter values.
---
 ui/src/routes/browse/+page.svelte | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/ui/src/routes/browse/+page.svelte b/ui/src/routes/browse/+page.svelte
index 80544c8..4fbd4a5 100644
--- a/ui/src/routes/browse/+page.svelte
+++ b/ui/src/routes/browse/+page.svelte
@@ -91,28 +91,31 @@
 
 	<select
 		name="genre"
+		value={data.genre}
 		class="bg-zinc-800 border border-zinc-700 text-zinc-200 text-sm rounded px-3 py-1.5 focus:outline-none focus:border-amber-400"
 	>
 		{#each genres as g}
-			<option value={g.value} selected={data.genre === g.value}>{g.label}</option>
+			<option value={g.value}>{g.label}</option>
 		{/each}
 	</select>
 
 	<select
 		name="sort"
+		value={data.sort}
 		class="bg-zinc-800 border border-zinc-700 text-zinc-200 text-sm rounded px-3 py-1.5 focus:outline-none focus:border-amber-400"
 	>
 		{#each sorts as s}
-			<option value={s.value} selected={data.sort === s.value}>{s.label}</option>
+			<option value={s.value}>{s.label}</option>
 		{/each}
 	</select>
 
 	<select
 		name="status"
+		value={data.status}
 		class="bg-zinc-800 border border-zinc-700 text-zinc-200 text-sm rounded px-3 py-1.5 focus:outline-none focus:border-amber-400"
 	>
 		{#each statuses as st}
-			<option value={st.value} selected={data.status === st.value}>{st.label}</option>
+			<option value={st.value}>{st.label}</option>
 		{/each}
 	</select>