import { useQuery } from "@apollo/client";
import React from "react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
import AlertComponent from "../alert/alert.component";
import ContractJobsComponent from "./contract-jobs.component";
import { QUERY_ALL_ACTIVE_JOBS } from "../../graphql/jobs.queries";

const mapStateToProps = createStructuredSelector({
  //currentUser: selectCurrentUser
  bodyshop: selectBodyshop,
});
export function ContractJobsContainer({ selectedJobState, bodyshop }) {
  const { loading, error, data } = useQuery(QUERY_ALL_ACTIVE_JOBS, {
    variables: {
      statuses: bodyshop.md_ro_statuses.active_statuses || ["Open"],
    },
  });
  const [selectedJob, setSelectedJob] = selectedJobState;

  const handleSelect = (record) => {
    setSelectedJob(record.id);
  };

  if (error) return <AlertComponent message={error.message} type="error" />;
  return (
    <ContractJobsComponent
      handleSelect={handleSelect}
      selectedJob={selectedJob}
      loading={loading}
      data={data ? data.jobs : []}
    />
  );
}
export default connect(mapStateToProps, null)(ContractJobsContainer);
