import { Tooltip } from 'antd'
import { memo } from 'react'

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

export type PermissionViewProps = {
    info?: PermissionDto
}

export const PermissionView = memo<PermissionViewProps>(({ info }) => info ? (
    <Tooltip overlayInnerStyle={{ width: '400px' }} title={
        <Grid>
            <GridItem row={1} col={1}>Название:</GridItem>
            <GridItem row={1} col={2}>{info.name}</GridItem>

            <GridItem row={2} col={1}>Описание:</GridItem>
            <GridItem row={2} col={2}>{info.description}</GridItem>
        </Grid>
    }>
        {info.name}
    </Tooltip>
) : (
    <Tooltip title={'нет данных'}>-</Tooltip>
))


export default PermissionView
