24. Edit Item names

[sillytsundere]

Summary

After Users have added items to a list, the User will be able to edit the item names from the List component.

Acceptance Criteria

• the List page has a button/icon on each list item that indicates to users they can click to edit the item
• Clicking the edit item button opens a modal with a label, text box and submit button that allows users to edit the item name
• After users type in a new name and click submit they are alerted that the name has been updated and the modal closes, users can observe the updated item name on the List page
  • consider accessibility in the modal window for desktop and mobile users with and without assistive technologies
  • we might also want to add a cancel button on the modal to exit out?
• the firebase.js file nas a new EditItem function which edits the Item name in the firebase database

Stretch Goal

• When users click the edit item button on the List page, the modal that appears also has an input allowing users to edit the NextPurchaseDate
• Similar to when Adding an Item to a List, this input contains selections for soon - 7 days, kind of soon - 14 days and not soon - 30 days, selecting one of these
• Selecting one of these will change the next purchase date in the database to the given number of days from the current day
• the EditItem function in the firebase.js file also edits the NextPurchaseDate
  • Potential choice; when adding this functionality, the EditItem function will not require the User to enter both a new name and a new NextPurchaseDate, but one of either will be required

Notes

Ensure that the EditItem function does not edit the item name to an empty string when updating the NextPurchaseDate only, and ensure the function also does not edit the NextPurchaseDate to null when updating the item name only, if we choose to make only one required.

Also important to note is the purpose of implementing this functionality. After this idea was introduced, mentors suggested that users could simply just delete the item they no longer want and add a new one to the list instead of editing the name of the item. Consider the scenarios in which a user would want to edit the name of an item. If Users wanted to edit the purchase urgency of an item, they could similarly delete it and create a new item with the desired purchase urgency.