Delete Workout

[EmmaDir]

Value proposition

As a user I want to be able to delete workouts that are no longer relevant, so that I can maintain a clean and organised workouts list, ensuring it’s always up to date.

Description

Acceptance criteria

• [x] The workouts list page includes an easily accessible delete option for each workout.
• [x] Clicking the delete option triggers a confirmation dialog.
• [x] The dialog serves to prevent accidental deletions by asking the user to confirm their intention.
• [x] The dialog includes options for both confirming the deletion and cancelling the action.
• [x] The cancellation option allows the user to back out of the deletion process if selected by mistake or if they change their mind.
• [x] Upon confirming the deletion, the workout is removed from the list and a success message is displayed.
• [x] If all workouts are deleted, a message appears indicating that there are no workouts and providing an option to create new ones.

Tasks

• [x] Create feature branch feature/delete-workout
• [x] -----
• [x] In the WorkoutsList component, add a delete button for each list item
• [x] Clicking the button opens a confirm pop up with the options confirm and cancel
• [x] Clicking the cancel button hides the pop up
• [x] The WorkoutsList component needs to receive a new prop called onDeleteWorkout
• [x] Pass it to the confirm button as onClick prop
• [x] Pass the workout's id to onDeleteWorkout as argument
• [x] In pages/workouts/index.js, write a function handleDeleteWorkout, which accepts an id as parameter. The function should filter the workouts state and keep all objects except the one with the given id
• [x] Pass handleDeleteWorkout to the List component as onDeleteWorkout prop

[MerleMak]

The Acceptance criteria tak about a dialoge that open ton confirm the delete process, please add this to the tasks as well. The dialog window is also called a "Modal" you can import a libary ffor that or write one yourself, i recommend writing one but don't forget to make it accessible :)