Implement admin "select shift times" calendar

[7tint]

Ticket link

Closes #102

Implementation description

• Leveraged FullCalendar to create the admin shifts calendar.
• To use the calendar:

• • Click to create a new event
• • Drag the bottom of the event card to change the length of the event
• • Click on the card to prompt deletion modal

Steps to test

1. Navigate to http://localhost:3000/admin/posting/create/shifts and play around with the calendar!
2. Feel free to add a console.log(events) in the code to check the output data

What should reviewers focus on?

• Correct usage of FullCalendar
• Intuitive feel to the calendar

Checklist

• My PR name is descriptive and in imperative tense
• My commit messages are descriptive and in imperative tense. My commits are atomic and trivial commits are squashed or fixup'd into non-trivial commits
• I have run the appropriate linter(s)
• I have requested a review from the PL, as well as other devs who have background knowledge on this PR or who will be building on top of this PR

[github-actions]

Visit the preview URL for this PR (updated for commit 959dce8):

https://sistering-dev--pr150-lambert-implement-ca-bcy6p2av.web.app

_{(expires Sun, 13 Mar 2022 06:23:07 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

[LenaNguyen]

optionally you could use newEvents.indexOf()

[sherryhli]

Looking good, thanks for fiddling around with CSS to get the correct styling! One main thing is to change events to a prop, the rest are just small nits.

[LenaNguyen]

Just tested it out and the calendar looks sooo good! 🤩

[7tint]

Fixed up the details! Please let me know if there's anything else I can clean up 🛁

[sherryhli]

UI looks great but we do need to rework the state management a bit. Again, sorry for not catching this earlier and let me know if you have any questions!

[sherryhli]

We need to lift the state up to the parent component (in this case it's CreatePostingShiftsPage and eventually it'll be CreatePostingShifts from #164 when merged). This is so that the create shifts component can update the posting context (global state) with shifts data along with other posting fields.

Sorry, I didn't completely think this through when I made my previous comment, but the change is a bit more involved than just adding a shifts prop. We need the parent component to maintain the events state and all functions for manipulating state (e.g. addEvent, changeEvent, deleteEvent) should be passed in as props (and defined in the parent). The event count state should similarly be maintained in the parent and a function for getting the next event ID should also be provided as a prop.

Let me know if any further clarification is needed!

[sherryhli]

Awesome stuff! 🚀 Go ahead and merge if you need to unblock yourself, though there is a one-liner change needed

[sherryhli]

🚢🚢🚢