function renderDirects()

in src/contactCard/OrgDetails.tsx [62:85]


function renderDirects(directs: IPersonaProfile[] | undefined, onPersonaClick: (profile: IPersonaProfile) => void): React.ReactNode {
    if (!directs || !directs.length) {
        return <></>;
    }

    let key = 0;
    return (
        <>
            <div className="hierarchy-splitter" />
            <li className="directs">
                <Label className="directs-label">Direct reports ({directs.length})</Label>
                <ul>
                    {directs.map(direct => (
                        <li key={key++}>
                            <ActionButton className="person direct" onClick={() => onPersonaClick(direct)}>
                                <Persona
                                    id={direct.id}
                                    displayName={direct.displayName}
                                    showMode={PersonaShowMode.NameTitle}
                                    size={PersonaSize.size48}
                                />
                            </ActionButton>
                        </li>
                    ))}