import React from "react";
import { useQuery, useMutation } from "react-apollo";
import {
  QUERY_AVAILABLE_NEW_JOBS,
  DELETE_AVAILABLE_JOB,
  DELETE_ALL_AVAILABLE_NEW_JOBS
} from "../../graphql/available-jobs.queries";
import AlertComponent from "../alert/alert.component";
import JobsAvailableComponent from "./jobs-available-new.component";

export default function JobsAvailableContainer() {
  const { loading, error, data, refetch } = useQuery(QUERY_AVAILABLE_NEW_JOBS, {
    fetchPolicy: "network-only"
  });
  const [deleteJob] = useMutation(DELETE_AVAILABLE_JOB);
  const [deleteAllNewJobs] = useMutation(DELETE_ALL_AVAILABLE_NEW_JOBS);

  if (error) return <AlertComponent type="error" message={error.message} />;
  return (
    <JobsAvailableComponent
      loading={loading}
      data={data}
      refetch={refetch}
      deleteJob={deleteJob}
      deleteAllNewJobs={deleteAllNewJobs}
    />
  );
}