KeyOverwriteDetailsComponent
parent
d871b01436
commit
4dc2b3e25e
|
@ -64,6 +64,7 @@
|
|||
},
|
||||
"KeyOverwrite": {
|
||||
"Label": "Key overwrite",
|
||||
"Details": "Keys",
|
||||
"Tooltip": "KeyOverwrite can be used to replace any key from all http responses of a forward.",
|
||||
"Origin": "Origin",
|
||||
"Substitute": "Substitute"
|
||||
|
|
|
@ -55,6 +55,7 @@
|
|||
},
|
||||
"KeyOverwrite": {
|
||||
"Label": "Key overwrite",
|
||||
"Details": "Chei",
|
||||
"Tooltip": "KeyOverwrite poate fi utilizat pentru a înlocui orice cheie din toate răspunsurile http ale unei redirecționări.",
|
||||
"Origin": "Înlocuit",
|
||||
"Substitute": "Înlocuitor"
|
||||
|
|
|
@ -0,0 +1,73 @@
|
|||
import React from "react";
|
||||
import PropTypes from "prop-types";
|
||||
import ExpandableCard from "../../../../../../components/common/ExpandableCard";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { List } from "@material-ui/icons";
|
||||
import { makeStyles } from "@material-ui/core/styles";
|
||||
import {
|
||||
Table,
|
||||
TableBody,
|
||||
TableContainer,
|
||||
TableHead,
|
||||
TableRow,
|
||||
Paper
|
||||
} from "@material-ui/core";
|
||||
import styles from "../../../../../../components/common/styles/tableStyles";
|
||||
import {
|
||||
StyledTableCell,
|
||||
StyledTableRow
|
||||
} from "../../../../../../components/common/MaterialTable";
|
||||
|
||||
const useStyles = makeStyles(styles);
|
||||
|
||||
const KeyOverwriteDetailsComponent = ({ details }) => {
|
||||
const classes = useStyles();
|
||||
const { t } = useTranslation();
|
||||
|
||||
return (
|
||||
<ExpandableCard
|
||||
Icon={<List />}
|
||||
iconVariant="rounded"
|
||||
title={t("Forward.Options.KeyOverwrite.Details")}
|
||||
smallHeader
|
||||
Content={
|
||||
<TableContainer component={Paper}>
|
||||
<Table
|
||||
className={classes.narrowTable}
|
||||
size="small"
|
||||
aria-label="customized table"
|
||||
>
|
||||
<TableHead>
|
||||
<TableRow>
|
||||
<StyledTableCell>
|
||||
{t("Forward.Options.KeyOverwrite.Origin")}
|
||||
</StyledTableCell>
|
||||
<StyledTableCell>
|
||||
{t("Forward.Options.KeyOverwrite.Substitute")}
|
||||
</StyledTableCell>
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
<TableBody>
|
||||
<>
|
||||
{details.map(detail => {
|
||||
return (
|
||||
<StyledTableRow key={details.indexOf(detail)}>
|
||||
<StyledTableCell>{detail.origin}</StyledTableCell>
|
||||
<StyledTableCell>{detail.substitute}</StyledTableCell>
|
||||
</StyledTableRow>
|
||||
);
|
||||
})}
|
||||
</>
|
||||
</TableBody>
|
||||
</Table>
|
||||
</TableContainer>
|
||||
}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
KeyOverwriteDetailsComponent.propTypes = {
|
||||
details: PropTypes.array.isRequired
|
||||
};
|
||||
|
||||
export default KeyOverwriteDetailsComponent;
|
|
@ -5,30 +5,45 @@ import { makeStyles } from "@material-ui/core/styles";
|
|||
import { useTranslation } from "react-i18next";
|
||||
import styles from "../../../../../../components/common/styles/gridStyles";
|
||||
import ActiveIcon from "../../../../../../components/common/ActiveIcon";
|
||||
import KeyOverwriteDetailsComponent from "./KeyOverwriteDetailsComponent";
|
||||
|
||||
const useStyles = makeStyles(styles);
|
||||
|
||||
const KeyOverwriteSummary = ({ data }) => {
|
||||
const classes = useStyles();
|
||||
const { t } = useTranslation();
|
||||
const singleKey = data.details.length === 1;
|
||||
|
||||
return (
|
||||
<Grid container>
|
||||
<Grid item xs={6} sm={3} md={3}>
|
||||
{`${t("General.Enabled")}: `}
|
||||
<ActiveIcon active={data.on} />
|
||||
</Grid>
|
||||
<>
|
||||
<Grid container>
|
||||
<Grid item xs={6} sm={3} md={3}>
|
||||
{`${t("General.Enabled")}: `}
|
||||
<ActiveIcon active={data.on} />
|
||||
</Grid>
|
||||
{singleKey && (
|
||||
<>
|
||||
<Grid item xs={6} sm={3} md={3}>
|
||||
{`${t("Forward.Options.KeyOverwrite.Origin")}: `}
|
||||
<span className={classes.value}>{data.details[0].origin}</span>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={6} sm={3} md={3}>
|
||||
{`${t("Forward.Options.KeyOverwrite.Origin")}: `}
|
||||
<span className={classes.value}>{data.origin}</span>
|
||||
<Grid item xs={6} sm={3} md={3}>
|
||||
{`${t("Forward.Options.KeyOverwrite.Substitute")}: `}
|
||||
<span className={classes.value}>
|
||||
{data.details[0].substitute}
|
||||
</span>
|
||||
</Grid>
|
||||
</>
|
||||
)}
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={6} sm={3} md={3}>
|
||||
{`${t("Forward.Options.KeyOverwrite.Substitute")}: `}
|
||||
<span className={classes.value}>{data.substitute}</span>
|
||||
</Grid>
|
||||
</Grid>
|
||||
{!singleKey && (
|
||||
<>
|
||||
<br />
|
||||
<KeyOverwriteDetailsComponent details={data.details} />
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
|
|
Loading…
Reference in New Issue