Edit Mission Personnel

[rtate2]

User Story

As a user, I should be able to edit Mission Personnel.

Acceptance Criteria

GIVEN the user is logged in and visits the Mission page WHEN the appropriate mission is selected and user clicks the edit button on the card THEN a modal will pop up with pre-populated fields for the individual personnel

WHEN the save button is clicked THEN the updated object is sent to firebase AND the DOM is updated

Dev Notes

• Create an (updateMissionPersonnel) axios.put call in the helpers/data/missionPersonnelData.js file that allows the user to edit mission personnel by missionId to firebase and the DOM

• to Pre-populate the form, get the mission personnel by missionId.

• Need a getMissionPersonnelById(missionId) function that takes a missionId as a parameter and resolves one single mission personnel object

• import updateMissionPersonnel into missionPersonnel.js, and then pass it through a function updateMissionPersonnelFromModal that takes the value of the form inputs on the modal, and creates a new object that will be passed through updateMissionPersonnel(updatedMissionPersonnel).

• After the object is edited and the edits are pushed up to firebase via the function above, call the createMissionPersonnelCard function in the .then of updateMissionPersonnelFromModal to reprint the cards on the page

• Create an event listener that targets the id of the "Save" button from the modal, and calls updateMissionPersonnelFromModal on click of the "Save" button

[rtate2]

Example Edit button mockup

[gregkorte]

In dev notes: Remember, you are getting these personnel by missionId. Also, I didn't see anywhere where you are deleting the records if you de-select them on edit.