${secondary}`\n : `${primary} ${secondary}`;\n};\n\n/**\n * Takes a transfer object and determines the \"To\" value\n * dangerouslySetInnerHTML\n * @param {*} transfer\n */\nexport const formatToDisplay = (transfer, format = 'html') => {\n let primary = [];\n let secondary = [];\n\n // FUNDS IN, to = Client\n if (!transfer?.transferType?.isDebit) {\n primary = [transfer?.tenant?.name ?? ''].filter(f => f).join(' ');\n secondary = '';\n }\n // FUNDS OUT, to = Tenant\n else {\n primary = [\n transfer?.client?.firstName ?? '',\n transfer?.client?.lastName ?? '',\n ]\n .filter(f => f)\n .join(' ');\n\n if (\n transfer?.destBankAccount?.bankName ||\n transfer?.destBankAccount?.accountLastFourDigits\n ) {\n secondary = [\n '(',\n `${transfer?.destBankAccount?.bankName ?? ''} `,\n `X${transfer?.destBankAccount?.accountLastFourDigits || '----'}`,\n ')',\n ].join('');\n } else {\n secondary = '';\n }\n }\n\n return format === 'html'\n ? `${primary}
${secondary}`\n : `${primary} ${secondary}`;\n};\n\n/**\n * The notes property in transfers MIGHT BE stringified JSON and we need to extract the note property from it\n * e.g., [{\"createdAt\":\"12/01/20 11:31 AM\",\"createdBy\":\"someone@somedomain.com\",\"note\":\"foo bar baz note\"}]\n * @param {*} json\n */\nexport const extractNotesFromJson = possibleJsonString => {\n try {\n const obj = JSON.parse(possibleJsonString);\n if (obj[0] && obj[0]?.note) {\n return obj[0]?.note;\n }\n return '';\n } catch (e) {\n return possibleJsonString ? possibleJsonString : '';\n }\n};\n\nexport const getQueryVariable = (query, variable, splitSymbol = '&') => {\n if (!isEmpty(query)) {\n const vars = split(query, splitSymbol);\n for (let i = 0; i < vars.length; i++) {\n const pair = vars[i].split('=');\n if (pair[0] === variable) {\n return pair[1];\n }\n }\n }\n return null;\n};\n\nconst getAddressComponentByType = (components = [], type, path = 'long_name') =>\n (components.find(component => component.types.includes(type)) || {})[path] ||\n '';\n\nexport function getAddressFromPlaceDetails({\n address_components: addressComponents = {},\n geometry = {},\n} = {}) {\n const getComponent = (type, path) =>\n getAddressComponentByType(addressComponents, type, path);\n\n const streetNumber = getComponent('street_number');\n const streetName = getComponent('route');\n const neighborhood = getComponent('neighborhood');\n\n return {\n address: `${streetNumber} ${streetName}`.trim(),\n streetNumber,\n streetName,\n neighborhood,\n zipcode: getComponent('postal_code'),\n city:\n getComponent('locality') ||\n getComponent('sublocality') ||\n neighborhood ||\n getComponent('administrative_area_level_3') ||\n getComponent('administrative_area_level_2'),\n state: `${getComponent('administrative_area_level_1', 'short_name')}`,\n country: getComponent('country'),\n lat: invoke(geometry, 'location.lat'),\n lng: invoke(geometry, 'location.lng'),\n };\n}\n\nexport const filterNotNull = list =>\n filter(list, item => (!isNull(item) ? item !== '' : false));\n\nexport const formatAddressStreetApartment = (\n streetNumberName,\n apartmentSuiteNumber,\n withSymbol = true\n) => {\n const formatAddress = filterNotNull([streetNumberName, apartmentSuiteNumber]);\n if (withSymbol) {\n return join(formatAddress, ', #');\n }\n return join(formatAddress, ', ');\n};\n\nexport const formatAddressCityStateZipCode = (city, state, zipcode) => {\n const formatAddress = filterNotNull([city, state]);\n const formatZipCode = !isNull(zipcode) ? ` ${zipcode}` : '';\n return `${join(formatAddress, ', ')}${formatZipCode}`;\n};\n\nexport const formatDayFromUTC = date => {\n const newDate = split(date, /[-,T]/);\n const day = newDate[2];\n const month = newDate[1];\n const year = newDate[0];\n return `${year}-${month}-${day}`;\n};\nexport const setClientStore = client => {\n return sessionStorage.setItem('client', JSON.stringify(client));\n};\nexport const getClientStore = () => {\n const client = sessionStorage.getItem('client');\n return client ? { user: JSON.parse(client) } : { user: undefined };\n};\nexport const setRealtorStore = realtor => {\n return sessionStorage.setItem('realtor', JSON.stringify(realtor));\n};\nexport const getRealtorStore = () => {\n const realtor = sessionStorage.getItem('realtor');\n return realtor ? { realtor: JSON.parse(realtor) } : { realtor: undefined };\n};\n\nexport const clearStore = () => {\n return sessionStorage.clear();\n};\nexport const setItem = (key, value) => {\n sessionStorage.setItem(key, value);\n};\nexport const getItem = key => {\n return { value: sessionStorage.getItem(key) };\n};\nexport const removeItem = key => {\n sessionStorage.removeItem(key);\n};\n\nexport const getTenantIdentifier = hostname => {\n const [identifier] = hostname.split('.');\n return identifier ? identifier : null;\n};\n\nexport const paymintsCurrencyFormatter = (\n value,\n decimals = 2,\n style = 'currency',\n fallback = '$0.00'\n) => {\n const formatter = new Intl.NumberFormat('en-US', {\n style: style,\n currency: 'USD',\n minimumFractionDigits: decimals,\n maximumFractionDigits: decimals,\n });\n\n const numeric = +value;\n if (numeric) {\n if (numeric < 0) {\n return ['(', formatter.format(numeric), ')'].join('');\n }\n return formatter.format(numeric);\n }\n return fallback;\n};\n","import React from \"react\";\nimport classNames from \"classnames\";\nimport {\n PaymintsButton,\n BUTTON_TYPE,\n} from \"paymints-address-autocomplete-field\";\nimport { withRouter } from \"react-router-dom\";\nimport { getClientStore } from \"../../utils/util\";\nimport \"./boxContainer.css\";\nimport split from \"lodash/split\";\nimport get from \"lodash/get\";\nimport {\n useAllTenants,\n useAllBrandingsFromTenant,\n useDefaultBrandingFromTenant,\n} from \"../../utils/service/service_tenant_api\";\nimport { getQueryVariable } from \"../../utils/util\";\n\nconst createLogButton = (user, brandLogo, history, showLogin) => (\n
\n
\n);\nconst Logo = (props) => {\n const mobile = window.screen.width < 1200;\n return (\n \n {!user && !showLogin && (\n history.push(\"/login\")}\n noShadow\n type={BUTTON_TYPE.INVERSE_BLUE}\n >\n {\"Login\"}\n \n )}\n
\n \n
\n );\n};\n\nconst BoxContainer = ({\n children,\n className = \"\",\n color = \"default\",\n withBorder = true,\n withDoubleBorder = false,\n withLogButton = false,\n widest = false,\n internalBox = false,\n history,\n showLogin = false,\n}) => {\n const { user } = getClientStore();\n const tenantIdentifier = split(window.location.hostname, \".\")[0];\n const { tenant } = useAllTenants(tenantIdentifier);\n const { branding } = useAllBrandingsFromTenant(get(tenant, \"id\", \"\"), true);\n const { defaultBranding } = useDefaultBrandingFromTenant();\n const brandLogo = branding\n ? get(branding, \"logoURL\")\n : get(defaultBranding, \"logoURL\");\n const path = window.location.search.split(\"?\")[2];\n const selectedTab = getQueryVariable(path, \"disbursement\") || null;\n const classNameBox = classNames(\n `paymints__box-container paymints__box-container${\n internalBox ? \"__internal\" : \"\"\n }--${color} ${className}`,\n {\n \"with-border\": withBorder,\n }\n );\n const classNameContainer = classNames(\n `paymints__box-container__container paymints__box-container__box-shadow--default`,\n {\n widest: widest,\n }\n );\n\n if (withDoubleBorder) {\n return (\n <>\n \n \n Success\n
\n \n \n \n Accept Your Payment\n
\n Select a Bank Account
\n \n {withLogButton &&\n createLogButton(user, brandLogo, history, showLogin)}\n
\n \n \n );\n }\n\n return (\n {children}
\n \n
\n );\n};\n\nexport default withRouter(BoxContainer);\n","export default function updateAction(state, payload) {\n return {\n ...state,\n data: {\n ...state.data,\n ...payload\n }\n };\n}","import React, { Component } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\n\nimport \"./errorMessageInput.css\";\n\nclass ErrorMessageInput extends Component {\n render() {\n const { className, children } = this.props;\n const classNameContainer = classNames(\"error-message-input__container\", className, {})\n \n return (\n \n {withLogButton && createLogButton(user, brandLogo, history, showLogin)}\n {children}\n
\n \n {children}\n
\n );\n }\n}\n\nErrorMessageInput.propTypes = {\n children: PropTypes.any,\n className: PropTypes.string,\n};\n\nErrorMessageInput.defaultProps = {\n className: '',\n};\n\nexport default ErrorMessageInput;","const APIDomain = process.env.REACT_APP_BASE_SERVICE_URL;\n\nexport default APIDomain;\n","import axios from 'axios';\nimport APIDomain from '../apiSettings';\n\naxios.defaults.baseURL = APIDomain;\n\nexport const plaidCreateClient = data =>\n axios({\n method: 'post',\n headers: {\n 'Content-Type': 'application/json',\n Authorization: `Bearer ${process.env.REACT_APP_AUTH_TOKEN}`,\n },\n url: '/account/auth/create-client',\n data: data,\n }).then(response => {\n return response.data;\n });\n\nexport const plaidStartMicrodepoits = (data, tenantID) => {\n data.tenantId = tenantID;\n return axios({\n method: 'post',\n headers: {\n 'Content-Type': 'application/json',\n Authorization: `Bearer ${process.env.REACT_APP_AUTH_TOKEN}`,\n },\n url: '/account/microdeposit/start',\n data: data,\n }).then(response => {\n window.location.reload();\n return response.data;\n });\n};\n\nexport const startDwolla = (data, config) => {\n let url = '/transfer/start';\n\n if (config?.type === 'disbursement') {\n url = '/transfer/disbursement/start';\n }\n\n /**\n * slight change in data payload\n * was:\n * {\n * destBankAccountId: data.destBankAccountId,\n * sourceBankAccountId: data.sourceBankAccountId,\n * transferId: data.transferId,\n * }\n * now \"sourceBankAccountId\" needs to be just \"bankAccountId\" <= this is NOT correct... bankAccountId === client/vendor bank account\n * please read updated transfer service documentation here: https://github.com/lemonbrew/paymints-transfer-service\n * let me know if you have any questsions - doug\n */\n return axios({\n method: 'post',\n headers: {\n 'Content-Type': 'application/json',\n Authorization: `Bearer ${process.env.REACT_APP_AUTH_TOKEN}`,\n },\n url,\n data: {\n bankAccountId: data.sourceBankAccountId,\n // bankAccountId: data.destBankAccountId,\n transferId: data.transferId,\n },\n });\n};\n\nexport const getBankAccounts = clientId =>\n axios({\n method: 'get',\n headers: {\n 'Content-Type': 'application/json',\n Authorization: `Bearer ${process.env.REACT_APP_AUTH_TOKEN}`,\n },\n url: `/account/client-accounts/${clientId}`,\n }).then(response => {\n return response.data;\n });\n\nexport const disconnectBankAccount = clientId =>\n axios({\n method: 'delete',\n headers: {\n 'Content-Type': 'application/json',\n Authorization: `Bearer ${process.env.REACT_APP_AUTH_TOKEN}`,\n },\n url: `/account`,\n data: clientId,\n }).then(response => {\n console.log(response.data);\n });\n// .then(response => response.data)\n\nexport const uploadDocument = form =>\n axios({\n method: 'post',\n headers: {\n 'Content-Type': 'application/json',\n Authorization: `Bearer ${process.env.REACT_APP_AUTH_TOKEN}`,\n },\n url: `/assets/private/`,\n data: form,\n }).then(response => response.data);\n\nexport const saveTransferDoc = (transferId, data) =>\n axios({\n method: 'post',\n headers: {\n 'Content-Type': 'application/json',\n Authorization: `Bearer ${process.env.REACT_APP_AUTH_TOKEN}`,\n },\n url: `/account/document/${transferId}`,\n data: data,\n }).then(response => response.data);\n\n/**\n *\n * @param {*} data {TRANSFER_GUID: string, emailRecipients: Array\n
\n );\n};\n\nconst FieldsPersonalInformation = ({\n client,\n register,\n errors,\n setValue,\n watch,\n control,\n}) => {\n return (\n \n {introductoryText\n ? introductoryText\n : `To create an account and transfer money to ${organization}, please confirm the following details. All fields are required.`}\n
\n \n
\n \n \n This is required \n )}\n {errors.firstName && errors.firstName.type === 'maxLength' && (\n Max length exceeded \n )}\n
\n \n \n
\n \n \n This is required \n )}\n {errors.lastName && errors.lastName.type === 'maxLength' && (\n Max length exceeded \n )}\n
\n \n 
\n
\n \n Must match your driver's license or government-issued ID.\n
\n \n
\n);\n\nconst FieldsContactInformation = ({ errors, control }) => (\n \n Personal Information\n
\n \n
\n \n This is required \n )}\n
\n \n
\n Mobile Phone
\n \n We will send a security code to your mobile phone for account\n verification.\n
\n \n 
\n
\n \n Standard text messaging and provider rates may apply.\n
\n \n
\n );\n};\n\nconst FooterInformation = ({ setDisabled }) => (\n \n Contact Information\n
\n \n \n setDisabled(!e.target.checked)}\n />{' '}\n {' '}\n {'By clicking Create Account, you agree to CertifID, Inc. '}\n \n Terms of Service{' '}\n 
{' '}\n \n {' and '}\n \n Privacy Policy{' '}\n \n \n {' as well as our partner'} Dwolla's\n \n {' '}\n Terms of Service{' '}\n \n {' '}\n and{' '}\n \n Privacy Policy.\n \n \n
\n);\n\nconst nextStep = history => {\n history.push(`/create-account/step-2${get(history, 'location.search')}`);\n};\n\nconst FirstStep = props => {\n const { beforeContinue, onUpdateAuth0User, refetchNewClient } = props;\n const { register, handleSubmit, errors, watch, setValue, control } = useForm({\n defaultValues: props.client,\n });\n const { createClient } = useCreateClient();\n const { action } = useStateMachine(updateAction);\n const [error, onSetError] = useState({\n active: false,\n type: '',\n messageError: '',\n });\n const [disabled, setDisabled] = useState(true);\n const onSubmit = newUser => {\n removeItem('login_user');\n onSetError({ active: false, type: '', messageError: '' });\n const email = get(props.user, 'email')\n ? get(props.user, 'email')\n : `${newUser.phone_number}@paymints.io`;\n const tenantId = get(props, 'tenant.id');\n if (isEmpty(tenantId))\n onSetError({\n active: true,\n messageError: 'Tenant not found, please check url',\n });\n if (email && !isEmpty(tenantId)) {\n const { phone_number } = newUser;\n // Search for all clients with that email\n refetchNewClient({ where: { mobilePhone: '+1' + phone_number } }).then(\n response => {\n const client = get(response, 'data.allClients')[0];\n delete newUser.phone_number;\n if (!client) {\n let clientData = {};\n // Create a new client\n createClient({\n variables: {\n client: {\n ...newUser,\n email: '',\n mobilePhone: '+1' + phone_number,\n tenant: {\n connect: {\n id: tenantId,\n },\n },\n },\n },\n })\n .then(res => {\n clientData = res.data.createClient;\n beforeContinue();\n })\n .then(() => {\n // Create Auth0 client\n const userEmail = get(props.user, 'email');\n if (!userEmail) {\n const auth0User = {\n email: email,\n phone_number: `+1${phone_number}`,\n name: `${newUser.firstName} ${newUser.lastName}`,\n connection: 'sms',\n };\n const auth0Payload = {\n create_user: auth0User,\n role: 'paymints_admin',\n new_user_role: 'paymints_client',\n };\n\n onUpdateAuth0User(tenantId, auth0Payload)\n .then(response => {\n if (response === 'error') {\n onSetError({\n active: true,\n messageError:\n 'Account exists for phone number. Please login in.',\n });\n } else {\n getCode(tenantId, clientData.id, clientData);\n }\n })\n .then(() => {\n action(newUser);\n });\n } else {\n action(newUser);\n nextStep(props.history);\n }\n });\n } else {\n onSetError({ active: true, type: 'sms' });\n setItem('login_user', 'existing_user');\n }\n }\n );\n }\n };\n const getCode = (tenantId, clientid, client) => {\n APIUtil.getSMSCode(tenantId, clientid).then(\n () => {\n props.history.push('/create-account/account-verification', { client });\n },\n error => {\n console.log(error);\n }\n );\n };\n\n return (\n setVisible(true)} onBlur={() => setVisible(false)}>\n
\n );\n}","import React, {\n createContext,\n useContext,\n useState,\n useEffect,\n useCallback,\n} from 'react';\nimport { getSensitiveData } from '../utils/service/service_api';\n\nconst SensitiveDataContext = createContext();\n\nexport const SensitiveDataProvider = ({ clientID, tenantID, children }) => {\n const [sensitiveData, setSensitiveData] = useState();\n const [loading, setLoading] = useState(false);\n const res = getSensitiveData(clientID, tenantID);\n const getData = useCallback(\n async () => {\n setLoading(true);\n try {\n const res = await getSensitiveData(clientID, tenantID);\n if (res) {\n setSensitiveData(res.data);\n }\n setLoading(false);\n } catch (error) {\n getData();\n setLoading(false);\n }\n },\n /* eslint-disable */ [clientID, tenantID]\n );\n\n const refetch = () => getData();\n\n useEffect(() => {\n if (clientID && tenantID) getData();\n }, [clientID, tenantID]);\n\n return (\n \n
\n);\n\nconst InfoSSN = () => (\n \n Your account has been verified, {get(client, 'firstName')}.\n
\n \n
\n);\n\nconst FieldSSN = ({ register, errors, control }) => {\n return (\n \n Now we need to verify your social security number and date of birth, and\n then we'll be ready to connect to your bank.\n
\n \n \n \n
\n );\n};\n\nconst FieldBirthday = ({ register, errors }) => {\n return (\n \n \n This is required \n )}\n {errors.ssn && errors.ssn.type === 'validate' && (\n \n Must be a valid social security number\n \n )}\n
\n \n \n \n
\n );\n};\n\nconst FieldEmail = ({ register, errors }) => {\n return (\n \n \n This is required \n )}\n {errors.dateOfBirth && errors.dateOfBirth.type === 'validate' && (\n Must be at least 18 years old \n )}\n
\n \n \n \n
\n );\n};\n\nconst FieldsPersonalInformation = ({ register, errors, control }) => {\n return (\n \n \n Max length exceeded \n )}\n {errors.email && errors.email.type === 'required' && (\n This is required \n )}\n
\n \n \n \n
\n );\n};\n\nconst FooterInformation = props => {\n return (\n \n \n This is required \n )}\n This is required \n )}\n This is required \n )}\n This is required \n )}\n
\n \n
\n );\n};\n\nconst nextStep = history => {\n history.push(`/bank-accounts`);\n window.location.reload();\n};\n\nconst SecondStep = props => {\n const clientId = get(props, 'client.id');\n const tenantId = get(props, 'tenant.id');\n\n const intialform = { ...props.client, email: null };\n const { register, handleSubmit, errors, control } = useForm({\n defaultValues: intialform,\n });\n const { action } = useStateMachine(updateAction);\n const { updateClient } = useUpdateClient();\n const { sensitiveData, refetch: refetchSensitiveData } = useSensitiveData();\n const onSubmit = async newUser => {\n const newUserWithoutSsnDash = {\n ...newUser,\n ssn: newUser.ssn.replace(/-/g, ''),\n };\n\n const { ssn, dateOfBirth, ...userValues } = newUserWithoutSsnDash;\n\n const sensitiveData = {\n SSN: encrypt(ssn),\n DOB: encrypt(dateOfBirth),\n };\n try {\n await saveSensitiveData(clientId, tenantId, sensitiveData);\n const dataSENS = await getSensitiveData(clientId, tenantId);\n await updateClient({\n variables: {\n id: clientId,\n client: userValues,\n },\n });\n\n await props.refetch();\n await refetchSensitiveData();\n await action({ client: newUser });\n nextStep(props.history);\n } catch (error) {\n console.log(error);\n }\n };\n\n return (\n \n \n
\n \n {`By clicking Verify you authorize ${props.props.tenant.name}, by electronic signature, to securely connect to your financial institution.`}\n
\n \n {formatAddressStreetApartment(streetNumberName, apartmentSuiteNumber)}\n
\n \n {formatAddressCityStateZipCode(city, state, zipcode)}\n
\n \n );\n};\n\nexport default FormatAddress;","import React from 'react'\nimport FormatAddress from '../FormatAddress/FormatAddress'\nimport './destinationAccount.css'\n\nexport default function DestinationAccount({\n title = 'Destination Account:',\n bankName,\n accountLastFourDigits,\n description,\n destAccountLogo,\n tenantName,\n address1,\n apartmentSuiteNumber,\n name,\n city,\n state,\n zipcode,\n office,\n logoURL,\n children,\n type,\n}) {\n return (\n \n
\n )\n}\n","import { useQuery } from \"@apollo/react-hooks\";\nimport { gql } from \"apollo-boost\";\nimport isEmpty from \"lodash/isEmpty\";\nimport isNil from \"lodash/isNil\";\n\nconst GET_INSTITUTION_LOGO_QUERY = gql`\n query allInstitutionLogos($institutionCode: String) {\n allInstitutionLogos(where: { institutionCode: $institutionCode }) {\n id\n logoURL\n }\n }\n`;\n\nexport function useInstitutionLogo(institutionID) {\n const id =\n isNil(institutionID) || isEmpty(institutionID) ? null : institutionID;\n const { loading, error, data, refetch } = useQuery(\n GET_INSTITUTION_LOGO_QUERY,\n { variables: { institutionCode: id } }\n );\n return {\n loading,\n error,\n refetch,\n institutionLogo: data ? data.allInstitutionLogos[0] : undefined,\n };\n}\n\nconst GET_INSTITUTION_LOGO_OR_QUERY = gql`\n query allInstitutionLogos($institution: [InstitutionLogoWhereInput]) {\n allInstitutionLogos(where: { OR: $institution }) {\n id\n logoURL\n institutionCode\n }\n }\n`;\n\nexport function useInstitutionLogoOR(institutionID) {\n const institution =\n isNil(institutionID) || isEmpty(institutionID)\n ? [{ institutionCode: null }]\n : institutionID;\n const { loading, error, data, refetch } = useQuery(\n GET_INSTITUTION_LOGO_OR_QUERY,\n {\n variables: { institution: institution },\n }\n );\n return {\n loading,\n error,\n refetch,\n institutionsLogo: data ? data.allInstitutionLogos : [],\n };\n}\n","export const START_DWOLLA_FETCH = \"START_DWOLLA_FETCH\";\nexport const START_DWOLLA_SUCCESS = \"START_DWOLLA_SUCCESS\";\nexport const START_DWOLLA_ERROR = \"START_DWOLLA_ERROR\";\nexport const SAVE_TRANSFER_DOC_FETCH = \"SAVE_TRANSFER_DOC_FETCH\";\nexport const SAVE_TRANSFER_DOC_SUCCESS = \"SAVE_TRANSFER_DOC_SUCCESS\";\nexport const SAVE_TRANSFER_DOC_ERROR = \"SAVE_TRANSFER_DOC_ERROR\";\nexport const SEND_EMAIL_RECEIPT_FETCH = \"SEND_EMAIL_RECEIPT_FETCH\";\nexport const SEND_EMAIL_RECEIPT_SUCCESS = \"SEND_EMAIL_RECEIPT_SUCCESS\";\nexport const SEND_EMAIL_RECEIPT_ERROR = \"SEND_EMAIL_RECEIPT_ERROR\";\n","import * as APIUtil from '../../utils/service/service_api';\nimport * as actionType from './TransferActionType';\nimport get from 'lodash/get';\n\nexport const startDwollaFetch = () => ({\n type: actionType.START_DWOLLA_FETCH,\n});\n\nexport const startDwollaSuccess = response => ({\n type: actionType.START_DWOLLA_SUCCESS,\n payload: { response },\n});\n\nexport const startDwollaError = response => ({\n type: actionType.START_DWOLLA_ERROR,\n payload: { response },\n});\n\nexport const startDwolla = (data, config) => dispatch => {\n dispatch(startDwollaFetch());\n return APIUtil.startDwolla(data, config)\n .then(response => {\n dispatch(startDwollaSuccess(response));\n return response;\n })\n .catch(error => {\n const errorElement = get(error, 'response.data');\n dispatch(startDwollaError(errorElement));\n const message =\n get(errorElement, 'error.body.message') ||\n get(errorElement, 'message') ||\n get(errorElement, 'error_message') ||\n 'Something went wrong... please try again in a few minutes';\n return { error: true, message: message };\n });\n};\n\nexport const saveTransferDocFetch = () => ({\n type: actionType.SAVE_TRANSFER_DOC_FETCH,\n});\n\nexport const saveTransferDocSuccess = response => ({\n type: actionType.SAVE_TRANSFER_DOC_SUCCESS,\n payload: { response },\n});\n\nexport const saveTransferDocError = response => ({\n type: actionType.SAVE_TRANSFER_DOC_ERROR,\n payload: { response },\n});\n\nexport const saveTransferDoc = (transferId, data) => dispatch => {\n dispatch(saveTransferDocFetch());\n return APIUtil.saveTransferDoc(transferId, data)\n .then(response => {\n dispatch(saveTransferDocSuccess(response));\n return response;\n })\n .catch(error => {\n const errorElement = get(error, 'response.data');\n const message =\n get(errorElement, 'error.body.message') ||\n get(errorElement, 'err.message') ||\n get(errorElement, 'err') ||\n get(errorElement, 'message') ||\n get(errorElement, 'error_message') ||\n 'Something went wrong... please try again in a few minutes';\n dispatch(saveTransferDocError(errorElement));\n return { error: true, message: message };\n });\n};\n\nexport const sendEmailReceiptFetch = () => ({\n type: actionType.SEND_EMAIL_RECEIPT_FETCH,\n});\n\nexport const sendEmailReceiptSuccess = response => ({\n type: actionType.SEND_EMAIL_RECEIPT_SUCCESS,\n payload: { response },\n});\n\nexport const sendEmailReceiptError = error => ({\n type: actionType.SEND_EMAIL_RECEIPT_ERROR,\n payload: { error },\n});\n\nexport const sendEmailReceipt = data => dispatch => {\n dispatch(sendEmailReceiptFetch());\n return APIUtil.sendEmailReceipt(data)\n .then(response => {\n console.log('hello', response);\n dispatch(sendEmailReceiptSuccess(response));\n return { success: true, ...response };\n })\n .catch(error => {\n const errorElement = get(error, 'response.data');\n dispatch(sendEmailReceiptError(error));\n const message =\n get(errorElement, 'error.body.message') ||\n get(errorElement, 'message') ||\n get(errorElement, 'error_message') ||\n 'Something went wrong... please try again in a few minutes';\n console.log(message);\n return { error: true, message: message };\n });\n};\n","import React from 'react';\nimport get from 'lodash/get';\nimport MaskedInput from 'react-text-mask'\nimport createNumberMask from 'text-mask-addons/dist/createNumberMask'\n\nconst numberMask = createNumberMask({\n allowDecimal: true,\n});\n\nexport default function AmountInput ({...props}) {\n const handleChange = (e) => props.onChange(`${get(e, 'target.value')}`.replace(/[$,_ ]/g, ''));\n\n return (\n \n {title}\n
\n\n \n {/*\n
\n {children}\n \n {type === \"from\" && (\n
*/}\n\n {type === 'from' ? (\n \n
\n )}\n\n \n
\n \n {bankName}\n
\n Account X{accountLastFourDigits}\n
\n ) : (\n \n Account X{accountLastFourDigits}\n
\n
\n )}\n {tenantName}
\n\n
\n);\n\n/**\n * @TODO extract out to component\n */\nconst InfoTransfer = () => (\n Transfer Details
\n \n
\n);\n\n/**\n * @TODO extract out to component\n */\nconst FieldsEMD = ({\n register,\n errors,\n control,\n realtorData,\n setRealtorData,\n showREAInfoFill,\n}) => {\n return (\n \n What kind of transfer would you like to make?\n
\n \n
\n \n );\n};\n\n/**\n * @TODO extract out to component\n */\nconst FieldsInfoTransfer = ({\n client,\n register,\n errors,\n control,\n setValue,\n purposes,\n emdVisible,\n setFieldsEMDVisible,\n realtorData,\n setRealtorData,\n showREAInfoFill,\n}) => {\n const purposesOptions = purposes.map(purpose => ({\n value: purpose,\n label: purpose\n }))\n return (<>\n \n \n
\n\n setRealtorData({\n ...realtorData,\n fullName: e.target.value,\n })\n }\n />\n
\n \n
\n \n
\n\n setRealtorData({\n ...realtorData,\n email: e.target.value,\n })\n }\n />\n
\n \n
\n \n\n
\n \n \n setRealtorData({\n ...realtorData,\n phoneNumber: e.toString(),\n })\n }\n />\n
\n PURPOSE
\n \n\n This is required \n\n
)}\n {emdVisible ? (\n PROPERTY ADDRESS AND ADDITIONAL NOTES
\n);\n\n/**\n * @TODO extract out to component\n */\nconst FieldsInfoPropertyAddress = ({\n transfer,\n register,\n errors,\n setValue,\n control,\n}) => {\n return (\n \n \n This is required \n )}\n This is required \n )}\n This is required \n )}\n This is required \n )}\n
\n {((errors.propertyAddress1 &&\n errors.propertyAddress1.type === 'required') ||\n (errors.propertyCity && errors.propertyCity.type === 'required') ||\n (errors.propertyState && errors.propertyState.type === 'required') ||\n (errors.propertyZipcode &&\n errors.propertyZipcode.type === 'required')) && (\nPlease select a valid address \n )}\n
\n \n
\n \n {((errors.propertyAddress1 &&\n errors.propertyAddress1.type === 'required') ||\n (errors.propertyCity && errors.propertyCity.type === 'required') ||\n (errors.propertyState && errors.propertyState.type === 'required') ||\n (errors.propertyZipcode &&\n errors.propertyZipcode.type === 'required')) && (\n
\n \n
AMOUNT
\n);\n\n/**\n * @TODO extract out to component\n */\nconst FieldInfoAmount = ({\n register,\n errors,\n control,\n watch,\n watchDocument,\n regDocument,\n controlDocument,\n bankBalance,\n setMaxAmountValidate,\n maxAmountValidate,\n MAXIMUM_AMOUNT,\n transferFeeConfigData,\n getValues\n}) => {\n return (\n \n
\n Account Balance
\n {!bankBalance ? (\n '--'\n ) : (\n \n
\n )}\n \n
\n \n \n \n {!bankBalance ? (\n setMaxAmountValidate(false)}\n className=\"create-account__input form-control\"\n rules={{\n required: true,\n }}\n autoComplete=\"no\"\n />\n ) : (\n setMaxAmountValidate(false)}\n className=\"create-account__input form-control\"\n rules={{\n required: true,\n validate: value =>\n validAmount(\n value,\n bankBalance,\n extractTranferFeeFromData(transferFeeConfigData)\n ),\n }}\n autoComplete=\"no\"\n />\n )}\n\n\n {errors.amount && errors.amount.type === 'required' && (\n This is required \n )}\n {errors.amount && errors.amount.type === 'validate' && (\n \n Amount entered exceeds account balance and any applicable\n convenience fees. Please enter an amount lesser than or equal to\n this combined amount.\n \n )}\n {maxAmountValidate && (\n \n Transfer amount cannot exceed{' '}\n \n )}\n
\n \n \n value === getValues('amount'),\n },\n }}\n onPaste={e => {\n e.preventDefault()\n return false\n }}\n />\n {errors.amount2 && errors.amount2.type === 'required' && (\n Amount is required \n )}\n {errors.amount2 && errors.amount2.type === 'matchesAmount' && (\n Amounts do not match \n )}\n\n\n {errors.amount && errors.amount.type === 'required' && (\n This is required \n )}\n {errors.amount && errors.amount.type === 'validate' && (\n \n Amount entered exceeds account balance and any applicable\n convenience fees. Please enter an amount lesser than or equal to\n this combined amount.\n \n )}\n {maxAmountValidate && (\n \n Transfer amount cannot exceed{' '}\n \n )}\n
\n \n
\n \n \n
\n \n
\n\n \n \n
\n \n
\n );\n}\n\nexport default function MobileTransferSummary({\n transfer,\n bankAccount,\n bankAccountLogo,\n disbursement,\n}) {\n return (\n \n
\n\n Purpose
\n \n {transformPurpose(transfer?.purpose)}\n \n\n
\n\n Subject Property
\n\n
\n {transfer?.fee ? (\n Transfer Amount
\n\n
\n \n
\n ) : (\n ''\n )}\n\n Fee
\n\n
\n \n
\n Total
\n\n
\n \n
\n );\n}\n","import { useMutation, useQuery } from \"@apollo/react-hooks\";\nimport { gql } from \"apollo-boost\";\nimport isEmpty from \"lodash/isEmpty\";\nimport isNil from \"lodash/isNil\";\n\nconst CREATE_BANK_ACCOUNT_QUERY = gql`\n mutation createBankAccount($bankAccount: BankAccountCreateInput!) {\n createBankAccount(data: $bankAccount) {\n id\n }\n }\n`;\n\nexport function useCreateBankAccount() {\n const [createBankAccount, { loading, error, data }] = useMutation(\n CREATE_BANK_ACCOUNT_QUERY\n );\n return {\n createBankAccount,\n loading,\n error,\n bank: data ? data.createBankAccount : undefined,\n };\n}\n\nconst GET_BANK_ACCOUNTS_QUERY = gql`\n query allBankAccounts($where: BankAccountWhereInput!) {\n allBankAccounts(where: $where) {\n id\n bankName\n description\n institutionCode\n accountLastFourDigits\n bankDisplayName\n accountNumber\n active\n updatedAt\n createdAt\n }\n }\n`;\n\nexport function useAllBankAccountsByClient(clientID) {\n const id = isNil(clientID) || isEmpty(clientID) ? null : clientID;\n const { loading, error, data, refetch } = useQuery(GET_BANK_ACCOUNTS_QUERY, {\n variables: { where: { client: { id }, active: true } },\n });\n return {\n loading,\n error,\n refetch,\n bankAccounts: data ? data.allBankAccounts : undefined,\n };\n}\n\nconst GET_BANK_ACCOUNT_QUERY = gql`\n query BankAccount($bankAccount: ID!) {\n BankAccount(where: { id: $bankAccount }) {\n id\n bankName\n description\n institutionCode\n accountNumber\n accountLastFourDigits\n bankDisplayName\n active\n updatedAt\n createdAt\n }\n }\n`;\n\nexport function useBankAccount(id) {\n const { loading, error, data, refetch } = useQuery(GET_BANK_ACCOUNT_QUERY, {\n variables: { bankAccount: id },\n });\n return {\n loading,\n error,\n refetch,\n bankAccount: data ? data.BankAccount : undefined,\n };\n}\n\nconst UPDATE_BANK_ACCOUNT = gql`\n mutation updateBankAccount($id: ID!, $bankAccount: BankAccountUpdateInput!) {\n updateBankAccount(id: $id, data: $bankAccount) {\n id\n }\n }\n`;\n\nexport function useUpdateBankAccount() {\n const [updateBankAccount, { loading, error, data }] = useMutation(\n UPDATE_BANK_ACCOUNT\n );\n return {\n updateBankAccount,\n loadingDelete: loading,\n error,\n bankAccount: data ? data.updateBankAccount : undefined,\n };\n}\n\nconst GET_ESCROW_BANK_ACCOUNT_QUERY = gql`\n query EscrowAccount($destBankAccount: ID!) {\n EscrowAccount(where: { id: $destBankAccount }) {\n id\n bankName\n institutionCode\n description\n accountNumber\n accountLastFourDigits\n bankDisplayName\n active\n updatedAt\n createdAt\n }\n }\n`;\n\nexport function useEscrowAccount(id) {\n const { loading, error, data, refetch } = useQuery(\n GET_ESCROW_BANK_ACCOUNT_QUERY,\n {\n variables: { destBankAccount: id },\n }\n );\n return {\n loading,\n error,\n refetch,\n destBankAccount: data ? data.destBankAccount : undefined,\n };\n}\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Modal } from 'react-bootstrap';\nimport { PaymintsButton, BUTTON_TYPE } from 'paymints-address-autocomplete-field';\nimport './contentModal.css';\n\nconst small = (props) => (\n props.small ? ' content-modal--small' : ''\n)\n\nconst progress = (props) => (\n props.progress ? ' content-modal--progress' : ''\n)\n\nconst ContentModal = (props) => (\n \n {props.content}\n
\n Review
;\n\nconst InfoTransfer = () => (\n \n Please confirm that the information below is correct before continuing.\n
\n);\n\n/**\n * Taking the purpose string and possible adjustment\n * @param {*} purpose\n */\nconst transformPurpose = purpose => {\n if (!purpose) {\n return '--';\n }\n return purpose;\n};\n\nconst DisplaySummationRows = ({ transfer }) => {\n return (\n \n \n \n
\n
\n );\n};\n\nconst SummaryTransfer = ({\n transfer,\n bankAccount,\n bankAccountLogo,\n disbursement,\n}) => {\n return (<>\n | {`${transformPurpose(\n transfer?.purpose\n )} Amount`} | \n{paymintsCurrencyFormatter(transfer?.amount || 0)} | \n
| Convenience Fee | \n{paymintsCurrencyFormatter(transfer?.fee || 0)} | \n\n | Transfer Total Amount | \n \n
| \n | \n | \n
Details
\n \n
\n\n \n
\n Transfer Date
\n {moment().format('MM/DD/YYYY')}
\n\n
\n Purpose
\n \n {transformPurpose(transfer?.purpose)}\n
\n\n
\n {transfer.office !== null ? (\n Subject Property
\n \n
\n ) : null}\n {transfer.realtor !== null ? (\n Office
\n \n {transfer?.office?.title} - {transfer?.office?.city},{' '}\n {transfer?.office?.state}\n
\n\n
\n ) : null}\n Real Estate Agent
\n \n {' '}\n {transfer?.realtor?.firstName} {transfer?.realtor?.lastName}{' '}\n {transfer?.realtor?.email}\n
\n\n
\n Note
\n {extractNotesFromJson(transfer?.notes || '')}
\n\n \n \n {'Use Different Account'}\n \n \n
\n);\n\nconst onClickBackButton = (history, disbursement, id) => {\n if (!disbursement) {\n history.push(`/create-account/step-3${get(history, 'location.search')}`);\n } else {\n history.push(\n `/create-account/step-select-account?go_to_transfer=${id}?disbursement=\"select-bank\"`\n );\n }\n};\n\nconst onClickGoToTransferHistory = history => history.push('/transfer-history');\n\nconst buildLoaderModal = () => (\n \n
\n);\n\nconst TransferSummary = props => {\n const {\n history,\n client,\n transfer,\n onstartDwolla,\n transferDwolla,\n account,\n } = props;\n const { handleSubmit, getValues } = useForm({ defaultValues: transfer });\n const { state, action } = useStateMachine(updateAction);\n const { saveTransfer } = useSaveTransfer();\n const { bankAccount } = useBankAccount(get(state, 'data.bankAccount.id', ''));\n const { institutionLogo: bankAccountLogo } = useInstitutionLogo(\n get(bankAccount, 'institutionCode', '')\n );\n const { destBankAccount } = useEscrowAccountFromTenant(\n get(props, 'tenant.id', '')\n );\n const { institutionLogo } = useInstitutionLogo(\n get(destBankAccount, 'institutionCode', '')\n );\n\n const [error, onSetError] = useState({ active: false, messageError: '' });\n const [showModal, setShow] = useState(false);\n\n const handleClose = () => setShow(false);\n const handleShow = () => setShow(true);\n const pathUrl = get(split(props.location.search, '?'), 2);\n const disbursement = getQueryVariable(pathUrl, 'disbursement');\n\n const onSubmit = (newTransfer, saveAsDraft = false) => {\n const path = get(split(props.location.search, '?'), 1);\n const transferId =\n getQueryVariable(path, 'go_to_transfer') || get(transfer, 'id');\n if (transferId) {\n // const disbursementData = {\n // sourceBankAccountId: get(transfer, \"sourceBankAccount.id\"),\n // destBankAccountId: get(state, \"data.bankAccount.id\"),\n // transferId: transferId,\n // };\n const disbursementData = {\n sourceBankAccountId: get(state, 'data.bankAccount.id', ''),\n destBankAccountId: get(transfer, 'destBankAccount.id'),\n transferId: transferId,\n };\n\n const data = {\n sourceBankAccountId: get(state, 'data.bankAccount.id', ''),\n destBankAccountId: get(transfer, 'destBankAccount.id'),\n transferId: transferId,\n };\n if (saveAsDraft) {\n saveTransfer({\n variables: {\n id: transferId,\n transfer: {\n status: 'draft',\n tenant: {\n connect: {\n id: get(props, 'tenant.id'),\n },\n },\n sourceBankAccount: {\n connect: {\n id: get(state, 'data.bankAccount.id'),\n },\n },\n },\n },\n })\n .then(response => {\n handleClose();\n props.refetchTransfer({\n id: get(response, 'data.updateTransfer.id'),\n });\n action({ transfer: { ...props.transfer } });\n })\n .then(() => {\n if (saveAsDraft) {\n onClickGoToTransferHistory(props.history);\n }\n });\n } else {\n handleShow();\n onSetError({ active: false, messageError: '' });\n onstartDwolla(disbursement ? disbursementData : data, {\n type: disbursement ? 'disbursement' : null,\n }).then(response => {\n if (!get(response, 'error')) {\n handleClose();\n saveTransfer({\n variables: {\n id: transferId,\n transfer: {\n status: 'pending',\n },\n },\n })\n .then(response => {\n props.refetchTransfer({\n id: get(response, 'data.updateTransfer.id'),\n });\n action({ transfer: { ...props.transfer } });\n })\n .then(() => {\n if (saveAsDraft) {\n onClickGoToTransferHistory(props.history);\n } else {\n if (!disbursement) {\n props.history.push(`/create-account/success`);\n } else {\n const path = get(split(props.location.search, '?'), 1);\n const transferId =\n getQueryVariable(path, 'go_to_transfer') || '';\n props.history.push(\n `/create-account/success?go_to_transfer=${transferId}?disbursement=success`\n );\n }\n }\n });\n } else {\n const customErrMsg = `Unfortunately, your transfer cannot be completed at this time due to connectivity issues with your financial institution. Please provide the closer with a certified check or contact ${\n props.tenant.name\n } at ${props.tenant.pocPhone ??\n 'their primary phone number'} or email ${props.tenant\n .supportEmail ??\n 'them'} to get wiring instructions specific to your transaction. We apologize for any inconvenience.`;\n\n handleClose();\n onSetError({\n active: true,\n // messageError: get(response, \"message\"),\n messageError: customErrMsg,\n });\n }\n });\n }\n }\n };\n const path = get(split(props.location.search, '?'), 1);\n const transferId = getQueryVariable(path, 'go_to_transfer') || '';\n const values = getValues();\n\n useEffect(() => {\n window.scrollTo(0, 0);\n }, []);\n\n return (\n <>\n \n
\n \n Processing Fund Transfer ...\n
\n \n {[1, 2, 3, 4, 5].map((m) => {\n const marker = `email${m}`;\n return (\n
\n );\n};\n\nexport default EmailAddresses;\n","/*\n * src/components/TransferSuccess/InfoDisbursement.jsx\n * Description:\n * Copyright (c) 2021 PredictiveUX\n */\nimport React from \"react\";\n\nconst InfoDisbursement = () => (\n \n
\n );\n })}\n \n
\n);\n\nexport default InfoDisbursement;\n","/*\n * InfoEmail.jsx\n * Description:\n * Copyright (c) 2021 PredictiveUX\n */\nimport React from \"react\";\n\nconst InfoEmail = () => (\n \n You should see the funds deposited into your account within the next 1-3\n business days. Check your email for a transaction summary receipt.\n
\n \n
\n);\n\nexport default InfoEmail;\n","/*\n * src/components/TransferSuccess/InfoTransfer.jsx\n * Description:\n * Copyright (c) 2021 PredictiveUX\n */\nimport React from 'react';\n\nconst InfoTransfer = () => (\n \n You can send a receipt of this transfer to up to 5 people. If you wish to\n do so, please enter their email addresses below:\n
\n \n
\n);\n\nexport default InfoTransfer;\n","/*\n * SuccessTitle.jsx\n * Description:\n * Copyright (c) 2021 PredictiveUX\n */\nimport React from 'react';\n\nconst SuccessTitle = () => (\n \n You should expect to see the money come out of your account within the\n next business day. Check your email for a transfer summary receipt.\n
\n \n
\n);\n\nexport default SuccessTitle;\n","import React from 'react';\nimport get from 'lodash/get';\nimport FormatAddress from '../../FormatAddress/FormatAddress';\nimport { PaymintsNumberFormat } from 'paymints-address-autocomplete-field';\n\nfunction TransferSuccess({\n transfer,\n bankAccount,\n destAccount,\n bankAccountLogo,\n escrowAccountLogo,\n disbursement,\n tenant,\n}) {\n const tenantName = get(tenant, 'name');\n const address1 = get(tenant, 'address1');\n const address2 = get(tenant, 'address2');\n const city = get(tenant, 'city');\n const state = get(tenant, 'state');\n const zipcode = get(tenant, 'zipcode');\n const office = get(transfer, 'office.title');\n return (\n Your transfer is now pending.
\n \n
\n );\n}\n\nexport default function MobileTransferSuccess({\n transfer,\n bankAccount,\n destAccount,\n bankAccountLogo,\n escrowAccountLogo,\n tenant,\n disbursement,\n}) {\n return (\n \n
\n\n Subject Property:
\n\n
\n\n Transfer Amount:
\n\n
\n \n
\n\n Transfer From Account:
\n\n
\n \n {disbursement ? null : (\n
\n \n {disbursement ? (\n
\n {disbursement\n ? null\n : `X${get(bankAccount, 'accountLastFourDigits')}`}\n
\n \n {tenantName}\n
\n {address1}\n {address2 !== null ? (\n <>\n
\n {address2}\n \n ) : null}\n
\n {city}, {state} {zipcode}\n
\n {office}\n
\n ) : (\n get(bankAccount, 'bankName')\n )}\n \n {address1}\n {address2 !== null ? (\n <>\n
\n {address2}\n \n ) : null}\n
\n {city}, {state} {zipcode}\n
\n {office}\n
\n {disbursement\n ? null\n : `X${get(bankAccount, 'accountLastFourDigits')}`}\n
\n
\n Transfer To Account:
\n\n
\n \n {disbursement ? (\n
\n \n {disbursement ? (\n `${get(bankAccount, 'bankName')}`\n ) : (\n
\n {disbursement\n ? `X${get(bankAccount, 'accountLastFourDigits')}`\n : null}\n
\n \n {tenantName}\n
\n {address1}\n {address2 !== null ? (\n <>\n
\n {address2}\n \n ) : null}\n
\n {city}, {state} {zipcode}\n
\n {office}\n
\n )}\n \n {address1}\n {address2 !== null ? (\n <>\n
\n {address2}\n \n ) : null}\n
\n {city}, {state} {zipcode}\n
\n {office}\n
\n {disbursement\n ? `X${get(bankAccount, 'accountLastFourDigits')}`\n : null}\n
\n
\n );\n}\n//Commented out due to deployment issue\n// import React from 'react';\n// import get from 'lodash/get';\n// import FormatAddress from '../../FormatAddress/FormatAddress';\n// import { PaymintsNumberFormat } from 'paymints-address-autocomplete-field';\n\n// function TransferSuccess({\n// transfer,\n// bankAccount,\n// bankEscrowAccount,\n// bankAccountLogo,\n// escrowAccountLogo,\n// }) {\n// return (\n// \n//
\n// );\n// }\n\n// export default function MobileTransferSuccess({\n// transfer,\n// bankAccount,\n// bankEscrowAccount,\n// bankAccountLogo,\n// escrowAccountLogo,\n// }) {\n// return (\n// \n//
\n\n// Subject Property:
\n//\n//
\n\n// Transfer Amount:
\n//\n//
\n// \n//
\n\n// Transfer From Account:
\n//\n//
\n// \n//
\n// \n// {!disbursement\n// ? get(bankAccount, 'bankName')\n// : get(destBankAccount, 'bankName')}\n//
\n// {!disbursement\n// ? get(bankAccount, 'accountLastFourDigits')\n// : get(destBankAccount, 'accountLastFourDigits')}\n//
\n// \n// {!disbursement\n// ? get(bankAccount, 'accountLastFourDigits')\n// : get(destBankAccount, 'accountLastFourDigits')}\n//
\n//
\n// Transfer To Account:
\n//\n//
\n// \n//
\n// \n// {!disbursement\n// ? get(destBankAccount, 'bankName')\n// : get(bankAccount, 'bankName')}\n//
\n// {!disbursement\n// ? get(destBankAccount, 'accountLastFourDigits')\n// : get(bankAccount, 'accountLastFourDigits')}\n//
\n// \n// {!disbursement\n// ? get(destBankAccount, 'accountLastFourDigits')\n// : get(bankAccount, 'accountLastFourDigits')}\n//
\n//
\n// );\n// }\n","/*\n * src/components/TransferSuccess/SuccessLastRow.jsx\n * Description:\n * Copyright (c) 2021 PredictiveUX\n */\nimport React from 'react';\nimport get from 'lodash/get';\nimport moment from 'moment';\n\nimport { PaymintsNumberFormat } from 'paymints-address-autocomplete-field';\nimport FormatAddress from '../FormatAddress/FormatAddress';\n\nimport {\n extractNotesFromJson,\n paymintsCurrencyFormatter,\n} from '../../utils/util';\n\nimport './transfer-success.css';\n\n/**\n * Taking the purpose string and possible adjustment\n * @param {*} purpose\n */\nconst transformPurpose = purpose => {\n if (!purpose) {\n return '--';\n }\n return purpose;\n};\n\nconst DisplaySummationRows = ({ transfer }) => {\n return (\n \n \n \n
\n
\n );\n};\n\nconst SuccessLastRow = ({ transfer }) => {\n return (\n <>\n | {`${transformPurpose(\n transfer?.purpose\n )} Amount`} | \n{paymintsCurrencyFormatter(transfer?.amount || 0)} | \n
| Convenience Fee | \n{paymintsCurrencyFormatter(transfer?.fee || 0)} | \n\n | Transfer Total Amount | \n \n
| \n | \n | \n
Details
\n \n
\n\n \n
\n Transfer Date
\n {moment().format('MM/DD/YYYY')}
\n\n
\n Purpose
\n \n {transformPurpose(transfer?.purpose)}\n
\n\n
\n {transfer.office !== null ? (\n Subject Property
\n \n
\n ) : null}\n {transfer.realtor !== null ? (\n Office
\n \n {transfer.office.title} - {transfer.office.city},{' '}\n {transfer.office.state}\n
\n\n
\n ) : null}\n Realtor
\n \n {transfer.realtor.firstName} {transfer.realtor.lastName},{' '}\n {transfer.realtor.email}\n
\n\n
\n Note
\n {extractNotesFromJson(transfer?.notes || '')}
\n\n
\n );\n */\n};\n\nexport default SuccessLastRow;\n","/*\n * src/components/TransferSuccess/SuccessSecondRow.jsx\n * Description: second row for a transfer record\n * Copyright (c) 2021 PredictiveUX\n */\n\nimport React from 'react';\nimport get from 'lodash/get';\n\nimport arrow from '../../styles/assets/Arrow_right.svg';\n\nconst SuccessSecondRow = ({\n bankAccount,\n destAccount,\n bankAccountLogo,\n escrowAccountLogo,\n tenant,\n disbursement,\n transfer,\n}) => {\n const tenantName = get(tenant, 'name');\n const address1 = get(tenant, 'address1');\n const address2 = get(tenant, 'address2');\n const city = get(tenant, 'city');\n const state = get(tenant, 'state');\n const zipcode = get(tenant, 'zipcode');\n const office = get(transfer, 'office.title');\n return (\n \n
\n \n Transfer Details\n
\n \n
\n \n Transfer Date\n
\n \n {moment().format(\"MM/DD/YYYY\")}\n
\n \n
\n Property
\n \n {formatAddressStreetApartment(\n get(transfer, \"propertyAddress1\"),\n get(transfer, \"propertyAddress2\")\n )}{\" \"}\n {formatAddressCityStateZipCode(\n get(transfer, \"propertyCity\"),\n get(transfer, \"propertyState\"),\n get(transfer, \"propertyZipcode\")\n )}\n
\n \n
\n Purpose
\n \n \n {`${transfer?.purpose ?? \" \"}`}\n \n
\n \n
\n Note
\n \n \n {extractNotesFromJson(transfer?.notes || \"\")}\n \n
\n \n \n
\n \n )\n}\n\nexport default SuccessSecondRow\n","/*\n * SummaryTransfer.jsx\n * Description:\n * Copyright (c) 2021 PredictiveUX\n */\nimport React from 'react';\n\nimport MobileTransferSuccess from './MobileTransferSuccess/MobileTransferSuccess';\nimport SuccessLastRow from './SuccessLastRow';\nimport SuccessSecondRow from './SuccessSecondRow';\n\nconst SummaryTransfer = ({\n transfer,\n bankAccount,\n destAccount,\n bankAccountLogo,\n escrowAccountLogo,\n tenant,\n disbursement,\n}) => (\n \n
\n From
\n To
\n \n
\n \n
\n \n
\n \n {get(bankAccount, 'bankName')}\n
\n Account X\n {get(bankAccount, 'accountLastFourDigits')\n ? get(bankAccount, 'accountLastFourDigits')\n : ''}\n
\n \n Account X\n {get(bankAccount, 'accountLastFourDigits')\n ? get(bankAccount, 'accountLastFourDigits')\n : ''}\n
\n
\n \n
\n \n {tenantName}\n
\n {address1}\n {address2 !== null ? (\n <>\n
\n {address2}\n \n ) : null}\n
\n {city}, {state} {zipcode}\n
\n {office}\n
\n \n {address1}\n {address2 !== null ? (\n <>\n
\n {address2}\n \n ) : null}\n
\n {city}, {state} {zipcode}\n
\n {office}\n
\n <>\n
\n);\n\nexport default SummaryTransfer;\n","/*\n * src/components/TransferSuccess/TransferSuccess.jsx\n * Description: Transfer success page\n * Copyright (c) 2021 PredictiveUX\n */\nimport React, { useState, useEffect } from 'react';\nimport BoxContainer from '../BoxContainer/BoxContainer';\nimport { connect } from 'react-redux';\nimport { useForm } from 'react-hook-form';\nimport { withRouter, Link } from 'react-router-dom';\nimport { useStateMachine } from 'little-state-machine';\nimport get from 'lodash/get';\nimport split from 'lodash/split';\nimport {\n PaymintsButton,\n BUTTON_TYPE,\n} from 'paymints-address-autocomplete-field';\n\nimport updateAction from '../CreateAccountWizard/updateAction';\nimport ContentModal from '../ContentModal/ContentModal';\nimport { useBankAccount } from '../../utils/service/service_bank_api';\nimport { useInstitutionLogo } from '../../utils/service/service_institution_logo';\nimport { sendEmailReceipt } from '../../reducers/transfer/TransferActions';\nimport useEscrowAccountFromTenant from '../../utils/service/service_tenant_api';\nimport { getQueryVariable } from '../../utils/util';\n// import { InsuranceBannerAd } from \"../BannerAds/\";\n\n// local imports\nimport EmailAddresses from './EmailAddresses';\nimport InfoDisbursement from './InfoDisbursement';\nimport InfoEmail from './InfoEmail';\nimport InfoTransfer from './InfoTransfer';\nimport SuccessTitle from './SuccessTitle';\nimport SummaryTransfer from './SummaryTransfer';\n\nimport '../CreateAccountWizard/createAccount.css';\n\nconst buildReceiptModal = message => (\n \n
\n \n \n
\n);\n\n/**\n *\n * @param {*} props\n * @returns\n */\nconst TransferSuccess = props => {\n const { register, handleSubmit, errors } = useForm({\n defaultValues: props.transfer,\n });\n const { state, action } = useStateMachine(updateAction);\n const tenant = get(props, 'tenant');\n const { bankAccount } = useBankAccount(get(state, 'data.bankAccount.id', ''));\n const { destAccount } = useEscrowAccountFromTenant(\n get(props, 'tenant.id', '')\n );\n const { institutionLogo: bankAccountLogo } = useInstitutionLogo(\n get(bankAccount, 'institutionCode', '')\n );\n const { institutionLogo: escrowAccountLogo } = useInstitutionLogo(\n get(destAccount, 'institutionCode', '')\n );\n const [showModal, setShow] = useState({ active: false, message: '' });\n const pathUrl = get(split(props.location.search, '?'), 2);\n const disbursement = getQueryVariable(pathUrl, 'disbursement');\n const handleClose = () => setShow({ active: false, message: '' });\n const handleShow = ({ message }) =>\n setShow({ active: true, message: message });\n\n const onSubmit = emailAddresses => {\n // compile a UNIQUE list of email addresses supplied in the form\n /* eslint-disable array-callback-return */\n const uniqueEmailAddressList = [\n ...new Set(\n Object.keys(emailAddresses)\n .map(m => {\n if (emailAddresses[m]) return emailAddresses[m];\n })\n .filter(f => f)\n ),\n ];\n\n if (uniqueEmailAddressList.length === 0) {\n handleShow({ message: 'No emails provided.' });\n return;\n }\n\n const data = {\n transfer: get(props, 'transfer'),\n TRANSFER_GUID: get(props, 'transfer.id'),\n additionalEmailRecipient: uniqueEmailAddressList,\n };\n\n props.onSendEmailReceipt(data).then(response => {\n if (get(response, 'error')) {\n handleShow({\n message: 'Failed to send email. Please try again later.',\n });\n } else {\n action({ emailAddresses });\n handleShow({ message: 'Receipt successfully sent!' });\n }\n });\n };\n\n useEffect(() => {\n window.scrollTo(0, 0);\n }, []);\n\n return (\n <>\n {message}
\n \n \n \n {'Transfer history'}\n \n \n
\n \n
\n);\n\nconst AccountError = props => {\n const { action } = useStateMachine(updateAction);\n const [isLoading, onSetLoadingService] = useState(false);\n const initialSate = {\n plaidInfoToVerify: {\n address1: '',\n city: '',\n firstName: '',\n lastName: '',\n zipcode: '',\n state: '',\n },\n accessToken: '',\n };\n const { state } = props.history.location;\n let { plaidInfoToVerify } = state || initialSate;\n const { plaidResponse, accessToken } = state || initialSate;\n const accountRequest = {\n accessToken,\n plaidAccountId: plaidResponse.metadata.account.id,\n verified: 'true',\n manual: 'true',\n };\n //plaidResponse.metadata.account.id\n const { updateClient } = useUpdateClient();\n const { user } = getClientStore();\n const { client } = useClientByPhone(user.mobilePhone);\n const { register, handleSubmit, errors, control, setValue } = useForm({\n defaultValues: client,\n });\n const onSubmit = newUser => {\n updateClient({\n variables: {\n id: client.id,\n client: newUser,\n },\n }).then(() => {\n delete accountRequest.manual;\n onSetLoadingService(true);\n SelectedBankAccounts({\n plaidResponse,\n history: props.history,\n client,\n action,\n setValue,\n onGetPlaidCreateClient: props.onGetPlaidCreateClient,\n onGetBankAccounts: props.onGetBankAccounts,\n verified: 'true',\n manual: 'true',\n onSetLoadingService,\n accountRequest,\n navigateAccounts: true,\n });\n });\n };\n return (\n <>\n \n
\n Loading please wait...
\n \n
\n Error
\n \n
\n \n Your transfer is not complete.\n
\n \n
\n \n The information you entered{' '}\n does not match your bank\n account records. Please choose how you would like to proceed:\n
\n \n
\n \n \n
\n \n
\n \n \n
\n Bank Notice
\n \n The bank you selected is not supported by our 3rd party \n service provider used to connect to your bank.
\n Please try another bank that is supported on the platform \n or contact your title agency or real estate brokerage \n for alternative methods of payment.\n
\n \n Please try another bank that is supported on the platform \n or contact your title agency or real estate brokerage \n for alternative methods of payment.\n
\n dismissHandler(false)}\n onKeyUp={() => dismissHandler(false)}\n >\n \n
\n \n
\n \n \n );\n};\n\nexport default AddAccountTooltip;\n","import React, { useState, useEffect } from 'react';\nimport axios from 'axios';\nimport { withRouter } from 'react-router-dom';\nimport { connect } from 'react-redux';\nimport get from 'lodash/get';\nimport map from 'lodash/map';\nimport size from 'lodash/size';\nimport find from 'lodash/find';\nimport format from 'dateformat';\nimport Table from 'react-bootstrap/Table';\nimport { Controller } from 'react-hook-form';\nimport {\n PaymintsButton,\n BUTTON_TYPE,\n} from 'paymints-address-autocomplete-field';\n\nimport {\n getClientAccounts,\n disconnectBankAccount,\n} from '../../reducers/account/AccountActions';\nimport BoxContainer from '../BoxContainer/BoxContainer';\nimport { useClientByPhone } from '../../utils/service/service_user_api';\nimport SpinnerLoader from '../SpinnerLoader/SpinnerLoader';\nimport { useInstitutionLogoOR } from '../../utils/service/service_institution_logo';\nimport PlaidButton from '../PlaidButton/PlaidButton';\nimport PlaidAddBankAccountButton from '../PlaidButton/PlaidAddBankAccountButton';\nimport PlaidVerifyButton from '../PlaidButton/PlaidVerifyButton';\nimport usePlaidTokenForMicroDepositsStart from '../../hooks/plaid/usePlaidTokenForMicrodepositStart';\nimport SelectedBankAccounts from '../PlaidButton/SelectedBankAccount';\nimport {\n getPlaidCreateClient,\n getPlaidStartMicrodepoits,\n getPlaidVerifyMicrodepoits,\n} from '../../reducers/account/AccountActions';\nimport ErrorMessageInput from '../ErrorMessajeInput/ErrorMessageInput';\nimport FieldRadioButton from '../FieldRadioButton/FieldRadioButton';\nimport DisconnectModal from '../DisconnectModal/disconnectModal';\nimport { getClientStore } from '../../utils/util';\nimport { getQueryVariable } from '../../utils/util';\nimport AddAccountTooltip from './AddAccountTooltip';\nimport './bankAccounts.css';\n\n///move after testing\n\n// axios.defaults.headers.common = {\n// Authorization: `Bearer ${process.env.REACT_APP_AUTH_TOKEN}`,\n// };\nconst Title = ({ isSelectAccount }) => (\n \n Connect to over 16,000 banks\n
\n dismissHandler(false)}>\n {plaidButton}\n
\n \n
\n);\n\nconst Subtitle = ({ disbursement }) => (\n \n {isSelectAccount ? 'Select an Account' : 'Linked Bank Accounts'}\n
\n \n {disbursement ? (\n
\n);\n\nconst mobile = window.screen.width < 450;\n\n/**\n * @function\n * Handle potential null balance for account\n */\nconst nullBalanceHandler = balance => {\n if (balance) {\n return '$' + balance.toFixed(2);\n }\n return '$__.__';\n};\n\nconst BuildRow = ({\n Controller,\n bankAccount,\n control,\n setValue,\n isSelectAccount,\n onDisconnectBankAccount,\n onGetPlaidVerifyMicrodepoits,\n onSetError,\n action,\n register,\n onReloadBankAccounts,\n institutionsLogo,\n state,\n bankAccounts,\n client,\n tenant,\n reloadingBankAccounts\n}) => {\n const clientId = get(client, 'id');\n const tenantId = get(tenant, 'id');\n const id = get(bankAccount, 'id');\n let balanceDateTime = get(bankAccount, 'balanceDateTime');\n const timeFormat = 'h:MM TT Z';\n const dateFormat = 'mm/dd/yyyy';\n const date = format(balanceDateTime, dateFormat);\n const time = format(balanceDateTime, timeFormat);\n const institution = get(bankAccount, 'bankName');\n const balance = get(bankAccount, 'balance');\n const accountLastFourDigits = get(bankAccount, 'accountNumber')\n ? get(bankAccount, 'accountNumber')\n : '';\n const institutionCode = get(bankAccount, 'institutionCode');\n const institutionLogo = get(\n find(institutionsLogo, ['institutionCode', institutionCode]),\n 'logoURL'\n );\n const [showDisconnectModal, setShowDisconnectModal] = useState(false);\n const [isOpen, setIsOpen] = useState(false);\n let [linkToken, setlinkToken] = useState(false);\n let [bankAccountId, setBankAccountId] = useState(false);\n\n const NavyFederalCreditUnionSavingsAccount =\n bankAccount.bankName === 'Navy Federal Credit Union' &&\n bankAccount.name.includes('Saving');\n\n \n\n const onSuccess1 = data => {\n let body = {\n id: clientId,\n tenantId: tenantId,\n bankAccountId: bankAccountId,\n };\n\n axios\n .post(\n `${process.env.REACT_APP_BASE_SERVICE_URL}/account/microdeposit/verify`,\n body,\n {\n headers: {\n 'Content-Type': 'application/json',\n Authorization: `Bearer ${process.env.REACT_APP_AUTH_TOKEN}`,\n },\n }\n )\n .then(() => {\n onReloadBankAccounts(true);\n });\n };\n\n const getTokenResponse = async () => {\n let tokenResponse = await axios({\n url: `${process.env.REACT_APP_BASE_SERVICE_URL}/account/microdeposit/link-token`,\n method: 'POST',\n headers: {\n 'Content-Type': 'application/json',\n Authorization: `Bearer ${process.env.REACT_APP_AUTH_TOKEN}`,\n },\n data: {\n bankAccountId: bankAccountId,\n id: clientId,\n tenantId: tenantId,\n },\n });\n return tokenResponse.data.linkToken;\n };\n\n const verificationStart = bankID => {\n setBankAccountId(bankID);\n setIsOpen(true);\n };\n\n useEffect(() => {\n if (bankAccountId) {\n getTokenResponse().then(token => {\n setlinkToken(token);\n });\n }\n }, [bankAccountId]);\n\n return (\n \n Please select the account for depositing your funds:\n
\n ) : (\n \n Please select the account you want to transfer money from:\n
\n )}\n \n {isSelectAccount && !NavyFederalCreditUnionSavingsAccount ? (\n {\n setValue([{ selection: id }]);\n action({ bankAccount: { id: id, balance: balance } });\n }}\n checked={get(state, 'data.bankAccount.id') === id}\n />\n ) : null}\n
\n \n {institution}\n
\n --
\n ) : (\n \n \n {nullBalanceHandler(balance)}\n
\n {`as of ${date}`}
\n {`${time}`}
\n {!balance && (\n \n We're having trouble retrieving your current balance.\n
\n )}\n \n )}\n\n verificationStart(bankAccount.id)}\n isOpen={isOpen}\n onSuccess={onSuccess1}\n >\n VERIFY\n \n
\n ) : !NavyFederalCreditUnionSavingsAccount ? (\n 'Verified'\n ) : (\n 'Unsupported'\n )}\n \n {\n setValue([{ selection: id }]);\n action({ bankAccount: { id: id, balance: balance } });\n }}\n checked={get(state, 'data.bankAccount.id') === id}\n />\n
\n ) : (\n \n
\n )}\n \n {institution} X{accountLastFourDigits}\n
\n {!balance ? (\n--
\n ) : (\n \n \n {nullBalanceHandler(balance)}\n
\n {`as of ${date}`}
\n {`${time}`}
\n {!balance && (\n \n We're having trouble retrieving your current balance.\n
\n )}\n \n )}\n\n {!isSelectAccount ? (\n\n
\n ) : null}\n\n \n
\n
\n
\n {/* DK I will need to make it prettier but in the meantime it works */}\n {bankAccount.pendingVerification ? (\n
\n \n \n \n );\n};\n\nconst BankAccountsList = ({\n isEmptyBankAccounts,\n watch,\n control,\n setValue,\n bankAccounts,\n onDisconnectBankAccount,\n isSelectAccount,\n action,\n register,\n onReloadBankAccounts,\n institutionsLogo,\n state,\n onSetError,\n tenant,\n client,\n reloadingBankAccounts\n}) => {\n if (isEmptyBankAccounts && !isSelectAccount)\n return (\n \n verificationStart(bankAccount.id)}\n isOpen={isOpen}\n onSuccess={onSuccess1}\n >\n VMOBILE\n \n
\n ) : !NavyFederalCreditUnionSavingsAccount ? (\n \n
\n ) : (\n \n \n Verified\n
\n\n
\n )}\n \n \n Unsupported\n
\n\n
\n Navy Federal Credit Union savings accounts are\n non-transactional. Please move funds to Navy Federal\n checking account and link the checking account.\n Alternatively, please link another bank account. Thank you.\n
\n \n \n You have no linked bank accounts\n
\n );\n if (isEmptyBankAccounts) return null;\n\n return (\n <>\n {mobile ? (\n <>\n {bankAccounts.map((item, index) => (\n| Financial Institution | \nAccount | \nBalance | \n {!isSelectAccount ? (\nUpdate | \n ) : null}\n {!isSelectAccount ? (\nDisconnect | \n ) : null}\n {!isSelectAccount ? (\nStatus | \n ) : (\nStatus | \n )}\n
|---|
\n
\n \n onClickMakeTransfer(props.history)}\n >\n {'Make Transfer'}\n \n
\n {children}\n {error.active && (\n \n \n {selected ? (\n
\n \n
\n ) :\n isDragActive ? (\n {`Selected file: ${selected}, click if you want to change it`}
\n\n
\n ) : (\n Drop the files here ...
\n\n
\n )}\n Drag and drop some files here, or click to select files
\nFile upload must be in jpg or png format
\n \n )\n}","import React, { useState } from 'react'\nimport FileUpload from './FileUpload';\nimport { validateFile } from '../../utils/validations';\n\nexport default function InputFile({ value, onChange, selected }) {\n const [invalidFormat, setInvalidFormat] = useState(false);\n const onDropFiles = files => {\n if (validateFile(files[0].type)) {\n setInvalidFormat(false);\n onChange(files[0])\n } else {\n setInvalidFormat(true);\n }\n }\n return \n
\n)\nconst uploadIdDocument = ({ props, action, transferId, selectedDocument, selectedDocumentType, onSetError }) => {\n const tenantId = get(props, 'tenant.id');\n const clientId = get(props, 'client.id');\n const type = selectedDocumentType.toLowerCase();\n\n const form = new FormData();\n form.append('TENANT_GUID', tenantId);\n form.append('CLIENT_GUID', clientId);\n // form.append('TRANSFER_GUID', transferId);\n form.append(type, selectedDocument);\n\n return props.onUploadDocument(form)\n .then((responseUploadDocument) => {\n if (!get(responseUploadDocument, 'error')) {\n const data = {\n documentType: type,\n assetId: get(responseUploadDocument, `s3-assets.${type}.assetID`)\n }\n return props.onSaveTransferDoc(transferId, data)\n .then((responseTransferDoc) => {\n if (!get(responseTransferDoc, 'error')) {\n action({ asset: { id: get(responseUploadDocument, `s3-assets.${type}.assetID`) } });\n return { success: true }\n } else {\n return { success: false }\n }\n })\n } else {\n return { success: false }\n }\n })\n}\nconst DocumentVerification = (props) => {\n const [isLoading, onSetLoadingService] = useState(false);\n const { register: regDocument, control: controlDocument, watch: watchDocument, handleSubmit } = useForm();\n const { action } = useStateMachine(updateAction);\n const transferId = get(props, 'client.id');\n const selectedDocument = watchDocument('selectedDocument');\n const selectedDocumentType = watchDocument('selectedDocumentType');\n const { addToast } = useToasts();\n const onSubmit = () => {\n onSetLoadingService(true);\n uploadIdDocument({ props, action, transferId, selectedDocument, selectedDocumentType }).then(response => {\n if (response.success) {\n onSetLoadingService(false);\n props.history.push(`/bank-accounts`);\n addToast('Your Document has successfully uploaded.', { appearance: 'success' });\n }\n });\n }\n return (\n <>\n \n
\n \n Loading please wait...\n
\n \n
\n );\n};\n\n/**\nconst Title = () => {\n return (\n \n
\n );\n};\n */\n\nconst RealtorIntroText = ({ props }) => {\n\n const introDefault = props?.realtor?.firstName + ' ' + props?.realtor?.lastName + ' has partnered with ' +\n props.tenant.name + ' to securely transfer funds';\n const introText = props?.realtor?.displayDescription || introDefault;\n\n return (\n Welcome
\n \n \n {introText}\n
\n \n To get started please create an account by entering your name and mobile phone number below.\n
\n \n );\n};\n\nconst FieldsPersonalInformation = ({ register, errors }) => {\n return (\n \n \n This is required \n )}\n {errors.firstName && errors.firstName.type === 'maxLength' && (\n Max length exceeded \n )}\n
\n \n \n
\n \n \n This is required \n )}\n {errors.lastName && errors.lastName.type === 'maxLength' && (\n Max length exceeded \n )}\n
\n \n Must match your driver's license or government-issued ID.
\n \n \n );\n};\n\nconst PersonalInformation = ({\n client,\n watch,\n register,\n errors,\n setValue,\n control,\n}) => (\n \n
\n);\n\nconst FieldsContactInformation = ({ errors, control }) => (\n \n \n This is required \n )}\n \n \n
\n \n \n);\n\nconst ContactInformation = ({ client, errors, control }) => {\n return \n We will send a security code to your mobile phone for account verification.\n
\n \n \n setDisabled(!e.target.checked)}\n />{' '}\n {' '}\n {'By clicking Create Account, you agree to CertifID, Inc. '}\n \n Terms of Service{' '}\n {' '}\n \n {' and '}\n \n Privacy Policy{' '}\n \n \n {' as well as our partner'} Dwolla's\n \n {' '}\n Terms of Service{' '}\n \n {' '}\n and{' '}\n \n Privacy Policy.\n \n \n
\n \n);\n\nconst nextStep = history => {\n history.push(`/create-account/step-2${get(history, 'location.search')}`);\n};\n\nconst FirstStep = props => {\n const {\n beforeContinue,\n onUpdateAuth0User,\n refetchNewClient,\n realtor,\n } = props;\n\n const { register, handleSubmit, errors, watch, setValue, control } = useForm({\n defaultValues: props.client,\n });\n const { createClient } = useCreateClient();\n const { action } = useStateMachine(updateAction);\n const [error, onSetError] = useState({\n active: false,\n type: '',\n messageError: '',\n });\n const [disabled, setDisabled] = useState(true);\n const [licenseArray, setLicenseArray] = useState([]);\n\n const onSubmit = newUser => {\n removeItem('login_user');\n onSetError({ active: false, type: '', messageError: '' });\n const email = get(props.user, 'email')\n ? get(props.user, 'email')\n : `${newUser.phone_number}@paymints.io`;\n const tenantId = get(props, 'tenant.id');\n if (isEmpty(tenantId))\n onSetError({\n active: true,\n messageError: 'Tenant not found, please check url',\n });\n if (email && !isEmpty(tenantId)) {\n const { phone_number } = newUser;\n // Search for all clients with that email\n refetchNewClient({ where: { mobilePhone: '+1' + phone_number } }).then(\n response => {\n const client = get(response, 'data.allClients')[0];\n delete newUser.phone_number;\n if (!client) {\n let clientData = {};\n // Create a new client\n createClient({\n variables: {\n client: {\n ...newUser,\n email: '',\n mobilePhone: '+1' + phone_number,\n tenant: {\n connect: {\n id: tenantId,\n },\n },\n },\n },\n })\n .then(res => {\n clientData = res.data.createClient;\n beforeContinue();\n })\n .then(() => {\n // Create Auth0 client\n const userEmail = get(props.user, 'email');\n if (!userEmail) {\n const auth0User = {\n email: email,\n phone_number: `+1${phone_number}`,\n name: `${newUser.firstName} ${newUser.lastName}`,\n connection: 'sms',\n };\n const auth0Payload = {\n create_user: auth0User,\n role: 'paymints_admin',\n new_user_role: 'paymints_client',\n };\n\n onUpdateAuth0User(tenantId, auth0Payload)\n .then(response => {\n if (response === 'error') {\n onSetError({\n active: true,\n messageError:\n 'Account exists for phone number. Please login in.',\n });\n } else {\n getCode(tenantId, clientData.id, clientData);\n }\n })\n .then(() => {\n action(newUser);\n });\n } else {\n action(newUser);\n nextStep(props.history);\n }\n });\n } else {\n onSetError({ active: true, type: 'sms' });\n setItem('login_user', 'existing_user');\n }\n }\n );\n }\n };\n\n const getCode = (tenantId, clientid, client) => {\n APIUtil.getSMSCode(tenantId, clientid).then(\n () => {\n props.history.push('/create-account/account-verification', { client });\n },\n error => {\n console.log(error);\n }\n );\n };\n\n useEffect(() => {\n if (props?.realtor) {\n setLicenseArray(JSON.parse(props.realtor.licenses));\n }\n }, [props.realtor]);\n\n const nameDefault = props?.realtor?.firstName + ' ' + props?.realtor?.lastName;\n const nameText = props?.realtor?.displayName || nameDefault;\n\n return (\n \n \n \n
\n \n {realtor?.headshotImageURL ? (\n
\n \n {nameText}\n
\n \n
\n {`Agent with ${realtor?.brokerage?.name}`}
\n \n {licenseArray && licenseArray.length? (\n License
\n ):\"\"}\n {licenseArray.map(license => (\n {`${license.state} #${license.license}`}
\n ))}\n
\n \n ):\"\"}\n {licenseArray.map(license => (\n {`${license.state} #${license.license}`}
\n ))}\n
\n {realtor?.brokerage?.logoURL ? (\n
\n \n {`${realtor?.brokerage?.name}`}{' '}\n
\n )}\n \n {phoneFormatter(\n '(XXX) XXX-XXXX',\n realtor?.brokerage?.officePhone?.replace('+1', '')\n )}{' '}\n
\n \n \n \n
\n);\n\n/**\n * @TODO extract out to component\n */\nconst InfoTransfer = () => (\n Transfer Details
\n \n
\n);\n\n/**\n * @TODO extract out to component\n */\nconst FieldsInfoTransfer = ({\n client,\n register,\n errors,\n control,\n setValue,\n purposes,\n emdVisible,\n setFieldsEMDVisible,\n realtorData,\n setRealtorData,\n showREAInfoFill,\n}) => {\n const purposesOptions = purposes.map(purpose => ({\n value: purpose,\n label: purpose\n }))\n return (<>\n \n What kind of transfer would you like to make?\n
\n PURPOSE
\n \n\n This is required \n\n
)}\n \n\n PROPERTY ADDRESS AND ADDITIONAL NOTES
\n);\n\n/**\n * @TODO extract out to component\n */\nconst FieldsInfoPropertyAddress = ({\n transfer,\n register,\n errors,\n setValue,\n control,\n}) => {\n return (\n \n \n This is required \n )}\n This is required \n )}\n This is required \n )}\n This is required \n )}\n
\n {((errors.propertyAddress1 &&\n errors.propertyAddress1.type === 'required') ||\n (errors.propertyCity && errors.propertyCity.type === 'required') ||\n (errors.propertyState && errors.propertyState.type === 'required') ||\n (errors.propertyZipcode &&\n errors.propertyZipcode.type === 'required')) && (\nPlease select a valid address \n )}\n
\n \n
\n \n {((errors.propertyAddress1 &&\n errors.propertyAddress1.type === 'required') ||\n (errors.propertyCity && errors.propertyCity.type === 'required') ||\n (errors.propertyState && errors.propertyState.type === 'required') ||\n (errors.propertyZipcode &&\n errors.propertyZipcode.type === 'required')) && (\n
\n \n
AMOUNT
\n);\n\n/**\n * @TODO extract out to component\n */\nconst FieldInfoAmount = ({\n register,\n errors,\n control,\n watch,\n watchDocument,\n regDocument,\n controlDocument,\n bankBalance,\n setMaxAmountValidate,\n maxAmountValidate,\n MAXIMUM_AMOUNT,\n transferFeeConfigData,\n getValues\n}) => {\n return (\n \n
\n Account Balance
\n {!bankBalance ? (\n '--'\n ) : (\n \n
\n )}\n \n
\n \n \n \n {!bankBalance ? (\n setMaxAmountValidate(false)}\n className=\"create-account__input form-control\"\n rules={{\n required: true,\n }}\n autoComplete=\"no\"\n />\n ) : (\n setMaxAmountValidate(false)}\n className=\"create-account__input form-control\"\n rules={{\n required: true,\n validate: value =>\n validAmount(\n value,\n bankBalance,\n extractTranferFeeFromData(transferFeeConfigData)\n ),\n }}\n autoComplete=\"no\"\n />\n )}\n\n\n {errors.amount && errors.amount.type === 'required' && (\n This is required \n )}\n {errors.amount && errors.amount.type === 'validate' && (\n \n Amount entered exceeds account balance and any applicable\n convenience fees. Please enter an amount lesser than or equal to\n this combined amount.\n \n )}\n {maxAmountValidate && (\n \n Transfer amount cannot exceed{' '}\n \n )}\n
\n \n \n value === getValues('amount'),\n },\n }}\n onPaste={e => {\n e.preventDefault()\n return false\n }}\n />\n {errors.amount2 && errors.amount2.type === 'required' && (\n Amount is required \n )}\n {errors.amount2 && errors.amount2.type === 'matchesAmount' && (\n Amounts do not match \n )}\n\n\n {errors.amount && errors.amount.type === 'required' && (\n This is required \n )}\n {errors.amount && errors.amount.type === 'validate' && (\n \n Amount entered exceeds account balance and any applicable\n convenience fees. Please enter an amount lesser than or equal to\n this combined amount.\n \n )}\n {maxAmountValidate && (\n \n Transfer amount cannot exceed{' '}\n \n )}\n
\n \n
\n \n \n
\n \n
\n\n \n \n
\n \n
\n \n );\n};\n\nexport default AlertBanner;\n","import { useQuery } from '@apollo/react-hooks';\r\nimport { gql } from 'apollo-boost';\r\nimport isEmpty from 'lodash/isEmpty';\r\nimport isNil from 'lodash/isNil';\r\n\r\nconst GET_TRANSACTIONS_SORTED_QUERY = gql`\r\n query allTransfersSorted($where: TransferWhereInput!) {\r\n allTransfers(where: $where, sortBy: createdAt_DESC) {\r\n id\r\n firstName\r\n middleName\r\n lastName\r\n otherIndividuals\r\n email\r\n mobilePhone\r\n propertyAddress1\r\n propertyAddress2\r\n propertyCity\r\n propertyState\r\n propertyZipcode\r\n amount\r\n fee\r\n purpose\r\n expectedClosingDate\r\n sellerName\r\n notes\r\n emailMessage\r\n status\r\n disbursement\r\n active\r\n createdAt\r\n tenant {\r\n id\r\n name\r\n address1\r\n address2\r\n city\r\n state\r\n zipcode\r\n }\r\n client {\r\n id\r\n firstName\r\n lastName\r\n address1\r\n address2\r\n city\r\n state\r\n zipcode\r\n propertyAddress1\r\n propertyAddress2\r\n propertyCity\r\n propertyState\r\n propertyZipcode\r\n }\r\n transferType {\r\n id\r\n name\r\n isDebit\r\n isCredit\r\n }\r\n sourceBankAccount {\r\n id\r\n bankName\r\n description\r\n accountNumber\r\n accountLastFourDigits\r\n bankDisplayName\r\n active\r\n client {\r\n id\r\n }\r\n institutionCode\r\n updatedAt\r\n }\r\n destBankAccount {\r\n id\r\n bankName\r\n description\r\n accountNumber\r\n accountLastFourDigits\r\n bankDisplayName\r\n active\r\n client {\r\n id\r\n }\r\n institutionCode\r\n updatedAt\r\n }\r\n agent {\r\n id\r\n firstName\r\n lastName\r\n email\r\n }\r\n realtor {\r\n id\r\n firstName\r\n lastName\r\n email\r\n }\r\n updatedAt\r\n }\r\n }\r\n`;\r\n\r\n// PAYAPP-906: Exclude vendor disbursements from the Client UI\r\nexport function useAllTransfersSorted(clientID) {\r\n const id = isNil(clientID) || isEmpty(clientID) ? null : clientID;\r\n const { loading, error, data, refetch } = useQuery(\r\n GET_TRANSACTIONS_SORTED_QUERY,\r\n {\r\n variables: {\r\n where: {\r\n client: { id },\r\n status_not_in: ['created', 'rejected', 'awaiting approval'],\r\n OR: [\r\n { transferType: { name: 'Client Disbursement' } },\r\n { transferType: { name: 'Client Transfer' } },\r\n { transferType_is_null: true },\r\n ],\r\n },\r\n },\r\n }\r\n );\r\n\r\n // the filter is a hack because name_not_i excludes BOTH \"Vendor Disbursement\" and null (no bueno)\r\n return {\r\n loadingSearchTransfer: loading,\r\n error,\r\n refetchTransfers: refetch,\r\n transfers: data ? data.allTransfers : undefined,\r\n };\r\n}\r\n","/*\n * src/utils/service/service_pdf-download.js\n * Description: PDF ReadableStream download utilities\n * Copyright (c) 2020 Mark Fehrenbacher\n */\nimport axios from \"axios\";\n\n/**\n * Just the promise\n * @param {*} url\n */\nexport const downloadPdfPromise = (url) => {\n return axios({\n method: \"get\",\n responseType: \"blob\",\n headers: {\n \"Content-Type\": \"application/json\",\n Authorization: `Bearer ${process.env.REACT_APP_AUTH_TOKEN}`,\n },\n url,\n });\n};\n\n/**\n * Promise + resolve\n * @param {*} url\n */\nconst downloadPdf = (url) =>\n axios({\n method: \"get\",\n responseType: \"blob\", // <--- this is key\n headers: {\n \"Content-Type\": \"application/json\",\n Authorization: `Bearer ${process.env.REACT_APP_AUTH_TOKEN}`,\n },\n url,\n }).then((response) => response.data);\n\nexport default downloadPdf;\n","/*\n * src/components/TransferHistory/TransferDocuments.jsx\n * Description: Downloadable documentation for a particular transfer\n * Copyright (c) 2021\n */\nimport React from \"react\";\n\nimport { shouldHideDocuments } from \"../../utils/validations\";\nimport { asyncWrapper } from \"../../utils/util\";\nimport downloadPdfPromise from \"../../utils/service/service_pdf-download\";\n\nconst TransferDocuments = ({ documentData, transferId, status }) => {\n const escrowAgreements = documentData.filter(\n (f) => f?.transfer?.id === transferId && f.type === \"escrow agreement\"\n );\n const receipts = documentData.filter(\n (f) => f?.transfer?.id === transferId && f.type === \"receipt\"\n );\n\n /**\n * PDF stream reader / download functionality\n * @param {*} pdfUrl String\n */\n const openPdf = async (pdfUrl) => {\n const [err, data] = await asyncWrapper(downloadPdfPromise(pdfUrl));\n\n if (err) {\n return;\n }\n\n const file = new Blob([data], { type: \"application/pdf\" });\n const fileURL = URL.createObjectURL(file);\n window.open(fileURL);\n };\n\n return (\n \n setVisible(false)}\n >\n X\n
\n {text}
\n \n
\n );\n};\n\nexport default InboundTransfer;\n","import React, { Component } from \"react\";\nimport PropTypes from \"prop-types\";\nimport { OverlayTrigger, Tooltip } from \"react-bootstrap\";\n\nimport \"./custom-tooltip.css\";\n\nexport default class CustomTooltip extends Component {\n render = () => {\n const tooltipContent = (\n \n \n
\n \n \n {transfer?.status}\n \n \n
\n
\n\n {/* related property / actions / documents */}\n \n \n \n Actions\n \n \n Documents\n \n
\n \n \n \n
\n
\n \n \n \n \n
\n \n \n \n \n \n Real Estate Agent\n \n
\n \n {`${transfer?.realtor?.firstName} ${transfer?.realtor?.lastName} (${transfer?.realtor?.email})`}
\n \n \n \n );\n};\n\nexport default OutboundTransfer;\n","/*\n * src/components/TransferHistory/TransferHistoryListing.jsx\n * Description: This wrapper component determines inbound (disbursement) or outbound (client -> tenant) transfer\n */\nimport React from 'react';\n\nimport InboundTransfer from './InboundTransfer';\nimport OutboundTransfer from './OutboundTransfer';\n\nconst TransferHistoryListing = ({ transfers, clientDocuments, display }) => {\n if (display) {\n return (\n <>\n {transfers.map(t => {\n return t?.disbursement ? (\n \n \n
\n \n \n {transfer?.status === 'Requested' ||\n transfer?.status === 'viewed' ? (\n \n \n
\n
\n\n {/* related property / actions / documents */}\n \n (-\n
\n --
\n \n \n \n \n Actions\n \n \n Documents\n \n
\n \n \n \n
\n \n \n \n \n \n
\n \n\n \n \n \n SEND FUNDS\n \n \n {`Requested by ${transfer?.agent?.firstName} ${transfer?.agent?.lastName} (${transfer?.agent?.email})`}
\n \n
\n );\n};\n\n/**\n * @TODO refactor to separate component...no internal component definitions\n * Don't understand why it's called UpdateUI when it's a mobile transfer card block\n * @param {*} param0\n */\nconst UpdateUI = ({ transfer, getStatusType, clientDocuments, tenant }) => {\n const id = get(transfer, 'id');\n const status = get(transfer, 'status');\n const dateFormat = 'mm/dd/yyyy hh:MM TT';\n const updatedAt = format(get(transfer, 'updatedAt'), dateFormat);\n const createdAt = format(get(transfer, 'createdAt'), dateFormat);\n const propertyAddress1 = get(transfer, 'propertyAddress1');\n const propertyAddress2 = get(transfer, 'propertyAddress2');\n const propertyCity = get(transfer, 'propertyCity');\n const propertyState = get(transfer, 'propertyState');\n const propertyZipcode = get(transfer, 'propertyZipcode');\n const amount = get(transfer, 'amount');\n const disbursement = get(transfer, 'disbursement');\n\n return (\n <>\n {disbursement && status === 'draft' ? null : (\n <>\n {!disbursement ? (\n \n {escrowAgreement || receipt ? (\n
\n \n
\n ) : null}\n DOCUMENTS
\n\n {escrowAgreement ? (\n
\n \n \n
openPdf(receipt)}>\n \n
\n \n \n {status}\n
\n \n\n {/* {status}
*/}\n\n
\n \n \n {/* Date/Time */}\n \n Date/Time\n \n \n \n Fee\n \n
\n\n {/* TO */}\n {createdAt}
\n {/* FROM */}\n \n From\n \nSubmitted {createdAt}
\n\n \n Amount\n \n\n {!disbursement ? (\n <>\n (-\n
\n (-\n
\n
\n \n To\n
\n {formatToDisplay(transfer, 'text')}\n
\n Property Address\n
\n {propertyAddress1}\n {propertyAddress2 ? (\n <>\n
\n {propertyAddress2}\n \n ) : (\n ''\n )}\n
\n {propertyCity}, {propertyState} {propertyZipcode}\n
\n {status === 'sent' && transfer?.disbursement ? (\n
\n
\n )}\n \n )}\n \n );\n};\n\nexport default function MobileHistory({\n transfers,\n institutionsLogo,\n clientDocuments,\n tenant,\n}) {\n /**\n * @function\n * @param {*} option\n * @returns\n */\n const getStatusType = option => {\n switch (option.toLowerCase().trim()) {\n case 'draft':\n return BALL_TYPE.INACTIVE;\n case 'pending':\n return BALL_TYPE.PENDING;\n case 'submitted':\n return BALL_TYPE.ACTIVE;\n case 'sent':\n return BALL_TYPE.SENT;\n case 'viewed':\n return BALL_TYPE.VIEWED;\n case 'completed':\n return BALL_TYPE.COMPLETED;\n case 'cancelled':\n return BALL_TYPE.CANCELLED;\n case 'error':\n return BALL_TYPE.ERROR;\n default:\n return BALL_TYPE.INACTIVE;\n }\n };\n\n const transfersData = transfers || [];\n const transferCards = (transfers || []).map(transfer => (\n \n
\n {status}
\n \n
\n \n
\n \n {/* FROM */}\n
\n \n From\n
\n {formatFromDisplay(transfer, 'text')}\n
Submitted {updatedAt}
\n {/* TO */}\n\n To\n
\n {propertyAddress1}\n {propertyAddress2 ? (\n <>\n
\n {propertyAddress2}\n \n ) : (\n ''\n )}\n
\n {propertyCity}, {propertyState} {propertyZipcode}\n
\n \n {!disbursement ? '-' : null}\n
\n {propertyAddress1}\n {propertyAddress2 ? (\n <>\n
\n {propertyAddress2}\n \n ) : (\n ''\n )}\n
\n {propertyCity}, {propertyState} {propertyZipcode}\n
\n {status === 'sent' && transfer?.disbursement ? (\n
\n {transfersData.length ? (\n transferCards\n ) : (\n
\n );\n}\n","/*\n * src/components/TransferHistory/TransferHistory.jsx\n * Description: Listing out transfers\n * Copyright (c) 2021 PredictiveUX\n */\nimport React, { useState, useEffect } from 'react';\nimport { withRouter, Link } from 'react-router-dom';\nimport get from 'lodash/get';\nimport map from 'lodash/map';\nimport size from 'lodash/size';\nimport { PaymintsIconButton } from 'paymints-address-autocomplete-field';\nimport BoxContainer from '../BoxContainer/BoxContainer';\nimport {\n useClientByPhone,\n useAllClientDocuments,\n} from '../../utils/service/service_user_api';\nimport AlertBanner from '../AlertBanner/';\nimport { useAllTransfersSorted } from '../../hooks/useAllTransfersSorted';\n// import useAllTransferArchives from '../../hooks/useAllTransferArchives';\nimport { useInstitutionLogoOR } from '../../utils/service/service_institution_logo';\nimport ContentModal from '../ContentModal/ContentModal';\nimport SpinnerLoader from '../SpinnerLoader/SpinnerLoader';\nimport { getClientStore } from '../../utils/util';\n\nimport TransferHistoryListing from './TransferHistoryListing';\nimport MobileHistory from './MobileHistory/MobileHistory';\nimport './transferHistory.css';\n\nconst buildCancelEditError = () => (\n \n You have no pending or completed transfers, select the “+” button to\n start a transfer.\n
\n )}\n\n
\n);\n\n/**\n * The primary component\n * @param {*} props\n * @returns\n */\nconst TransferHistory = props => {\n // local state\n const [seeMoreInfo, updateSeeMoreInfo] = useState([]);\n\n const [transfers, setTransfers]= useState([])\n // get client information\n const { user } = getClientStore();\n const { loadingSearch, client } = useClientByPhone(user?.mobilePhone || null);\n const clientID = get(client, 'id');\n\n // retrieve transfer information\n\n const {\n loadingSearchTransfer,\n transfers: transfersNew,\n refetchTransfers,\n } = useAllTransfersSorted(clientID);\n\n // retrieve transfer archive information\n\n // const {\n // transfers: transfersArchive,\n // loadingTransfersArchive\n // } = useAllTransferArchives();\n\n \n \n\n // retrieve client documentation\n const { clientDocuments } = useAllClientDocuments(clientID);\n\n // unique list of bank accounts codes\n let bankAccountCodes = [];\n let escrowBankAccountCodes = [];\n if (transfers && transfers.length > 0) {\n bankAccountCodes = [\n ...new Set(\n transfers.map(f => f?.sourceBankAccount?.institutionCode).filter(f => f)\n ),\n ];\n\n escrowBankAccountCodes = [\n ...new Set(\n transfers.map(f => f?.escrowBankAccount?.institutionCode).filter(f => f)\n ),\n ];\n }\n\n // combine them\n const allCodes = [...bankAccountCodes, ...escrowBankAccountCodes].map(m => {\n return {\n institutionCode: m,\n };\n });\n\n const { institutionsLogo } = useInstitutionLogoOR(\n size(allCodes) > 0 ? allCodes : []\n );\n\n const [showModal, setShow] = useState(false);\n const tenant = get(props, 'tenant');\n const handleClose = () => setShow(false);\n const handleShow = () => setShow(true);\n\n const nav = document.querySelector('.menu-nav-bar__grey-bar');\n if (!nav) window.location.reload();\n\n /**\n * @function\n */\n const alertBannerText = () => {\n if (transfers) {\n return `You Have ${\n transfers.filter(f => f.status === 'sent').length\n } Transfers Waiting for You!`;\n }\n return '';\n };\n\n /**\n * @function\n */\n const alertBannerShouldBeVisible = () => {\n if (transfers && transfers.length > 0) {\n return transfers.filter(f => f.status === 'sent').length > 0;\n }\n return false;\n };\n\n /**\n *\n * @param {*} history\n * @returns\n */\n const onClickMakeTransfer = history => {\n history.push('/create-account/step-select-account');\n };\n\n useEffect(() => {\n const transfersID = map(transfers, item => ({\n id: item.id,\n showMoreInfo: false,\n }));\n updateSeeMoreInfo(transfersID);\n refetchTransfers();\n if (get(props.location, 'state.editError')) {\n handleShow();\n props.location.state.editError = false;\n }\n // if (transfersNew && transfersArchive) {\n // setTransfers([...transfersNew, ...transfersArchive]) \n // }\n if (transfersNew ) {\n setTransfers([...transfersNew]) \n }\n \n }, [clientID, props.location, refetchTransfers, transfersNew]);\n // }, [clientID, props.location, refetchTransfers, transfersNew, transfersArchive]);\n\n // if (loadingSearch || loadingSearchTransfer || loadingTransfersArchive) {\n if (loadingSearch || loadingSearchTransfer ) {\n return \n The transfer cannot be edited\n
\n \n
\n \n Transfers
\n \n \n onClickMakeTransfer(props.history)}>\n \n \n \n
\n \n You have no pending or completed transfers, select the “+” button to\n start a transfer.\n
\n )}\n\n
\n);\n\nconst FieldsPersonalInformation = ({\n register,\n watch,\n setValue,\n control,\n errors,\n client,\n}) => {\n const nav = document.querySelector('.menu-nav-bar__grey-bar');\n if (!nav) window.location.reload();\n return (\n Your Account
\n \n \n This is required \n )}\n {errors.firstName && errors.firstName.type === 'maxLength' && (\n Max length exceeded \n )}\n
\n \n \n
\n \n \n This is required \n )}\n {errors.lastName && errors.lastName.type === 'maxLength' && (\n Max length exceeded \n )}\n
\n \n \n \n Must be a valid social security number\n \n )}\n
\n \n \n Must be at least 18 years old \n )}\n
\n \n \n
\n \n \n
\n
\n \n
\n
\n);\n\nconst FieldsContactInformation = ({ register, errors, control }) => {\n return (\n \n Personal Information\n
\n \n \n This is required \n )}\n
\n \n
\n);\n\nconst Account = props => {\n const { user } = getClientStore();\n const { loadingSearch, client, refetch } = useClientByPhone(user.mobilePhone);\n const clientID = get(client, 'id');\n const { loading, updateClient } = useUpdateClient();\n const tenantIdentifier = split(window.location.hostname, '.')[0];\n const { loading: loadingTenant, tenant } = useAllTenants(tenantIdentifier);\n const tenantID = get(tenant, 'id');\n const { register, handleSubmit, watch, errors, setValue, control } = useForm({\n defaultValues: client,\n });\n const { sensitiveData, refetch: refetchSensitiveData } = useSensitiveData();\n\n const { SSN, DOB } = sensitiveData || {};\n\n useEffect(() => {\n if (client && sensitiveData) {\n setValue([\n { firstName: client.firstName },\n { middleName: client.middleName },\n { lastName: client.lastName },\n { address1: client.address1 },\n { address2: client.address2 },\n { state: client.state },\n { city: client.city },\n { zipcode: client.zipcode },\n { mobilePhone: validateNumber(client.mobilePhone) },\n { email: client.email },\n { ssn: ssnCutter(decrypt(SSN)) },\n { dateOfBirth: decrypt(DOB) },\n ]);\n }\n }, [client, SSN, DOB]);\n\n \n\n const ssnCutter = (ssn) => {\n if (ssn.length > 4) {\n return ssn.slice(ssn?.length - 4)\n } else return ssn\n };\n\n const validateNumber = phone => {\n return phone ? phone.slice(2, 12) : phone;\n };\n\n const onSubmit = async newUser => {\n delete newUser.mobilePhone;\n\n const sensitiveData = {\n SSN: encrypt(newUser.ssn),\n DOB: encrypt(newUser.dateOfBirth),\n };\n //removing sensititve data from query\n const { ssn, dateOfBirth, ...rest } = newUser;\n\n try {\n await saveSensitiveData(clientID, tenantID, sensitiveData);\n\n await updateClient({\n variables: {\n id: client.id,\n client: rest,\n },\n });\n\n await refetch();\n await refetchSensitiveData();\n } catch (err) {\n console.log(err);\n }\n };\n\n if (loading || loadingSearch || loadingTenant) {\n return Contact Information
\n \n \n hideSideNav(props.mobile)}\n >\n \n \n
\n \n hideSideNav(props.mobile)}\n >\n \n \n 
\n \n \n Bank Account\n \n \n
\n \n hideSideNav(props.mobile)}\n >\n \n \n 
\n \n \n New Transfer\n \n \n
\n\n\n \n openMenu(!isOpen)}\n >\n \n \n
\n \n hideSideNav(props.mobile)}\n >\n \n \n
\n\n\n userLogout()}>\n
\n \n \n \n 
\n \n Log Out\n
\n openMenu(!isOpen)}>\n
\n \n \n \n {props.children}\n \n \n );\n};\n\nexport default withRouter(MenuNavBar);\n","import React, { useState } from \"react\";\nimport { withRouter } from \"react-router-dom\";\nimport BoxContainer from \"../BoxContainer/BoxContainer\";\nimport { useForm, Controller } from \"react-hook-form\";\nimport PhoneField from \"../PhoneField/PhoneField\";\nimport { setItem } from \"../../utils/util\";\nimport ErrorMessageInput from \"../ErrorMessajeInput/ErrorMessageInput\";\nimport {\n PaymintsButton,\n BUTTON_TYPE,\n} from \"paymints-address-autocomplete-field\";\nimport * as APIUtil from \"../../utils/service/service_api\";\nimport { useClientByPhone } from \"../../utils/service/service_user_api\";\nimport Phone from \"../../styles/assets/phone.png\";\n\nimport get from \"lodash/get\";\n\nconst Login = (props) => {\n const [error, onSetError] = useState({ active: false, messageError: \"\" });\n const tenantId = get(props, \"tenant.id\");\n const { errors, control, handleSubmit } = useForm();\n const { refetch: refetchNewClient } = useClientByPhone();\n\n const onSubmit = (newUser) => {\n const { phone_number } = newUser;\n refetchNewClient({ where: { mobilePhone: \"+1\" + phone_number } }).then(\n (response) => {\n const client = get(response, \"data.allClients\")[0];\n if (client) {\n setItem(\"login_user\", \"existing_user\");\n getCode(tenantId, client.id, client);\n } else {\n onSetError({ active: true, messageError: \"\" });\n }\n }\n );\n };\n const getCode = (tenantId, clientid, client) => {\n APIUtil.getSMSCode(tenantId, clientid).then(() => {\n props.history.push(\"/create-account/account-verification\", { client });\n });\n };\n return (\n \n \n 
\n \n Contact support\n
\n \n \n support@certifid.com\n
\n 1-616-816-1668\n \n
\n \n 1-616-816-1668\n \n
{moment(a).format(DEFAULT_DATE_FORMAT)}
;\n },\n sorter: (a, b) => new Date(a.createdAt) - new Date(b.createdAt),\n defaultSortOrder: \"descend\",\n },\n {\n title: \"FROM\",\n dataIndex: \"tenant\",\n render: (text) =>{text?.name ?? emptyValue}
,\n sorter: (a, b) =>\n (a?.tenant?.name ?? \"\").localeCompare(b?.tenant?.name ?? \"\"),\n }, \n {\n title: \"REFERENCE\",\n dataIndex: \"transfer\",\n render: (text) =>{text?.propertyAddress1 ?? emptyValue}
,\n sorter: (a, b) =>\n (a?.transfer?.propertyAddress1 ?? \"\").localeCompare(\n b?.transfer?.propertyAddress1 ?? \"\"\n ),\n },\n {\n title: \"TYPE\",\n dataIndex: \"type\",\n render: (text) =>{messageKey[text]}
,\n sorter: (a, b) => (a?.type ?? \"\").localeCompare(b?.type ?? \"\"),\n },\n\n {\n title: \"DOWNLOAD\",\n dataIndex: \"messageURL\",\n render: (text) => {\n return (\n