Added and Delete Note Buttons

[Jonimz]

Issue Description

Fixes #1630

• Add issue description
  This update allows users to edit an existing note using the same modal that is used to add a new note.
  When a user clicks Edit, the modal now opens with the note’s:
  Text already filled in

Changes

Added logic so clicking Edit opens the modal with the note’s current information.
Fixed the edit button’s data-* attributes so they match the correct model fields.
If editing, the old note is deleted.
The updated version is saved as a new note.

Note Editing
Go to My Profile under Event List.
Create a note and save
Click Edit on the existing note.
Confirm the updated text appears correctly.
Click save.
Confirm the updated note appears correctly.

[Meatchema]

The looks of the edit and delete buttons are in a bit of an odd position. I think it may be best to have a drop down tab for each note that is present so that the buttons aren't smash together;

I have also recieved this error when trying to click on the edit button for the note.

[ojmakinde]

Looks great, but a few changes were suggested. Also, two things:

• On smaller screens, the Edit and Delete button have no spacing (image below). We can use custom Bootstrap to help with that.

• Secondly, on a large screen, if you add a note that is long enough, the formatting of the Edit and Delete buttons become messed up (image for before and after).

• Lastly, if a note is long enough, the content gets cut half way. In the image example below, I have a write up. When I save the note, not all the content in the write up is saved.

After saving:

[ojmakinde]

Looks great, but a few changes were suggested. Also, two things:

• On smaller screens, the Edit and Delete button have no spacing (image below). We can use custom Bootstrap to help with that.

• Secondly, on a large screen, if you add a note that is long enough, the formatting of the Edit and Delete buttons become messed up (image for before and after).

• Lastly, if a note is long enough, the content gets cut half way. In the image example below, I have a write up. When I save the note, not all the content in the write up is saved.

After saving:

[ojmakinde]

Two last things:

• Currently, if you hit the delete button for a note, there is no modal confirmation for deleting. If a user clicks the Delete button on accident, they may accidentally delete a note. I believe we have delete modals in other places you can import and use.

• Small nit, but the modal stores the content after a note is created. Ideally, the textbox should only keep the text (arguably) if a note is not created. Example below:

Creating a note:

Created note:

Hitting the edit button and reopening the modal:

This should be a brief fix, but if it takes more than an hour or two, I'm fine with either identifying and fixing it, or merging it straight altogether. Great work.

[Meatchema]

Hello, something that I noticed is that the Edit button is about half the size as the delete button which should probably be adjusted. I also tested out how much text can be accepted now that you changed the code from CharField to TextField() as well as changing noteContent to Text. This should allow for extended text but for some reason it doesn't.

I am wondering if you would need to change the code of the box itself so that it expands as the text gets larger.

Next, I tested the button stacking issue and it is no longer there. Nice!

Other than the size of the edit button and the long text issue, all basic functions work.

[Meatchema]

The notes box is now working properly to adjust to longer messages without cuttoffs after submission.

[github-actions]

View Code Coverage

[MImran2002]

requested changes has been implemented. Approved!