- created forms for JSON, BOF2, UTMC and FTP

src/features/output/components/Output.tsx

@@ -1,13 +1,14 @@
 import { Formik, Form } from "formik";
 import BearerTypeCard from "./BearerTypeCard";
 import ChannelCard from "./ChannelCard";
+import type { FormTypes } from "../../../types/types";
 
 const Output = () => {
-  const handleSubmit = (values) => {
+  const handleSubmit = (values: FormTypes) => {
     console.log(values);
   };
 
-  const inititalValues = {
+  const inititalValues: FormTypes = {
     format: "JSON",
     enabled: true,
     backOfficeURL: "",
@@ -17,11 +18,22 @@ const Output = () => {
     readTimeoutSeconds: Number(15),
     overviewQuality: "HIGH",
     cropSizeFactor: "3/4",
+
+    // Bof2 -optional constants
+    FFID: "",
+    SCID: "",
+    timestampSource: "UTC",
+    GPSFormat: "Minutes",
+
+    //BOF2 - optional Lane IDs
+    laneId: "",
+    LID1: "",
+    LID2: "",
   };
 
   return (
     <Formik initialValues={inititalValues} onSubmit={handleSubmit}>
-      <Form>
+      <Form className="grid grid-cols-1 md:grid-cols-2">
         <BearerTypeCard />
         <ChannelCard />
       </Form>