import React, { useState } from "react";
import PropTypes from "prop-types";
import { useDispatch } from "react-redux";

import { addPolochon } from "../../actions/polochon";

import { PolochonEdit } from "./edit";

export const PolochonAdd = () => {
  const dispatch = useDispatch();
  const [modal, setModal] = useState(false);

  return (
    <React.Fragment>
      <div className="btn btn-primary" onClick={() => setModal(true)}>
        <i className="fa fa-plus mr-2" />
        Add new polochon
      </div>

      <PolochonEdit
        title="Add a new polochon"
        icon="plus"
        show={modal}
        setShow={setModal}
        update={(params) => dispatch(addPolochon(params))}
      />
    </React.Fragment>
  );
};
PolochonAdd.propTypes = {
  addPolochon: PropTypes.func,
};