From 09c16e922a3ed587135e61b308790c27e5c6f7e7 Mon Sep 17 00:00:00 2001
From: Samuel Rowe <samuelrowe1999@gmail.com>
Date: Sat, 20 Aug 2022 16:47:47 +0530
Subject: [PATCH] feat: created `SuperForm` component

---
 .../frontend/src/components/SuperForm.tsx     | 28 +++++++++++++++++++
 1 file changed, 28 insertions(+)
 create mode 100644 services/frontend/src/components/SuperForm.tsx

diff --git a/services/frontend/src/components/SuperForm.tsx b/services/frontend/src/components/SuperForm.tsx
new file mode 100644
index 0000000..e1c1273
--- /dev/null
+++ b/services/frontend/src/components/SuperForm.tsx
@@ -0,0 +1,28 @@
+import { styled } from "@mui/joy";
+import { FunctionComponent, ReactElement } from "react";
+import { useSuperForm } from "../hooks";
+import { IFormField, TFinalFormField } from "../types";
+
+const Root = styled("div")`
+  display: flex;
+  flex-direction: column;
+  row-gap: ${({ theme }) => theme.spacing(1)};
+  @media (max-width: 640px) {
+    row-gap: 0;
+  }
+`;
+
+export interface IRecordFormProps<T extends IFormField> {
+  fields: T[];
+}
+
+export const SuperForm: FunctionComponent<IRecordFormProps<TFinalFormField>> = <
+  T extends IFormField
+>(
+  props: IRecordFormProps<T>
+): ReactElement => {
+  const { fields } = props;
+  const { renderField } = useSuperForm();
+
+  return <Root>{fields.map(renderField)}</Root>;
+};