import { useQuery } from "@apollo/client";
import React, { useContext } from "react";
import { QUERY_SEARCH_OWNER_BY_IDX } from "../../graphql/owners.queries";
import JobCreateContext from "../../pages/jobs-create/jobs-create.context";
import AlertComponent from "../alert/alert.component";
import JobsCreateOwnerInfoComponent from "./jobs-create-owner-info.component";

export default function JobsCreateOwnerContainer() {
  const [state] = useContext(JobCreateContext);
  const { loading, error, data } = useQuery(QUERY_SEARCH_OWNER_BY_IDX, {
    variables: { search: `%${state.owner.search}%` },
    skip: !state.owner.search,
    fetchPolicy: "network-only",
    nextFetchPolicy: "network-only"
  });

  if (error) return <AlertComponent message={error.message} type="error" />;
  return <JobsCreateOwnerInfoComponent loading={loading} owners={data ? data.search_owners : null} />;
}