From 275377e10310a929121232db2f2ef4b2d21f0d09 Mon Sep 17 00:00:00 2001
From: Samuel Rowe <samuelrowe1999@gmail.com>
Date: Sun, 31 Jul 2022 13:30:49 +0530
Subject: [PATCH] feat(frontend): created `Environment` component

---
 .../components/Modal/service/Environment.tsx  | 41 +++++++++++++++++++
 1 file changed, 41 insertions(+)
 create mode 100644 services/frontend/src/components/Modal/service/Environment.tsx

diff --git a/services/frontend/src/components/Modal/service/Environment.tsx b/services/frontend/src/components/Modal/service/Environment.tsx
new file mode 100644
index 0000000..bb0e2aa
--- /dev/null
+++ b/services/frontend/src/components/Modal/service/Environment.tsx
@@ -0,0 +1,41 @@
+import { styled } from "@mui/joy";
+import Records from "../../Records";
+
+const Root = styled("div")`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+`;
+
+const Environment = () => {
+  return (
+    <Root>
+      <Records
+        name="environmentVariables"
+        title=""
+        collapsible={false}
+        fields={(index: number) => [
+          {
+            name: `environmentVariables[${index}].key`,
+            placeholder: "Key",
+            required: true,
+            type: "text"
+          },
+          {
+            name: `environmentVariables[${index}].value`,
+            placeholder: "Value",
+            required: false,
+            type: "text"
+          }
+        ]}
+        newValue={{
+          hostPort: "",
+          containerPort: "",
+          protocol: ""
+        }}
+      />
+    </Root>
+  );
+};
+
+export default Environment;