My availability tab

[seancfong]

Summary

Drag-selecting multiple date availabilities:

Confirmation of date availabilities (mouse up/touch end):

Pagination maintains availability across multiple pages

Availability state is stored in svelte store (maintained when tab is switched)

• Clicking on cells to toggle their availability
• Have a separate store for the availability so that other pages can access it
• Drag over cells to change the availability
• Reasonable proportions
• Looks nice (imo)

Other changes:

• Added ZotDate class for consistent date format
• Converted Calendar to use ZotDate objects

Closes #7.

[seancfong]

@MinhxNguyen7 Marking this PR as ready to review. The availability page is also live on staging.

[MinhxNguyen7]

Looks very good. Let's push this, then you can address these suggestions:

• The margins for the availability on mobile are pretty big. I think that if we put the arrows, we'd be able to fit one more day.
• Can you make the page/number of columns responsive to screen size? You started with mobile, which is good.

A few more things that you can leave for later if there are better things to do:

• Mobile selection works perfectly, but, on desktop, if you drag outside of the grid, it doesn't register the mouse up.
• Instead of manipulating ZotDate arrays and the such, there should be a class that encapsulates this logic. Not sure how feasible this is, but what we're doing is somewhat error-prone.