import { Dialog } from "@mui/material";
import React from "react";
import Body from "./meeting-details-components/Body";
import Header from "./meeting-details-components/Header";
import { useAppSelector, useAppDispatch } from "../../redux/hooks";
import {
  close,
  selectMeetingDetailsOpen,
} from "../../redux/slices/meetingDetailsOpenSlice";

const MeetingDetails: React.FC = () => {
  const meetingDetailsOpen = useAppSelector(selectMeetingDetailsOpen);
  const dispatch = useAppDispatch();

  return meetingDetailsOpen.meeting ? (
    <Dialog
      fullScreen
      open={meetingDetailsOpen.open}
      onClose={() => dispatch(close())}
    >
      <Header meeting={meetingDetailsOpen.meeting} />
      <Body meeting={meetingDetailsOpen.meeting} />
    </Dialog>
  ) : null;
};

export default MeetingDetails;
