Luis add remove descriptions to warning component

[luisarevalo21]

Description

Add and Delete descriptions.
Integrate the component into the existing warnings component, which reflects the changes.

Related PRS (if any):

This frontend PR is related to the #791 backend PR.

Main changes explained:

• Created a modal which displays the current warnings description which is called warnings tracker.
• Upon opening the modal, Owners can toggle if the warning is active or not, by clicking the "+" or the "-".
• If disabled the warning, will appear grey and no longer appear inside of the warning tracker, and warnings can no longer be assigned.
• Reactivating will display the warning and warnings can be assigned.
• Deleting a warning will trigger a modal, warning the owner, deleting will delete the warning and all associated warnings to it, which will delete from every user.

How to test:

1. check into current branch
2. do npm install and npm run start:local to run this PR locally
3. Log in as an owner, no other user's will be able to view the "+/-" button
4. Once logged in, click the "+/-" button to view the modal.
5. deactivate a warning and view a users' warnings, the activated warning no longer appears
6. Reactivate the warning and will appear inside of the users' list
7. Each button, has a hover state, and review each styling/ text for errors.
8. Next, click "add warning tracker" an input will appear allowing you to add a new warning.
9. Add a warning, and click submit.
10. Attempt to add the same one and the app will prevent duplication warnings.,
11. Next add a few warnings using the new one assigned to at least 2 users (remember their names!)
12. View the user's and see they were assigned warnings
13. Next delete the newly, created warning.
14. Click the "x" to delete and a second modal will appearing asking you are you sure.
15. Delete the warning the the warning will no longer appear.
16. Recreate the warning, and view the user's warnings for that newly created warning, the warnigns should have reset.

Screenshots or videos of changes:

Initial startup
https://github.com/OneCommunityGlobal/HighestGoodNetworkApp/assets/22454953/cf9c4702-09b7-4976-9267-c8d187e087b0

adding warning
https://github.com/OneCommunityGlobal/HighestGoodNetworkApp/assets/22454953/6cc14b9e-28c5-40c7-9bd8-aa00d1647163

activating/deactivating warning
https://github.com/OneCommunityGlobal/HighestGoodNetworkApp/assets/22454953/d38743b2-b3cd-4f8a-a3bf-f525ef68c608

deleting warning
https://github.com/OneCommunityGlobal/HighestGoodNetworkApp/assets/22454953/b48d27da-a486-468f-b966-e77d8dac48e5

Note:

Include the information the reviewers need to know.

[YHX6]

Hi, I tested the add/update/delete features and they worked as described.

Screen.Recording.2024-03-09.at.6.10.06.PM.mov

But as for the add function, it will prevent duplicates but not for the ones with empty spaces. For example, when I try to add "Test1" for the second time, it will prevent me from doing it. But if I add "Test1 "(with an empty space), it will allow me to do it. But it looks the same in the page when it has empty space following it.

Screen.Recording.2024-03-09.at.6.14.01.PM.mov

[luisarevalo21]

Hi, I tested the add/update/delete features and they worked as described.

Screen.Recording.2024-03-09.at.6.10.06.PM.mov
But as for the add function, it will prevent duplicates but not for the ones with empty spaces. For example, when I try to add "Test1" for the second time, it will prevent me from doing it. But if I add "Test1 "(with an empty space), it will allow me to do it. But it looks the same in the page when it has empty space following it.

Screen.Recording.2024-03-09.at.6.14.01.PM.mov

Hello @YHX6
Thanks for catching that bug!
I added a fix, by calling a trim when typing the value into the input field. I tested it by adding another "Test" and an error appeared preventing me from adding a duplicate warning.

[20chen-7]

left review at the backend