)}

{/* Top identity row — avatar on banner, name + meta below the cover */}

{company && ( )} {contact.position && · {contact.position}}

{contact.location}, contact.connectionsCount && <>{contact.connectionsCount.toLocaleString()} connections, contact.followerCount && <>{contact.followerCount.toLocaleString()} followers, contact.tenure && <>{contact.tenure} in role, ]} />

{/* ─── Left column: profile content ─── */}

{contact.about && } {contact.experience?.length > 0 && } {contact.education?.length > 0 && } {contact.skills?.length > 0 && } {contact.certifications?.length > 0 && } {contact.languages?.length > 0 && } {contact.volunteering?.length > 0 && ({ primary: v.role || v.organization, secondary: [v.organization, v.cause].filter(Boolean).join(" · "), period: v.period, })} />} {contact.projects?.length > 0 && ({ primary: p.name || p.title, secondary: p.description, period: p.period })} />} {contact.publications?.length > 0 && ({ primary: p.title || p.name, secondary: p.publisher, period: p.date?.text })} />} {contact.organizations?.length > 0 && ({ primary: o.name, secondary: o.position, period: o.period })} />} {contact.honorsAndAwards?.length > 0 && ({ primary: h.title || h.name, secondary: h.issuer || h.description, period: h.date?.text })} />} {contact.causes?.length > 0 && ( Causes & interests

{contact.causes.map((c, i) => {c})}

)}

{/* ─── Right column: relationship + contact info ─── */}

{contact.moreProfiles?.length > 0 && ( )}

); } /* ───── Reusable cards (this page only) ───── */ function AboutCard({ text }) { const [open, setOpen] = useStateCD(false); const truncated = text.length > 360; const display = open || !truncated ? text : text.slice(0, 340).trim() + "…"; return ( About

{display}

{truncated && ( )} ); } function ExperienceCard({ items }) { return ( {items.length} positions}> Experience

{items.map((e, i) => (

{e.companyLogo ?

: }

{e.position}

{e.company}

{e.period}{e.duration ? ` · ${e.duration}` : ""}

{(e.location || e.workplaceType || e.employmentType) && (

{[e.location, e.workplaceType, e.employmentType].filter(Boolean).join(" · ")}

)} {e.skills?.length > 0 && (

{e.skills.slice(0, 6).map((s, j) => ( {s} ))}

)} {e.description && (

{e.description}

)}

))}

); } function EducationCard({ items }) { return ( {items.length} schools}> Education

{items.map((e, i) => (

{e.schoolLogo ?

: }

{e.school}

{[e.degree, e.field].filter(Boolean).join(" · ")}

{e.period &&

{e.period}

} {e.description && (

{e.description}

)}

))}

); } function SkillsCard({ items }) { const [expanded, setExpanded] = useStateCD(false); const shown = expanded ? items : items.slice(0, 8); const more = items.length - shown.length; return ( {items.length} skills}> Skills

{shown.map((s, i) => (

{s.name}

{s.positions?.length > 0 && (

{s.positions[0]}{s.positions.length > 1 ? ` · +${s.positions.length - 1} more` : ""}

)}

{s.endorsements && ( {String(s.endorsements).replace(/ endorsements?/i, "")} )}

))}

{more > 0 && ( )} ); } function CertificationsCard({ items }) { return ( {items.length}}> Certifications & licenses

{items.map((c, i) => (

{c.name || c.title}

{c.issuer || c.authority}

{(c.issueDate || c.expirationDate || c.period) && (

{c.period || [c.issueDate?.text || c.issueDate, c.expirationDate?.text || c.expirationDate] .filter(Boolean).join(" — ")}

)}

))}

); } function LanguagesCard({ items, fallback }) { /* Pill rows per language with a proficiency strength dot scale. */ const STRENGTH = { "native or bilingual proficiency": 5, "full professional proficiency": 4, "professional working proficiency": 3, "limited working proficiency": 2, "elementary proficiency": 1, }; const list = items?.length ? items : (fallback || []).map(s => ({ name: s, proficiency: "" })); return ( Languages

{list.map((l, i) => { const s = STRENGTH[(l.proficiency || "").toLowerCase()] || 0; return (

{l.name}

{l.proficiency}

{s > 0 && (

{[1,2,3,4,5].map(d => ( ))}

)}

); })}

); } function SimpleListCard({ title, items, render }) { return ( {items.length}}> {title}

{items.map((it, i) => { const r = render(it) || {}; return (

{r.primary &&

{r.primary}

} {r.secondary &&

{r.secondary}

} {r.period &&

{r.period}

}

); })}

); } function RelationshipCard({ contact }) { return ( Relationship intelligence

{contact.abm.persona} {contact.abm.buyingCommitteeRole.replace(/_/g, " ")}

{contact.abm.weakBuyingSignals?.length > 0 && (

Buying signals

{contact.abm.weakBuyingSignals.map((s, i) => {s})}

)} {contact.abm.recommendedNextAction && (

{contact.abm.recommendedNextAction}

)} ); } function ContactInfoCard({ contact }) { const rows = []; (contact.emails || []).forEach((e, i) => { rows.push({ icon: "mail", label: i === 0 ? "Email" : "Email (alt)", val: ( {e.email} {e.status} {typeof e.qualityScore === "number" && ( q{e.qualityScore} )} ), }); }); if (contact.linkedinUrl) rows.push({ icon: "linkedin", label: "LinkedIn", val: {contact.linkedinUrl.replace(/^https?:\/\/(www\.)?/, "")} , }); (contact.companyWebsites || []).forEach(w => rows.push({ icon: "external", label: "Company web", val: {w.domain}, })); if (contact.locationCity || contact.locationCountry) rows.push({ icon: "map-pin", label: "Location", val: [contact.locationCity, contact.locationCountry].filter(Boolean).join(", "), }); if (rows.length === 0) return null; return ( Contact info

{rows.map((r, i) => (

{r.label}

{r.val}

))}

); } function ProfileMetaCard({ contact, raw }) { const composeLabel = ({ UPSELL: "Connection slot open (Upsell)", PREMIUM_INMAIL: "Premium InMail recommended", })[contact.composeOptionType] || contact.composeOptionType; return ( Profile

{contact.composeOptionType && ( {composeLabel} } /> )} {contact.registeredAt && {window.fmtDate(contact.registeredAt, { month: "short", year: "numeric" })}} />} {contact.updatedAt && {window.fmtRelative(contact.updatedAt)}} />} {raw?.primaryLocale && {raw.primaryLocale.language}-{raw.primaryLocale.country}} />} {raw?._meta?.pagination && ( {raw._meta.pagination.totalElements?.toLocaleString()} results · page {raw._meta.pagination.pageNumber} } /> )}

); } function Row({ label, value }) { return (

{label} {value}

); } function SimilarProfilesCard({ items, onNavigate }) { return ( {items.length}}> People also viewed

{items.slice(0, 6).map((p, i) => { const pic = window.pickPicture ? window.pickPicture(p.profilePicture, 100) : (p.profilePicture?.url || null); return (

{p.firstName} {p.lastName}

{p.headline && (

{p.headline}

)}

); })}

); } window.PageContactDetail = PageContactDetail;