74 lines
2.9 KiB
JavaScript
74 lines
2.9 KiB
JavaScript
import React from 'react';
|
|
import { Star, Briefcase, Quote } from 'lucide-react';
|
|
import { verifiedExperience } from './VerifiedExperienceList';
|
|
export { verifiedExperience };
|
|
import { clientEndorsements } from '@/lib/talentInsights';
|
|
|
|
const ENDORSEMENT_ROLES = ['Event Director', 'Operations Lead', 'GM', 'Owner', 'HR Partner'];
|
|
|
|
function Stars({ count }) {
|
|
return (
|
|
<div className="flex items-center gap-0.5">
|
|
{Array.from({ length: 5 }).map((_, i) => (
|
|
<Star
|
|
key={i}
|
|
className={`w-3.5 h-3.5 ${i < count ? 'text-[#F59E0B] fill-[#F59E0B]' : 'text-[#E5E7EB]'}`}
|
|
/>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
// Consolidated Experience & Endorsements — one row per company combining the
|
|
// verified experience entry (shifts, supervisor, duration) with its client
|
|
// endorsement (role/title + rating). Falls back to seeded experience so the
|
|
// block always shows 3 rows.
|
|
export default function ExperienceEndorsements({ profile, onReference }) {
|
|
const jobs = verifiedExperience(profile);
|
|
if (jobs.length === 0) return null;
|
|
|
|
// Map endorsements by company for inline merge.
|
|
const endorsements = clientEndorsements(profile);
|
|
const byCompany = new Map(endorsements.map((e) => [e.company, e]));
|
|
|
|
return (
|
|
<div className="space-y-2">
|
|
{jobs.map((x, i) => {
|
|
const en = byCompany.get(x.company);
|
|
return (
|
|
<div
|
|
key={i}
|
|
className="rounded-xl border border-[#E5E7EB] bg-white px-3 py-2.5"
|
|
>
|
|
<div className="flex items-center justify-between gap-2">
|
|
<p className="text-[13px] font-semibold text-[#0F172A] truncate flex items-center gap-1.5 min-w-0">
|
|
<Briefcase className="w-3.5 h-3.5 text-[#9CA3AF] shrink-0" />
|
|
{x.company}
|
|
{x.role && <span className="text-[#6B7280] font-normal">· {x.role}</span>}
|
|
</p>
|
|
<div className="flex items-center gap-2 shrink-0">
|
|
<Stars count={x.stars} />
|
|
<button
|
|
onClick={() => onReference?.(x)}
|
|
className="hidden sm:inline-flex items-center gap-1 px-2.5 py-1 rounded-full border border-[#0A39DF] text-[#0A39DF] text-[11px] font-semibold hover:bg-[#EFF6FF] transition-colors"
|
|
>
|
|
Request Reference
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<p className="text-[11px] text-[#16A34A] font-medium mt-1 truncate">
|
|
{x.shifts} shifts · {x.supervisor}
|
|
{x.years != null && <span className="text-[#9CA3AF]"> · {x.years} yr</span>}
|
|
</p>
|
|
{en && (
|
|
<p className="text-[11px] text-[#6B7280] mt-1 flex items-center gap-1.5 truncate">
|
|
<Quote className="w-3 h-3 text-[#9CA3AF] shrink-0" />
|
|
<span className="italic">“{en.role}”</span>
|
|
</p>
|
|
)}
|
|
</div>
|
|
);
|
|
})}
|
|
</div>
|
|
);
|
|
} |