import {Tooltip, Tag, Typography, Popconfirm, Button } from 'antd'
import {UserView} from './UserView'

const markTypes = {
  0 : {color:"orange", text : "неизвестно"},
  1 : {color:"green", text : "согласовано"},
}

const {Text} = Typography

export const Mark = ({mark, onDelete}) => {
  const markType = markTypes[mark.idMarkType]??markTypes[0]
  return <Tooltip title={<UserView user={mark.user}/>}>
    <Tag color={markType.color}>
      <Text delete={mark?.isDeleted}>
        {`${markType.text} ${new Date(mark.dateCreated).toLocaleString()}`}
      </Text>
      {(!mark?.isDeleted)&&
        <Popconfirm title="Отозвать согласование?" onConfirm={onDelete}>
          <Button type="link">x</Button>
        </Popconfirm>
      }
    </Tag >
  </Tooltip>
}