import { FC } from 'react';
import { isMobile } from 'react-device-detect';

import { Button } from 'antd';
import { DeleteOutlined, EditOutlined } from '@ant-design/icons';

import styles from '../Document.module.scss';


interface CardActionButtonsProps {
  onDelete: () => void;
  onEdit: () => void;
}

const CardActionButtons: FC<CardActionButtonsProps> = ({
  onDelete,
  onEdit,
}) => {
  return (
    <div
      className={styles.buttons}
      style={
        isMobile ? undefined : { right: 10, top: 10 }
      }
    >
      <Button icon={<DeleteOutlined />} type='primary' className={styles.button} onClick={onDelete}>
        Видалити
      </Button>
      <Button icon={<EditOutlined />} type='primary' className={styles.button} onClick={onEdit}>
        Редагувати
      </Button>
    </div>
  );
};

export default CardActionButtons;