134 lines
4.2 KiB
JavaScript
134 lines
4.2 KiB
JavaScript
import React from "react";
|
|
import PropTypes from "prop-types";
|
|
import { makeStyles } from "@material-ui/core/styles";
|
|
import {
|
|
Table,
|
|
TableBody,
|
|
TableContainer,
|
|
TableHead,
|
|
TableRow,
|
|
Tooltip,
|
|
Link,
|
|
Grid,
|
|
Paper,
|
|
IconButton,
|
|
Typography
|
|
} from "@material-ui/core";
|
|
import Spinner from "../../../components/common/Spinner";
|
|
import DonutLargeRoundedIcon from "@material-ui/icons/DonutLargeRounded";
|
|
import SessionForwardsHeaderComponent from "./SessionForwardsHeaderComponent";
|
|
import { useTranslation } from "react-i18next";
|
|
import styles from "../../../components/common/styles/tableStyles";
|
|
import {
|
|
StyledTableCell,
|
|
StyledTableRow
|
|
} from "../../../components/common/MaterialTable";
|
|
|
|
const useStyles = makeStyles(styles);
|
|
|
|
const SessionForwardsComponent = ({
|
|
session,
|
|
forwards,
|
|
openOptionsDialog,
|
|
showSessionInfo,
|
|
handleForwardClick
|
|
}) => {
|
|
const classes = useStyles();
|
|
const { t } = useTranslation();
|
|
|
|
return (
|
|
<Grid container>
|
|
<Grid item xs={12} sm={12} md={12}>
|
|
<Typography variant="h6">{t("Session.Forwards.Title")}</Typography>
|
|
</Grid>
|
|
<Grid item xs={12} sm={12} md={12}>
|
|
{!forwards || forwards.loading ? (
|
|
<Spinner />
|
|
) : (
|
|
forwards.loaded && (
|
|
<TableContainer component={Paper}>
|
|
<Table
|
|
className={classes.table}
|
|
size="small"
|
|
aria-label="customized table"
|
|
>
|
|
<TableHead>
|
|
<TableRow>
|
|
<StyledTableCell />
|
|
<StyledTableCell>
|
|
{t("Session.Forwards.From")}
|
|
</StyledTableCell>
|
|
<StyledTableCell>
|
|
{t("Session.Forwards.To")}
|
|
</StyledTableCell>
|
|
<StyledTableCell align="right">
|
|
{t("Session.Forwards.Options.Title")}
|
|
</StyledTableCell>
|
|
</TableRow>
|
|
</TableHead>
|
|
<TableBody>
|
|
{forwards.map((row) => (
|
|
<StyledTableRow key={row.forwardId}>
|
|
<StyledTableCell component="th" scope="row">
|
|
{forwards.indexOf(row) + 1}
|
|
</StyledTableCell>
|
|
<StyledTableCell>
|
|
{handleForwardClick ? (
|
|
<Link href="#" onClick={handleForwardClick(row.from)}>
|
|
{row.from}
|
|
</Link>
|
|
) : (
|
|
row.from
|
|
)}
|
|
</StyledTableCell>
|
|
<StyledTableCell>{row.to}</StyledTableCell>
|
|
<StyledTableCell align="right">
|
|
{row.options ? (
|
|
<Tooltip title={t("Session.Forwards.Options.Title")}>
|
|
<IconButton
|
|
aria-label="options"
|
|
size="small"
|
|
onClick={openOptionsDialog({
|
|
...row.options,
|
|
title: `${row.from} >>> ${row.to}`
|
|
})}
|
|
>
|
|
<DonutLargeRoundedIcon color="primary" />
|
|
</IconButton>
|
|
</Tooltip>
|
|
) : (
|
|
""
|
|
)}
|
|
</StyledTableCell>
|
|
</StyledTableRow>
|
|
))}
|
|
</TableBody>
|
|
</Table>
|
|
</TableContainer>
|
|
)
|
|
)}
|
|
</Grid>
|
|
{showSessionInfo && (
|
|
<>
|
|
<Grid item xs={12} sm={12} md={12}>
|
|
<br />
|
|
</Grid>
|
|
<Grid item xs={12} sm={12} md={12}>
|
|
<SessionForwardsHeaderComponent session={session} />
|
|
</Grid>
|
|
</>
|
|
)}
|
|
</Grid>
|
|
);
|
|
};
|
|
|
|
SessionForwardsComponent.propTypes = {
|
|
session: PropTypes.object.isRequired,
|
|
forwards: PropTypes.array,
|
|
openOptionsDialog: PropTypes.func.isRequired,
|
|
showSessionInfo: PropTypes.bool.isRequired,
|
|
handleForwardClick: PropTypes.func
|
|
};
|
|
|
|
export default SessionForwardsComponent;
|