From 853019075d03989c176569f17e224384c40ceb7c Mon Sep 17 00:00:00 2001
From: Piotr Oleszczyk <piotr@oleszczyk.eu>
Date: Sat, 28 Feb 2026 12:57:56 +0100
Subject: [PATCH] fix: remove AM/PM filter from routines, add keyed each blocks
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Remove the All/AM/PM filter buttons and part_of_day param from
the routines list page — date-based sorting/filtering is preferred.

Add missing keyed {#each} blocks across all pages to follow
Svelte 5 best practice (dashboard, products, medications,
lab results, routines list and detail, skin).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 frontend/src/routes/+page.svelte              |  4 +--
 .../routes/health/lab-results/+page.svelte    |  6 ++---
 .../routes/health/medications/+page.svelte    |  4 +--
 frontend/src/routes/products/+page.svelte     |  6 ++---
 frontend/src/routes/routines/+page.server.ts  |  5 ++--
 frontend/src/routes/routines/+page.svelte     | 25 +------------------
 .../src/routes/routines/[id]/+page.svelte     |  4 +--
 7 files changed, 15 insertions(+), 39 deletions(-)

diff --git a/frontend/src/routes/+page.svelte b/frontend/src/routes/+page.svelte
index 0947393..6bd0dac 100644
--- a/frontend/src/routes/+page.svelte
+++ b/frontend/src/routes/+page.svelte
@@ -44,7 +44,7 @@
 						{/if}
 						{#if s.active_concerns.length}
 							<div class="flex flex-wrap gap-1">
-								{#each s.active_concerns as concern}
+								{#each s.active_concerns as concern (concern)}
 									<Badge variant="secondary">{concern.replace(/_/g, ' ')}</Badge>
 								{/each}
 							</div>
@@ -67,7 +67,7 @@
 			<CardContent>
 				{#if data.recentRoutines.length}
 					<ul class="space-y-2">
-						{#each data.recentRoutines as routine}
+						{#each data.recentRoutines as routine (routine.id)}
 							<li class="flex items-center justify-between">
 								<a href="/routines/{routine.id}" class="text-sm hover:underline">
 									{routine.routine_date}
diff --git a/frontend/src/routes/health/lab-results/+page.svelte b/frontend/src/routes/health/lab-results/+page.svelte
index 17e77f5..6c3e102 100644
--- a/frontend/src/routes/health/lab-results/+page.svelte
+++ b/frontend/src/routes/health/lab-results/+page.svelte
@@ -68,7 +68,7 @@
 			<SelectTrigger class="w-32">{filterFlag || 'All'}</SelectTrigger>
 			<SelectContent>
 				<SelectItem value="">All</SelectItem>
-				{#each flags as f}
+				{#each flags as f (f)}
 					<SelectItem value={f}>{f}</SelectItem>
 				{/each}
 			</SelectContent>
@@ -111,7 +111,7 @@
 							<SelectTrigger>{selectedFlag || 'None'}</SelectTrigger>
 							<SelectContent>
 								<SelectItem value="">None</SelectItem>
-								{#each flags as f}
+								{#each flags as f (f)}
 									<SelectItem value={f}>{f}</SelectItem>
 								{/each}
 							</SelectContent>
@@ -138,7 +138,7 @@
 				</TableRow>
 			</TableHeader>
 			<TableBody>
-				{#each data.results as r}
+				{#each data.results as r (r.id)}
 					<TableRow>
 						<TableCell class="text-sm">{r.collected_at.slice(0, 10)}</TableCell>
 						<TableCell class="font-medium">{r.test_name_original ?? r.test_code}</TableCell>
diff --git a/frontend/src/routes/health/medications/+page.svelte b/frontend/src/routes/health/medications/+page.svelte
index 412b237..188ffcf 100644
--- a/frontend/src/routes/health/medications/+page.svelte
+++ b/frontend/src/routes/health/medications/+page.svelte
@@ -54,7 +54,7 @@
 						<Select type="single" value={kind} onValueChange={(v) => (kind = v)}>
 							<SelectTrigger>{kind}</SelectTrigger>
 							<SelectContent>
-								{#each kinds as k}
+								{#each kinds as k (k)}
 									<SelectItem value={k}>{k}</SelectItem>
 								{/each}
 							</SelectContent>
@@ -81,7 +81,7 @@
 	{/if}
 
 	<div class="space-y-3">
-		{#each data.medications as med}
+		{#each data.medications as med (med.id)}
 			<div class="rounded-md border border-border px-4 py-3">
 				<div class="flex items-center justify-between">
 					<div class="flex items-center gap-3">
diff --git a/frontend/src/routes/products/+page.svelte b/frontend/src/routes/products/+page.svelte
index 243ce20..f3a4573 100644
--- a/frontend/src/routes/products/+page.svelte
+++ b/frontend/src/routes/products/+page.svelte
@@ -51,7 +51,7 @@
 			</SelectTrigger>
 			<SelectContent>
 				<SelectItem value="">All categories</SelectItem>
-				{#each categories as cat}
+				{#each categories as cat (cat)}
 					<SelectItem value={cat}>{cat.replace(/_/g, ' ')}</SelectItem>
 				{/each}
 			</SelectContent>
@@ -70,7 +70,7 @@
 				</TableRow>
 			</TableHeader>
 			<TableBody>
-				{#each data.products as product}
+				{#each data.products as product (product.id)}
 					<TableRow class="cursor-pointer hover:bg-muted/50">
 						<TableCell>
 							<a href="/products/{product.id}" class="font-medium hover:underline">
@@ -83,7 +83,7 @@
 						</TableCell>
 						<TableCell>
 							<div class="flex flex-wrap gap-1">
-								{#each product.targets.slice(0, 3) as t}
+								{#each product.targets.slice(0, 3) as t (t)}
 									<Badge variant="secondary" class="text-xs">{t.replace(/_/g, ' ')}</Badge>
 								{/each}
 								{#if product.targets.length > 3}
diff --git a/frontend/src/routes/routines/+page.server.ts b/frontend/src/routes/routines/+page.server.ts
index a8044d4..92710e7 100644
--- a/frontend/src/routes/routines/+page.server.ts
+++ b/frontend/src/routes/routines/+page.server.ts
@@ -2,10 +2,9 @@ import { getRoutines } from '$lib/api';
 import type { PageServerLoad } from './$types';
 
 export const load: PageServerLoad = async ({ url }) => {
-	const part_of_day = url.searchParams.get('part_of_day') ?? undefined;
 	const from_date = url.searchParams.get('from_date') ?? recentDate(30);
-	const routines = await getRoutines({ from_date, part_of_day });
-	return { routines, part_of_day };
+	const routines = await getRoutines({ from_date });
+	return { routines };
 };
 
 function recentDate(daysAgo: number): string {
diff --git a/frontend/src/routes/routines/+page.svelte b/frontend/src/routes/routines/+page.svelte
index ad71de5..4a8e5fa 100644
--- a/frontend/src/routes/routines/+page.svelte
+++ b/frontend/src/routes/routines/+page.svelte
@@ -2,14 +2,9 @@
 	import type { PageData } from './$types';
 	import { Badge } from '$lib/components/ui/badge';
 	import { Button } from '$lib/components/ui/button';
-	import { goto } from '$app/navigation';
 
 	let { data }: { data: PageData } = $props();
 
-	function filterPod(pod: string) {
-		goto(pod ? `/routines?part_of_day=${pod}` : '/routines');
-	}
-
 	// Group by date
 	const byDate = $derived(
 		data.routines.reduce(
@@ -34,25 +29,7 @@
 		<Button href="/routines/new">+ New routine</Button>
 	</div>
 
-	<div class="flex gap-2">
-		<Button
-			variant={!data.part_of_day ? 'default' : 'outline'}
-			size="sm"
-			onclick={() => filterPod('')}
-		>All</Button>
-		<Button
-			variant={data.part_of_day === 'am' ? 'default' : 'outline'}
-			size="sm"
-			onclick={() => filterPod('am')}
-		>AM</Button>
-		<Button
-			variant={data.part_of_day === 'pm' ? 'default' : 'outline'}
-			size="sm"
-			onclick={() => filterPod('pm')}
-		>PM</Button>
-	</div>
-
-	{#if sortedDates.length}
+{#if sortedDates.length}
 		<div class="space-y-4">
 			{#each sortedDates as date}
 				<div>
diff --git a/frontend/src/routes/routines/[id]/+page.svelte b/frontend/src/routes/routines/[id]/+page.svelte
index f1d5235..155fecc 100644
--- a/frontend/src/routes/routines/[id]/+page.svelte
+++ b/frontend/src/routes/routines/[id]/+page.svelte
@@ -65,7 +65,7 @@
 									{/if}
 								</SelectTrigger>
 								<SelectContent>
-									{#each products as p}
+									{#each products as p (p.id)}
 										<SelectItem value={p.id}>{p.name} ({p.brand})</SelectItem>
 									{/each}
 								</SelectContent>
@@ -90,7 +90,7 @@
 
 		{#if routine.steps.length}
 			<div class="space-y-2">
-				{#each routine.steps.toSorted((a, b) => a.order_index - b.order_index) as step}
+				{#each routine.steps.toSorted((a, b) => a.order_index - b.order_index) as step (step.id)}
 					<div class="flex items-center justify-between rounded-md border border-border px-4 py-3">
 						<div class="flex items-center gap-3">
 							<span class="text-xs text-muted-foreground w-4">{step.order_index + 1}</span>