fix(planner): exclude current recipe from swap suggestions

Adds excludeRecipeId prop to SwapSuggestionList so the meal being
replaced is not offered as a swap candidate.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit was merged in pull request #45.
This commit is contained in:
2026-04-09 10:38:30 +02:00
parent b4fa3ca23e
commit f0bbb3b009
3 changed files with 24 additions and 2 deletions

View File

@@ -11,6 +11,7 @@
replacingMeta, replacingMeta,
recipes, recipes,
currentWeekRecipeIds, currentWeekRecipeIds,
excludeRecipeId,
isLoading = false, isLoading = false,
onpick, onpick,
oncancel oncancel
@@ -19,11 +20,16 @@
replacingMeta?: string; replacingMeta?: string;
recipes: Recipe[]; recipes: Recipe[];
currentWeekRecipeIds: Set<string>; currentWeekRecipeIds: Set<string>;
excludeRecipeId?: string;
isLoading?: boolean; isLoading?: boolean;
onpick: (recipeId: string, recipeName: string) => void; onpick: (recipeId: string, recipeName: string) => void;
oncancel?: () => void; oncancel?: () => void;
} = $props(); } = $props();
let visibleRecipes = $derived(
excludeRecipeId ? recipes.filter((r) => r.id !== excludeRecipeId) : recipes
);
function recipeMeta(recipe: Recipe): string { function recipeMeta(recipe: Recipe): string {
return [ return [
recipe.cookTimeMin != null ? `${recipe.cookTimeMin} min` : null, recipe.cookTimeMin != null ? `${recipe.cookTimeMin} min` : null,
@@ -60,7 +66,7 @@
</p> </p>
<!-- Recipe list --> <!-- Recipe list -->
{#if recipes.length === 0} {#if visibleRecipes.length === 0}
<p <p
data-testid="swap-empty-state" data-testid="swap-empty-state"
style="text-align: center; color: var(--color-text-muted); font-family: var(--font-sans); margin: 0;" style="text-align: center; color: var(--color-text-muted); font-family: var(--font-sans); margin: 0;"
@@ -68,7 +74,7 @@
Keine Rezepte verfügbar. Keine Rezepte verfügbar.
</p> </p>
{:else} {:else}
{#each recipes as recipe (recipe.id)} {#each visibleRecipes as recipe (recipe.id)}
{@const meta = recipeMeta(recipe)} {@const meta = recipeMeta(recipe)}
{@const alreadyPlanned = currentWeekRecipeIds.has(recipe.id)} {@const alreadyPlanned = currentWeekRecipeIds.has(recipe.id)}
<div <div

View File

@@ -74,6 +74,20 @@ describe('SwapSuggestionList', () => {
expect(screen.getByTestId('swap-empty-state')).toBeTruthy(); expect(screen.getByTestId('swap-empty-state')).toBeTruthy();
}); });
it('excludes the recipe being replaced when excludeRecipeId is provided', () => {
render(SwapSuggestionList, { props: { ...baseProps, excludeRecipeId: 'r2' } });
expect(screen.queryByText('Chicken stir-fry')).toBeNull();
expect(screen.getByText('Quick carbonara')).toBeTruthy();
expect(screen.getByText('Mushroom risotto')).toBeTruthy();
});
it('shows all recipes when excludeRecipeId is not provided', () => {
render(SwapSuggestionList, { props: baseProps });
expect(screen.getByText('Quick carbonara')).toBeTruthy();
expect(screen.getByText('Chicken stir-fry')).toBeTruthy();
expect(screen.getByText('Mushroom risotto')).toBeTruthy();
});
it('disables all Wählen buttons when isLoading is true', () => { it('disables all Wählen buttons when isLoading is true', () => {
render(SwapSuggestionList, { props: { ...baseProps, isLoading: true } }); render(SwapSuggestionList, { props: { ...baseProps, isLoading: true } });
const buttons = screen.getAllByRole('button', { name: /Wählen/i }); const buttons = screen.getAllByRole('button', { name: /Wählen/i });

View File

@@ -309,6 +309,7 @@
replacingMeta={replacingMeta || undefined} replacingMeta={replacingMeta || undefined}
recipes={sortedRecipes} recipes={sortedRecipes}
{currentWeekRecipeIds} {currentWeekRecipeIds}
excludeRecipeId={selectedSlot.recipe?.id}
isLoading={swapLoading} isLoading={swapLoading}
onpick={handleSwapPick} onpick={handleSwapPick}
oncancel={() => (swapSheetOpen = false)} oncancel={() => (swapSheetOpen = false)}
@@ -549,6 +550,7 @@
replacingMeta={replacingMeta || undefined} replacingMeta={replacingMeta || undefined}
recipes={sortedRecipes} recipes={sortedRecipes}
{currentWeekRecipeIds} {currentWeekRecipeIds}
excludeRecipeId={pickerSlot.recipe.id}
onpick={handleRecipePick} onpick={handleRecipePick}
/> />
</div> </div>