Edit Ingredient with Flavour Profile

As a user, I want to edit an existing ingredient and its associated flavour profiles to update or correct information. As a culinary enthusiast,

Description

Acceptance Criteria:

An edit button should be provided within the list
When the edit button is clicked, display a form pre-populated with the current details of the ingredient and its flavour profiles.
It should allow the users to modify the ingredient name and any of its flavour profiles
Should validate that the updated ingredient name is not empty.
Upon submission it should update the ingredient and its flavour profiles in the collection.
It should provide a feedback to the user upon the succesful update.

Tasks

Create feature branch feature edit-ingredients.
Add Edit Button to Ingredient List Component IngredientList:
Create Edit Ingredient Form Component EditIngredientForm:
Populate Form with Current Details:
Implement logic handleEditSubmit to validate inputs and update the ingredient details upon successful submission.
Update the application state ingredients to reflect the changes made to the ingredient and its flavour profiles.

Hi there,

as a value proposition you can use what was already given:

As a culinary enthusiast,

I want to edit the details of an ingredient and its flavour profile in the app,

so that I correct any inaccuracies and contribute to the quality and reliability of the app's content.

The same goes for the AC, using the existing ones is a lot less work and they are more precise.

- The ingredient details page includes an easily accessible "Edit" link.
- Clicking "Edit" opens a new "edit" page displaying the edit form.
- The form is pre-filled with the ingredient's existing details for modification.
- The form allows for edits to all ingredient aspects including
  - `ingredient name`,
  - `ingredient image url`,
  - `flavour tags` dropdown.
- If no image is added, a placeholder image is used.
- The form section includes options for both saving and cancelling the action.
- The cancellation option allows the user to back out of the edit process if selected by mistake or changed mind. The user is then redirected to the ingredients details page.
- Submissions with empty required fields are blocked, with validation messages guiding completion.
- Changes are saved and reflected in the ingredient list upon submitting the form.
- After submitting, the user is redirected to the ingredients details page.

Please take the VP and the AC as the basis of the User Story and only make changes when needed.

Your main task is to create the wireframes and the tasks for the User Story. Your wireframes match the given Acceptance Criteria better than the ones you noted down. So please adapt the VP and the AC.

Once that is done, this User Story is approved ✅

Cheers ✌️

ndrbn0 / Flavion