\n {rbLogo}\n {syndicatorLogo}\n
\n \n
\n );\n};\n","import React from \"react\";\nimport {default as NumberFormat} from \"react-number-format\";\nimport {IBasicListingInfo, IQALAgent} from \"../quick_apply_link\";\nimport {\n formatBathsCount,\n formatBedroomCount,\n formatCurrencyWithoutDecimals,\n formatNumberWithCommas\n} from \"../../lm_insurance/common/quote\";\nimport {BedroomIcon, CalendarIcon, DollarIcon, ShowerIcon, SqFtIcon} from \"../../../../assets/icons/QALIcons\";\nimport {isMobile} from \"../../../utils/device_info\";\nimport {imgUrl} from \"../../../../services/constants\";\n\ninterface IAgent {\n agent: IQALAgent;\n listingInfo: IBasicListingInfo;\n}\n\nexport const ListingAgent = (props: IAgent) => {\n const {email, phone, full_name, broker_logo, brokerage_name} = props.agent;\n const {date_available, rent, beds, baths, sqft, description} = props.listingInfo;\n\n const agentPhone = () => {\n if (phone) {\n const phoneValue = phone.replace(/\\D/g, '')\n return phoneValue.length === 11 && phoneValue.startsWith('1') ? phoneValue.slice(1) : phoneValue\n }\n\n }\n\n const hasBrokerLogo = !(broker_logo === undefined || broker_logo === null || broker_logo === '')\n\n const ListingAgentImg = () => {\n if (hasBrokerLogo) {\n return Your Agent
\n \n {\n isMobile() &&\n Your agent is excited to share the following listing with you. Use the form to initiate your rental application.\n
\n }\n \n 
\n
\n }\n }\n const listingAgentInfo = () => {\n return \n \n {\n ListingAgentImg()\n }\n \n
\n }\n\n const listingAvailableDate = () => {\n const [month, day, year] = date_available.split('-');\n const shortYear = `${parseInt(year, 10) % 100}`.padStart(2, '0');\n return `${month}/${day}/${shortYear}`;\n }\n\n // @ts-ignore\n return (\n \n {!isMobile() &&
\n );\n};\n","import React from \"react\";\nimport {QALApplyNowInverseIcon, QALEmailIcon, QALPhoneIcon} from \"../../../../assets/icons/QALIcons\";\nimport {privacyPolicyURL, termsOfUseURL} from \"../../../../services/constants\";\n\nconst QALFooter = () => {\n return (\n \n );\n};\n\nexport default QALFooter;\n","import React, {useEffect, useState} from \"react\";\nimport {IQALApplicant, IQALListing} from \"../hooks/listing\";\nimport {imgUrl} from \"../../../../services/constants\";\nimport {AddApplicantIcon, EditApplicantIcon, QALTrashIcon} from \"../../../../assets/icons/QALIcons\";\nimport {userEmailApi} from \"../../../../services/rails_api/user/email\";\nimport {IAffiliateReferral, IQALApplication} from \"../quick_apply_link\";\nimport validator from \"validator\"\nimport Col from \"react-bootstrap/Col\";\nimport { Form } from \"react-bootstrap\";\nimport { applyNowComplianceApi } from '../../../../services/api/apply_now_compliance';\nimport { ApplyNowBlockedPopupModal } from '../../listing_management/components/edit_listing/components/apply_now_blocked_popup_modal';\n\ninterface IRentalApplication {\n listing: IQALListing;\n application: IQALApplication;\n setApplication: any;\n affiliateReferral?: IAffiliateReferral\n}\n\ninterface IApplicantFormError {\n fullName?: string;\n phone?: string;\n email?: string;\n verifyEmail?: string;\n}\n\nconst validateUser = (applicant: IQALApplicant) => {\n const applicantErrors: IApplicantFormError = {};\n const nameRegex = /^[A-Za-z ,.'-]{2,50}$/;\n\n // Full name validation\n let fullNameValue = applicant.fullName.trim();\n if (!fullNameValue) {\n applicantErrors.fullName = 'Full name is required';\n } else if(!nameRegex.test(fullNameValue)) {\n applicantErrors.fullName = 'Full Name should only contain letters, commas, periods, spaces, single quotes, hyphens and must be between 2 and 50 characters long';\n } else {\n const nameParts = fullNameValue.split(/\\s+/);\n if (nameParts.length < 2) {\n applicantErrors.fullName = 'Please include both first and last name';\n } else {\n applicant.first_name = nameParts.slice(0, -1).join(' ');\n applicant.last_name = nameParts[nameParts.length - 1];\n }\n }\n\n let phoneValue = applicant.phone.trim();\n if (!phoneValue) {\n applicantErrors.phone = 'Phone number is required';\n } else if (!/^\\d+$/.test(phoneValue)) {\n applicantErrors.phone = 'Phone number must contain only digits';\n } else if(!validator.isMobilePhone(phoneValue, \"en-US\")) {\n applicantErrors.phone = 'Phone number is invalid'\n }\n\n // Email validation\n let emailValue = applicant.email.trim()\n if (!emailValue) {\n applicantErrors.email = 'Email is required';\n } else if (!/\\S+@\\S+\\.\\S+/.test(emailValue)) {\n applicantErrors.email = 'Please enter a valid email';\n }\n\n // Verify email validation\n let verifyEmailValue = applicant.verifyEmail.trim()\n if (!verifyEmailValue) {\n applicantErrors.verifyEmail = 'Verify Email is required';\n } else if (emailValue.toLowerCase() !== verifyEmailValue.toLowerCase()) {\n applicantErrors.verifyEmail = 'Emails do not match';\n }\n\n return applicantErrors;\n};\n\nexport const RentalApplication = (props: IRentalApplication) => {\n const { street_address, unit_no, city, state, thumbnail, zip, listing_id, partner_id } = props.listing\n const fullname = props.affiliateReferral.firstname && props.affiliateReferral.lastname ?\n `${props.affiliateReferral.firstname} ${props.affiliateReferral.lastname}` : ''\n const [applicants, setApplicants] = useStateListing Agent
}\n\n {\n !isMobile() && listingAgentInfo()\n }\n
\n \n
\n \n
\n \n Available: {listingAvailableDate()}\n
\n \n
\n {formatCurrencyWithoutDecimals(rent)}
\n \n
\n {formatBedroomCount(beds)}
\n \n
\n {formatBathsCount(baths)}
\n \n
\n {formatNumberWithCommas(sqft)} Sq.Ft.
\n \n
\n\n Overview
\n {description}\n\n \n Rental Beast is a rental marketplace and does not own or manage this unit.\n \n
\n\n \n {isMobile() &&
\n Listing Agent
}\n {\n isMobile() && listingAgentInfo()\n }\nComplete Applicant {index + 1} info
\n ))\n }\n // console.log('listing_id', listing_id);\n // console.log('partner_id', partner_id);\n\n const initApplyNowCompliance = async () => {\n const applyNowComplianceParams = {\n partnerId : partner_id,\n listing_id: listing_id,\n };\n const applyNowCompliance = await applyNowComplianceApi.get(applyNowComplianceParams);\n //console.log('applyNowComplianceRules', applyNowCompliance);\n setApplyNowBlocked(applyNowCompliance.rules?.apply_now_blocked);\n\n };\n\n useEffect(() => {\n if (listing_id && partner_id) {\n initApplyNowCompliance();\n }\n }, [listing_id, partner_id])\n\n return (\n\n
\n {street_address}{unit_no && `, ${unit_no}`}{`, ${city}, ${state}. ${zip}`}\n
\n \n {/* Left part - Single Image */}\n => {\n const url = `/api/user/email/${email}`;\n return await REST.get(url,).then(res => {\n return res;\n });\n },\n};","import {HttpRequest} from \"../../../../services/httprequest\";\n\nexport class listingServiceApi {\n static async get(params: IListingServiceApiGetParams) {\n return HttpRequest.get(`/apply_now/listing?syndicator_property_id=${params.syndicator_property_id}&syndicator_access_key=${params.syndicator_access_key}`)\n .then((response) => response.data)\n .catch((error) => {\n return error.response\n });\n }\n static async getPartnerListing (params: IGetPartnerListingParams) {\n let url = `/apply_now/partner_listing?`;\n url += `syndicator_access_key=${params.syndicator_access_key}`;\n url += `&partner_id=${params.partner_id}`;\n url += `&mls_id=${params.listing_id}`;\n\n if(params.buyers_agent_id){\n url += `&buyers_agent_id=${params.buyers_agent_id}`;\n }\n else {\n url += `&buyers_agent_id=`;\n }\n return HttpRequest.get(url)\n .then((response) => response.data)\n .catch((error) => {\n return error.response\n });\n }\n static async save (listing: any) {\n return HttpRequest.post(\"/free_tenant_screening/property\", {listing, landlord: listing.landlord})\n .then((response) => response.data.data)\n .catch((error) => Promise.reject(error.response));\n }\n}\n\ninterface IListingServiceApiGetParams {\n syndicator_property_id: any,\n syndicator_access_key: string\n}\n\ninterface IGetPartnerListingParams {\n syndicator_access_key: any,\n partner_id: any,\n listing_id: any,\n buyers_agent_id: any\n}","import {REST} from \"../../rest\";\n\nexport const affiliateReferralApi = {\n\n get : async (params: IGetAffiliateReferralParams) => {\n const url = `/api/affiliate_referral?affiliate_referral_id=${params.affiliate_referral_id}`;\n return await REST.get(url,\n {\n headers: {\n 'Content-Type': 'multipart/form-data'\n },\n params: params\n }).then(res => {\n return res.data.affiliateReferralsRequest;\n });\n },\n};\n\nexport interface IGetAffiliateReferralParams {\n affiliate_referral_id: string;\n}"],"sourceRoot":""}
\n 
\n
\n\n {/* Right part - User form */}\n \n \n
\n\n {/* Modal for adding/editing applicants */}\n {showModal && (\n Start Your Rental Application
\nProvide your contact information below to begin your rental\n application. To add a roommate, click “Add Applicants”. To\n continue, click “Apply Now”.
\n \n\n
\n );\n};\n","import {REST} from \"../../rest\";\n\nexport const userEmailApi = {\n get: async (email: string): Promise\n \n }\n
\n \n ×\n {applicants.map((applicant, index) => (\n
\n )}\n {\n isModalOpen && \n \n \n \n \n {\n index > 0 &&\n \n }\n \n \n\n \n \n handleInputChange(index, e)}\n className=\"input-field\"\n />\n {touchedFields[index]?.fullName && errors[index]?.fullName &&\n \n \n handleInputChange(index, e)}\n className=\"input-field\"\n />\n {touchedFields[index]?.phone && errors[index]?.phone && \n \n\n \n \n handleInputChange(index, e)}\n className=\"input-field\"\n />\n {touchedFields[index]?.email && errors[index]?.email && \n \n handleInputChange(index, e)}\n className=\"input-field\"\n />\n {touchedFields[index]?.verifyEmail && errors[index]?.verifyEmail &&\n \n \n\n {\n (index !== applicants.length - 1) && \n \n \n \n \n\n \n \n \n \n \n \n \n \n
\n \n {\n index === 0 ? 'Primary Applicant' : `Applicant ${index + 1}`\n }\n
\n{errors[index].fullName}
}\n\n{errors[index].phone}
}\n{errors[index].email}
}\n{errors[index].verifyEmail}
}\n\n }\n
\n ))}\n