feat: extract built-in view presets and add filter chips

frontend/src/lib/components/view/preset-chips.svelte

@@ -0,0 +1,27 @@
+<script lang="ts">
+	import { BOOK_PRESETS } from '$lib/presets';
+	import { getBookCollectionState } from '$lib/state/bookCollection.svelte';
+
+	const bookCollection = getBookCollectionState();
+</script>
+
+<!--
+	Built-in views, not shelves: a fixed set every library has, so nothing here is
+	named, owned or persisted. The same definitions drive the home page's shelves,
+	so "Recently added" means the same thing in both places.
+-->
+<div class="flex items-center gap-1.5 overflow-x-auto" aria-label="Preset views">
+	{#each BOOK_PRESETS as preset (preset.id)}
+		{@const active = bookCollection.isPresetActive(preset)}
+		<button
+			type="button"
+			aria-pressed={active}
+			onclick={() => (active ? bookCollection.clearView() : bookCollection.applyPreset(preset))}
+			class="shrink-0 rounded-full border px-3 py-1 text-xs whitespace-nowrap transition-colors {active
+				? 'border-primary bg-primary text-primary-foreground font-medium'
+				: 'border-border text-muted-foreground hover:border-muted-foreground hover:text-foreground'}"
+		>
+			{preset.label}
+		</button>
+	{/each}
+</div>