marcel/mealprep
1
0
Fork 0
Code Issues 22 Pull Requests Actions Packages Projects Releases Wiki Activity

feat(planner): add onremove prop and Entfernen button to MealActionSheet

Browse Source 
Button only renders when onremove callback is provided, keeping the
component usable in read-only contexts without the destructive action.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel Raddatz
2026-04-09 12:25:22 +02:00
parent cb921b3c0f
commit f55d938b32
2 changed files with 30 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
frontend/src/lib/planner/MealActionSheet.test.ts
View File

@@ -13,7 +13,8 @@ const baseProps = {
open: true,
slot,
onswap: vi.fn(),
oncancel: vi.fn()
oncancel: vi.fn(),
onremove: vi.fn()
};
describe('MealActionSheet', () => {
@@ -28,14 +29,29 @@ describe('MealActionSheet', () => {
expect(screen.getByText(/easy/i)).toBeTruthy();
});
it('renders all 4 action buttons', () => {
it('renders all 5 action buttons', () => {
render(MealActionSheet, { props: baseProps });
expect(screen.getByRole('button', { name: /Gericht tauschen/i })).toBeTruthy();
expect(screen.getByRole('link', { name: /Jetzt kochen/i })).toBeTruthy();
expect(screen.getByRole('link', { name: /Rezept ansehen/i })).toBeTruthy();
expect(screen.getByRole('button', { name: /Entfernen/i })).toBeTruthy();
expect(screen.getByRole('button', { name: /Abbrechen/i })).toBeTruthy();
});
it('clicking Entfernen calls onremove', async () => {
const onremove = vi.fn();
const user = userEvent.setup();
render(MealActionSheet, { props: { ...baseProps, onremove } });
await user.click(screen.getByRole('button', { name: /Entfernen/i }));
expect(onremove).toHaveBeenCalledOnce();
});
it('does not render Entfernen button when onremove is not provided', () => {
const { onremove: _, ...propsWithoutRemove } = baseProps;
render(MealActionSheet, { props: propsWithoutRemove });
expect(screen.queryByRole('button', { name: /Entfernen/i })).toBeNull();
});
it('Jetzt kochen links to the cook route', () => {
render(MealActionSheet, { props: baseProps });
const link = screen.getByRole('link', { name: /Jetzt kochen/i });