42 lines
1.2 KiB
TypeScript
42 lines
1.2 KiB
TypeScript
import { AppBar, Button, IconButton, Toolbar, Typography } from "@mui/material";
|
|
import React from "react";
|
|
import CloseIcon from "@mui/icons-material/Close";
|
|
import { useAppDispatch } from "../../../redux/hooks";
|
|
import { close } from "../../../redux/slices/meetingDetailsOpenSlice";
|
|
import DetailedMeeting from "../../../api-bodies/DetailedMeeting";
|
|
|
|
interface Props {
|
|
meeting: DetailedMeeting | null;
|
|
}
|
|
|
|
const Header: React.FC<Props> = (props) => {
|
|
const dispatch = useAppDispatch();
|
|
|
|
return (
|
|
<AppBar sx={{ position: "relative" }}>
|
|
<Toolbar>
|
|
<Typography variant="h6" sx={{ flexGrow: 1 }}>
|
|
{props.meeting !== null ? props.meeting.topic : null}
|
|
</Typography>
|
|
<Button variant="contained" color="secondary">
|
|
Join
|
|
</Button>
|
|
<Button variant="contained" color="secondary" sx={{ ml: 1 }}>
|
|
Recording
|
|
</Button>
|
|
<IconButton
|
|
edge="start"
|
|
color="inherit"
|
|
aria-label="close"
|
|
onClick={() => dispatch(close())}
|
|
sx={{ ml: 1 }}
|
|
>
|
|
<CloseIcon />
|
|
</IconButton>
|
|
</Toolbar>
|
|
</AppBar>
|
|
);
|
|
};
|
|
|
|
export default Header;
|