import React, { useEffect, useState, useRef } from "react";

import { useDispatch, useSelector } from "react-redux";

import { useTranslation } from "react-i18next";

import "./LandingPageNew.scss";

import axios from "axios";

import { updateUserInfo } from "../../../../reducers/userInfoSlice";

import DocumentsPage from "./DocumentsPage/DocumentsPage";

import AuthentixPage from "./AuthentixPage/AuthentixPage";

import { notifyApiFail } from "../../../../reducers/errorNotifySlice";

import { userInfoData } from "../../../../services/userInfo.service";

import { useNavigate, useParams } from "react-router-dom";

import moment from "moment";

import { configurationServices } from

"../../../../constants/configurationServices";

import SumSubPage from "./SumSubPage/SumSubPage";

import { Box, Button, Stack, Typography, useMediaQuery } from "@mui/material";

import Loader from "../../../../components/Loader";

import TRADUTrans from "../../../../components/common/TRADUTrans";

import ArrowForwardIcon from "@mui/icons-material/ArrowForward";

import ArrowBackIcon from "@mui/icons-material/ArrowBack";

const LandingPageNew = () => {

const dispatch = useDispatch();

const navigate = useNavigate();

const { userCameFrom='header' } = useParams();

const { t: getLabel } = useTranslation();

const { user } = useSelector((state) => state.user);

const { authToken, loginRes } = useSelector((state) => state.signUp);

const { ip } = useSelector((state) => state.ipAddress);

const [enableDetailsView, setEnableDetailsView] = useState(false);

 const [docLists, setDocLists] = useState([]);

const [docType, setDocType] = useState();

const [selectedDocument, setSelectedDocument] = useState({});

const [docTitle, setDocTitle] = useState();

const [subDocuments, setSubDocuments] = useState('');

const [authenticsUrl, setAuthenticsUrl] = useState('');

const [sessionFlag, setSessionFlag] = useState('');

const [identityStatus, setIdentityStatus] = useState("Required");

const [addressStatus, setAddressStatus] = useState("Required");

const [sowStatus, setSowStatus] = useState("Required");

const [sofStatus, setSofStatus] = useState("Required");

const [foreignStatus, setForeignStatus] = useState("Required");

const [cubaStatus, setCubaStatus] = useState("Required");

const [firstName, setFirstName] = useState('');

const [lastName, setLastName] = useState('');

const [middleName, setMiddleName] = useState('');

const [email, setEmail] = useState('');

const [phone, setPhone] = useState('');

const [sumSubAccessToken, setSumSubAccessToken] = useState('');

const [isApplicantFound, setIsApplicantFound] = useState(false);

const [isNameMismatch, setIsNameMismatch] = useState(false); // for to show only

name mismatch box on true

const [isDOBMismatch, setIsDOBMismatch] = useState(false); // for to show only

DOB mismatch box on true

const [isBothMismatch, setIsBothMismatch] = useState(false); // for to show both

name & DOB mismatch box on true

const [enableTextInput, setEnableTextInput] = useState(false); // for to have

text inputs for firstName, middleName and lastName on true

const [inputFirstName, setInputFirstName] = useState('');

const [inputMiddleName, setInputMiddleName] = useState('');

const [inputLastName, setInputLastName] = useState('');

 const [submitLoading, setSubmitLoading] = useState(false);

const [errorTextFeild, setErrorTextFeild] = useState(

{ inputFirstName: false },

{ inputLastName: false },

{ inputMiddleName: false }

);

const [enableVideoIdent, setEnableVideoIdent] = useState(false);

const [uploadedStatus, setUploadedStatus] = useState({status:"success", title :

'Your documents have been uploaded successfully.' , description :''});
//status:"success / fail / optional"

const isMobile = useMediaQuery("(max-width: 599px)");

const isTablet = useMediaQuery("(min-width: 600px) and (max-width: 1023px)");

const [manualDocData, setManualDocData] = useState([]);

const [eventFlag, setEventFlag] = useState(false);

// const [intervalId, setIntervalId] = useState('');

const intervalId = useRef(null); // we can save timer in useRef and pass it to

child

const [initAu10TixDocListCount, setInitAu10TixDocListCount] = useState(0);

const [statusesObj, setStatusesObj] = useState({

kycStatus: '',

eddStatus: '',

fatcaStatus: '',

miscStatus: '',

miscStatusReason: '',

onboardingStatus:'',

xddStatus: '',

screeningStatus:'',

accountDocuments:[]

});

const userId = user?.userId;

 console.log({user, loginRes})

// const selectedAsset = useSelector((state) =>

state.assetClassVerification.assetClassVerification) || {"assetClassCode": "FX",
"id":3}

const selectedAsset = user?.currentAsset || {"assetClassCode": "FX", "id":3}

// const selectedAsset = {"assetClassCode": "LS", "id":3}

console.log("selectedAsset ", selectedAsset)

const [showManualUploadFS, setShowManualUploadFS] =

useState(selectedAsset.assetClassCode === "LS" ? false : true);

let reqObj = {

ipAddress: ip,

};

// SumSub ePOR, SumSub eVI, Au10Tix, Manual, 'AU10TIX, SUMSUB EPOR, SUMSUB EVI,
DEUTSCHEPOST, MANUAL'

let docPref = JSON.parse(user?.countryOfResidence?.docVerificationPref || null)

|| {

idCheck: "Au10Tix, Manual",

addressCheck: "SumSub ePOR, Manual",

othersCheck: "Manual",

};

const docPrefMap = { Identity: "idCheck", Address: "addressCheck" };

let uploadPrefFirstCheck = ""

let uploadPrefSecondCheck = "Manual"

const { kycStatus, eddStatus, fatcaStatus, miscStatus, fundingStatus,

miscStatusReason,xddStatus, screeningStatus, onboardingStatus, accountDocuments } =
statusesObj;

console.log({ kycStatus, eddStatus, fatcaStatus, miscStatus, fundingStatus,

miscStatusReason, xddStatus,accountDocuments, onboardingStatus, screeningStatus })

const docsAcceptedFundNotAllowed =

kycStatus === "COMPLETE" &&

 (eddStatus === "COMPLETE" || eddStatus === "NOT APPLICABLE") &&

fatcaStatus === "REVIEW COMPLETED" && fundingStatus === "NOT ALLOWED";

const docFirstName =

user.userDocumentVerification?.firstName &&

user.userDocumentVerification?.firstName !== "Not Present"

? user.userDocumentVerification?.firstName

: '';

const docMiddleName =

user.userDocumentVerification?.middleName &&

user.userDocumentVerification?.middleName !== "Not Present"

? user.userDocumentVerification?.middleName

: '';

const docLastName =

user.userDocumentVerification?.lastName &&

user.userDocumentVerification?.lastName !== "Not Present"

? user.userDocumentVerification?.lastName

: '';

const docDOB = user.userDocumentVerification?.dateOfBirth

? moment(user.userDocumentVerification?.dateOfBirth).format("DD/MM/YYYY")

: '';

const applDOB = user.dob

