From 055ae11fa3bc3c80678489a7edfb690edefd7f9b Mon Sep 17 00:00:00 2001
From: Marcel Raddatz <marcel@raddatz.cloud>
Date: Thu, 9 Apr 2026 12:54:31 +0200
Subject: [PATCH] feat(planner): show yellow neutral badge for scoreDelta = 0
 in RecipePicker

Neutral suggestions (no variety impact) now show "= 0.0 Punkte" in yellow
instead of no badge, making the three states explicit: green (improves),
yellow (neutral), red (worsens).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 frontend/src/lib/planner/RecipePicker.svelte  | 8 ++++++++
 frontend/src/lib/planner/RecipePicker.test.ts | 6 ++++--
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/frontend/src/lib/planner/RecipePicker.svelte b/frontend/src/lib/planner/RecipePicker.svelte
index 5f3f90e..1b73409 100644
--- a/frontend/src/lib/planner/RecipePicker.svelte
+++ b/frontend/src/lib/planner/RecipePicker.svelte
@@ -120,6 +120,14 @@
 						>
 							↓ {(suggestion.scoreDelta ?? 0).toFixed(1)} Punkte
 						</span>
+					{:else}
+						<span
+							data-testid="badge-{suggestion.recipe.id}"
+							data-type="neutral"
+							style="display: inline-block; margin-top: 3px; font-size: 9px; font-weight: 500; padding: 1px 5px; border-radius: 3px; background: var(--yellow-tint); color: var(--yellow-text);"
+						>
+							= {(suggestion.scoreDelta ?? 0).toFixed(1)} Punkte
+						</span>
 					{/if}
 				</div>
 				<button
diff --git a/frontend/src/lib/planner/RecipePicker.test.ts b/frontend/src/lib/planner/RecipePicker.test.ts
index 7e44fe3..6bdfbca 100644
--- a/frontend/src/lib/planner/RecipePicker.test.ts
+++ b/frontend/src/lib/planner/RecipePicker.test.ts
@@ -99,12 +99,14 @@ describe('RecipePicker', () => {
 		expect(screen.getByText(/Keine Treffer/i)).toBeTruthy();
 	});
 
-	it('shows no badge when scoreDelta is zero (neutral, no improvement)', () => {
+	it('shows yellow neutral badge when scoreDelta is zero', () => {
 		const neutralSuggestions = [
 			{ recipe: { id: 'sn', name: 'Neutrales Rezept', effort: 'easy', cookTimeMin: 20 }, scoreDelta: 0.0, hasConflict: false }
 		];
 		render(RecipePicker, { props: { ...baseProps, suggestions: neutralSuggestions } });
-		expect(screen.queryByTestId('badge-sn')).toBeNull();
+		const badge = screen.getByTestId('badge-sn');
+		expect(badge.getAttribute('data-type')).toBe('neutral');
+		expect(badge.textContent).toContain('0.0');
 	});
 
 	it('shows loading skeleton instead of Empfohlen section when isLoading is true', () => {