import { memo } from 'react';

import { type User } from 'src/types/user';
import { getFullName } from 'src/utils/userUtils';

type SelectedUsersTooltipListProps = {
  users: User[];
};

const SelectedUsersTooltipList = ({ users }: SelectedUsersTooltipListProps) => (
  <ul style={{ margin: 0, paddingLeft: 16 }}>
    {users.map(user => (
      <li key={user.id}>{getFullName(user)}</li>
    ))}
  </ul>
);

export default memo(SelectedUsersTooltipList);
