import React from 'react';
import { useHistory } from 'react-router-dom';
import Button from '../../components/Button';
import { patch, baseURL } from '../../requests';
import { PanelProps } from '../../containers/Service/ServiceContext';


const ContractorPanel: React.FC<PanelProps> = ({ item, mutate }) => {
  const history = useHistory();

  return (
    <div className="lg:m-4 p-4 flex flex-col lg:pl-16 lg:border-l">
      <span className="text-lg mb-10">
        Долг контрагента: <span className="font-bold">{item.debt}</span>
      </span>
      <div className="grid lg:grid-cols-2">
        <Button route={`/waybills?contractorId=${item._id}`} variant="outlined">
          Показать накладные
        </Button>
        <Button route={`/waybills/add?contractorId=${item._id}`}>
          Новая накладная
        </Button>
        <Button route={`/transfers?contractorId=${item._id}`} variant="outlined">
          Показать переводы
        </Button>
        <Button route={`/transfers/add?contractorId=${item._id}`}>
          Новый перевод
        </Button>
      </div>
    </div>
  );
};

export default ContractorPanel;