feat: implement dynamic work environment section and improve availability data mapping with backend-resolved labels

This commit is contained in:
pradeepkumar
2026-04-14 09:07:37 +05:30
parent 1eccde73e3
commit dc2b279947
3 changed files with 114 additions and 73 deletions

View File

@@ -21,11 +21,12 @@ import { connectionRequestsService } from '@/services/connection-requests.servic
import { uploadService } from '@/services/upload.service';
import { usersService } from '@/services/users.service';
import { testimonialsService, Testimonial } from '@/services/testimonials.service';
import { mapFieldValuesToExperience, mapFieldValuesToProfileCard, mapFieldValuesToAvailability, mapFieldValuesToSpecializationFields, mapFieldValuesToContactInfo, ExperienceData, ProfileCardData, AvailabilityData, SpecializationFieldsData, ContactInfoData } from '@/utils/profileDataMapper';
import { mapFieldValuesToExperience, mapFieldValuesToProfileCard, mapFieldValuesToAvailability, mapFieldValuesToSpecializationFields, mapFieldValuesToContactInfo, mapFieldValuesToWorkEnvironment, ExperienceData, ProfileCardData, AvailabilityData, SpecializationFieldsData, ContactInfoData, WorkEnvironmentData } from '@/utils/profileDataMapper';
// Mock data for sections not yet available from API
const mockData = {
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',
// Default work environment data
const defaultWorkEnvironmentData: WorkEnvironmentData = {
label: 'Preferred Work Environment',
content: '',
};
// Default experience data when no field values are available
@@ -59,6 +60,7 @@ const defaultProfileCardData: ProfileCardData = {
const defaultAvailabilityData: AvailabilityData = {
type: '',
schedule: [],
label: 'Availability',
};
// Default specialization fields data when no field values are available
@@ -79,6 +81,7 @@ export default function AgentDashboard() {
const [experienceData, setExperienceData] = useState<ExperienceData>(defaultExperience);
const [profileCardData, setProfileCardData] = useState<ProfileCardData>(defaultProfileCardData);
const [availabilityData, setAvailabilityData] = useState<AvailabilityData>(defaultAvailabilityData);
const [workEnvironmentData, setWorkEnvironmentData] = useState<WorkEnvironmentData>(defaultWorkEnvironmentData);
const [specializationFieldsData, setSpecializationFieldsData] = useState<SpecializationFieldsData>(defaultSpecializationFieldsData);
const [contactInfoData, setContactInfoData] = useState<ContactInfoData>(defaultContactInfoData);
const [loading, setLoading] = useState(true);
@@ -150,6 +153,10 @@ export default function AgentDashboard() {
const mappedAvailability = mapFieldValuesToAvailability(fieldValuesResponse.fieldValues);
setAvailabilityData(mappedAvailability);
// Map field values to work environment data
const mappedWorkEnv = mapFieldValuesToWorkEnvironment(fieldValuesResponse.fieldValues);
setWorkEnvironmentData(mappedWorkEnv);
// Map field values to specialization fields data (only fields from "Specialization" section)
const mappedSpecializationFields = mapFieldValuesToSpecializationFields(fieldValuesResponse.fieldValues);
setSpecializationFieldsData(mappedSpecializationFields);
@@ -452,11 +459,11 @@ export default function AgentDashboard() {
{/* Info Cards Section */}
<div className="flex flex-col lg:grid lg:grid-cols-3 gap-6">
<InfoCard
title="Availability"
title={availabilityData.label}
icon={
<Image
src="/assets/icons/availability-clock-icon.svg"
alt="Availability"
alt={availabilityData.label}
width={28}
height={31}
/>
@@ -478,18 +485,20 @@ export default function AgentDashboard() {
</div>
}
/>
<InfoCard
title=""
icon={
<Image
src="/assets/icons/work-environment-icon.svg"
alt="Work environment"
width={28}
height={28}
/>
}
content={<p className="font-serif font-semibold text-[14px] leading-[19px] text-[#00293D]">{mockData.preferredWorkEnvironment}</p>}
/>
{workEnvironmentData.content && (
<InfoCard
title={workEnvironmentData.label}
icon={
<Image
src="/assets/icons/work-environment-icon.svg"
alt={workEnvironmentData.label}
width={28}
height={28}
/>
}
content={<p className="font-serif font-semibold text-[14px] leading-[19px] text-[#00293D]">{workEnvironmentData.content}</p>}
/>
)}
{testimonials.length > 0 && (
<InfoCard
title=""