dynamic-questionnaire-form 1.1.0

package/dist/esm/components/ComplianceQuestionarie/QuestionnaireForm.js

@@ -0,0 +1,1119 @@
+import { __assign, __spreadArray } from "tslib";
+/* eslint-disable @typescript-eslint/no-use-before-define */
+/* eslint-disable react/jsx-key */
+/* eslint-disable max-len */
+import React, { useEffect, useState } from "react";
+import { Field, reduxForm, getFormValues } from "redux-form";
+// import TextField from "../../commonFields/TextField";
+import { connect } from "react-redux";
+// import CheckboxGroup from "../../commonFields/CheckPanelGroup";
+import { Row, Col } from "reactstrap";
+// import "./styles.css";
+// import SelectButtonField from "../../commonFields/SelectButtonField";
+import { Button } from "reactstrap";
+// import MultipleSelectField from "../../commonFields/MultipleSelectField";
+// import { Question, QuestionOption, saveQuestionReview } from "../../Models/Shared/QuestionaryModule/Question";
+// import FileDropZoneField from "../../commonFields/FileUpload";
+// import CheckPanelBox from "../../commonFields/CheckPanelBox";
+// import DatePicker from "../../commonFields/DatePicker";
+// import normalizePhone from "../../Utils/normalise";
+// import EmailField from "../../commonFields/EmailField";
+import { Label } from "reactstrap";
+// import { QuestionTypes } from "../../Helpers/QuestionTypes";
+// import YesOrNo from "../../commonFields/YesOrNoSelectBox";
+// import CheckSpan from "../../commonFields/CheckSpan";
+import _ from "lodash";
+import flagPlane from "../../images/flagPlane.svg";
+import redFlag from "../../images/red-flag.svg";
+import writingredFlag from "../../images/writingredFlag.svg";
+import check from "../../images/check.svg";
+import checkedPlane from "../../images/checkedPlane.svg";
+import checked from "../../images/checked.svg";
+import writing from "../../images/writing.svg";
+import history from "../../images/history.svg";
+import help from "../../images/help.svg";
+import cross from "../../images/x.svg";
+import comment from "../../images/comment.svg";
+import oval from "../../images/Oval.svg";
+import CheckOval from "../../images/checkOval.svg";
+// import SelectField from "../../commonFields/SelectField";
+// import CustomerService from "../../Services/CustomerService";
+// import { AxiosResponse } from "axios";
+import { Modal } from "reactstrap";
+// import { HistoryInfo } from "../../Models/Compliance/History";
+import { ModalHeader, Collapse } from "reactstrap";
+// import { OverallPercentage } from "../../Models/Lead/GetResponseCategoreis";
+// import { useParams } from "react-router-dom";
+import backGray from "../../images/backGray.svg";
+import moment from "moment";
+// import { BankUserContext } from "../../bankUserContext";
+import { ModalBody } from "reactstrap";
+// import MessageChatWindowFC from "../PortalPage/MessageChatWindowFC";
+// import { MessageThread } from "../../Models/MessageCenter/MessageThread";
+// import { LeadDetailsModel } from "../../Models/Lead/LeadDetails";
+import { Nav, Tab } from "react-bootstrap";
+// import { MessageThreadImpl } from "./MessageThread";
+import Accordion from 'react-bootstrap/Accordion';
+import { Card } from "react-bootstrap";
+// import FutureDatePicker from "../../commonFields/FutureDatePicker";
+// import PastDatePicker from "../../commonFields/PastDatePicker";
+// import SSNField from "../../commonFields/SSNField";
+// import NormaliseSSN from "../../Utils/NormaliseSSN";
+import { toast } from "react-toastify";
+import { FormGroup } from "reactstrap";
+import copy from "copy-to-clipboard";
+// import NormalizeNumber from "../../Utils/NormalizeNumber";
+// import normaliseZipcode from "../../Utils/normaliseZipCode";
+import copyImage from "../../images/copy.svg";
+import FlaggReasonForm from "./FlaggReasonForm";
+import NewTaskForm from "./NewTaskForm";
+// import { transformDateWithoutTime } from "../../Utils/dateUtil";
+// import MessageCenterModal from "../PortalPage/MessageCenterModal";
+import deleteImg from "../../images/delete.svg";
+import { QuestionTypes, transformDateWithoutTime } from "../../helpers/GenericHelpers";
+import { CheckPanelBox, CheckboxGroup, EmailField, FutureDatePicker, MultipleSelectField, PastDatePicker, PhoneNumberField, SSNField, SelectButtonFieldOptions, SelectField, TextField, FileDropZoneField, YesOrNo, Datepicker, checkspan2, MultiCheckboxGroup, SingleCheckBox, DisableTextField } from "common-fields";
+import { NormaliseSSN, NormalizeNumber, normaliseZipcode, normalizePhone, normalizeTextarea, NormalizeTax, normalizeFax, normalizeAlphanumeric, NormalizeText, NormaliseFedTaxSSN, NormalizeDecimalNumber, NormalizeTime, NormalizeEIN, NormalizeRoutingNumber, normalizeNumericId, normalizeMonth } from "../../helpers/NormalizeHelpers";
+var QuestionnaireForm = function (props) {
+    var _a, _b, _c, _d;
+    // const service = new CustomerService();
+    var currentQuestions = props.currentQuestions;
+    // const { clientId } = useParams();
+    // state for modal popup
+    var _e = useState(false), historyModel = _e[0], setHistoryModal = _e[1];
+    var _f = useState(false), guidanceModel = _f[0], setGuidanceModel = _f[1];
+    // const [complianceStatusData, setComplianceStatusData] = useState<OverallPercentage>()
+    // const bankUserContext = useContext(BankUserContext);
+    // const [messageModal, setMessageModal] = useState(false);
+    // const [refreshCounter, setRefreshCounter] = React.useState(0);
+    // const [clientDeatils, setClientDetails] = useState<LeadDetailsModel>();
+    // const [selectedQuestion, setSelectedQuestion] = useState<Question>();
+    // const [clientUserId, setClientUserId] =  useState<string>("0");
+    // const [selectedMessageThread, setSelectedMessageThread] = React.useState<MessageThread>(new MessageThreadImpl());
+    var guidance = useState()[0];
+    var _g = useState([]), notesForm = _g[0], setNotes = _g[1];
+    var questionHistory = useState()[0];
+    var _h = useState(0), guidanceToggle = _h[0], setGuidanceToggle = _h[1];
+    var _j = useState(false), flagModal = _j[0], setFlagModal = _j[1];
+    var _k = useState(), flaggedQuestion = _k[0], setFlaggedQuestion = _k[1];
+    var _l = useState(false), markTaskModal = _l[0], setMarkTaskModal = _l[1];
+    var _m = useState(), naTaskQuestion = _m[0], setNATaskQuestion = _m[1];
+    var _o = useState(null), previousFormValues = _o[0], setPreviousFormValues = _o[1];
+    var _p = useState(false), isEditFlagNotes = _p[0], setIsEditFlagNotes = _p[1];
+    useEffect(function () {
+        // service
+        //   .getComplianceOverallPercentage(clientId)
+        //   .then((response: AxiosResponse<OverallPercentage>) => {
+        //   });
+        // console.log(props.status);
+        // setComplianceStatusData(props.status);
+        // service.getUserIdByClientId(clientId).then(resp=>{
+        //   setClientUserId(resp?.data?.userId);
+        // })
+        // service.getClientLeadInfoDetails(clientId).then((response: AxiosResponse<LeadDetailsModel>) =>
+        //  {setClientDetails(response.data)}).catch((error: any) => {
+        //   console.log(error);
+        //     toast.error("Something went Wrong")         
+        // })
+    }, []);
+    useEffect(function () {
+        var _a, _b, _c, _d;
+        var _e;
+        if (props.disableFields) {
+            return;
+        }
+        else {
+            if (!props.formValues) {
+                return;
+            }
+            if (Object.keys(props.formValues).length === 0) {
+                return;
+            }
+            var CombinedValues = __assign(__assign({}, props.formInitialvalues), props.reviewValues);
+            if (!previousFormValues && _(props.formInitialvalues).differenceWith(CombinedValues, _.isEqual).isEmpty()) {
+                setPreviousFormValues(_.cloneDeep(props.formValues));
+                return;
+            }
+            //identify the questionid currently editing
+            var clientQuestionId_1 = 0;
+            if (previousFormValues) {
+                Object.keys(props.formValues).forEach(function (key) {
+                    var _a;
+                    if (((_a = Object.keys(previousFormValues)) === null || _a === void 0 ? void 0 : _a.indexOf(key)) == -1) {
+                        clientQuestionId_1 = key.replace("question_", "");
+                    }
+                    if (_.isEqual(previousFormValues[key], props.formValues[key]) == false) {
+                        clientQuestionId_1 = key.replace("question_", "");
+                    }
+                });
+            }
+            else {
+                clientQuestionId_1 =
+                    (_e = Object.keys(props.formValues)[0]) === null || _e === void 0 ? void 0 : _e.replace("question_", "");
+            }
+            var currentQuestion = currentQuestions.find(function (m) { return m.clientQuestionId == clientQuestionId_1; });
+            if (currentQuestion) {
+                // const questionId = currentQuestion.questionId;
+                if (currentQuestion.questionType !== QuestionTypes.Text &&
+                    currentQuestion.questionType !== QuestionTypes.TextArea &&
+                    currentQuestion.questionType !== QuestionTypes.Email &&
+                    currentQuestion.questionType !== QuestionTypes.PhoneNumber &&
+                    currentQuestion.questionType !== QuestionTypes.SSN &&
+                    currentQuestion.questionType !== QuestionTypes.EIN &&
+                    currentQuestion.questionType !== QuestionTypes.Number &&
+                    currentQuestion.questionType !== QuestionTypes.Currency &&
+                    currentQuestion.questionType !== QuestionTypes.ZipCode &&
+                    currentQuestion.questionType !== QuestionTypes.TaxId &&
+                    currentQuestion.questionType !== QuestionTypes.AlphaNumeric &&
+                    currentQuestion.questionType !== QuestionTypes.FaxId &&
+                    currentQuestion.questionType !== QuestionTypes.disableTextField &&
+                    currentQuestion.questionType !== QuestionTypes.LabelText &&
+                    currentQuestion.questionType !== QuestionTypes.NumericId &&
+                    currentQuestion.questionType !== QuestionTypes.NumberOfMonths) {
+                    var oldAnswer = previousFormValues
+                        ? previousFormValues["question_" + clientQuestionId_1]
+                        : null;
+                    if (Array.isArray(oldAnswer)) {
+                        // eslint-disable-next-line no-prototype-builtins
+                        if (!File.prototype.isPrototypeOf(oldAnswer[0])) {
+                            props.saveQuestion((_a = {}, _a[clientQuestionId_1] = props.formValues["question_" + clientQuestionId_1], _a), (_b = {}, _b[clientQuestionId_1] = oldAnswer, _b));
+                        }
+                    }
+                    else {
+                        props.saveQuestion((_c = {}, _c[clientQuestionId_1] = props.formValues["question_" + clientQuestionId_1], _c), (_d = {}, _d[clientQuestionId_1] = oldAnswer, _d));
+                    }
+                }
+            }
+            setPreviousFormValues(_.cloneDeep(props.formValues));
+        }
+    }, [props.formValues]);
+    var historyModalViewHandler = function () {
+        setHistoryModal(!historyModel);
+    };
+    var guidanceModelHandler = function () {
+        setGuidanceModel(true);
+    };
+    var closeHistoryModalViewHandler = function () {
+        setHistoryModal(false);
+    };
+    var flagModalViewHandler = function () {
+        setFlagModal(!flagModal);
+    };
+    var naTaskViewHandler = function () {
+        setMarkTaskModal(!markTaskModal);
+        setNATaskQuestion(null);
+    };
+    var closeGuidanceModelHandler = function () {
+        setGuidanceModel(false);
+        setGuidanceToggle(0);
+    };
+    var Flagtoggle = function (question, isEdit) {
+        if (statusChange(question)) {
+            setFlagModal(function (prev) { return !prev; });
+            setFlaggedQuestion(question);
+            setIsEditFlagNotes(isEdit);
+        }
+    };
+    var markTaskToggle = function (question) {
+        if (statusChange(question)) {
+            setMarkTaskModal(function (prev) { return !prev; });
+            setNATaskQuestion(question);
+        }
+    };
+    { /* Removed Send Message functionality as per new requirements */ }
+    var copyQuestion = function (question, questionsData) {
+        var _a, _b, _c, _d, _e, _f, _g;
+        var copyText = [];
+        var answersList = [];
+        if (questionsData === undefined) {
+            if (question.questionType === QuestionTypes.Text
+                || question.questionType === QuestionTypes.TextArea
+                || question.questionType === QuestionTypes.SSN
+                || question.questionType === QuestionTypes.EIN
+                || question.questionType === QuestionTypes.PhoneNumber
+                || question.questionType === QuestionTypes.Email
+                || question.questionType === QuestionTypes.Number
+                || question.questionType === QuestionTypes.Currency
+                || question.questionType === QuestionTypes.ZipCode
+                || question.questionType === QuestionTypes.FaxId
+                || question.questionType === QuestionTypes.disableTextField
+                || question.questionType === QuestionTypes.TaxId
+                || question.questionType === QuestionTypes.AlphaNumeric
+                || question.questionType === QuestionTypes.NumericId
+                || question.questionType === QuestionTypes.NumberOfMonths) {
+                ((_a = question === null || question === void 0 ? void 0 : question.answers[0]) === null || _a === void 0 ? void 0 : _a.answer) !== undefined && copyText.push("".concat(question.questionText, ":").concat((_b = question === null || question === void 0 ? void 0 : question.answers[0]) === null || _b === void 0 ? void 0 : _b.answer, " \n"));
+            }
+            if (question.questionType === QuestionTypes.DatePicker
+                || question.questionType === QuestionTypes.DatePicker
+                || question.questionType === QuestionTypes.DOB
+                || question.questionType === QuestionTypes.PastDatePicker
+                || question.questionType === QuestionTypes.FutureDatePicker) {
+                var answerTime = transformDateWithoutTime((_c = question === null || question === void 0 ? void 0 : question.answers[0]) === null || _c === void 0 ? void 0 : _c.answer);
+                ((_d = question === null || question === void 0 ? void 0 : question.answers[0]) === null || _d === void 0 ? void 0 : _d.answer) !== undefined && copyText.push("".concat(question.questionText, ":").concat(answerTime, " \n"));
+            }
+            if (question.questionType === QuestionTypes.YesOrNo
+                || question.questionType === QuestionTypes.SingleSelectionDropDown
+                || question.questionType === QuestionTypes.SingleSelectionCheckBox
+                || question.questionType === QuestionTypes.SingleSelectionBoxSelection
+                || question.questionType === QuestionTypes.AddressSelectionCheckBox) {
+                var answeredOption = question.options.find(function (el) { var _a; return el.value == ((_a = question.answers[0]) === null || _a === void 0 ? void 0 : _a.answer); });
+                (answeredOption === null || answeredOption === void 0 ? void 0 : answeredOption.text) !== undefined && copyText.push("".concat(question.questionText, ":").concat(answeredOption === null || answeredOption === void 0 ? void 0 : answeredOption.text, " \n"));
+            }
+            if (question.questionType === QuestionTypes.MultiSelectionBoxSelection
+                || question.questionType === QuestionTypes.MultiSelectionDropdown
+                || question.questionType === QuestionTypes.MultiSelectionCheckBox) {
+                question.options.map(function (el) {
+                    question === null || question === void 0 ? void 0 : question.answers.forEach(function (els) {
+                        if (el.value == els.answer) {
+                            answersList.push(el.text);
+                        }
+                    });
+                });
+                answersList.toString() !== undefined && copyText.push("".concat(question.questionText, ":").concat(answersList === null || answersList === void 0 ? void 0 : answersList.toString(), " \n"));
+            }
+            if (question.questionType === QuestionTypes.FileUpload
+                || question.questionType === QuestionTypes.PDFFileUpload) {
+                var variable = typeof ((_e = question === null || question === void 0 ? void 0 : question.answers[0]) === null || _e === void 0 ? void 0 : _e.answer) === 'object' ? JSON.stringify((_f = question === null || question === void 0 ? void 0 : question.answers[0]) === null || _f === void 0 ? void 0 : _f.answer)
+                    : (_g = question === null || question === void 0 ? void 0 : question.answers[0]) === null || _g === void 0 ? void 0 : _g.answer;
+                var parsed = JSON.parse(variable);
+                // let ans="";
+                if (parsed) {
+                    // ans=parsed.fileName
+                }
+                else {
+                    copyText.push("".concat(question.questionText, ":").concat(" ", " \n"));
+                }
+            }
+        }
+        else {
+            copyText.push("".concat(question.complianceGroupName, " \n"));
+            questionsData === null || questionsData === void 0 ? void 0 : questionsData.forEach(function (element) {
+                var _a, _b, _c, _d, _e, _f, _g, _h;
+                if (element.questionType === QuestionTypes.Text
+                    || element.questionType === QuestionTypes.TextArea
+                    || element.questionType === QuestionTypes.SSN
+                    || element.questionType === QuestionTypes.EIN
+                    || element.questionType === QuestionTypes.PhoneNumber
+                    || element.questionType === QuestionTypes.Email
+                    || element.questionType === QuestionTypes.Number
+                    || element.questionType === QuestionTypes.Currency
+                    || element.questionType === QuestionTypes.ZipCode
+                    || element.questionType === QuestionTypes.TaxId
+                    || element.questionType === QuestionTypes.AlphaNumeric
+                    || element.questionType === QuestionTypes.FaxId
+                    || element.questionType === QuestionTypes.disableTextField
+                    || element.questionType === QuestionTypes.NumericId
+                    || element.questionType === QuestionTypes.NumberOfMonths) {
+                    ((_a = element === null || element === void 0 ? void 0 : element.answers[0]) === null || _a === void 0 ? void 0 : _a.answer) !== undefined && copyText.push("".concat(element.questionText, ":").concat((_b = element === null || element === void 0 ? void 0 : element.answers[0]) === null || _b === void 0 ? void 0 : _b.answer, " \n"));
+                }
+                if (element.questionType === QuestionTypes.DatePicker
+                    || element.questionType === QuestionTypes.DatePicker
+                    || element.questionType === QuestionTypes.DOB
+                    || element.questionType === QuestionTypes.PastDatePicker
+                    || element.questionType === QuestionTypes.FutureDatePicker) {
+                    var answerTime = transformDateWithoutTime((_c = element === null || element === void 0 ? void 0 : element.answers[0]) === null || _c === void 0 ? void 0 : _c.answer);
+                    ((_d = element === null || element === void 0 ? void 0 : element.answers[0]) === null || _d === void 0 ? void 0 : _d.answer) !== undefined && copyText.push("".concat(element.questionText, ":").concat(answerTime, " \n"));
+                }
+                if (element.questionType === QuestionTypes.YesOrNo
+                    || element.questionType === QuestionTypes.SingleSelectionDropDown
+                    || element.questionType === QuestionTypes.SingleSelectionCheckBox
+                    || element.questionType === QuestionTypes.SingleSelectionBoxSelection) {
+                    var answeredOption = element.options.find(function (el) { var _a; return el.value == ((_a = element.answers[0]) === null || _a === void 0 ? void 0 : _a.answer); });
+                    (answeredOption === null || answeredOption === void 0 ? void 0 : answeredOption.text) !== undefined && copyText.push("".concat(element.questionText, ":").concat(answeredOption === null || answeredOption === void 0 ? void 0 : answeredOption.text, " \n"));
+                }
+                if (element.questionType === QuestionTypes.MultiSelectionBoxSelection
+                    || element.questionType === QuestionTypes.MultiSelectionDropdown
+                    || element.questionType === QuestionTypes.MultiSelectionCheckBox) {
+                    element.options.map(function (el) {
+                        element === null || element === void 0 ? void 0 : element.answers.forEach(function (els) {
+                            if (el.value == els.answer) {
+                                answersList.push(el.text);
+                            }
+                        });
+                    });
+                    answersList.toString() !== undefined && copyText.push("".concat(question.questionText, ":").concat(answersList.toString(), " \n"));
+                }
+                if (element.questionType === QuestionTypes.FileUpload && ((_e = element === null || element === void 0 ? void 0 : element.answers[0]) === null || _e === void 0 ? void 0 : _e.answer)) {
+                    var parsed = JSON.parse((_f = element === null || element === void 0 ? void 0 : element.answers[0]) === null || _f === void 0 ? void 0 : _f.answer);
+                    var ans = "";
+                    if (parsed) {
+                        ans = parsed.fileName;
+                    }
+                    ans !== undefined && copyText.push("".concat(element.questionText, ":").concat(ans, " \n"));
+                }
+                if (element.questionType === QuestionTypes.PDFFileUpload && ((_g = element === null || element === void 0 ? void 0 : element.answers[0]) === null || _g === void 0 ? void 0 : _g.answer)) {
+                    var parsed = JSON.parse((_h = element === null || element === void 0 ? void 0 : element.answers[0]) === null || _h === void 0 ? void 0 : _h.answer);
+                    var ans = "";
+                    if (parsed) {
+                        ans = parsed.fileName;
+                    }
+                    ans !== undefined && copyText.push("".concat(element.questionText, ":").concat(ans, " \n"));
+                }
+            });
+        }
+        copy(copyText.join(''));
+        toast.success("Text copied to clipboard");
+    };
+    var copyQuestionPanel = function (question, questionsData) {
+        return (React.createElement("span", { onClick: function () { return copyQuestion(question, questionsData); } }, "Copy Text"));
+    };
+    var selectOptions = function (question, questionsData) {
+        return (React.createElement("div", { className: "selectOptions" },
+            React.createElement("div", { className: "optionDisplay" },
+                question.reviewAccepted ? (React.createElement("div", { className: "".concat(statusChange(question) ? "containerPointer" : "containerCursor"), onClick: function () { return onAccept(question); } },
+                    React.createElement("img", { src: checked }),
+                    " ",
+                    React.createElement("span", null, "Accepted"))) : (React.createElement("div", { className: "".concat(statusChange(question) ? "containerPointer" : "containerCursor"), onClick: function () { return onAccept(question); } },
+                    React.createElement("img", { src: checkedPlane }),
+                    " ",
+                    React.createElement("span", null, "Accept"))),
+                question.reviewFlagged ? (React.createElement("div", { className: "".concat(statusChange(question) ? "containerPointer" : "containerCursor"), onClick: function () { return onFlagged(question); } },
+                    React.createElement("img", { src: redFlag }),
+                    " ",
+                    React.createElement("span", null, " Flagged "))) : React.createElement("div", { className: "".concat(statusChange(question) ? "containerPointer" : "containerCursor"), onClick: function () { return Flagtoggle(question, false); } },
+                    React.createElement("img", { src: flagPlane }),
+                    " ",
+                    React.createElement("span", null, " Flag ")),
+                React.createElement("div", { className: "".concat(statusChange(question) ? "containerPointer" : "containerCursor"), onClick: function () { return setNotesFrame(question); } },
+                    React.createElement("img", { src: writing }),
+                    " ",
+                    React.createElement("span", null, " Add Notes")),
+                React.createElement("div", { className: "containerPointer" },
+                    React.createElement("img", { src: copyImage }),
+                    copyQuestionPanel(question, questionsData))),
+            React.createElement("div", { className: "bottom containerPointer", onClick: function () { return getGuidance(question); } },
+                React.createElement("img", { src: help }),
+                " ",
+                React.createElement("span", null, " Guidance "))));
+    };
+    var statusChange = function (question) {
+        if (props.disableActions) {
+            return false;
+        }
+        else if (question.naFlag) {
+            return false;
+        }
+        else {
+            return true;
+        }
+    };
+    // const isAllowed=(question:Question)=>{
+    //   if(props.status == "REVIEW_COMPLETED" || props.status == "MANAGEMENT_REVIEW" )
+    //   {
+    //     return false;
+    //   }
+    //     return true;
+    // }
+    var onAcceptAllowed = function (question) {
+        if (question.complianceCategoryStatus) {
+            if ((question.answers && question.answers[0] || question.naFlag ||
+                question.reviewFlagged || question.reviewNotes !== null)) {
+                return true;
+            }
+            else
+                return false;
+        }
+        else
+            return true;
+    };
+    var onAccept = function (question) {
+        if (!props.disableActions) {
+            if (onAcceptAllowed(question)) {
+                var body_1 = {
+                    accepted: !question.reviewAccepted,
+                    flagged: question.reviewFlagged,
+                    items: [],
+                    notes: question.reviewNotes,
+                    infoId: 1,
+                    flaggedReason: props === null || props === void 0 ? void 0 : props.formValues.flaggedReason,
+                    naReason: question.naReason,
+                    naFlag: question.naFlag
+                };
+                if (question.complianceGroupId) {
+                    currentQuestions.filter(function (m) { return m.complianceGroupId == question.complianceGroupId &&
+                        m.serialNumber == question.serialNumber; }).map(function (m) { return (body_1.items = __spreadArray(__spreadArray([], body_1.items, true), [{
+                            clientQuestionId: m.clientQuestionId,
+                            reviewClientQuestionId: m.reviewClientQuestionId
+                        }], false)); });
+                }
+                else {
+                    body_1.items = [{
+                            clientQuestionId: question.clientQuestionId,
+                            reviewClientQuestionId: question.reviewClientQuestionId
+                        }];
+                }
+                props.postsavequestion(body_1);
+            }
+            else {
+                toast.error("An action must be taken");
+            }
+        }
+    };
+    var naFlagged = function (question, value) {
+        props.preparenextquestion(question, value);
+    };
+    var confirmRemoveNaFlag = function (question) {
+        var body = {
+            accepted: question.reviewAccepted,
+            flagged: question.reviewFlagged,
+            items: [],
+            notes: question.reviewNotes,
+            infoId: 4,
+            flaggedReason: question.flaggedReason,
+            naReason: question.naReason,
+            naFlag: false
+        };
+        if (question.complianceGroupId) {
+            currentQuestions.filter(function (m) { return m.complianceGroupId == question.complianceGroupId &&
+                m.serialNumber == question.serialNumber; }).map(function (m) { return (body.items = __spreadArray(__spreadArray([], body.items, true), [{
+                    clientQuestionId: m.clientQuestionId,
+                    reviewClientQuestionId: m.reviewClientQuestionId
+                }], false)); });
+        }
+        else {
+            body.items = [{
+                    clientQuestionId: question.clientQuestionId,
+                    reviewClientQuestionId: question.reviewClientQuestionId
+                }];
+        }
+        props.postsavequestion(body);
+    };
+    var onFlagged = function (question) {
+        if (statusChange(question)) {
+            var body_2 = {
+                accepted: question.reviewAccepted,
+                flagged: !question.reviewFlagged,
+                items: [],
+                notes: question.reviewNotes,
+                infoId: 2,
+                flaggedReason: props === null || props === void 0 ? void 0 : props.formValues.flaggedReason,
+                naReason: question.naReason,
+                naFlag: question.naFlag
+            };
+            if (question.complianceGroupId) {
+                currentQuestions.filter(function (m) { return m.complianceGroupId == question.complianceGroupId &&
+                    m.serialNumber == question.serialNumber; }).map(function (m) { return (body_2.items = __spreadArray(__spreadArray([], body_2.items, true), [{
+                        clientQuestionId: m.clientQuestionId,
+                        reviewClientQuestionId: m.reviewClientQuestionId
+                    }], false)); });
+            }
+            else {
+                body_2.items = [{
+                        clientQuestionId: question.clientQuestionId,
+                        reviewClientQuestionId: question.reviewClientQuestionId
+                    }];
+            }
+            props.postsavequestion(body_2);
+        }
+    };
+    var onAddNotes = function (question) {
+        var _a;
+        if (statusChange(question)) {
+            var notes = props.formValues["questionReview_" + question.clientQuestionId.toString()];
+            var body_3 = {
+                accepted: question.reviewAccepted,
+                flagged: question.reviewFlagged,
+                notes: notes,
+                infoId: 3,
+                items: [],
+                flaggedReason: props === null || props === void 0 ? void 0 : props.formValues.flaggedReason,
+                naReason: (_a = props === null || props === void 0 ? void 0 : props.formValues) === null || _a === void 0 ? void 0 : _a.naReason,
+                naFlag: question.naFlag,
+            };
+            if (question.complianceGroupId) {
+                currentQuestions.filter(function (m) { return m.complianceGroupId == question.complianceGroupId &&
+                    m.serialNumber == question.serialNumber; }).map(function (m) { return (body_3.items = __spreadArray(__spreadArray([], body_3.items, true), [{
+                        clientQuestionId: m.clientQuestionId,
+                        reviewClientQuestionId: m.reviewClientQuestionId
+                    }], false)); });
+            }
+            else {
+                body_3.items = [{
+                        clientQuestionId: question.clientQuestionId,
+                        reviewClientQuestionId: question.reviewClientQuestionId
+                    }];
+            }
+            props.postsavequestion(body_3);
+            closeFrame(question);
+        }
+    };
+    var setNotesFrame = function (question) {
+        if (statusChange(question)) {
+            var notes = __spreadArray([], notesForm, true);
+            if (!notesForm.includes(question.clientQuestionId)) {
+                notes.push(question.clientQuestionId);
+                setNotes(notes);
+            }
+        }
+    };
+    var closeFrame = function (question) {
+        var notes = __spreadArray([], notesForm, true);
+        if (notesForm.includes(question.clientQuestionId)) {
+            var id = notes === null || notes === void 0 ? void 0 : notes.indexOf(question.clientQuestionId);
+            notes.splice(id, 1);
+        }
+        else {
+            //notes.push(question.clientQuestionId)
+        }
+        props.change("questionReview_".concat(question.clientQuestionId), question.reviewNotes);
+        setNotes(notes);
+    };
+    var notesFrame = function (question) {
+        return (React.createElement(Row, null,
+            React.createElement(Col, { md: "10" },
+                React.createElement(Row, null,
+                    React.createElement(Col, { md: "12" },
+                        React.createElement("span", null, "Notes:")),
+                    React.createElement(Col, { className: "editNotesArea" },
+                        React.createElement(Field, { component: TextField, name: "questionReview_" + question.clientQuestionId.toString(), type: "textarea", normalize: normalizeTextarea })))),
+            React.createElement(Col, { md: "2 close" },
+                React.createElement(Row, null,
+                    React.createElement(Col, { md: "12 cross" },
+                        React.createElement("img", { src: cross, onClick: function () { return closeFrame(question); } })),
+                    React.createElement(Col, { className: "saveButton" },
+                        React.createElement(Button, { type: "button", onClick: function () { return onAddNotes(question); } }, "Save"))))));
+    };
+    var layoutSet = function (layoutCoulmns) {
+        if (layoutCoulmns) {
+            return layoutCoulmns;
+        }
+        return 12;
+    };
+    var getHistory = function (reviewClientQuestionId, clientQuestionId) {
+        // clientQuestionId && getQuestionThread(clientQuestionId, 'history');
+        props.onClickHistory(reviewClientQuestionId, clientQuestionId);
+        if (reviewClientQuestionId !== null) {
+            // service
+            //   .getIteamHistory(reviewClientQuestionId)
+            //   .then((response: AxiosResponse<Array<HistoryInfo>>) => {
+            //     setQuestionHistory(response.data);
+            //     historyModalViewHandler();
+            //   });
+        }
+        else {
+            // historyModalViewHandler();
+            // toast.error("No history found")
+        }
+    };
+    var getGuidance = function (question) {
+        var idList = [];
+        if (question.complianceGroupId) {
+            currentQuestions.filter(function (m) { return m.complianceGroupId == question.complianceGroupId &&
+                m.serialNumber == question.serialNumber; }).map(function (m) { return (idList = __spreadArray(__spreadArray([], idList, true), [m.questionId], false)); });
+        }
+        else {
+            idList = [question.questionId];
+        }
+        props.onClickGuidance(idList);
+        // service.getQuestionGuidance({ questionId: idList }).then((response: any) => {
+        //   setGuidance(response.data)
+        //   setGuidanceModel(true)
+        // })
+    };
+    var findGroupSearialNumbers = function (complianceGroupId) {
+        var serialNumbers = [];
+        currentQuestions.filter(function (m) { return m.complianceGroupId == complianceGroupId; })
+            .forEach(function (m) {
+            if ((serialNumbers === null || serialNumbers === void 0 ? void 0 : serialNumbers.indexOf(m.serialNumber)) == -1) {
+                serialNumbers.push(m.serialNumber);
+            }
+        });
+        return serialNumbers.sort();
+    };
+    var addCustomQuestion = function (body) {
+        props.addCustomQuestion(body);
+    };
+    var removeCustomQuestion = function () {
+        props.removeCustomQuestion();
+    };
+    var fillHeadertemplate = function (question, serialNumber) {
+        if (question.questionGroupHeaderTemplate) {
+            if (question && question.questionGroupHeaderTemplate) {
+                var regex = new RegExp("(?:{)([^}]*)(?:})", "g");
+                // eslint-disable-next-line no-var
+                var match, questionIds = [];
+                while ((match = regex.exec(question.questionGroupHeaderTemplate)))
+                    questionIds.push(parseInt(match[1]));
+                var questions = currentQuestions.filter(function (m) { return (questionIds === null || questionIds === void 0 ? void 0 : questionIds.indexOf(m.questionId)) > -1
+                    && m.serialNumber == serialNumber; });
+                var template_1 = question === null || question === void 0 ? void 0 : question.questionGroupHeaderTemplate;
+                questions.forEach(function (m) {
+                    var _a, _b;
+                    if (m.answers && ((_a = m.answers) === null || _a === void 0 ? void 0 : _a.length) > 0) {
+                        template_1 = template_1.replace("{".concat(m.questionId, "}"), ((_b = moment(m.answers[0].answer)) === null || _b === void 0 ? void 0 : _b.isValid()) &&
+                            (m.questionType === QuestionTypes.DatePicker ||
+                                m.questionType === QuestionTypes.FutureDatePicker ||
+                                m.questionType === QuestionTypes.PastDatePicker) ?
+                            moment(m.answers[0].answer).format("MM/DD/yyyy") :
+                            m.answers[0].answer);
+                    }
+                    else {
+                        template_1 = template_1.replace("{".concat(m.questionId, "}"), "--");
+                    }
+                });
+                template_1 = template_1.replace('[', '<b>').replace(']', '</b>');
+                return React.createElement("div", { dangerouslySetInnerHTML: { __html: template_1 } });
+            }
+        }
+        return "";
+    };
+    var removeAddedQuestion = function (question, value) {
+        if (statusChange(question))
+            props.preparenextquestion(question, value, true);
+    };
+    var cancelRemoveProcess = function (question, value) {
+        props.preparenextquestion(question, value, true);
+    };
+    var renderQuestions = function () {
+        var complianceGroupIds = [];
+        var dependentQuestionGroupIds = [];
+        return currentQuestions
+            // .sort((q1:Question, q2:Question)=>{
+            //   const temp1:number =new Date(q1.createdDate).getTime();
+            //   const temp2:number =new Date(q2.createdDate).getTime();
+            //   return temp2-temp1;})
+            .map(function (question) {
+            var _a;
+            if (question.complianceGroupId &&
+                (complianceGroupIds === null || complianceGroupIds === void 0 ? void 0 : complianceGroupIds.indexOf(question.complianceGroupId)) > -1) {
+                return null;
+            }
+            if (question.complianceGroupId &&
+                (complianceGroupIds === null || complianceGroupIds === void 0 ? void 0 : complianceGroupIds.indexOf(question.complianceGroupId)) == -1) {
+                complianceGroupIds === null || complianceGroupIds === void 0 ? void 0 : complianceGroupIds.push(question.complianceGroupId);
+            }
+            if (question.complianceGroupId == null) {
+                if (question.denpendentQuestionGroupId &&
+                    (dependentQuestionGroupIds === null || dependentQuestionGroupIds === void 0 ? void 0 : dependentQuestionGroupIds.indexOf(question.denpendentQuestionGroupId)) > -1) {
+                    return null;
+                }
+                if (question.denpendentQuestionGroupId &&
+                    (dependentQuestionGroupIds === null || dependentQuestionGroupIds === void 0 ? void 0 : dependentQuestionGroupIds.indexOf(question.denpendentQuestionGroupId)) == -1) {
+                    dependentQuestionGroupIds === null || dependentQuestionGroupIds === void 0 ? void 0 : dependentQuestionGroupIds.push(question.denpendentQuestionGroupId);
+                }
+            }
+            return (React.createElement(Col, { key: question.questionId, sm: "12", className: "DynoLayout", md: 12 },
+                question.isRepetitive == false ?
+                    React.createElement(React.Fragment, null, !notesForm.includes(question === null || question === void 0 ? void 0 : question.clientQuestionId) ? (React.createElement(React.Fragment, null,
+                        " ",
+                        question.reviewNotes && ((_a = question.reviewNotes) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (React.createElement(Row, { className: "notesShowReview" },
+                            React.createElement("div", { className: "show" },
+                                React.createElement("span", { className: "head" }, "Notes:"),
+                                " \u00A0\u00A0\u00A0",
+                                React.createElement("span", { className: "content" }, question.reviewNotes)))) : (""))) : (React.createElement(Row, { className: "notes" },
+                        React.createElement(Col, null, notesFrame(question))))) : '',
+                question.complianceGroupId ? (React.createElement(React.Fragment, null,
+                    question.isRepetitive &&
+                        React.createElement(React.Fragment, null,
+                            " ",
+                            renderRepetativeQuestionGroup(question)),
+                    question.isRepetitive == false &&
+                        React.createElement(React.Fragment, null,
+                            " ",
+                            renderQuestionGroup(question)))) : React.createElement(React.Fragment, null),
+                question.complianceGroupId == null && question.denpendentQuestionGroupId && (React.createElement(React.Fragment, null, renderDependentQuestionGroup(question, 0))),
+                question.complianceGroupId == null && question.denpendentQuestionGroupId == null && (React.createElement("div", { className: "box" },
+                    question.naCustomDelete && React.createElement("div", { className: "overlay" },
+                        React.createElement("p", { className: "removeDesignation" }, "Remove N/A Designation?"),
+                        React.createElement("button", { type: "button", className: "confirmMessage", onClick: function () { return confirmRemoveNaFlag(question); } }, "Confirm"),
+                        React.createElement("span", { className: "CancelNaCustom", onClick: function () { return naFlagged(question, false); } }, "Cancel")),
+                    question.removeCustomQuestion && React.createElement("div", { className: "overlay" },
+                        React.createElement("p", { className: "removeDesignation" }, "Remove This Task?"),
+                        React.createElement("button", { type: "button", className: "confirmMessage confirmMessageDelete", onClick: function () { return props.removeQuestion(question); } }, "Confirm"),
+                        React.createElement("span", { className: "CancelNaCustom", onClick: function () { return cancelRemoveProcess(question, false); } }, "Cancel")),
+                    React.createElement(Row, { className: "field ".concat(question.naFlag && "fieldNaFlag", " ").concat(question.reviewFlagged ? "fieldFlagRed mb-3" : "mb-3") },
+                        React.createElement(Col, { md: "10", className: "formComponent" },
+                            React.createElement(Row, null,
+                                React.createElement(Col, { md: "3", className: "displayDesitions" },
+                                    question.reviewAccepted && (React.createElement("div", null,
+                                        React.createElement("img", { src: check }))),
+                                    question.reviewFlagged && question.flaggedReason && (React.createElement("div", null,
+                                        React.createElement("img", { src: redFlag }),
+                                        React.createElement("div", { className: "reasonFlagNote", onClick: function () { return Flagtoggle(question, true); } },
+                                            React.createElement("img", { src: writingredFlag, className: "reasonFlagicon" }),
+                                            React.createElement("span", null, (question === null || question === void 0 ? void 0 : question.flaggedReason.length) > 600 ? "".concat(question === null || question === void 0 ? void 0 : question.flaggedReason.slice(0, 600), "...") : question === null || question === void 0 ? void 0 : question.flaggedReason)))),
+                                    question.naFlag && React.createElement("div", { className: "n-aDiv" },
+                                        React.createElement("span", { className: "n-atext" }, "N/A"))),
+                                React.createElement(Col, { md: "3", className: "offset-md-6" },
+                                    React.createElement("div", { className: "history", onClick: function () { return getHistory(question.reviewClientQuestionId, question.clientQuestionId); } },
+                                        React.createElement("img", { src: history }),
+                                        " History"))),
+                            React.createElement(React.Fragment, null,
+                                question.layoutPreset && React.createElement(Col, { md: question.layoutPreset }),
+                                React.createElement(Col, { key: question.questionId, sm: "12", className: question.dependent ? "DynoLayout dependent-question" : "DynoLayout", md: layoutSet(question === null || question === void 0 ? void 0 : question.layoutCoulmns) }, renderQuestionField(question)),
+                                question.layoutOffset && React.createElement(Col, { md: question.layoutOffset }),
+                                question.complianceCategoryStatus ? (question.clientCustomQuestion === false) ? (question.naFlag ?
+                                    React.createElement(Col, { sm: "12", className: "d-flex flex-row justify-content-end" },
+                                        React.createElement("div", { className: "naTaskReason" },
+                                            React.createElement("span", { className: "n-Anotes" }, "N/A Notes:"),
+                                            " ",
+                                            React.createElement("span", { className: "naReason" }, question.naReason)),
+                                        React.createElement("div", { className: "naTask1" },
+                                            React.createElement("label", { className: "d-flex flex-row", onClick: function () { return naFlagged(question, true); } },
+                                                React.createElement("img", { src: CheckOval }),
+                                                React.createElement("p", { className: "taskPara" }, "Task N/A")))) : React.createElement(Col, { sm: "12", className: "d-flex flex-row justify-content-end" },
+                                    React.createElement("div", { className: "naTask" },
+                                        React.createElement("label", { className: "d-flex flex-row", onClick: function () { return markTaskToggle(question); } },
+                                            React.createElement("img", { src: oval }),
+                                            React.createElement("p", { className: "taskPara" }, "Task N/A"))))) : React.createElement(Col, { sm: "12", className: "d-flex flex-row justify-content-end" },
+                                    React.createElement("div", null,
+                                        React.createElement("img", { src: deleteImg, alt: "X" }),
+                                        React.createElement("span", { className: "remove", onClick: function () { return removeAddedQuestion(question, true); } }, "Remove"))) : React.createElement(React.Fragment, null)),
+                            React.createElement(React.Fragment, null)),
+                        React.createElement(Col, { md: "2", className: "compliance" }, selectOptions(question))))),
+                question.isCustomQuestion && (React.createElement(Col, { md: "12", className: "formComponent-1" },
+                    React.createElement(NewTaskForm, { question: question, onAccept: onAccept, onFlagged: onFlagged, setNotesFrame: setNotesFrame, getGuidance: getGuidance, disableFields: props.disableFields, addCustomQuestion: addCustomQuestion, removeCustomQuestion: removeCustomQuestion }))),
+                React.createElement(React.Fragment, null)));
+        });
+    };
+    var renderQuestionGroup = function (question) {
+        var dependentQuestionGroupIds = [];
+        return React.createElement(React.Fragment, null,
+            React.createElement("div", { className: "DynoColumns mb-3" },
+                React.createElement(Row, { className: "field ".concat(question.reviewFlagged ? "fieldFlagRed" : "") },
+                    React.createElement(Col, { md: "10", className: "formComponent" },
+                        React.createElement(Row, { className: "mb-2" },
+                            React.createElement(Col, { md: "3 displayDesitions" },
+                                question.reviewAccepted && (React.createElement("div", null,
+                                    React.createElement("img", { src: check }))),
+                                question.reviewFlagged && question.flaggedReason && (React.createElement("div", null,
+                                    React.createElement("img", { src: redFlag }),
+                                    React.createElement("div", { className: "reasonFlagNote", onClick: function () { return Flagtoggle(question, true); } },
+                                        React.createElement("img", { src: writingredFlag, className: "reasonFlagicon" }),
+                                        React.createElement("span", null, (question === null || question === void 0 ? void 0 : question.flaggedReason.length) > 600 ? "".concat(question === null || question === void 0 ? void 0 : question.flaggedReason.slice(0, 600), "...") : question === null || question === void 0 ? void 0 : question.flaggedReason))))),
+                            React.createElement(Col, { md: "3", className: "offset-md-6" },
+                                React.createElement("div", { className: "history", onClick: function () {
+                                        return getHistory(question.reviewClientQuestionId, question === null || question === void 0 ? void 0 : question.clientQuestionId);
+                                    } },
+                                    React.createElement("img", { src: history }),
+                                    " History")),
+                            question.complianceGroupHideHeading != true &&
+                                React.createElement("h4", { style: { fontSize: question.complianceGroupHeadingSize + "px" }, className: "CardInfoTitle" }, question.complianceGroupName)),
+                        React.createElement(Row, null,
+                            React.createElement("div", { className: "DynoColumns px-4" }, findGroupSearialNumbers(question.complianceGroupId).map(function (serial) {
+                                return React.createElement(Row, null, currentQuestions.filter(function (m) {
+                                    return m.complianceGroupId == question.complianceGroupId &&
+                                        m.serialNumber == serial;
+                                })
+                                    .map(function (groupQuestion) {
+                                    if (groupQuestion.denpendentQuestionGroupId &&
+                                        dependentQuestionGroupIds.indexOf(groupQuestion.denpendentQuestionGroupId) > -1) {
+                                        return null;
+                                    }
+                                    if (groupQuestion.denpendentQuestionGroupId &&
+                                        (dependentQuestionGroupIds === null || dependentQuestionGroupIds === void 0 ? void 0 : dependentQuestionGroupIds.indexOf(groupQuestion.denpendentQuestionGroupId)) == -1) {
+                                        dependentQuestionGroupIds === null || dependentQuestionGroupIds === void 0 ? void 0 : dependentQuestionGroupIds.push(groupQuestion.denpendentQuestionGroupId);
+                                        return renderDependentQuestionGroup(groupQuestion, serial);
+                                    }
+                                    return React.createElement(React.Fragment, null,
+                                        groupQuestion.layoutPreset && React.createElement(Col, { md: groupQuestion.layoutPreset }),
+                                        React.createElement(Col, { key: groupQuestion.questionId, sm: "12", className: groupQuestion.dependent ? "DynoLayout dependent-question" : "DynoLayout", md: layoutSet(groupQuestion === null || groupQuestion === void 0 ? void 0 : groupQuestion.layoutCoulmns) }, renderQuestionField(groupQuestion)),
+                                        groupQuestion.layoutOffset && React.createElement(Col, { md: groupQuestion.layoutOffset }));
+                                }));
+                            })))),
+                    React.createElement(Col, { md: "2", className: "compliance" }, selectOptions(question, currentQuestions.filter(function (m) {
+                        return m.complianceGroupId == question.complianceGroupId;
+                    }))))));
+    };
+    var currentSerialNumberQuestion = function (complianceGroupId, serialNumber) {
+        var data = currentQuestions.filter(function (m) {
+            return m.complianceGroupId == complianceGroupId && m.serialNumber == serialNumber;
+        });
+        return (data === null || data === void 0 ? void 0 : data.length) > 0 ? data[0] : null;
+    };
+    var renderRepetativeQuestionGroup = function (question) {
+        return React.createElement(Accordion, null, findGroupSearialNumbers(question.complianceGroupId).map(function (serial) {
+            var _a;
+            var currentSerialQuestion = currentSerialNumberQuestion(question.complianceGroupId, serial);
+            return React.createElement("div", { className: "DynoColumns mb-3" },
+                React.createElement(React.Fragment, null, !notesForm.includes(currentSerialQuestion === null || currentSerialQuestion === void 0 ? void 0 : currentSerialQuestion.clientQuestionId) ? (React.createElement(React.Fragment, null,
+                    " ",
+                    currentSerialQuestion.reviewNotes && ((_a = currentSerialQuestion.reviewNotes) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (React.createElement(Row, { className: "notesShowReview" },
+                        React.createElement("div", { className: "show" },
+                            React.createElement("span", { className: "head" }, "Notes:"),
+                            " \u00A0\u00A0\u00A0",
+                            React.createElement("span", { className: "content" }, currentSerialQuestion.reviewNotes)))) : (""))) : (React.createElement(Row, { className: "notes" },
+                    React.createElement(Col, null, notesFrame(currentSerialQuestion))))),
+                React.createElement(Row, { className: "field ".concat(currentSerialQuestion.reviewFlagged ? "fieldFlagRed" : "") },
+                    React.createElement(Col, { md: "10", className: "formComponent" },
+                        React.createElement(Row, { className: "mb-2" },
+                            React.createElement(Col, { md: "3 displayDesitions" },
+                                (currentSerialQuestion === null || currentSerialQuestion === void 0 ? void 0 : currentSerialQuestion.reviewAccepted) && (React.createElement("div", null,
+                                    React.createElement("img", { src: check }))),
+                                (currentSerialQuestion === null || currentSerialQuestion === void 0 ? void 0 : currentSerialQuestion.reviewFlagged) && (currentSerialQuestion === null || currentSerialQuestion === void 0 ? void 0 : currentSerialQuestion.flaggedReason) && (React.createElement("div", null,
+                                    React.createElement("img", { src: redFlag }),
+                                    React.createElement("div", { className: "reasonFlagNote", onClick: function () { return Flagtoggle(question, true); } },
+                                        React.createElement("img", { src: writingredFlag, className: "reasonFlagicon" }),
+                                        React.createElement("span", null, (currentSerialQuestion === null || currentSerialQuestion === void 0 ? void 0 : currentSerialQuestion.flaggedReason.length) > 600 ? "".concat(currentSerialQuestion === null || currentSerialQuestion === void 0 ? void 0 : currentSerialQuestion.flaggedReason.slice(0, 600), "...") : currentSerialQuestion === null || currentSerialQuestion === void 0 ? void 0 : currentSerialQuestion.flaggedReason))))),
+                            React.createElement(Col, { md: "3", className: "offset-md-6" },
+                                React.createElement("div", { className: "history", onClick: function () {
+                                        getHistory(currentSerialQuestion === null || currentSerialQuestion === void 0 ? void 0 : currentSerialQuestion.reviewClientQuestionId, currentSerialQuestion === null || currentSerialQuestion === void 0 ? void 0 : currentSerialQuestion.clientQuestionId);
+                                    } },
+                                    React.createElement("img", { src: history }),
+                                    " History")),
+                            question.complianceGroupHideHeading != true &&
+                                React.createElement("h4", { style: { fontSize: question.complianceGroupHeadingSize + "px" }, className: "CardInfoTitle" }, question.complianceGroupName)),
+                        React.createElement(Row, null,
+                            React.createElement("div", { className: "DynoColumns px-4" },
+                                React.createElement(Accordion.Item, { eventKey: serial.toString() },
+                                    React.createElement(Accordion.Header, null,
+                                        React.createElement(Row, null,
+                                            React.createElement(Col, { md: "12", sm: "12" },
+                                                React.createElement("div", null, fillHeadertemplate(question, serial))))),
+                                    React.createElement(Accordion.Body, null,
+                                        React.createElement(Card.Body, null,
+                                            React.createElement(Row, null, currentQuestions.filter(function (m) { return m.complianceGroupId == question.complianceGroupId && m.serialNumber == serial; })
+                                                .map(function (groupQuestion) {
+                                                return React.createElement(React.Fragment, null,
+                                                    groupQuestion.layoutPreset && React.createElement(Col, { md: groupQuestion.layoutPreset }),
+                                                    React.createElement(Col, { key: groupQuestion.questionId, sm: "12", className: groupQuestion.dependent ? "DynoLayout dependent-question" : "DynoLayout", md: layoutSet(groupQuestion === null || groupQuestion === void 0 ? void 0 : groupQuestion.layoutCoulmns) }, renderQuestionField(groupQuestion)),
+                                                    groupQuestion.layoutOffset && React.createElement(Col, { md: groupQuestion.layoutOffset }));
+                                            })))))))),
+                    React.createElement(Col, { md: "2", className: "compliance" }, selectOptions(currentSerialQuestion, currentQuestions.filter(function (m) { return m.complianceGroupId == question.complianceGroupId && m.serialNumber == serial; })))));
+        }));
+    };
+    var renderDependentQuestionGroup = function (question, serialNumber) {
+        return React.createElement(React.Fragment, null,
+            question.dependentQuestionGroupHideHeading != true &&
+                React.createElement("h4", { style: { fontSize: question.dependentQuestionGroupHeadingSize + "px" }, className: "CardInfoTitle" }, question.denpendentQuestionGroupName),
+            React.createElement(Row, { className: "dependent-group-container nonAcoordion" }, currentQuestions.filter(function (m) {
+                return m.denpendentQuestionGroupId == question.denpendentQuestionGroupId && m.serialNumber == serialNumber;
+            })
+                .map(function (groupQuestion) {
+                return React.createElement(React.Fragment, null,
+                    groupQuestion.layoutPreset && React.createElement(Col, { md: groupQuestion.layoutPreset }),
+                    React.createElement(Col, { key: groupQuestion.questionId, sm: "12", className: "DynoLayout", md: layoutSet(groupQuestion === null || groupQuestion === void 0 ? void 0 : groupQuestion.layoutCoulmns) }, renderQuestionField(groupQuestion)),
+                    groupQuestion.layoutOffset && React.createElement(Col, { md: groupQuestion.layoutOffset }));
+            })),
+            " ");
+    };
+    var renderQuestionField = function (question) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+        if ((question === null || question === void 0 ? void 0 : question.questionType) === QuestionTypes.Text)
+            return (React.createElement(React.Fragment, null,
+                React.createElement("div", { className: "d-flex dynoFields csTextField cdFormGroup" },
+                    React.createElement(Field, { disabled: props.disableFields, component: TextField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, isRequired: question.isRequired, normalize: NormalizeText }))));
+        if (question.questionType === QuestionTypes.MultiSelectionDropdown)
+            return (React.createElement("div", { className: " d-flex dynoFields cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: MultipleSelectField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, HelpText: question.helpText, isRequired: question.isRequired, options: question.options.sort(function (a, b) {
+                        return (a === null || a === void 0 ? void 0 : a.text) > (b === null || b === void 0 ? void 0 : b.text) ? 1 : -1;
+                    }) })));
+        if (question.questionType === QuestionTypes.SingleSelectionBoxSelection)
+            return (React.createElement("div", { className: "d-flex dynoFields cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: SelectButtonFieldOptions, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, HelpText: question.helpText, isRequired: question.isRequired, options: question.options.sort(function (a, b) { return (a === null || a === void 0 ? void 0 : a.value) - (b === null || b === void 0 ? void 0 : b.value); }) })));
+        if ((question === null || question === void 0 ? void 0 : question.questionType) === QuestionTypes.FedTaxSSN)
+            return (React.createElement("div", { className: "d-flex dynoFields csTextField cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: SSNField, name: "question_" + ((_a = question.clientQuestionId) === null || _a === void 0 ? void 0 : _a.toString()), label: question.questionText, helpText: question.helpText, isRequired: question.isRequired, normalize: NormaliseFedTaxSSN })));
+        if (question.questionType === QuestionTypes.Checkbox ||
+            question.questionType === QuestionTypes.PercentageValidationCheckbox)
+            return (React.createElement("div", { className: "d-flex dynoFields" },
+                React.createElement("div", null,
+                    React.createElement(Field, { disabled: props.disableFields, name: "question_" + ((_b = question.clientQuestionId) === null || _b === void 0 ? void 0 : _b.toString()), label: question.questionText, helpText: question.helpText, component: SingleCheckBox, 
+                        // options={question.options.sort(
+                        //   (a: any, b: any) => a?.value - b?.value
+                        // )}              
+                        isRequired: question.isRequired }))));
+        if ((question === null || question === void 0 ? void 0 : question.questionType) === QuestionTypes.TimePicker)
+            return (React.createElement("div", { className: "d-flex dynoFields csTextField cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: SSNField, name: "question_" + ((_c = question.clientQuestionId) === null || _c === void 0 ? void 0 : _c.toString()), label: question.questionText, helpText: question.helpText, 
+                    // validate={[required]}
+                    isRequired: question.isRequired, normalize: NormalizeTime, placeholder: "hh:mm" })));
+        if (question.questionType === QuestionTypes.DecimalNumber)
+            return (React.createElement("div", { className: "cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: TextField, name: "question_" + ((_d = question.clientQuestionId) === null || _d === void 0 ? void 0 : _d.toString()), label: question === null || question === void 0 ? void 0 : question.questionText, helpText: question.helpText, isRequired: question.isRequired, normalize: NormalizeDecimalNumber })));
+        if (question.questionType === QuestionTypes.YesOrNo)
+            return (React.createElement("div", { className: " d-flex dynoFields cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: YesOrNo, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, HelpText: question.helpText, isRequired: question.isRequired, options: question.options.sort(function (a, b) { return (a === null || a === void 0 ? void 0 : a.optionSequence) - (b === null || b === void 0 ? void 0 : b.optionSequence); }) })));
+        if (question.questionType === QuestionTypes.MultiSelectionCheckBox)
+            return (React.createElement("div", { className: " d-flex dynoFields cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: CheckboxGroup, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, HelpText: question.helpText, isRequired: question.isRequired, options: question.options.sort(function (a, b) { return (a === null || a === void 0 ? void 0 : a.value) - (b === null || b === void 0 ? void 0 : b.value); }) })));
+        if (question.questionType === QuestionTypes.MultiCheckBox)
+            return (React.createElement("div", { className: "d-flex dynoFields cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: MultiCheckboxGroup, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, HelpText: question.helpText, options: question.options.sort(function (a, b) { return (a === null || a === void 0 ? void 0 : a.optionSequence) && (b === null || b === void 0 ? void 0 : b.optionSequence) ?
+                        ((a === null || a === void 0 ? void 0 : a.optionSequence) - (b === null || b === void 0 ? void 0 : b.optionSequence)) :
+                        ((a === null || a === void 0 ? void 0 : a.value) - (b === null || b === void 0 ? void 0 : b.value)); }), isRequired: question.isRequired, className: 'multiCheckBox' })));
+        if (question.questionType === QuestionTypes.SingleSelectionCheckBox)
+            return (React.createElement("div", { className: " d-flex dynoFields csCheckSpanWrap cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: checkspan2, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, HelpText: question.helpText, isRequired: question.isRequired, options: question.options.sort(function (a, b) { return (a === null || a === void 0 ? void 0 : a.value) - (b === null || b === void 0 ? void 0 : b.value); }) })));
+        if (question.questionType === QuestionTypes.AddressSelectionCheckBox)
+            return (React.createElement("div", { className: "d-flex dynoFields csCheckSpanWrap" },
+                React.createElement(Field, { disabled: props.disableFields, component: checkspan2, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, HelpText: question.helpText, options: question.options.sort(function (a, b) { return (a === null || a === void 0 ? void 0 : a.value) - (b === null || b === void 0 ? void 0 : b.value); }), isRequired: question.isRequired })));
+        if (question.questionType === QuestionTypes.MultiSelectionBoxSelection)
+            return (React.createElement("div", { className: "d-flex dynoFields cdFormGroup" },
+                React.createElement("div", { className: "multiGroupBox ".concat(question.questionType) },
+                    React.createElement(Field, { disabled: props.disableFields, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, component: CheckPanelBox, options: question.options.sort(function (a, b) { return (a === null || a === void 0 ? void 0 : a.value) - (b === null || b === void 0 ? void 0 : b.value); }), display: true, isRequired: question.isRequired }))));
+        if (question.questionType === QuestionTypes.Percentage
+            || question.questionType === QuestionTypes.Percentage25A
+            || question.questionType === QuestionTypes.Percentage25B ||
+            question.questionType === QuestionTypes.SalesPercentage)
+            return (React.createElement("div", { className: "cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: TextField, name: "question_" + ((_e = question.clientQuestionId) === null || _e === void 0 ? void 0 : _e.toString()), label: question === null || question === void 0 ? void 0 : question.questionText, helpText: question.helpText, isRequired: question.isRequired })));
+        if (question.questionType === QuestionTypes.FileUpload)
+            return (React.createElement("div", { className: "d-flex dynoFields cdFormGroup" },
+                React.createElement(Field, { question: question, onAccept: onAccept, onFlagged: onFlagged, setNotesFrame: setNotesFrame, getGuidance: getGuidance, disabled: (props.disableFields || !statusChange(question)), component: FileDropZoneField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, type: "file", checkedFormats: "image/jpeg, image/png, image/gif, image/bmp, .pdf, .doc, .docx, .xls,.xlsx, .rtf, .ppt, .pptx,.tiff,.rtf,.csv", clientQuestionId: question.clientQuestionId, displayAccepedFormats: false, allowMultiple: false, aiOverride: question.answers && ((_f = question === null || question === void 0 ? void 0 : question.answers[0]) === null || _f === void 0 ? void 0 : _f.aiOverride), maxSize: 5000000, isRequired: question.isRequired, noClick: question.answers && ((_g = question.answers) === null || _g === void 0 ? void 0 : _g.length) !== 0 ? true : false, noDrag: question.answers && ((_h = question.answers) === null || _h === void 0 ? void 0 : _h.length) !== 0 ? true : false, onClickFile: props.onClickFile })));
+        if (question.questionType === QuestionTypes.PDFFileUpload)
+            return (React.createElement("div", { className: "d-flex dynoFields cdFormGroup" },
+                React.createElement(Field, { question: question, onAccept: onAccept, onFlagged: onFlagged, setNotesFrame: setNotesFrame, getGuidance: getGuidance, disabled: (props.disableFields || !statusChange(question)), component: FileDropZoneField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, type: "file", acceptedFormats: ".pdf", clientQuestionId: question.clientQuestionId, displayAccepedFormats: false, allowMultiple: false, aiOverride: question.answers && ((_j = question === null || question === void 0 ? void 0 : question.answers[0]) === null || _j === void 0 ? void 0 : _j.aiOverride), maxSize: 5000000, isRequired: question.isRequired, noClick: question.answers && ((_k = question.answers) === null || _k === void 0 ? void 0 : _k.length) !== 0 ? true : false, noDrag: question.answers && ((_l = question.answers) === null || _l === void 0 ? void 0 : _l.length) !== 0 ? true : false, onClickFile: props.onClickFile })));
+        if ((question === null || question === void 0 ? void 0 : question.questionType) === QuestionTypes.TextArea)
+            return (React.createElement("div", { className: " d-flex dynoFields csTextField cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: TextField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, type: "textarea", normalize: NormalizeText, isRequired: question.isRequired })));
+        if (question.questionType === QuestionTypes.DatePicker)
+            return (React.createElement("div", { className: "dynoFields cdFormGroup" },
+                React.createElement(FormGroup, { row: true, className: "mb-5 w-100 form-group" },
+                    React.createElement(Label, null,
+                        question.questionText,
+                        " ",
+                        question.isRequired && React.createElement("span", { className: "input-required" }, "*")),
+                    React.createElement(Col, { sm: 12 },
+                        React.createElement(Field, { disabled: props.disableFields, name: "question_" + question.clientQuestionId.toString(), component: Datepicker, valuedata: null })))));
+        if (question.questionType === QuestionTypes.PhoneNumber)
+            return (React.createElement("div", { className: "dynoFields cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: PhoneNumberField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, normalize: normalizePhone, isRequired: question.isRequired })));
+        if (question.questionType === QuestionTypes.Email)
+            return (React.createElement("div", { className: "dynoFields cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: EmailField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, isRequired: question.isRequired })));
+        if (question.questionType === QuestionTypes.SingleSelectionDropDown)
+            return (React.createElement("div", { className: "dynoFields cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: SelectField, name: "question_" + question.clientQuestionId.toString(), label: question === null || question === void 0 ? void 0 : question.questionText, helpText: question.helpText, values: question.options.sort(function (a, b) { return (a === null || a === void 0 ? void 0 : a.optionSequence) - (b === null || b === void 0 ? void 0 : b.optionSequence); }), isRequired: question.isRequired })));
+        if (question.questionType === QuestionTypes.PastDatePicker)
+            return (React.createElement("div", { className: "dynoFields cdFormGroup" },
+                React.createElement(FormGroup, { row: true, className: "mb-5 w-100 form-group" },
+                    React.createElement(Label, null,
+                        question.questionText,
+                        " ",
+                        question.isRequired && React.createElement("span", { className: "input-required" }, "*")),
+                    React.createElement(Col, { sm: 12 },
+                        React.createElement(Field, { disabled: props.disableFields, name: "question_" + question.clientQuestionId.toString(), component: PastDatePicker, valuedata: null, maxDate: new Date(), showYearDropdown: true, placeholderText: "MM/DD/YYYY", autoComplete: "off" })))));
+        if (question.questionType === QuestionTypes.FutureDatePicker)
+            return (React.createElement("div", { className: "dynoFields cdFormGroup" },
+                React.createElement(FormGroup, { row: true, className: "mb-5 w-100 form-group" },
+                    React.createElement(Label, null,
+                        question.questionText,
+                        " ",
+                        question.isRequired && React.createElement("span", { className: "input-required" }, "*")),
+                    React.createElement(Col, { sm: 12 },
+                        React.createElement(Field, { disabled: props.disableFields, name: "question_" + question.clientQuestionId.toString(), component: FutureDatePicker, valuedata: null, minDate: new Date(), showYearDropdown: true, autoComplete: "off" })))));
+        if ((question === null || question === void 0 ? void 0 : question.questionType) === QuestionTypes.SSN)
+            return (React.createElement("div", { className: "d-flex dynoFields csTextField cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: SSNField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, isRequired: question.isRequired, normalize: NormaliseSSN })));
+        if ((question === null || question === void 0 ? void 0 : question.questionType) === QuestionTypes.EIN)
+            return (React.createElement("div", { className: "d-flex dynoFields csTextField cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: SSNField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, isRequired: question.isRequired, normalize: NormalizeEIN })));
+        if ((question === null || question === void 0 ? void 0 : question.questionType) === QuestionTypes.ROUTINGNUMBER)
+            return (React.createElement("div", { className: "d-flex dynoFields csTextField cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: TextField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, isRequired: question.isRequired, normalize: NormalizeRoutingNumber })));
+        if ((question === null || question === void 0 ? void 0 : question.questionType) === QuestionTypes.Number)
+            return (React.createElement("div", { className: "d-flex dynoFields csTextField cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: TextField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, normalize: NormalizeNumber, isRequired: question.isRequired })));
+        if ((question === null || question === void 0 ? void 0 : question.questionType) === QuestionTypes.NumericId)
+            return (React.createElement("div", { className: "d-flex dynoFields csTextField cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: TextField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, normalize: normalizeNumericId, isRequired: question.isRequired })));
+        if ((question === null || question === void 0 ? void 0 : question.questionType) === QuestionTypes.Currency)
+            return (React.createElement("div", { className: "d-flex dynoFields csTextField cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: TextField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, normalize: NormalizeNumber })));
+        if ((question === null || question === void 0 ? void 0 : question.questionType) === QuestionTypes.ZipCode)
+            return (React.createElement("div", { className: "d-flex dynoFields csTextField cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: TextField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, normalize: normaliseZipcode, isRequired: question.isRequired })));
+        if (question.questionType === QuestionTypes.TaxId)
+            return (React.createElement("div", { className: "cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: TextField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, isRequired: question.isRequired, normalize: NormalizeTax })));
+        if (question.questionType === QuestionTypes.AlphaNumeric)
+            return (React.createElement("div", { className: "cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: TextField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, isRequired: question.isRequired, normalize: normalizeAlphanumeric })));
+        if (question.questionType === QuestionTypes.LabelText)
+            return (React.createElement("div", { className: "cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: TextField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, isRequired: question.isRequired, labelText: true })));
+        if (question.questionType === QuestionTypes.disableTextField)
+            return (React.createElement("div", { className: "cdFormGroup" },
+                React.createElement(Field, { disabled: true, component: DisableTextField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, isRequired: question.isRequired, labelText: true })));
+        if (question.questionType === QuestionTypes.NumberOfMonths)
+            return (React.createElement("div", { className: "cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: DisableTextField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, isRequired: question.isRequired, normalize: normalizeMonth, labelText: true })));
+        if (question.questionType === QuestionTypes.FaxId)
+            return (React.createElement("div", { className: "cdFormGroup" },
+                React.createElement(Field, { disabled: props.disableFields, component: TextField, name: "question_" + question.clientQuestionId.toString(), label: question.questionText, helpText: question.helpText, isRequired: question.isRequired, normalize: normalizeFax })));
+        return null;
+    };
+    var setIsOpen = function (index) {
+        if (index == guidanceToggle) {
+            setGuidanceToggle(-1);
+        }
+        else {
+            setGuidanceToggle(index);
+        }
+    };
+    return (React.createElement(React.Fragment, null,
+        React.createElement("form", { className: "form-group" },
+            React.createElement(Row, null,
+                renderQuestions(),
+                " ")),
+        React.createElement(Modal, { className: "popup-modal modelWrap historyModal", size: "md", isOpen: historyModel, fade: false, toggle: historyModalViewHandler },
+            React.createElement(ModalBody, null,
+                React.createElement("button", { type: "button", className: "close", "aria-label": "Close", onClick: closeHistoryModalViewHandler },
+                    React.createElement("span", { "aria-hidden": "true" }, "\u00D7")),
+                React.createElement(Tab.Container, { id: "historyTabs", defaultActiveKey: "itemHistory" },
+                    React.createElement(Row, null,
+                        React.createElement(Col, { sm: 12 },
+                            React.createElement(Nav, { variant: "pills", id: "historyNav", className: "mb-3" },
+                                React.createElement(Nav.Item, null,
+                                    React.createElement(Nav.Link, { eventKey: "itemHistory" },
+                                        React.createElement("img", { src: history }),
+                                        React.createElement("span", null, "Item History"))),
+                                React.createElement(Nav.Item, null,
+                                    React.createElement(Nav.Link, { eventKey: "messageHistory" },
+                                        React.createElement("img", { src: comment }),
+                                        "Message History"))))),
+                    React.createElement(Row, null,
+                        React.createElement(Col, { sm: 12 },
+                            React.createElement(Tab.Content, null,
+                                React.createElement(Tab.Pane, { className: "tabElement historyModalTab", eventKey: "itemHistory" },
+                                    React.createElement("div", null,
+                                        React.createElement("div", { className: "historyModel" }, questionHistory !== undefined &&
+                                            ((_b = (_a = questionHistory[0]) === null || _a === void 0 ? void 0 : _a.historyDTO) === null || _b === void 0 ? void 0 : _b.length) < 0 === false ? (questionHistory !== undefined &&
+                                            ((_d = (_c = questionHistory[0]) === null || _c === void 0 ? void 0 : _c.historyDTO) === null || _d === void 0 ? void 0 : _d.map(function (element) { return (React.createElement(Row, { className: "infoPack" },
+                                                React.createElement(Col, { md: "2" }, element.firstName),
+                                                React.createElement(Col, { md: "1", className: "" }, moment(moment.utc(element.createdDate).toDate()).format('M/DD/YY')),
+                                                React.createElement(Col, { md: "2", className: "timeDate" }, moment(moment.utc(element.createdDate).toDate()).format('hh:mm A')),
+                                                React.createElement(Col, null, element.info))); }))) : (React.createElement(Row, { className: "infoPack" },
+                                            React.createElement(Col, null, "No records found")))))),
+                                React.createElement(Tab.Pane, { className: "tabElement historyModalTab", eventKey: "messageHistory" },
+                                    React.createElement("div", { className: "message-modal" })))))))),
+        React.createElement(Modal, { className: "popup-modal guidanceWrapper", size: "md", isOpen: guidanceModel, fade: false, toggle: guidanceModelHandler },
+            React.createElement(ModalHeader, { className: "guidance", toggle: closeGuidanceModelHandler }, "Guidance"),
+            React.createElement("div", null,
+                React.createElement("div", { className: "guidanceBody" }, guidance && (guidance === null || guidance === void 0 ? void 0 : guidance.map(function (element, index) { return (React.createElement(React.Fragment, null,
+                    React.createElement(Row, null,
+                        React.createElement(Col, { md: "12" },
+                            React.createElement("div", { onClick: function () { return setIsOpen(index); }, className: "question" },
+                                index == guidanceToggle ? React.createElement("img", { src: backGray, className: "downArrow arrow" })
+                                    : React.createElement("img", { src: backGray, className: "arrow" }),
+                                currentQuestions.find(function (ele) {
+                                    return ele.questionId == element.questionId;
+                                }).questionText)),
+                        React.createElement(Col, { md: "12" },
+                            React.createElement(Collapse, { isOpen: index == guidanceToggle },
+                                React.createElement("p", { className: "guidanceContent" }, element === null || element === void 0 ? void 0 : element.guidance)))))); }))))),
+        React.createElement(Modal, { className: "flag-modal", isOpen: flagModal, fade: false, toggle: Flagtoggle },
+            React.createElement(ModalHeader, { toggle: flagModalViewHandler },
+                React.createElement("div", null,
+                    React.createElement("img", { src: redFlag }),
+                    " ",
+                    React.createElement("span", { className: "flagItemHeader" }, " Flag Item "))),
+            React.createElement(ModalBody, { className: "flagg-modal-container" },
+                React.createElement(FlaggReasonForm, { toggle: Flagtoggle, flaggedQuestion: flaggedQuestion, label: "Reason for Flag", postsavequestion: props.postsavequestion, currentQuestions: currentQuestions, flagModalViewHandler: flagModalViewHandler, isEditReason: isEditFlagNotes, button: "Flag", infoId: 2, name: "flaggedReason" }))),
+        React.createElement(Modal, { className: "flag-modal Mark-Task-Modal", isOpen: markTaskModal, fade: false, toggle: naTaskViewHandler },
+            React.createElement(ModalHeader, { toggle: naTaskViewHandler },
+                React.createElement("div", null,
+                    React.createElement("span", { className: "Mark-Task-Modal-heading" }, " Mark Task N/A "))),
+            React.createElement(ModalBody, { className: "flagg-modal-container" },
+                React.createElement(FlaggReasonForm, { toggle: markTaskModal, flaggedQuestion: naTaskQuestion, label: "Reason for N/A", postsavequestion: props.postsavequestion, currentQuestions: currentQuestions, flagModalViewHandler: naTaskViewHandler, button: "Confirm", infoId: 4, name: "naReason" })))));
+};
+export default connect(function (state, props) {
+    return {
+        initialValues: __assign(__assign({}, props.formInitialvalues), props.reviewValues),
+        formValues: getFormValues("QuestionnaireForm")(state),
+    };
+})(reduxForm({
+    form: "QuestionnaireForm",
+    enableReinitialize: true,
+})(QuestionnaireForm));
+//# sourceMappingURL=QuestionnaireForm.js.map