import { memo } from 'react'
import { Tooltip } from 'antd'
import { BankOutlined } from '@ant-design/icons'

import { CompanyDto } from '../../services/api'
import { Grid, GridItem } from '../Grid'

export type CompanyViewProps = {
  company?: CompanyDto
}

export const CompanyView = memo<CompanyViewProps>(({ company }) => company ? (
  <Tooltip title={
    <Grid style={{ columnGap: '8px' }}>
      <GridItem row={1} col={1}>Тип:</GridItem>
      <GridItem row={1} col={2}>{company?.companyTypeCaption}</GridItem>
    </Grid>
  }>
    <BankOutlined style={{ marginRight: 8 }}/>
    {company?.caption}
  </Tooltip>
) : (
  <Tooltip title='нет данных'>-</Tooltip>
))
