import React from "react";

import { useQuery } from "@apollo/client";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { QUERY_BILLS_BY_JOBID } from "../../graphql/bills.queries";
import { selectJobReadOnly } from "../../redux/application/application.selectors";
import { selectBodyshop } from "../../redux/user/user.selectors";
import AlertComponent from "../alert/alert.component";
import JobBillsTotalComponent from "../job-bills-total/job-bills-total.component";
const mapStateToProps = createStructuredSelector({
  //currentUser: selectCurrentUser
  bodyshop: selectBodyshop,
  jobRO: selectJobReadOnly
});
const mapDispatchToProps = (dispatch) => ({
  //setUserLanguage: language => dispatch(setUserLanguage(language))
});
export default connect(mapStateToProps, mapDispatchToProps)(JobCloseRoGuardBills);

export function JobCloseRoGuardBills({ job, jobRO, bodyshop, form, warningCallback }) {
  const { loading, error, data } = useQuery(QUERY_BILLS_BY_JOBID, {
    variables: { jobid: job.id },
    fetchPolicy: "network-only",
    nextFetchPolicy: "network-only"
  });

  if (error) return <AlertComponent message={error.message} type="error" />;

  return (
    <JobBillsTotalComponent
      loading={loading}
      bills={data ? data.bills : []}
      partsOrders={data ? data.parts_orders : []}
      jobTotals={job.job_totals}
      showWarning
      warningCallback={warningCallback}
    />
  );
}
