diff --git a/public/locales/en/translations.json b/public/locales/en/translations.json index e9e12ba..ef0fdf1 100644 --- a/public/locales/en/translations.json +++ b/public/locales/en/translations.json @@ -67,7 +67,8 @@ "Tooltip": "KeyOverwrite can be used to replace any key from all http responses of a forward.", "Origin": "Origin", "Substitute": "Substitute" - } + }, + "Exceptions": "Exceptions" } }, "ReleaseNotes": { diff --git a/public/locales/ro/translations.json b/public/locales/ro/translations.json index f99f4aa..6659b2d 100644 --- a/public/locales/ro/translations.json +++ b/public/locales/ro/translations.json @@ -58,7 +58,8 @@ "Tooltip": "KeyOverwrite poate fi utilizat pentru a înlocui orice cheie din toate răspunsurile http ale unei redirecționări.", "Origin": "Înlocuit", "Substitute": "Înlocuitor" - } + }, + "Exceptions": "Excepții" } }, "ReleaseNotes": { diff --git a/src/components/common/ExpandableCard.js b/src/components/common/ExpandableCard.js index 1903633..fad6092 100644 --- a/src/components/common/ExpandableCard.js +++ b/src/components/common/ExpandableCard.js @@ -15,7 +15,15 @@ import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; const useStyles = makeStyles(styles); -const ExpandableCard = ({ Icon, title, subtitle, Summary, Content }) => { +const ExpandableCard = ({ + Icon, + iconVariant, + title, + subtitle, + smallHeader, + Summary, + Content +}) => { const [expanded, setExpanded] = useState(false); const classes = useStyles(); @@ -28,7 +36,11 @@ const ExpandableCard = ({ Icon, title, subtitle, Summary, Content }) => { + {Icon} } @@ -40,6 +52,7 @@ const ExpandableCard = ({ Icon, title, subtitle, Summary, Content }) => { onClick={handleExpandClick} aria-expanded={expanded} aria-label="show more" + size={smallHeader ? "small" : "medium"} > @@ -57,8 +70,10 @@ const ExpandableCard = ({ Icon, title, subtitle, Summary, Content }) => { ExpandableCard.propTypes = { Icon: PropTypes.node.isRequired, + iconVariant: PropTypes.oneOf("circle", "circular", "rounded", "square"), title: PropTypes.string.isRequired, subtitle: PropTypes.string, + smallHeader: PropTypes.bool, Summary: PropTypes.node, Content: PropTypes.node.isRequired }; diff --git a/src/components/common/styles/expandableCardStyles.js b/src/components/common/styles/expandableCardStyles.js index 4a63fea..e08d5e7 100644 --- a/src/components/common/styles/expandableCardStyles.js +++ b/src/components/common/styles/expandableCardStyles.js @@ -1,4 +1,4 @@ -const styles = (theme) => ({ +const styles = theme => ({ expand: { transform: "rotate(0deg)", marginLeft: "auto", @@ -11,6 +11,11 @@ const styles = (theme) => ({ }, avatar: { backgroundColor: theme.palette.primary.main + }, + avatarSmall: { + backgroundColor: theme.palette.primary.main, + width: theme.spacing(3), + height: theme.spacing(3) } }); diff --git a/src/features/forwards/options/components/advanced/ForwardOptionsAdvancedContainer.js b/src/features/forwards/options/components/advanced/ForwardOptionsAdvancedContainer.js index b31a599..8f73488 100644 --- a/src/features/forwards/options/components/advanced/ForwardOptionsAdvancedContainer.js +++ b/src/features/forwards/options/components/advanced/ForwardOptionsAdvancedContainer.js @@ -5,14 +5,22 @@ import PropTypes from "prop-types"; import { loadForwardOptions } from "../../actionCreators"; import ForwardOptionsAdvancedComponent from "./ForwardOptionsAdvancedComponent"; import Spinner from "../../../../../components/common/Spinner"; +import { useTranslation } from "react-i18next"; const ForwardOptionsAdvancedContainer = ({ actions, optionsId, options }) => { + const { t } = useTranslation(); + if (!options) { actions.loadForwardOptions(optionsId); return ; } - return ; + return ( + <> +

{t("Forward.Options.Title")}

+ + + ); }; ForwardOptionsAdvancedContainer.propTypes = { diff --git a/src/features/forwards/options/components/advanced/advancedSettings/AdvancedSettingsComponent.js b/src/features/forwards/options/components/advanced/advancedSettings/AdvancedSettingsComponent.js new file mode 100644 index 0000000..a5992ee --- /dev/null +++ b/src/features/forwards/options/components/advanced/advancedSettings/AdvancedSettingsComponent.js @@ -0,0 +1,19 @@ +import React from "react"; +import PropTypes from "prop-types"; +import ExceptionsCard from "../exceptions/ExceptionsCard"; + +const AdvancedSettingsComponent = ({ data }) => { + return ( + <> + {data && data.exceptions && ( + + )} + + ); +}; + +AdvancedSettingsComponent.propTypes = { + data: PropTypes.object +}; + +export default AdvancedSettingsComponent; diff --git a/src/features/forwards/options/components/advanced/pathInjection/PathInjectionCard.js b/src/features/forwards/options/components/advanced/pathInjection/PathInjectionCard.js index 26f2f9c..aeed02c 100644 --- a/src/features/forwards/options/components/advanced/pathInjection/PathInjectionCard.js +++ b/src/features/forwards/options/components/advanced/pathInjection/PathInjectionCard.js @@ -4,6 +4,7 @@ import ExpandableCard from "../../../../../../components/common/ExpandableCard"; import { useTranslation } from "react-i18next"; import InputIcon from "@material-ui/icons/Input"; import PathInjectionSummary from "./PathInjectionSummary"; +import AdvancedSettingsComponent from "../advancedSettings/AdvancedSettingsComponent"; const PathInjectionCard = ({ data }) => { const { t } = useTranslation(); @@ -14,7 +15,7 @@ const PathInjectionCard = ({ data }) => { title={t("Forward.Options.PathInjection.Label")} subtitle={t("Forward.Options.PathInjection.Tooltip")} Summary={} - Content={
CONTENT...
} + Content={} /> ); };