Teacher View: Event Creation

[h0ethan04]

Description

Last sprint, we implemented the flow for creating classes -- now it's time to apply the same to the events.

READ ALL INSTRUCTIONS BEFORE STARTING

• Note:
  • When working on the frontend, we want to work from making sure the site is responsive starting from a mobile device (this will make it easier when we modifying the styling for bigger screens)
  • When checking how the frontend looks on a mobile device through chrome's inspect element, be sure to select iPhone SE for test!!!
• Heads up:

  • Feel free to utilize /client/src/components/playground/Playground.jsx to test out anything before putting it in their respective pages, or if there currently is no respective page

  • When prompted to log in, you can sign in with the account:

  • student:

    • [email protected]
    • 123456

  • teacher:

    • [email protected]
    • 123456

  • admin:

    • [email protected]
    • 123456

Instructions

• Before we start on the frontend, we need to implement drafts for events. Use pgadmin to add a new column to the events table -- add a column called is_draft of type boolean, then modify the events.sql file to reflect this change. See the database figma for more details.
• Update the PUT backend route to update the event's is_draft attribute as well.
• Update the current drafts tab to also display the draft events.
• If the teacher is on the events page and clicks the "createItem" button (that plus sign in the bottom right) it should open a controller modal.
• The controller modal should default to opening a new Create Event form.
• On submission of the form (with all input fields validated) it should open a confirmation modal
• If the user chooses to publish, redirect back to the bookings page
• If the user chooses not to publish, return back to the form
• Save event as draft should insert the event into the database as a draft
• There is already a create event form implemented so your job is to detect if the currently opened tab is the event tab and if so, make the button open the form.

- might add some more bug fixes here from your previous PR if any are found

Notes

If you have any questions about design, please reach out to Claire from the design team.

• you can grab the role from the AuthContext, there is a role variable there to determine if the current user is a teacher

Acceptance Criteria

• matches mid-fi design
• option to create events should only appear on teacher accounts
• on submission of the event creation form (with all field validated) a confirmation modal should open on top of the form
• if the user confirms that they want to publish the event they will be redirected to the bookings page and the event will be created
• if the user chooses not to publish the event from the confirmation modal they will return back to the form and be able to continue editing
• if the user decides to save the event as a draft it will be saved as a draft and will appear in the drafts section alongside the draft classes

Resources

[Priyansh4444]

Questions:
Is this in the "bookings" page or "create-events" page or do we make a new page
is it a modal similar to our old modal where we made one for creating class, and if so should we just build off of that branch?
because everything seems similar here other than adding the thing to the backend