From dd820318b21981a00c3b32dda382c41ed9185336 Mon Sep 17 00:00:00 2001
From: Tudor Stanciu <tstanciu@totalsoft.ro>
Date: Wed, 21 Sep 2022 19:03:38 +0300
Subject: [PATCH] Display SpecificHeaders feature data

---
 private/Notes.txt                             |  1 +
 public/locales/en/translations.json           |  9 +++
 public/locales/ro/translations.json           |  9 +++
 src/components/common/ExpandableCard.js       |  5 +-
 .../ForwardOptionsAdvancedComponent.js        |  7 ++
 .../keyOverwrite/KeyOverwriteSummary.js       |  2 +-
 .../specificHeaders/SpecificHeaderRules.js    | 80 +++++++++++++++++++
 .../specificHeaders/SpecificHeadersCard.js    | 26 ++++++
 .../specificHeaders/SpecificHeadersSummary.js | 28 +++++++
 .../simple/ForwardOptionsComponent.js         |  5 ++
 10 files changed, 169 insertions(+), 3 deletions(-)
 create mode 100644 src/features/forwards/options/components/advanced/specificHeaders/SpecificHeaderRules.js
 create mode 100644 src/features/forwards/options/components/advanced/specificHeaders/SpecificHeadersCard.js
 create mode 100644 src/features/forwards/options/components/advanced/specificHeaders/SpecificHeadersSummary.js

diff --git a/private/Notes.txt b/private/Notes.txt
index bb732e8..0d37fe1 100644
--- a/private/Notes.txt
+++ b/private/Notes.txt
@@ -1,5 +1,6 @@
 ****************************************************************
 Material UI v4: https://v4.mui.com/components/lists/
+                https://v4.mui.com/components/material-icons/
 ****************************************************************
 
 withTranslation()(LegacyComponentClass)
diff --git a/public/locales/en/translations.json b/public/locales/en/translations.json
index 8721993..bf7d07b 100644
--- a/public/locales/en/translations.json
+++ b/public/locales/en/translations.json
@@ -74,6 +74,15 @@
         "Substitute": "Substitute",
         "Conditions": "Conditions"
       },
+      "SpecificHeaders": {
+        "Label": "Specific headers",
+        "Tooltip": "SpecificHeaders can be used to add, replace or delete headers on all http requests or responses of a forward.",
+        "Rules": "Rules",
+        "Header": "Header",
+        "Value": "Value",
+        "Direction": "Direction",
+        "Action": "Action"
+      },
       "Exceptions": {
         "Label": "Exceptions",
         "Definition": "Exceptions are used to inform the system to not replace the key in some sequences.",
diff --git a/public/locales/ro/translations.json b/public/locales/ro/translations.json
index 8792253..d9417a0 100644
--- a/public/locales/ro/translations.json
+++ b/public/locales/ro/translations.json
@@ -65,6 +65,15 @@
         "Substitute": "Înlocuitor",
         "Conditions": "Condiții"
       },
