more

src/Components/Case/CaseTypePage.js

@@ -1,4 +1,4 @@
-import { useEffect, useContext, useState } from "react";
+import { useEffect, useContext, useState, useRef } from "react";
 import { useNavigate } from "react-router-dom";
 import Button from "../../pageElements/Button";
 import Form from "react-bootstrap/Form";
@@ -6,12 +6,18 @@ import Col from "react-bootstrap/Col";
 import Row from "react-bootstrap/Row";
 import TextInput from "../../pageElements/TextInput";
 import Radiogroup from "../../pageElements/Radiogroup";
+import {
+  getFormDataDefaults,
+  getValidatedFormData,
+  handleFormDataChange,
+  isFormDataHasErrors,
+} from "../../Utils/Form";
 import { db } from "../../firebase";
 import { useParams } from "react-router-dom";
 import { AppContext } from "../../Hooks/useContext/appContext.js";
 import LoadingSpinner from "../../pageElements/LoadingSpinner";
 import { doc, onSnapshot } from "firebase/firestore";
-import { createCaseAdditionalFields as additionalFields } from "../../Constants/Fields/CreateCaseFields.js";
+import { createCaseAdditionalFields as fields } from "../../Constants/Fields/CreateCaseFields.js";
 import { objectMap } from "../../Utils/Object";
 
 const CaseTypePage = () => {
@@ -21,8 +27,10 @@ const CaseTypePage = () => {
   const { group } = appState;
   const [subCase, setSubCase] = useState(null);
   const [isLoading, setIsLoading] = useState(false);
-
+  const [selectedCaseTags, setSelectedCaseTags] = useState([]);
+  const typeaheadRef = useRef();
   const appUserId = group ? group.appUserId : null;
+  const [data, setData] = useState(fields);
 
   const handleNavigate = () => {
     navigate("/documents");
@@ -46,6 +54,20 @@ const CaseTypePage = () => {
 
   useEffect(getCase, [caseId, appUserId]);
 
+  const setSelectedTag = (item) => {
+    console.log("item in setSelectedTag ---------------------->", item);
+    const temp = [...selectedCaseTags, item.tagName];
+    setSelectedCaseTags(temp);
+    console.log("selectedCaseTags", selectedCaseTags);
+  };
+
+  const validateData = () => {
+    const newData = getValidatedFormData(data, fields);
+    const hasErrors = isFormDataHasErrors(newData);
+    setData(newData);
+    return hasErrors ? null : objectMap(({ value }) => value, newData);
+  };
+
   const ButtonContent = () => {
     return (
       <div className="details-button-container">
@@ -71,6 +93,9 @@ const CaseTypePage = () => {
       <div className="casetype-heading-container">
         <div>Additional Case Details</div>
         <div></div>
+        <Form>
+          <Row className="modal-caption-row"></Row>
+        </Form>
       </div>
     </div>
   );