Modal component: Implementing generic modal/dialog

[RyRy79261]

Over view

A standard styled modal should be created.

This should leverage tailwind components and have certain custmizations.

An appropriate tailwind based modal package can be used, provided its light weight.

Acceptance criteria

Option 1: Prebuiilt

• [ ] Something like TailwindUI`s dialog component

Option 2: Manually created

• Modal provider & hook
  • [ ] A generic modal/dialog component that handles the open & closing logic
  • [ ] The component should take an open state, a set open function setOpen: (state: boolean) => void
  • [ ] The modal/dialog wrapper basically just handles Transition, click off area & actual content area, anything else is up to the specific component itself

[RyRy79261]

@denviljclarke Do you have any preferred/suggested approaches for this?

[denviljclarke]

I think we should use Tailwind / Headless UI's Modal. It's pretty straight forward. You can expand the scope of this ticket to replace the existing modals with this modal and assign me 🫡