35 lines
962 B
TypeScript
35 lines
962 B
TypeScript
import React, { FunctionComponent } from 'react';
|
|
import { User } from '../../types/user';
|
|
|
|
export interface MembersPanelProps {
|
|
users: User[]
|
|
}
|
|
|
|
export const MembersPanel: FunctionComponent<MembersPanelProps> = ({ users }) => {
|
|
return (
|
|
<nav className="panel">
|
|
<p className="panel-heading">
|
|
Membres
|
|
</p>
|
|
{
|
|
users.map(u => {
|
|
return (
|
|
<div key={`user-${u.id}`} className="panel-block">
|
|
<span className="panel-icon">
|
|
<i className="fas fa-user" aria-hidden="true"></i>
|
|
</span>
|
|
<span>{`${ u.name ? u.name : '' } - `}</span><span className="is-italic">{`${u.email}`}</span>
|
|
</div>
|
|
);
|
|
})
|
|
}
|
|
{
|
|
users.length === 0 ?
|
|
<a className="panel-block has-text-centered is-block">
|
|
<p className="is-italic">Aucun membre pour l'instant.</p>
|
|
</a> :
|
|
null
|
|
}
|
|
</nav>
|
|
);
|
|
} |