? moment(new Date(user.dob)).format("DD/MM/YYYY")

: '';

const documentId = user.userDocumentVerification?.id ?? '';

console.log({docFirstName, docLastName, docMiddleName, docDOB, firstName,

lastName, middleName })

const BASE_URL = process.env.REACT_APP_URL;

const PROCESS_API_URL = BASE_URL + "/process";

const REACT_SUMSUB_CREATE_TOKEN_URL = BASE_URL + "/createSumsubToken";

// const REACT_AUTENTIX_CREATE_TOKEN_URL = BASE_URL + "/sessionLink";

const DEUTSCHEPOST_URL = process.env.REACT_APP_DEUTSCHEPOST_URL;

const getUniformValue = (str) => str && str.replace(/[_-]/g, ' ')?.toUpperCase();

const isEntryPresent = (type, kycFlag = false) => {

// console.log("isEntryPresent ", type)

const manualUploadFiles = statusesObj?.accountDocuments || []

const resultData = manualUploadFiles.filter((docDetail) =>

kycFlag ? docDetail.au10tixResult || docDetail.documentCategory === type

: docDetail.documentCategory === type

);

if (resultData.length > 0) {

return true;

return false;

};

const config = {

headers: {

Authorization: `Bearer ${authToken}`,

},

};

const idStatusArr = [

"COMPLETE",

"MISSING ID",

"MISSING ID AND POR",

 "MISSING ID AND POR REVIEW",

"MISSING ID REVIEW",

"MISSING ID REVIEW AND POR",

"MISSING ID REVIEW AND POR REVIEW",

"MISSING ID WITH ADDRESS",

"MISSING ID WITH ADDRESS REVIEW"

];

const porStatusArr = [

"COMPLETE",

"MISSING ID AND POR",

"MISSING ID AND POR REVIEW",

"MISSING ID REVIEW AND POR",

"MISSING ID REVIEW AND POR REVIEW",

"MISSING POR",

"MISSING POR REVIEW"

];

const sowStatusArr = [

"COMPLETE",

"MISSING SOW",

"MISSING SOF",

"MISSING SOW AND SOF",

];

const sofStatusArr = [

"COMPLETE",

"MISSING SOW",

"MISSING SOF",
 "MISSING SOW AND SOF",

];

const fatcaStatusArr = ["FATCA APPLICABLE", "REVIEW COMPLETED"];

let userStatusInfo = {

kycStatus: null,

eddStatus: null,

fatcaStatus: null,

miscStatus: null,

fundingStatus: null,

xddStatus: null,

preCddEligible: null,

isCubanNational: false,

isZulu: false,

};

const documentVerification = {

userDocumentVerification: {

id: '',

documentType: '',

fullNameStatus: '',

dateOfBirthStatus: '',

nameAndDateOfBirthinterpretedResult: '',

documentStatus: identityStatus,

fullName: '',

docFirstName: '',

docLastName: '',

docMiddleName: '',

docDOB: '',

},
};

const getIdentityStatusLogic = (securemeDocData, statusName) => {

const {

checkResult,

fullNameSimilarity,

fullNameStatus,

firstName,

lastName,

middleName,

dateOfBirthStatus,

retryAttempt

} = securemeDocData;

console.log({securemeDocData})

if (retryAttempt > 0 && (statusName === "ACCEPTED")) {

if (kycStatus !== "COMPLETE") {

// setIsSuccessFlag(true);

setIdentityStatus(statusName);

return;

const re = /^[A-Za-z'. -]+$/;

if (firstName && lastName && middleName) {

if (!(re.test(firstName) && re.test(middleName) && re.test(lastName))) {

return;

}
}

if (

checkResult === "PASSED" &&

fullNameSimilarity > 50 &&

fullNameSimilarity < 90 &&

fullNameStatus === "NO MATCH" &&

firstName !== "Not Present" &&

lastName !== "Not Present" &&

dateOfBirthStatus === "MATCH"

) {

setIsNameMismatch(true);

// updateMismatchStatus(dataObj);

setIdentityStatus('Alert');

} else if (

checkResult === "PASSED" &&

fullNameSimilarity > 50 &&

fullNameSimilarity < 90 &&

fullNameStatus === "NO MATCH" &&

firstName !== "Not Present" &&

lastName !== "Not Present" &&

dateOfBirthStatus === "NO MATCH"

) {

setIsBothMismatch(true);

// updateMismatchStatus(dataObj);

setIdentityStatus('Alert');

} else if (

checkResult === "PASSED" &&

fullNameSimilarity > 50 &&

fullNameSimilarity < 100 &&

 (fullNameStatus === "NO MATCH" || fullNameStatus === "MATCH") &&

firstName === "Not Present" &&

lastName === "Not Present" &&

dateOfBirthStatus === "MATCH"

) {

setIsNameMismatch(true);

setEnableTextInput(true);

// updateMismatchStatus(dataObj);

setIdentityStatus('Alert');

} else if (

checkResult === "PASSED" &&

fullNameSimilarity > 50 &&

fullNameSimilarity < 100 &&

(fullNameStatus === "NO MATCH" || fullNameStatus === "MATCH") &&

firstName === "Not Present" &&

lastName === "Not Present" &&

dateOfBirthStatus === "NO MATCH"

) {

setIsBothMismatch(true);

setEnableTextInput(true);

// updateMismatchStatus(dataObj);

setIdentityStatus('Alert');

} else if (

checkResult === "PASSED" &&

fullNameSimilarity > 50 &&

fullNameSimilarity < 90 &&

fullNameStatus === "MATCH" &&

dateOfBirthStatus === "NO MATCH"

) {
 setIsDOBMismatch(true);

// updateMismatchStatus(dataObj);

setIdentityStatus('Alert');

} else if(

checkResult === "PASSED" &&

fullNameSimilarity >= 90 &&

fullNameSimilarity <= 99 &&

dateOfBirthStatus === "MATCH" &&

firstName !== "Not Present" &&

lastName !== "Not Present"

) {

// au10tix mismatch for > 90 for to auto update name only

//update name only

setIsNameMismatch(true);

setIsBothMismatch(false);

setIsDOBMismatch(false);

setIdentityStatus('Verified');

} else if(

checkResult === "PASSED" &&

fullNameSimilarity >= 90 &&

fullNameSimilarity < 100 &&

dateOfBirthStatus === "NO MATCH" &&

firstName !== "Not Present" &&

lastName !== "Not Present"

) {

// au10tix mismatch for > 90 for to update name and dob

//update both name and dob

setIsBothMismatch(true);

setIsNameMismatch(false);

setIsDOBMismatch(false);
 setIdentityStatus('Verified');

} else if(

checkResult === "PASSED" &&

(fullNameSimilarity === 100 || fullNameSimilarity === '100') &&

dateOfBirthStatus === "NO MATCH" &&

firstName !== "Not Present" &&

lastName !== "Not Present"

) {

// au10tix mismatch for > 90 for to update dob only

//update dob

setIsDOBMismatch(true);

setIsNameMismatch(false);

setIsBothMismatch(false);

setIdentityStatus('Verified');

} else {

const statusNameArray = ["REJECTED", "ACCEPTED"];

if (kycStatus !== "COMPLETE") {

if (statusNameArray.includes(statusName.toUpperCase())) {

// setIsSuccessFlag(true);

if(statusName.toLowerCase() === 'accepted') {

setIdentityStatus("Verified");

} else{

setIdentityStatus(statusName);

// setIdentityStatus("In Review");

} else {

// setActualStatuses(true);

}
 }

};

const setActualStatuses = () => {

if (kycStatus === 'COMPLETE') {

setIdentityStatus("Verified");

setAddressStatus("Verified");

else if (kycStatus==='MISSING ID') {

setIdentityStatus("Required");

else if ( kycStatus==='MISSING ID WITH ADDRESS' || kycStatus==='MISSING ID WITH

ADDRESS REVIEW')

if (isNameMismatch || isDOBMismatch || isBothMismatch) {

setIdentityStatus("Alert");

} else {

setIdentityStatus("In Review");

else if (kycStatus==='MISSING ID REVIEW') {

setIdentityStatus("In Review");

else if (kycStatus==='MISSING POR') {

setAddressStatus("Required");

else if (kycStatus==='MISSING POR REVIEW') {

setAddressStatus("In Review");

else if (kycStatus==='MISSING ID AND POR') {

 setIdentityStatus("Required");

setAddressStatus("Required");

else if (kycStatus === 'MISSING ID REVIEW AND POR') {

setIdentityStatus("In Review");

setAddressStatus("Required");

else if (kycStatus === 'MISSING ID REVIEW AND POR REVIEW') {

setIdentityStatus("In Review");

setAddressStatus("In Review");

else if (kycStatus === 'MISSING ID AND POR REVIEW') {

setIdentityStatus("Required");

setAddressStatus("In Review");

if (eddStatus === 'COMPLETE') {

setSowStatus("Verified");

setSofStatus("Verified");

else

if (eddStatus === 'MISSING SOW AND SOF') {

if (isEntryPresent("SOW")) {

setSowStatus("In Review");

if (isEntryPresent("SOF")) {

setSofStatus("In Review");

}
 else if (eddStatus === 'MISSING SOF') {

setSowStatus("Verified");

if (isEntryPresent("SOF")) {

setSofStatus("In Review");

} else {

setSofStatus("Required");

else if (eddStatus === 'MISSING SOW') {

setSofStatus("Verified");

if (isEntryPresent("SOW")) {

setSowStatus("In Review");

} else {

setSowStatus("Required");

if ( selectedAsset?.assestClassCode==='LS' && isEntryPresent('w8ben')) {

if (miscStatusReason?.includes("w8ben")) {

setForeignStatus("In Review");

else

setForeignStatus("Accepted");

else

{
 if (fatcaStatus === 'REVIEW COMPLETED') {

setForeignStatus("Accepted");

else if (fatcaStatus === 'FATCA APPLICABLE') {

if (isEntryPresent('Foreign Status')) {

setForeignStatus("In Review");

} else {

setForeignStatus("Required");

if (miscStatusReason === "CUBAN NATIONAL") {

if (isEntryPresent('CUBA')) {

setCubaStatus("In Review");

} else {

setCubaStatus(getLabel("Required"));

} else {

if (miscStatusReason === "" || miscStatusReason !== "CUBAN NATIONAL") {

if (isEntryPresent('CUBA')) {

setCubaStatus(getLabel("Verified"));

};

useEffect(() => {

// getGlobalStatus();
 // if (

// (loginRes && loginRes.success) ||

// authToken

// // && identityStatus !== "Required"

// ) {

// getUploadedAllFilesDetails();

// // callApiForStatusMessage();

// // getUploadedFileDetail(docType);

// }

// setActualStatuses();

}, [authToken, kycStatus, eddStatus, fatcaStatus]);

const fetchJson = () => {

fetch(configurationServices().uploadDocuments)

.then((response) => {

return response.json();

})

.then((data) => {

setDocLists(data);

})

.catch((e) => {

console.log(e.message);

});

};

useEffect(() => {

// if(!selectedAsset){

// navigate("/assetclassverification");

// }
 if (selectedAsset.assetClassCode === "LS" && kycStatus === "COMPLETE" &&

(screeningStatus === "NO MATCH" || screeningStatus === "REVIEW COMPLETED") &&

(fatcaStatus === "REVIEW COMPLETED" || fatcaStatus === "NOT APPLICABLE") &&

(eddStatus === "COMPLETE" || eddStatus === "NOT APPLICABLE") &&

miscStatus === "COMPLETE" &&

(xddStatus === "NOT APPLICABLE" || xddStatus === "COMPLETE") &&

onboardingStatus === "ONBOARDED"

) {

navigate("/termsofbusiness");

setSessionFlag("Loader")

makeInitialCalls()

fetchJson()

return () => {

clearInterval(intervalId.current);

};

}, []);

useEffect(() => {

setActualStatuses();

setManualUploadDocStatus();

setTimeout(()=>{

if(sessionFlag==='Loader'){

setSessionFlag('')

},500)

}, [kycStatus, eddStatus, fatcaStatus, accountDocuments]);

const makeInitialCalls = async () => {

await getGlobalStatus();

// await getUploadedAllFilesDetails();

const prefVal = docPref?.idCheck

if(prefVal){

let fPrefVal = prefVal?.slice(0, prefVal?.indexOf(','))

console.log("fPrefVal ", fPrefVal)

if(fPrefVal?.toUpperCase() === "SUMSUB EVI"){

setEnableVideoIdent(true)

useEffect(() => {

// if (eventFlag) {

// setTimeout(() => {

// getUploadedAllFilesDetails();

// }, 30000);

// }

if(eventFlag) {

intervalId.current = setInterval(() => getAccountInfo(), 10000);

// setIntervalId(timerId);

}, [eventFlag]);

const updateCurrentStepAndNavigate = () => {

dispatch(

userInfoData(
 {

...reqObj,

currentStep: "UPLOAD_DOCUMENT",

},

reqObj

);

navigate("/deposit");

};

const updateMismatchStatus = (data) => {

const { isDeclined, updateSubStatus, subStatus, docStatus } = data;

const requestObj = {

processName: "declineDocument",

requestBody: {

docId: documentId,

userId: userId,

isDeclined: isDeclined, // if isDeclined is true then in BE the both

increment and doc status will update

// if isDeclined is false then in BE only increment will update [Confirm &

Update scenario]

updateSubStatus: updateSubStatus, // if updateSubStatus is true then in BE

it will go to update only status and sub_status but not the Decline and Confirm &
Update

subStatus: subStatus, // it will update sub_status in BE when the value is

not null

docStatus: docStatus, // it will update doc_status in BE when the value is

not null

},

methodType: "POST",

};
 axios

.post(PROCESS_API_URL, requestObj, config)

.then((response) => {

// handle success

if (kycStatus !== "COMPLETE") {

// setIsConditionalReview(true);

isDeclined && setIdentityStatus("In Review");

})

.catch((error) => {

// handle error

dispatch(notifyApiFail("Something went wrong."));

});

};

const onMismatchDeclineSubmit = () => {

const dataObj = {

isDeclined: true,

updateSubStatus: false,

subStatus: '',

docStatus: '',

};

updateMismatchStatus(dataObj);

};

const onMismatchConfirmSubmit = () => {

// todo need check after updating the details are saving properly in backend
table

let aboutYourself = {};

const dobData = docDOB.split("/");

if (isNameMismatch) {

aboutYourself = {

values: {

firstName: enableTextInput ? inputFirstName : docFirstName,

middleName: enableTextInput ? inputMiddleName : docMiddleName,

lastName: enableTextInput ? inputLastName : docLastName,

},

};

} else if (isBothMismatch) {

aboutYourself = {

values: {

firstName: enableTextInput ? inputFirstName : docFirstName,

middleName: enableTextInput ? inputMiddleName : docMiddleName,

lastName: enableTextInput ? inputLastName : docLastName,

dob: dobData[0] + "-" + dobData[1] + "-" + dobData[2],

},

};

} else if (isDOBMismatch) {

aboutYourself = {

values: {

dob: dobData[0] + "-" + dobData[1] + "-" + dobData[2],

},

};

const users = [];

const reqBody = {

id: userId,

isPrompt:true,
 aboutYourself: aboutYourself,

};

users.push(reqBody);

const requestBody = {

users: users,

};

const requestObj = {

processName: "updateUser",

requestBody,

methodType: "POST",

serviceName: ["aboutYourself"],

};

const dataObj = {

isDeclined: false,

updateSubStatus: false,

subStatus: "",

docStatus: "",

};

axios

.post(PROCESS_API_URL, requestObj, config)

.then((response) => {

if (response.status === 200 && response.data.success === true) {

setIdentityStatus("Verified");

updateMismatchStatus(dataObj);

})

.catch((error) => {
 dispatch(notifyApiFail("Something went wrong."));

});

};

const onInputChange = (newValue, type) => {

if (type === "fn") {

const re = /^[A-Za-z'. -]+$/;

if (re.test(newValue)) {

setErrorTextFeild({ ...errorTextFeild, inputFirstName: false });

} else {

setErrorTextFeild({ ...errorTextFeild, inputFirstName: true });

setInputFirstName(newValue);

if (type === "ln") {

const re = /^[A-Za-z'. -]+$/;

if (re.test(newValue)) {

setErrorTextFeild({ ...errorTextFeild, inputLastName: false });

} else {

setErrorTextFeild({ ...errorTextFeild, inputLastName: true });

setInputLastName(newValue);

if (type === "mn") {

const re = /^[A-Za-z'. -]+$/;

if (newValue === '') {

setErrorTextFeild({ ...errorTextFeild, inputMiddleName: false });

} else if (re.test(newValue)) {

setErrorTextFeild({ ...errorTextFeild, inputMiddleName: false });

 } else {

setErrorTextFeild({ ...errorTextFeild, inputMiddleName: true });

setInputMiddleName(newValue);

};

const validation = () => {

let isValid = true;

if (

errorTextFeild.inputFirstName === true ||

errorTextFeild.inputLastName === true ||

(inputMiddleName !== '' && errorTextFeild.inputMiddleName === true) ||

!inputFirstName ||

!inputLastName

) {

isValid = false;

return isValid;

};

const setLatestStatuses = (record) => {

let kycStatus = getUniformValue(record?.kycStatus);

let eddStatus = getUniformValue(record?.eddStatus);

let fatcaStatus = getUniformValue(record?.fatcaStatus);

let miscStatus = getUniformValue(record?.miscStatus);

let miscStatusReason = getUniformValue(record?.miscStatusReason);

let xddStatus = getUniformValue(record?.xddStatus);

let screeningStatus = getUniformValue(record?.screeningStatus);

let onboardingStatus = getUniformValue(record?.onboardingStatus);

 const tStatusObj = {...record, kycStatus, eddStatus, fatcaStatus,
miscStatusReason, miscStatus,xddStatus, screeningStatus, onboardingStatus }

setStatusesObj(tStatusObj)

// const manualUploadFiles = record?.accountDocuments;

// documentVerification.userManualUploadDetails = manualUploadFiles;

dispatch(updateUserInfo(documentVerification));

userStatusInfo.kycStatus = kycStatus ?? null;

userStatusInfo.eddStatus = eddStatus ?? null;

userStatusInfo.fatcaStatus = fatcaStatus ?? null;

userStatusInfo.miscStatus = miscStatus ?? null;

userStatusInfo.fundingStatus = record?.fundingStatus ?? null;

userStatusInfo.xddStatus = xddStatus ?? null;

userStatusInfo.applicationStatus = record?.applicationStatus ?? null;

userStatusInfo.currentStep = record.currentStep ?? null;

userStatusInfo.miscStatusReason = miscStatusReason ?? null;

dispatch(updateUserInfo(userStatusInfo));

const getGlobalStatus = async () => {

axios

.post(

PROCESS_API_URL,

processName: "userDetails",

requestBody: {

userId: userId,

},

methodType: "POST",
 },

config

.then((response) => {

const userDetails = response?.data?.data["user-details"];

const allAccountsInfo = userDetails.accountInfo;

const isStocks = selectedAsset.assetClassCode==="LS" ? true : false;

console.log("allAccountsInfo ", allAccountsInfo,

"selectedAsset.assetClassCode ", selectedAsset.assetClassCode)

let currentAccountData = allAccountsInfo?.length > 0 &&

allAccountsInfo?.filter(

(eachAcc) => eachAcc.assetEntityMap?.assestClassCode ===

selectedAsset.assetClassCode)[0];

if(isStocks===true){

const forexData = allAccountsInfo?.length > 0 &&

allAccountsInfo?.filter(

(eachAcc) => eachAcc.assetEntityMap?.assestClassCode === "FX")[0];

currentAccountData["kycStatus"]=forexData?.kycStatus

userStatusInfo.preCddEligible = userDetails.preCddEligible;

userStatusInfo.isCubanNational = userDetails.citizenship === "CU" ?

true : false;

userStatusInfo.isZulu = (userDetails.platform)?.includes("ZT") ? true :

false;

userStatusInfo.dob = userDetails.dateOfBirth;

userStatusInfo.fxowsAccountNumber = userDetails.fxowsAccountNumber;

const manualDocData = currentAccountData?.accountDocuments || []

const au10tixData = manualDocData?.length > 0 &&

manualDocData?.filter((docDetail) => docDetail.vendorName === "Au10tix");

if (au10tixData && au10tixData.length > 0) {

 setInitAu10TixDocListCount(au10tixData.length)

setLatestStatuses(currentAccountData)

dispatch(updateUserInfo(userStatusInfo));

setFirstName(userDetails.firstName);

setLastName(userDetails.lastName);

setMiddleName(userDetails.middleName);

})

.catch((error) => {

setSessionFlag('');

console.log("error", error);

});

};

const callApiForStatusMessage = (latestAu10TixRecord) => {

const secureMeRequestId = latestAu10TixRecord.requestId

console.log("callApiForStatusMessage ", secureMeRequestId)

axios

.post(

PROCESS_API_URL,

processName: "securemeDocumentStatus",

requestBody: {

userId: userId,

assetId:selectedAsset.id,

requestId: secureMeRequestId,

},

methodType: "POST",

},
 config

.then((response) => {

const securemeDocData = response?.data?.data;

// const { documentStatus, docSubStatus, checkResult, checkResultReason } =

securemeDocData;

let checkResult = getUniformValue(securemeDocData?.checkResult);

let fullNameStatus = getUniformValue(securemeDocData?.fullNameStatus);

let dateOfBirthStatus =
getUniformValue(securemeDocData?.dateOfBirthStatus);

let documentStatus = getUniformValue(securemeDocData?.documentStatus);

let docSubStatus = getUniformValue(securemeDocData?.docSubStatus);

let checkResultReason =
getUniformValue(securemeDocData?.checkResultReason);

let fullNameSimilarity = parseInt(securemeDocData?.fullNameSimilarity);

const tSecureMeData = {...securemeDocData, checkResult, fullNameStatus,

dateOfBirthStatus, documentStatus, docSubStatus, fullNameSimilarity,
checkResultReason }

console.log("tSecData ", tSecureMeData)

documentVerification.userDocumentVerification = response?.data?.data;

dispatch(updateUserInfo(documentVerification));

const statusName = documentStatus && documentStatus.charAt(0).toUpperCase()

+ documentStatus.slice(1).toLowerCase();

console.log("latestAu10TixRecord ", latestAu10TixRecord)

if(latestAu10TixRecord?.processingResultRemark &&
(latestAu10TixRecord?.processingResultRemark==='0,100' ||
latestAu10TixRecord?.processingResultRemark==='100')){

setIdentityStatus('Expired');

else if (documentStatus !== '' && documentStatus !== undefined) {

let subStatusName = "Required";

if (docSubStatus === "IN REVIEW") {

 subStatusName = "In Review";

} else if (docSubStatus === "ALERT") {

subStatusName = "Alert";

} else if(checkResult === 'CONDITIONAL' && checkResultReason === 'DEFAULT

MANUAL REVIEW') {

subStatusName = "In Review";

getIdentityStatusLogic(tSecureMeData,

documentStatus === "MANUAL REVIEW" ? subStatusName : statusName

);

else{

setIdentityStatus('In Review');

})

.catch((error) => {

// dispatch(

// notifyApiFail({

// title: getLabel("SECURE_ME_ERROR_TITLE"),

// desc: getLabel("AUTHORIZATION_FAILED"),

// })

// );

});

};

// useEffect(() => {

// if (identityStatus === "In Review") {

// // let timerId = setInterval(() =>

callApiForStatusMessage(secureMeRequestId), 10000);

// let timerId = setInterval(() => getUploadedAllFilesDetails(), 10000);

// // stops after 10 seconds

// setTimeout(() => {

// clearInterval(timerId);

// }, 30000);

// }

// }, [identityStatus]);

const onUploadSubmit = async (files) => {

setSubmitLoading(true);

const formData = new FormData();

const dataObject = {

// // deviceId: "test",

// documentType: "image",

// reviewType: "test",

// documentCategory: docType,

// processed: false,

// processingResultRemark: "test",

// // softwareUsed: "test",

// // containNonLatinChars: false,

// fullNameStatus: "MATCH",

// addressStatus: "MATCH",

// nameAndDateOfBirthinterpretedResult: '',

// requestId: "requestId",

"documentType": "image",

// "docLevelName": "idv",

"reviewType": "test",

"vendorName": "manualupload",

"documentCategory": docType === "Foreign Status" &&

selectedAsset.assetClassCode === "LS" ? "w8ben" : docType,

"processed": false,

// "primaryProcessingResult": "manualupload",

"processingResultRemark": "test",

"nameAndDateOfBirthinterpretedResult": '',

"requestId": "requestId",

};

files.forEach((subArray, index) => {

formData.append("files", subArray[0] ? subArray[0] : {});

});

// Append the userId and file groups object to the form data

formData.append("userId", userId);

formData.append("assetId", selectedAsset.id);

formData.append("userDocumentString", JSON.stringify(dataObject));

const urlEndPoint = (docType === "Foreign Status" &&

selectedAsset.assetClassCode === "LS") ? "/manualW8benUpload" : "/document-upload";

await axios

.post(`${BASE_URL}${urlEndPoint}`, formData, {

headers: {

Authorization: `Bearer ${authToken}`,

"Content-Type": "multipart/form-data",

},

})

.then((response) => {

setSubmitLoading(false);

setSessionFlag("MessageCard")

// setUploadedStatus({status:"fail", title : 'Your document is under

review.' , description :"Your document is under review, and we'll notify you once
accepted. If you have more documents to add, select \"Upload additional
documents\''});

// const {
 // kycStatus,

// eddStatus,

// fatcaStatus,

// isZulu,

// fundingStatus,

// miscStatusReason,

// } = statusesObj;

setUploadedStatus({

status:"success",

title : 'Your document is under review.' ,

description :"Your document is under review, and we'll notify you once
accepted. If you have more documents to add, select \"Upload additional
documents\'"

});

if (docType === "Identity") {

if (kycStatus !== "COMPLETE") {

setIdentityStatus("In Review");

documentVerification.userDocumentVerification.documentStatus = "In
Review";

dispatch(updateUserInfo(documentVerification));

} else if (docType === "Address") {

if (kycStatus !== "COMPLETE") {

setAddressStatus("In Review");

} else if (docType === "SOW") {

if (eddStatus !== "COMPLETE") {

setSowStatus("In Review");

} else if (docType === "SOF") {

if (eddStatus !== "COMPLETE") {

 setSofStatus("In Review");

} else if (docType === "Foreign Status" || docType === "w8ben") {

if (fatcaStatus !== "REVIEW COMPLETED") {

setForeignStatus("In Review");

} else if (docType === "CUBA") {

setCubaStatus("In Review");

})

.catch((error) => {

setSessionFlag("MessageCard")

setUploadedStatus({

status:"fail",

title : 'Document Upload Failed' ,

description :"The document could not be uploaded"

});

});

};

const getLatestSumSubRecord = (docCategory) => {

const manualDocData = statusesObj?.accountDocuments || []

const sumSubData = manualDocData?.length > 0 &&

manualDocData?.filter((docDetail) => (docDetail.vendorName === "Sumsub" &&
docDetail.documentCategory===docCategory));

if(sumSubData?.length > 0){

const latestSumSubRecord = sumSubData.sort((a,b)=>new Date(b.createdDate) -

new Date(a.createdDate))[0]

setIsApplicantFound(true)

return latestSumSubRecord

}
 }

const setManualUploadDocStatus = () => {

const documentsList = statusesObj?.accountDocuments || []

console.log("setManualUploadDocStatus ", statusesObj?.accountDocuments)

//Address status Updating

const latestAddressSumSubRecord = getLatestSumSubRecord('Address')

if(latestAddressSumSubRecord){

if ((latestAddressSumSubRecord?.processingResultRemark === "completed" &&

latestAddressSumSubRecord?.documentResult === "GREEN") || kycStatus === 'COMPLETE')

setAddressStatus("Verified");

} else if (latestAddressSumSubRecord?.processingResultRemark !== "init") {

setAddressStatus("In Review");

//Identity status Updating

if(enableVideoIdent===true){

const latestIdSumSubRecord = getLatestSumSubRecord('Identity')

if(latestIdSumSubRecord){

if ((latestIdSumSubRecord?.processingResultRemark === "completed" &&

latestIdSumSubRecord?.documentResult === "GREEN") || kycStatus === 'COMPLETE')

setIdentityStatus("Verified");

} else if (latestIdSumSubRecord?.processingResultRemark !== "init") {

setIdentityStatus("In Review");

}
 else{

const au10tixData = documentsList?.length > 0 &&

documentsList?.filter((docDetail) => docDetail.vendorName === "Au10tix");

if (au10tixData && au10tixData.length > 0) {

const latestAu10TixRecord = au10tixData.sort((a,b)=>new Date(b.createdDate)

- new Date(a.createdDate))[0]

console.log({latestAu10TixRecord})

console.log(au10tixData.length," > ", initAu10TixDocListCount)

if(au10tixData.length > initAu10TixDocListCount){

clearInterval(intervalId.current);

callApiForStatusMessage(latestAu10TixRecord);

// return (

// manualDocData

// // .filter((docManualList) => docManualList.flag === true)

// .map((docsData, index) => {

// if ( docsData.documentCategory !== undefined &&

docsData.documentCategory && docsData.documentCategory === "Address")

// {

// if ((docsData.processingResultRemark === "completed" &&

docsData?.documentResult === "GREEN") || kycStatus === 'COMPLETE')

// {

// setAddressStatus("Complete");

// } else if (docsData.processingResultRemark !== "init") {

// setAddressStatus("In Review");

// }

// if (kycStatus!=='COMPLETE') {

// }
 // } else if (docsData.documentCategory === "Foreign Status" ||
docsData.documentCategory === "w8ben") {

// if (fatcaStatus !== "REVIEW COMPLETED" &&

docsData.documentResultMapping?.documentStatus) {

// console.log("docsData.documentResultMapping?.documentStatus ",
docsData.documentResultMapping?.documentStatus)

// setForeignStatus(docsData.documentResultMapping?.documentStatus
=== "MANUAL_REVIEW" ? "In Review" :
docsData.documentResultMapping?.documentStatus);

// }

// }

// })

// );

};

const getAccountInfo = async () => {

await axios

.post(

PROCESS_API_URL,

processName: "userDocuments",

requestBody: {

userId: userId,

assetId: selectedAsset.id,

isImageRequired: true,

},

methodType: "POST",

},

config

.then((response) => {

const accountData = response?.data?.data["documents-response"];

 console.log({accountData})

setLatestStatuses(accountData)

})

.catch((error) => {

setSessionFlag('');

// dispatch(notifyApiFail("Something went wrong."));

});

};

// const getUploadedAllFilesDetails = async () => {

// await axios

// .post(

// PROCESS_API_URL,

// {

// processName: "userDocuments",

// requestBody: {

// userId: userId,

// countryId: 1,

// assetId: selectedAsset.id,

// isImageRequired: true,

// },

// methodType: "POST",

// },

// config

// )

// .then((response) => {

// const manualUploadFiles =
 // response?.data?.data["documents-response"];

// setManualDocData(manualUploadFiles);

// documentVerification.userManualUploadDetails = manualUploadFiles;

// dispatch(updateUserInfo(documentVerification));

// const au10tixData = manualUploadFiles.filter(

// (docDetail) =>

// docDetail.au10tixResult !== undefined &&

// docDetail.au10tixResult !== ''

// );

// setManualUploadDocStatus(manualUploadFiles);

// const sumSubData = manualUploadFiles?.length > 0 &&

manualUploadFiles.filter(

// (docDetail) => docDetail.vendorName === "Sumsub");

// if(sumSubData?.length > 0){

// setIsApplicantFound(true)

// const latestSumSubRecord = sumSubData.sort(

// (objA, objB) => new Date(objB.updateDate) - new

Date(objA.updateDate),

// )[0];

// if (latestSumSubRecord["processingResultRemark"].match(/completed')) {

// setAddressStatus("Complete");

// }else if (!latestSumSubRecord["processingResultRemark"].match(/init'))
{

// setAddressStatus("In Review");

// }

// }

// if (au10tixData && au10tixData.length > 0) {

// callApiForStatusMessage(au10tixData[au10tixData.length -
1].requestId);

// }

// })
 // .catch((error) => {

// // handle error

// dispatch(notifyApiFail("Something went wrong."));

// });

// };

const receiveMessage = (event) => {

// console.log("receiveMessage", event)

if (event.origin !== "https://secure-me.au10tixservicesstaging.com") {

return;

} else {

const {

data: { eventType },

} = event;

if (eventType !== null && eventType === "Success") {

setIdentityStatus("In Review");

documentVerification.userDocumentVerification.documentStatus = "In Review";

//todo need to update the status in backend DB by integrating with API once
its done

dispatch(updateUserInfo(documentVerification));

setSessionFlag("MessageCard")

setTimeout(()=>{

setEventFlag(true);

}, 2000)

if (eventType !== null && eventType === "Error") {

// setSessionFlag('');

// setEnableDetailsView(true);

}
 if (eventType !== null && eventType === "Application-state: loaded") {

// console.log("SecureMeeeee Loaded")

};

window.addEventListener("message", receiveMessage, false);

const createAuthenticsSession = async () => {

setSessionFlag("Loader")

const requestObj = {

processName: "secureme",

requestBody: {

userId: userId,

processingFlow: "idv",

assetId: selectedAsset.id

},

methodType: "POST",

await axios

.post(PROCESS_API_URL, requestObj, config)

.then(async (response) => {

const resData = await response.data;

const isAu10TixToken = await (resData?.data?.link?.url &&

resData?.data?.link?.url!=='')

console.log("isAu10TixToken ", isAu10TixToken)

if(isAu10TixToken){

setSessionFlag("Au10Tix");
 console.log("Inside isAu10TixToken ", isAu10TixToken)

const url = resData?.data?.link?.url;

setAuthenticsUrl(url);

setEnableDetailsView(false);

else

getUploaderVendor(uploadPrefSecondCheck, uploadPrefFirstCheck)

// if ( (resData?.reason && resData?.reason === "SECURE ME DOWN") ||

resData?.error || !resData?.reason )

})

.catch((error) => {

getUploaderVendor(uploadPrefSecondCheck, uploadPrefFirstCheck)

// dispatch(

// notifyApiFail({

// title: getLabel("SECURE_ME_ERROR_TITLE"),

// desc: getLabel("AUTHORIZATION_FAILED"),

// })

// );

});

};

const createSumSubSession = (type) => {

setSessionFlag("Loader")

const requestObj = {

requestBody:{

userId: userId+"-"+selectedAsset.id,

tokenType: type,

isApplicantFound
 }

};

axios

.post(REACT_SUMSUB_CREATE_TOKEN_URL, requestObj, config)

.then((response) => {

const resData = response.data

if (response.status === 200 && resData?.success === true &&

resData?.data?.token!=='') {

setSumSubAccessToken(resData?.data?.token)

setSessionFlag("SumSub");

setEnableDetailsView(false);

} else {

getUploaderVendor(uploadPrefSecondCheck, uploadPrefFirstCheck)

})

.catch((error) => {

getUploaderVendor(uploadPrefSecondCheck, uploadPrefFirstCheck)

// dispatch(notifyApiFail("Something went wrong."));

});

};

const createDeutchePostSession = () => {

goToMainPage()

window.open(DEUTSCHEPOST_URL, "_blank");

const getUploaderVendor = (currentPref, diffPref) => {

console.log("firstCheck "+ currentPref + " "+ diffPref)

if(currentPref!==diffPref){

console.log("firstCheck Inside "+ currentPref + " "+ diffPref)

 if(currentPref==="AU10TIX"){

createAuthenticsSession();

else if(currentPref==="SUMSUB EPOR" && diffPref!=="SUMSUB EVI" ){

createSumSubSession("POR")

else if(currentPref==="SUMSUB EVI" && currentPref!=="SUMSUB EPOR" ){

createSumSubSession("VI")

else if(currentPref==="DEUTSCHEPOST"){

createDeutchePostSession();

else{

openDetailView()

const openDetailView = () =>{

setSessionFlag('');

setEnableDetailsView(true);

const goToMainPage = async () => {

setSessionFlag("Loader")

await getGlobalStatus();

setDocType('')

setEnableDetailsView(false);
 setSelectedDocument({})

setSubDocuments('')

setAuthenticsUrl('')

setSumSubAccessToken('')

setTimeout(()=>{

setSessionFlag('');

}, 1000)

const inReview = () =>{

// to redirect back to doc list page

setSessionFlag('');

setEnableDetailsView(false);

setDocType('')

const onDocumentCardSelection = (selectedDoc) => {

// const docType = localStorage.getItem("uploadDocType");

const currentDocType = selectedDoc.docType;

console.log({selectedDoc})

if(

(currentDocType === "Identity" && (identityStatus === "Required" ||

identityStatus === "Alert" || identityStatus === "Rejected" || identityStatus ===
"Expired")) ||

(currentDocType === "Address" && addressStatus === "Required")

const prefVal = docPref[docPrefMap[currentDocType]]

if(prefVal){

let uploadPrefAry = prefVal.split(',')

console.log("uploadPrefAry ", uploadPrefAry)

 uploadPrefFirstCheck = uploadPrefAry[0]?.toUpperCase()

uploadPrefSecondCheck = uploadPrefAry[1]?.toUpperCase()?.trim()

getUploaderVendor(uploadPrefFirstCheck, uploadPrefSecondCheck)

else

openDetailView()

};

const onBackSubmit = () => {

setDocType('');

setSessionFlag('');

setSelectedDocument({})

setEnableDetailsView(false);

};

const onSumSubSuccess = () => {

setUploadedStatus({status:"success", title : 'Your document is under review.' ,

description :"Your document is under review, and we'll notify you once
accepted."});

setSessionFlag("MessageCard")

setAddressStatus("In Review")

};

return (

<>
 {

sessionFlag === "Loader" ? (

<Box>

<Loader/>

</Box>

) :

sessionFlag === "MessageCard" ? (

<MessageCardBox statusesObj={statusesObj}
setShowManualUploadFS={setShowManualUploadFS} openDetailView={openDetailView}
uploadedStatus={uploadedStatus} onBackSubmit={onBackSubmit}
goToMainPage={goToMainPage} />

) :

sessionFlag === "Au10Tix" && !enableDetailsView ? (

<>

<Box sx={{ marginBottom: "80px" }}>

<AuthentixPage authenticsUrl={authenticsUrl} />

</Box>

<Footer goToMainPage={goToMainPage} isMobile={isMobile} />

</>

) : sessionFlag === "SumSub" && !enableDetailsView ? (

<>

<SumSubPage

accessToken={sumSubAccessToken}

onSumSubSuccess={onSumSubSuccess}

openDetailView={openDetailView}

inReview={inReview}

/>

<Footer goToMainPage={goToMainPage} isMobile={isMobile} />

</>

) : sessionFlag === '' ? (

<DocumentsPage
docType={docType}

setDocType={setDocType}

selectedDocument={selectedDocument}

setSelectedDocument={setSelectedDocument}

subDocuments={subDocuments}

docLists={docLists}

setSubDocuments={setSubDocuments}

onDocumentCardSelection={onDocumentCardSelection}

applFirstName={firstName}

applLastName={lastName}

applMiddleName={middleName}

docFirstName={docFirstName}

docMiddleName={docMiddleName}

docLastName={docLastName}

updateCurrentStepAndNavigate={updateCurrentStepAndNavigate}

docTitle={docTitle}

setDocTitle={setDocTitle}

onUploadSubmit={onUploadSubmit}

isNameMismatch={isNameMismatch}

isDOBMismatch={isDOBMismatch}

isBothMismatch={isBothMismatch}

enableTextInput={enableTextInput}

docDOB={docDOB}

applDOB={applDOB}

onMismatchConfirmSubmit={onMismatchConfirmSubmit}

onMismatchDeclineSubmit={onMismatchDeclineSubmit}

onInputChange={onInputChange}

validation={validation}

errorTextFeild={errorTextFeild}

inputFirstName={inputFirstName}
 inputMiddleName={inputMiddleName}

inputLastName={inputLastName}

identityStatus={identityStatus}

addressStatus={addressStatus}

sowStatus={sowStatus}

sofStatus={sofStatus}

foreignStatus={foreignStatus}

cubaStatus={cubaStatus}

docsAcceptedFundNotAllowed={docsAcceptedFundNotAllowed}

onBackSubmit={onBackSubmit}

enableDetailsView={enableDetailsView}

submitLoading={submitLoading}

setSubmitLoading={setSubmitLoading}

enableVideoIdent={enableVideoIdent}

selectedAsset={selectedAsset}

goToMainPage={goToMainPage}

userId={userId}

authToken={authToken}

showManualUploadFS={showManualUploadFS}

setShowManualUploadFS={setShowManualUploadFS}

setSessionFlag={setSessionFlag}

setUploadedStatus={setUploadedStatus}

ip={ip}

userCameFrom={userCameFrom}

/>

) : null

</>

);
};

function Footer({goToMainPage, isMobile}){

return (

<Box

sx={{

zIndex:1,

display: "flex",

flexDirection: "row",

justifyContent: "flex-start",

alignItems: "center",

gap: "8px",

position: "fixed",

width: "100%",

padding: "20px",

left: "0",

bottom: "0",

background: "#000",

boxShadow: "0px -4px 12px rgba(33, 33, 33, 0.05)",

boxSizing: "border-box",

}}

>

<Button

variant="outlined"

sx={{

zIndex:1,

color: "#000!important",

flexDirection: "row",

alignItems: "center",

padding: "12px 24px",

 gap: "8px",

width: !isMobile ? "fit-content" : "100%",

height: "48px",

fontWeight: 700,

color: "white",

fontSize: "14px",

lineHeight: "24px",

border: "1px solid #f8f8f8",

borderRadius: "100px",

textTransform: "uppercase",

letterSpacing: "0.42px",

}}

onClick={goToMainPage}

>

<ArrowBackIcon

sx={{ display: isMobile ? "none" : "auto", color: "primary" }}

/>

{"BACK TO DOCUMENTS"}

</Button>

</Box>

);

function MessageCardBox(props){

const {

uploadedStatus,

openDetailView,

onBackSubmit,

goToMainPage,
 setShowManualUploadFS,

} = props;

const { t: getLabel } = useTranslation();

const navigate = useNavigate();

const isMobile = useMediaQuery("(max-width: 599px)");

const isTablet = useMediaQuery("(min-width: 600px) and (max-width: 1023px)");

// const tStatusObj = {

// ...currentAccountData,

// kycStatus,

// eddStatus,

// fatcaStatus,

// miscStatusReason,

// miscStatus,

// xddStatus,

// screeningStatus,

// };

// if (

// kycStatus === "COMPLETE" &&

// (screeningStatus === "NO MATCH" || screeningStatus === "REVIEW COMPLETED")

&&

// (fatcaStatus === "REVIEW COMPLETED" || fatcaStatus === "NOT APPLICABLE") &&

// (eddStatus === "COMPLETE" || eddStatus === "NOT APPLICABLE") &&

// miscStatus === "COMPLETE" &&

// (xddStatus === "NOT APPLICABLE" || xddStatus === "COMPLETE")

// && onboardingStatus === "ONBOARDED"

// ) {

// }

return (

<Stack
 spacing={2}

sx={{maxWidth: isMobile ? '335px' : '644px', textAlign: 'center',

margin: '40px auto 0px auto'}}

alignItems={'center'}

>

<Box>

uploadedStatus.status === "success"

<Box className="msg-card-icon success"></Box>

uploadedStatus.status === "fail"

<Box className="msg-card-icon fail"></Box>

<Box className="msg-card-icon optional"></Box>

</Box>

<Typography

sx={{

color: '#F8F8F8',

fontSize: isMobile ? '28px' : '36px',

fontWeight: 700,

lineHeight: '40px',

letterSpacing: '0.72px',

maxWidth: '644px'

}}

>

{uploadedStatus.title}

</Typography>
{uploadedStatus.description.length > 0 ?

<Typography

sx={{

color:'#B3B3B3',

fontSize: '18px',

fontWeight: 500,

lineHeight: '28px',

letterSpacing: '0.54px',

maxWidth: '644px'

}}

>

<TRADUTrans

defaults={uploadedStatus.description}

/>

</Typography>

:'' }

uploadedStatus.footerText

<Box

className="msg-card-footer-text"

>

{uploadedStatus.footerText}

</Box>

<></>

<Box

// className="button-classTwo"

sx={isMobile ? {
 display: "flex",

flexDirection: uploadedStatus.status != 'fail' ? "column-reverse"

: "column",

justifyContent: isMobile ? 'center' : "space-between",

alignItems: "center",

gap: "8px",

position: "fixed",

width: "100%",

padding: '20px',

left: "0",

bottom: "0",

background: "#000",

boxShadow: "0px -4px 12px rgba(33, 33, 33, 0.05)",

boxSizing: "border-box",

zIndex: "1",

} : {

display: "flex",

flexDirection: uploadedStatus.status === 'fail' ? "row-reverse" :

"row",

justifyContent: isMobile ? 'center' : uploadedStatus.status ===

'fail' ? "flex-start" : "flex-end",

alignItems: "center",

gap: "8px",

position: "fixed",

width: "100%",

padding: '20px',

left: "0",

bottom: "0",

background: "#000",

boxShadow: "0px -4px 12px rgba(33, 33, 33, 0.05)",

boxSizing: "border-box",
 zIndex: "1",

}}

>

{ uploadedStatus.status != 'success' ?

uploadedStatus.status != 'fail' ?

( <Button

variant="outlined"

sx={{

flexDirection: "row",

alignItems: "center",

padding: "12px 24px",

gap: "8px",

width: !isMobile ? 'fit-content' : '100%',

height: '48px',

fontWeight: 700,

fontSize: '14px',

lineHeight: '24px',

border: '1px solid #4d4d4d',

borderRadius: '100px',

color: '#ffffff',

textTransform: 'uppercase',

letterSpacing: '0.42px',

}}

onClick={() => {

// setSessionFlag('');

openDetailView();

// setShowManualUploadFS(true);

}}

>
 {'UPLOAD ADDITIONAL DOCUMENTS'}

</Button>)

: ( <Button

variant="contained"

sx={{

flexDirection: "row",

alignItems: "center",

padding: "12px 24px",

gap: "8px",

width: !isMobile ? 'fit-content' : '100%',

height: '48px',

fontWeight: 700,

fontSize: '14px',

lineHeight: '24px',

border: '1px solid #4d4d4d',

borderRadius: '100px',

color: '#ffffff',

textTransform: 'uppercase',

letterSpacing: '0.42px',

}}

onClick={() => {

// setSessionFlag('');

// setShowManualUploadFS(true);

openDetailView();

}}

>

{'RETRY DOCUMENT UPLOAD'}

<ArrowForwardIcon

sx={{

display: isMobile || isTablet ? "none" : "auto",

 color: "primary",

}}

/>

</Button>)

: ''}

<Button

variant={uploadedStatus.status != "optional" ? "outlined" :

"contained"}

// className="sub-upload"

sx={{

// minWidth: !isMobile ? "fitContent!important" : "335px",

color: '#000!important',

flexDirection: "row",

alignItems: "center",

padding: "12px 24px",

gap: "8px",

width: !isMobile ? 'fit-content' : '100%',

height: '48px',

fontWeight: 700,

color: 'white',

fontSize: '14px',

lineHeight: '24px',

border: '1px solid #4d4d4d',

borderRadius: '100px',

textTransform: 'uppercase',

letterSpacing: '0.42px',

}}

onClick={() => {

// setSessionFlag('');

// onBackSubmit();
 goToMainPage();

// navigate('/assetclassverification');

}}

>

{uploadedStatus.status === 'fail' ? 'BACK TO VERIFICATION STATUS'

: 'VIEW VERIFICATION STATUS'}

{uploadedStatus.status != 'fail' ? <ArrowForwardIcon

sx={{

display: isMobile || isTablet ? "none" : "auto",

color: "primary",

}}

/> : ''}

</Button>

</Box>

</Stack>

);

export default LandingPageNew;