import {Tooltip} from 'antd'
import { UserOutlined } from '@ant-design/icons'
import '../styles/grid.css'

export const UserView = ({user}) => {
  if(!user)
    return <Tooltip title='нет пользователя'>-</Tooltip>

  const displayName = user?.login

  const tooltipInfo = <div className='grid_container'>
    <div className='c1 r1'>
      Имя
    </div>
    <div className='c2 r1'>
      {user?.name}
    </div>
    <div className='c1 r2'>
      Фамилия
    </div>
    <div className='c2 r2'>
      {user?.surname}
    </div>
    <div className='c1 r3'>
      Отчество
    </div>
    <div className='c2 r3'>
      {user?.patronymic}
    </div>
  </div>

  return <Tooltip title={tooltipInfo}>
    <UserOutlined/>
    {displayName}
  </Tooltip>
  
}