From faf5178de5494ba8960e7aaaa9d367dc7d8b6c29 Mon Sep 17 00:00:00 2001
From: Tudor Stanciu <tudor.stanciu94@gmail.com>
Date: Sun, 16 May 2021 14:17:04 +0300
Subject: [PATCH] PathOverwriteCard

---
 .../ForwardOptionsAdvancedComponent.js        |  4 +--
 .../advanced/PathOverwriteComponent.js        | 12 ---------
 .../pathOverwrite/PathOverwriteCard.js        | 26 +++++++++++++++++++
 .../pathOverwrite/PathOverwriteSummary.js     | 24 +++++++++++++++++
 4 files changed, 52 insertions(+), 14 deletions(-)
 delete mode 100644 src/features/forwards/options/components/advanced/PathOverwriteComponent.js
 create mode 100644 src/features/forwards/options/components/advanced/pathOverwrite/PathOverwriteCard.js
 create mode 100644 src/features/forwards/options/components/advanced/pathOverwrite/PathOverwriteSummary.js

diff --git a/src/features/forwards/options/components/advanced/ForwardOptionsAdvancedComponent.js b/src/features/forwards/options/components/advanced/ForwardOptionsAdvancedComponent.js
index a4f0562..c4051ec 100644
--- a/src/features/forwards/options/components/advanced/ForwardOptionsAdvancedComponent.js
+++ b/src/features/forwards/options/components/advanced/ForwardOptionsAdvancedComponent.js
@@ -1,7 +1,7 @@
 import React from "react";
 import PropTypes from "prop-types";
 import TrailingSlashCard from "./trailingSlash/TrailingSlashCard";
-import PathOverwriteComponent from "./PathOverwriteComponent";
+import PathOverwriteCard from "./pathOverwrite/PathOverwriteCard";
 import PathInjectionCard from "./pathInjection/PathInjectionCard";
 import KeyOverwriteCard from "./keyOverwrite/KeyOverwriteCard";
 
@@ -12,7 +12,7 @@ const ForwardOptionsAdvancedComponent = ({ options }) => {
         <TrailingSlashCard enabled={options.trailingSlash} />
       )}
       {options.pathOverwrite && (
-        <PathOverwriteComponent data={options.pathOverwrite} />
+        <PathOverwriteCard data={options.pathOverwrite} />
       )}
       {options.pathInjection && (
         <PathInjectionCard data={options.pathInjection} />
diff --git a/src/features/forwards/options/components/advanced/PathOverwriteComponent.js b/src/features/forwards/options/components/advanced/PathOverwriteComponent.js
deleted file mode 100644
index 1b1f737..0000000
--- a/src/features/forwards/options/components/advanced/PathOverwriteComponent.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import React from "react";
-import PropTypes from "prop-types";
-
-const PathOverwriteComponent = ({ data }) => {
-  return "";
-};
-
-PathOverwriteComponent.propTypes = {
-  data: PropTypes.object.isRequired
-};
-
-export default PathOverwriteComponent;
diff --git a/src/features/forwards/options/components/advanced/pathOverwrite/PathOverwriteCard.js b/src/features/forwards/options/components/advanced/pathOverwrite/PathOverwriteCard.js
new file mode 100644
index 0000000..ec8c71e
--- /dev/null
+++ b/src/features/forwards/options/components/advanced/pathOverwrite/PathOverwriteCard.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 ThreeSixtyIcon from "@material-ui/icons/ThreeSixty";
+import PathOverwriteSummary from "./PathOverwriteSummary";
+
+const PathOverwriteCard = ({ data }) => {
+  const { t } = useTranslation();
+
+  return (
+    <ExpandableCard
+      Icon={<ThreeSixtyIcon />}
+      title={t("Forward.Options.PathOverwrite.Label")}
+      subtitle={t("Forward.Options.PathOverwrite.Tooltip")}
+      Summary={<PathOverwriteSummary data={data} />}
+      Content={<div>CONTENT...</div>}
+    />
+  );
+};
+
+PathOverwriteCard.propTypes = {
+  data: PropTypes.object.isRequired
+};
+
+export default PathOverwriteCard;
diff --git a/src/features/forwards/options/components/advanced/pathOverwrite/PathOverwriteSummary.js b/src/features/forwards/options/components/advanced/pathOverwrite/PathOverwriteSummary.js
new file mode 100644
index 0000000..da81017
--- /dev/null
+++ b/src/features/forwards/options/components/advanced/pathOverwrite/PathOverwriteSummary.js
@@ -0,0 +1,24 @@
+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";
+
+const PathOverwriteSummary = ({ data }) => {
+  const { t } = useTranslation();
+
+  return (
+    <Grid container>
+      <Grid item xs={6} sm={3} md={3}>
+        {`${t("General.Enabled")}: `}
+        <ActiveIcon active={data.on} />
+      </Grid>
+    </Grid>
+  );
+};
+
+PathOverwriteSummary.propTypes = {
+  data: PropTypes.object.isRequired
+};
+
+export default PathOverwriteSummary;