import { useQuery } from "@apollo/react-hooks";
import React from "react";
import { GET_LINE_TICKET_BY_PK } from "../../graphql/jobs-lines.queries";
import AlertComponent from "../alert/alert.component";
import JobsDetailLaborComponent from "./jobs-detail-labor.component";

export default function JobsDetailLaborContainer({ jobId, techConsole }) {
  const { loading, error, data, refetch } = useQuery(GET_LINE_TICKET_BY_PK, {
    variables: { id: jobId },
    skip: !!!jobId,
  });

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

  return (
    <JobsDetailLaborComponent
      loading={loading}
      jobId={jobId}
      timetickets={data ? data.timetickets : []}
      joblines={data ? data.joblines : []}
      refetch={refetch}
      techConsole={techConsole}
    />
  );
}