feat: implement dynamic contact info and availability mapping from field values, and enhance phone number masking.
This commit is contained in:
@@ -19,14 +19,10 @@ import { ConnectRequestModal } from '@/components/modals';
|
||||
import { agentsService, AgentProfile, FieldValueResponse } from '@/services/agents.service';
|
||||
import { connectionRequestsService, ConnectionStatus } from '@/services/connection-requests.service';
|
||||
import { uploadService } from '@/services/upload.service';
|
||||
import { mapFieldValuesToExperience, mapFieldValuesToSpecializationFields, mapFieldValuesToProfileCard, ExperienceData, SpecializationFieldsData, ProfileCardData } from '@/utils/profileDataMapper';
|
||||
import { mapFieldValuesToExperience, mapFieldValuesToSpecializationFields, mapFieldValuesToProfileCard, mapFieldValuesToContactInfo, mapFieldValuesToAvailability, ExperienceData, SpecializationFieldsData, ProfileCardData, ContactInfoData, AvailabilityData } from '@/utils/profileDataMapper';
|
||||
|
||||
// Mock data for sections not yet available from API
|
||||
const mockData = {
|
||||
availability: {
|
||||
type: 'Full-time',
|
||||
days: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
|
||||
},
|
||||
preferredWorkEnvironment: 'Preferred work environment includes on-site property visits, in-depth market research, client consultations, property tours, and active involvement in negotiations to ensure the best outcomes',
|
||||
testimonialHighlight: "The most amazing experience I've had as a real estate professional is helping a family secure their dream home and seeing their happiness when they received the keys.",
|
||||
testimonials: [
|
||||
@@ -77,6 +73,18 @@ const defaultProfileCardData: ProfileCardData = {
|
||||
state: null,
|
||||
};
|
||||
|
||||
// Default contact info data when no field values are available
|
||||
const defaultContactInfoData: ContactInfoData = {
|
||||
email: null,
|
||||
phone: null,
|
||||
};
|
||||
|
||||
// Default availability data when no field values are available
|
||||
const defaultAvailabilityData: AvailabilityData = {
|
||||
type: '',
|
||||
schedule: [],
|
||||
};
|
||||
|
||||
export default function AgentProfileView() {
|
||||
const params = useParams();
|
||||
const id = params.id as string;
|
||||
@@ -87,6 +95,8 @@ export default function AgentProfileView() {
|
||||
const [experienceData, setExperienceData] = useState<ExperienceData>(defaultExperience);
|
||||
const [specializationFieldsData, setSpecializationFieldsData] = useState<SpecializationFieldsData>(defaultSpecializationFieldsData);
|
||||
const [profileCardData, setProfileCardData] = useState<ProfileCardData>(defaultProfileCardData);
|
||||
const [contactInfoData, setContactInfoData] = useState<ContactInfoData>(defaultContactInfoData);
|
||||
const [availabilityData, setAvailabilityData] = useState<AvailabilityData>(defaultAvailabilityData);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const [imageError, setImageError] = useState(false);
|
||||
@@ -136,6 +146,14 @@ export default function AgentProfileView() {
|
||||
const mappedProfileCard = mapFieldValuesToProfileCard(fieldValuesResponse.fieldValues);
|
||||
setProfileCardData(mappedProfileCard);
|
||||
|
||||
// Map field values to contact info data (email, phone)
|
||||
const mappedContactInfo = mapFieldValuesToContactInfo(fieldValuesResponse.fieldValues);
|
||||
setContactInfoData(mappedContactInfo);
|
||||
|
||||
// Map field values to availability data
|
||||
const mappedAvailability = mapFieldValuesToAvailability(fieldValuesResponse.fieldValues);
|
||||
setAvailabilityData(mappedAvailability);
|
||||
|
||||
// If avatar is an S3 key, fetch presigned URL
|
||||
if (profile.avatar && isS3Key(profile.avatar)) {
|
||||
try {
|
||||
@@ -304,8 +322,8 @@ export default function AgentProfileView() {
|
||||
|
||||
{/* Contact Info */}
|
||||
<ContactInfo
|
||||
email={agentProfile.email || agentProfile.user?.email || ''}
|
||||
phone={agentProfile.phone || ''}
|
||||
email={agentProfile.email || agentProfile.user?.email || contactInfoData.email || ''}
|
||||
phone={agentProfile.phone || contactInfoData.phone || ''}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -347,11 +365,17 @@ export default function AgentProfileView() {
|
||||
}
|
||||
content={
|
||||
<div>
|
||||
<p className="font-semibold font-serif text-[14px] leading-[19px] text-[#00293D] mb-2">{mockData.availability.type}</p>
|
||||
{availabilityData.type && (
|
||||
<p className="font-semibold font-serif text-[14px] leading-[19px] text-[#00293D] mb-2">{availabilityData.type}</p>
|
||||
)}
|
||||
<div className="space-y-1">
|
||||
{mockData.availability.days.map((day) => (
|
||||
<p key={day} className="font-normal font-serif text-[14px] leading-[19px] text-[#00293D]">{day}</p>
|
||||
))}
|
||||
{availabilityData.schedule.length > 0 ? (
|
||||
availabilityData.schedule.map((item, index) => (
|
||||
<p key={index} className="font-normal font-serif text-[14px] leading-[19px] text-[#00293D]">{item}</p>
|
||||
))
|
||||
) : (
|
||||
<p className="font-normal font-serif text-[14px] leading-[19px] text-[#00293D]/60">Not specified</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user