+      "SpecificHeaders": {
+        "Label": "Specific headers",
+        "Tooltip": "SpecificHeaders poate fi utilizat pentru a adăuga, înlocui sau șterge headere de pe toate solicitările sau răspunsurile http ale unei redirecționări.",
+        "Rules": "Reguli",
+        "Header": "Antet",
+        "Value": "Valoare",
+        "Direction": "Direcție",
+        "Action": "Acțiune"
+      },
       "Exceptions": {
         "Label": "Excepții",
         "Definition": "Excepțiile sunt folosite pentru a informa sistemul să nu înlocuiască cheia în unele secvențe.",
diff --git a/src/components/common/ExpandableCard.js b/src/components/common/ExpandableCard.js
index 1439e9f..0a711c0 100644
--- a/src/components/common/ExpandableCard.js
+++ b/src/components/common/ExpandableCard.js
@@ -76,7 +76,8 @@ const ExpandableCard = ({
 };
 
 ExpandableCard.defaultProps = {
-  expandable: true
+  expandable: true,
+  Content: <div>...</div>
 };
 
 ExpandableCard.propTypes = {
@@ -87,7 +88,7 @@ ExpandableCard.propTypes = {
   smallHeader: PropTypes.bool,
   expandable: PropTypes.bool,
   Summary: PropTypes.node,
-  Content: PropTypes.node.isRequired
+  Content: PropTypes.node
 };
 
 export default ExpandableCard;
diff --git a/src/features/forwards/options/components/advanced/ForwardOptionsAdvancedComponent.js b/src/features/forwards/options/components/advanced/ForwardOptionsAdvancedComponent.js
index 76ba7b7..91d1418 100644
--- a/src/features/forwards/options/components/advanced/ForwardOptionsAdvancedComponent.js
+++ b/src/features/forwards/options/components/advanced/ForwardOptionsAdvancedComponent.js
@@ -4,6 +4,7 @@ import TrailingSlashCard from "./trailingSlash/TrailingSlashCard";
 import PathOverwriteCard from "./pathOverwrite/PathOverwriteCard";
 import PathInjectionCard from "./pathInjection/PathInjectionCard";
 import KeyOverwriteCard from "./keyOverwrite/KeyOverwriteCard";
+import SpecificHeadersCard from "./specificHeaders/SpecificHeadersCard";
 
 const ForwardOptionsAdvancedComponent = ({ options }) => {
   return (
@@ -32,6 +33,12 @@ const ForwardOptionsAdvancedComponent = ({ options }) => {
           <br />
         </>
       )}
+      {options.specificHeaders && (
+        <>
+          <SpecificHeadersCard data={options.specificHeaders} />
+          <br />
+        </>
+      )}
     </>
   );
 };
diff --git a/src/features/forwards/options/components/advanced/keyOverwrite/KeyOverwriteSummary.js b/src/features/forwards/options/components/advanced/keyOverwrite/KeyOverwriteSummary.js
index e6a3e7f..0653559 100644
--- a/src/features/forwards/options/components/advanced/keyOverwrite/KeyOverwriteSummary.js
+++ b/src/features/forwards/options/components/advanced/keyOverwrite/KeyOverwriteSummary.js
@@ -1,6 +1,6 @@
 import React from "react";
 import PropTypes from "prop-types";
-import { Grid, Box } from "@material-ui/core";
+import { Grid } from "@material-ui/core";
 import { makeStyles } from "@material-ui/core/styles";
 import { useTranslation } from "react-i18next";
 import styles from "../../../../../../components/common/styles/gridStyles";
diff --git a/src/features/forwards/options/components/advanced/specificHeaders/SpecificHeaderRules.js b/src/features/forwards/options/components/advanced/specificHeaders/SpecificHeaderRules.js
new file mode 100644
index 0000000..02a02af
--- /dev/null
+++ b/src/features/forwards/options/components/advanced/specificHeaders/SpecificHeaderRules.js
@@ -0,0 +1,80 @@
+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 SpecificHeaderRules = ({ rules }) => {
+  const classes = useStyles();
+  const { t } = useTranslation();
+  return (
+    <ExpandableCard
+      Icon={<List />}
+      iconVariant="rounded"
+      title={t("Forward.Options.SpecificHeaders.Rules")}
+      smallHeader
+      Content={
+        <TableContainer component={Paper}>
+          <Table
+            className={classes.narrowTable}
+            size="small"
+            aria-label="customized table"
+          >
+            <TableHead>
+              <TableRow>
+                <StyledTableCell>
+                  {t("Forward.Options.SpecificHeaders.Header")}
+                </StyledTableCell>
+                <StyledTableCell>
+                  {t("Forward.Options.SpecificHeaders.Value")}
+                </StyledTableCell>
+                <StyledTableCell>
+                  {t("Forward.Options.SpecificHeaders.Direction")}
+                </StyledTableCell>
+                <StyledTableCell>
+                  {t("Forward.Options.SpecificHeaders.Action")}
+                </StyledTableCell>
+              </TableRow>
+            </TableHead>
+            <TableBody>
+              <>
+                {rules.map(rule => {
+                  return (
+                    <StyledTableRow key={rules.indexOf(rule)}>
+                      <StyledTableCell>{rule.header}</StyledTableCell>
+                      <StyledTableCell>{rule.value}</StyledTableCell>
+                      <StyledTableCell>{rule.direction}</StyledTableCell>
+                      <StyledTableCell>{rule.action}</StyledTableCell>
+                    </StyledTableRow>
+                  );
+                })}
+              </>
+            </TableBody>
+          </Table>
+        </TableContainer>
+      }
+    />
+  );
+};
+
+SpecificHeaderRules.propTypes = {
+  rules: PropTypes.array.isRequired
+};
+
+export default SpecificHeaderRules;
diff --git a/src/features/forwards/options/components/advanced/specificHeaders/SpecificHeadersCard.js b/src/features/forwards/options/components/advanced/specificHeaders/SpecificHeadersCard.js
new file mode 100644
index 0000000..5c2f8cd
--- /dev/null
+++ b/src/features/forwards/options/components/advanced/specificHeaders/SpecificHeadersCard.js
@@ -0,0 +1,26 @@
+import React from "react";
+import PropTypes from "prop-types";
+import ExpandableCard from "../../../../../../components/common/ExpandableCard";
+import { useTranslation } from "react-i18next";
+import FolderSpecialIcon from "@material-ui/icons/FolderSpecial";
+import SpecificHeadersSummary from "./SpecificHeadersSummary";
+
+const SpecificHeadersCard = ({ data }) => {
+  const { t } = useTranslation();
+
+  return (
+    <ExpandableCard
+      Icon={<FolderSpecialIcon />}
+      title={t("Forward.Options.SpecificHeaders.Label")}
+      subtitle={t("Forward.Options.SpecificHeaders.Tooltip")}
+      expandable={false}
+      Summary={<SpecificHeadersSummary data={data} />}
+    />
+  );
+};
+
+SpecificHeadersCard.propTypes = {
+  data: PropTypes.object.isRequired
+};
+
+export default SpecificHeadersCard;
diff --git a/src/features/forwards/options/components/advanced/specificHeaders/SpecificHeadersSummary.js b/src/features/forwards/options/components/advanced/specificHeaders/SpecificHeadersSummary.js
new file mode 100644
index 0000000..22e7c54
--- /dev/null
+++ b/src/features/forwards/options/components/advanced/specificHeaders/SpecificHeadersSummary.js
@@ -0,0 +1,28 @@
+import React from "react";
+import PropTypes from "prop-types";
+import { Grid } from "@material-ui/core";
+import { useTranslation } from "react-i18next";
+import ActiveIcon from "../../../../../../components/common/ActiveIcon";
+import SpecificHeaderRules from "./SpecificHeaderRules";
+
+const SpecificHeadersSummary = ({ data }) => {
+  const { t } = useTranslation();
+  return (
+    <>
+      <Grid container>
+        <Grid item xs={6} sm={3} md={3}>
+          {`${t("General.Enabled")}: `}
+          <ActiveIcon active={data.on} />
+        </Grid>
+      </Grid>
+      <br />
+      <SpecificHeaderRules rules={data.rules} />
+    </>
+  );
+};
+
+SpecificHeadersSummary.propTypes = {
+  data: PropTypes.object.isRequired
+};
+
+export default SpecificHeadersSummary;
diff --git a/src/features/forwards/options/components/simple/ForwardOptionsComponent.js b/src/features/forwards/options/components/simple/ForwardOptionsComponent.js
index 1fea6f0..ab9bf6e 100644
--- a/src/features/forwards/options/components/simple/ForwardOptionsComponent.js
+++ b/src/features/forwards/options/components/simple/ForwardOptionsComponent.js
@@ -48,6 +48,11 @@ const ForwardOptionsComponent = ({ title, options }) => {
         label: "Forward.Options.KeyOverwrite.Label",
         tooltip: "Forward.Options.KeyOverwrite.Tooltip",
         active: options.keyOverwrite?.on
+      },
+      {
+        label: "Forward.Options.SpecificHeaders.Label",
+        tooltip: "Forward.Options.SpecificHeaders.Tooltip",
+        active: options.specificHeaders?.on
       }
     ],
     [options]