130 inc batch async

Add code to batch page to send job number to batch app.

src/components/services/Batch.js

@@ -8,7 +8,7 @@ import LoadingSpinner from "../LoadingSpinner";
 
 export default  function Batch() {
 
-  const {batchSystemURL, setBatchSystemURL, workflowURL, setWorkflowURL, list_of_workflows, setList_of_workflows, list_of_batchSystems, setList_of_batchSystems} = useContext(BATCHContext);
+  const {batchSystemURL, setBatchSystemURL, workflowURL, setWorkflowURL, list_of_workflows, setList_of_workflows, list_of_batchSystems, setList_of_batchSystems, list_job_results, setList_job_results} = useContext(BATCHContext);
   const { api_host } = useContext(GlobalContext);
 
   const [defaultWorkflow] = "https://github.com/ESAP-WP5/binder-empty";
@@ -82,6 +82,15 @@ export default  function Batch() {
    {/* TODO This will have to go off to the Async and create a ESAP worker job?? */}
    const onClickFindJob = e => {
      e.preventDefault();
+     axios
+      .get(api_host + "batch/worker/query?jobID=" + jobValues.jobID)
+        .then((response) => {
+          console.log(response.data);
+          setList_job_results(response.data);
+         })
+         .catch(function (error) {
+           console.log("Error when quering batch app api with job number");
+         });
      setState(prev => ({...prev, showMonitor: true, showSubmit: false, showJobStatus: true}));
    }
 
@@ -168,6 +177,8 @@ export default  function Batch() {
     //const workflow_results_sliced = workflow_results?.slice(0, state.numberOfitemsShown) || "";
     const workflow_results_sliced = workflow_results;
 
+    const job_results = list_job_results;
+
   return (
 
 
@@ -195,16 +206,18 @@ export default  function Batch() {
 
        <br/><br/>
 
+
         <input
              type="text"
              className="advanced-float-left"
              placeholder="Job ID Number"
              onChange={handleJobIDChange}
+             autoComplete="off"
          />
 
-       <br/><br/>
-         <Button onClick={onClickFindJob} className="search-button">Find Batch Jobs </Button>
-       <br/><br/>
+         <br/><br/>
+           <Button onClick={onClickFindJob} className="search-button">Find Batch Jobs </Button>
+         <br/><br/>
 
          {/* If find batch jobs button pressed do/show this:  */}
          {/* TODO This will be where the magic happens and information from Async is returned */}
@@ -212,7 +225,7 @@ export default  function Batch() {
             <div className="advanced-search">
                Job ID: {jobValues.jobID}
                <br/>
-               Job Status: Complete
+               Job Status: {job_results.phase}
             </div>
           : null }