17. implement toast notifications on all messages not requiring user input

[NickRoccodev11]

Description

This code changes all messages that do not require user input to toast notifications via the react-toastify library. This includes:

• alert messages
• messages handled as state and rendered as elements (like <p> or <span> tags )

In addition, the listName input now clears after submission of a new list name, and padding was added to the bottom of the "share list" div temporarily to make it visible for testing.

Related Issue

closes #48

Acceptance Criteria

-All messages that do not require a user response should now appear as toast notifications
-The listName state and associated input should be cleared after submitting a list name

Type of Changes

refactoring
bug fix

Updates

After

Testing Steps / QA Criteria

• after pulling, you must install react-toastify: npm install --save react-toastify
• perform any/all actions that trigger a message that does not require user response, such as:

1. success/ failure creating a list
2. success/ failure purchasing an item
3. success/ failure/ warning when trying to add an item to the list (try entering an empty list)
4. success/ failure sharing list with others

[github-actions]

Visit the preview URL for this PR (updated for commit 528294f):

https://tcl-74-smart-shopping-list--pr49-nr-toastnotification-17hzy50a.web.app

_{(expires Fri, 11 Oct 2024 19:19:29 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: 79d73546692f99aad8468c28e36db434e2c190ac}

[dterceroparker]

I tested it and it looks great! Wohoo! Great work!

[shuveksha-tuladhar]

Looks good!!