import type {FunctionComponent} from 'react'
import PageTitle from '@/components/custom/pageTitle'
import MeetingForm from '@/app/(authenticated)/meetings/meetingForm'
import {getMeeting} from '@/dal/meetings'
import {getContacts} from '@/dal/contacts'

interface MeetingDetailPageParams {
  params: Promise<{
    meetingId: string
  }>
}

const MeetingDetailPage: FunctionComponent<MeetingDetailPageParams> = async ({params}) => {
  const {meetingId} = await params
  const [meeting, contacts] = await Promise.all([getMeeting(meetingId), getContacts()])

  return (
    <>
      <div className="flex justify-between items-center mb-6">
        <PageTitle>My meetings</PageTitle>
      </div>

      <MeetingForm contacts={contacts} meeting={meeting} />
    </>
  )
}

export default MeetingDetailPage
