UBC/Alley-HSBC-Frontend
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

contacts and meeting details pages now show joinUrl in a popup window

Browse Source
This commit is contained in:
Taehee Choi 2022-03-30 12:56:43 -07:00
parent 59d7df1437
commit 1ebb45b73d
2 changed files with 49 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/components/contacts/contacts-components/body-components/UpperBody.tsx
View File

@ -1,5 +1,14 @@
import { Box, Button, IconButton, Typography } from "@mui/material";
import React from "react";
import {
Box,
Button,
Dialog,
DialogContent,
DialogContentText,
DialogTitle,
IconButton,
Typography,
} from "@mui/material";
import React, { useState } from "react";
import PhoneIcon from "@mui/icons-material/Phone";
import AddIcon from "@mui/icons-material/Add";
import UserLite from "../../../../api-bodies/UserLite";
@ -26,6 +35,7 @@ interface Props {
const UpperBody: React.FC<Props> = ({ contactInfo }) => {
const dispatch = useAppDispatch();
const [dialog, setDialog] = useState({ open: false, url: "" });
const userStatus: UserStatus = useAppSelector((state) =>
selectUserStatus(state, contactInfo.uuid)
);
@ -54,7 +64,7 @@ const UpperBody: React.FC<Props> = ({ contactInfo }) => {
`/users/${me}/meetings`,
JSON.stringify(newMeeting)
);
window.open(response.data.joinUrl, "_blank")?.focus();
setDialog({ open: true, url: response.data.joinUrl });
} catch (e) {
console.log(e);
}
@ -141,6 +151,17 @@ const UpperBody: React.FC<Props> = ({ contactInfo }) => {
) : null}
</Box>
</Box>
<Dialog
open={dialog.open}
onClose={() => {
setDialog({ open: false, url: "" });
}}
>
<DialogTitle>Join</DialogTitle>
<DialogContent>
<DialogContentText>{dialog.url}</DialogContentText>
</DialogContent>
</Dialog>
</Box>
);
};

28
src/components/meeting-details/meeting-details-components/Header.tsx
View File

@ -1,5 +1,15 @@
import { AppBar, Button, IconButton, Toolbar, Typography } from "@mui/material";
import React from "react";
import {
AppBar,
Button,
Dialog,
DialogContent,
DialogContentText,
DialogTitle,
IconButton,
Toolbar,
Typography,
} from "@mui/material";
import React, { useState } from "react";
import CloseIcon from "@mui/icons-material/Close";
import { useAppDispatch } from "../../../redux/hooks";
import { close } from "../../../redux/slices/meetingDetailsOpenSlice";
@ -11,6 +21,7 @@ interface Props {
const Header: React.FC<Props> = ({ meeting }) => {
const dispatch = useAppDispatch();
const [dialog, setDialog] = useState({ open: false, url: "" });
return (
<AppBar sx={{ position: "relative" }}>
@ -22,7 +33,7 @@ const Header: React.FC<Props> = ({ meeting }) => {
variant="contained"
color="secondary"
onClick={() => {
window.open(meeting.joinUrl, "_blank")?.focus();
setDialog({ open: true, url: meeting.joinUrl });
}}
>
Join
@ -37,6 +48,17 @@ const Header: React.FC<Props> = ({ meeting }) => {
<CloseIcon />
</IconButton>
</Toolbar>
<Dialog
open={dialog.open}
onClose={() => {
setDialog({ open: false, url: "" });
}}
>
<DialogTitle>Join</DialogTitle>
<DialogContent>
<DialogContentText>{dialog.url}</DialogContentText>
</DialogContent>
</Dialog>
</AppBar>
);
};