In Progress work for Jobs Form.

client/src/pages/jobs-detail/jobs-detail.page.jsx

@@ -1,5 +1,29 @@
 import React from "react";
+import { useSubscription } from "@apollo/react-hooks";
+import SpinComponent from "../../components/loading-spinner/loading-spinner.component";
+import AlertComponent from "../../components/alert/alert.component";
+import JobTombstone from "../../components/job-tombstone/job-tombstone.component";
+import { GET_JOB_BY_PK } from "../../graphql/jobs.queries";
+import { Breadcrumb } from "antd";
 
-export default function JobsDetail({ jobId }) {
-  return <div>Jobs Detail Page - Job ID {jobId}</div>;
+import Test from "./test";
+
+export default function JobsDetailPage({
+  match: { routes, params, children }
+}) {
+  const { jobId } = params;
+  const { loading, error, data } = useSubscription(GET_JOB_BY_PK, {
+    variables: { id: jobId },
+    fetchPolicy: "network-only"
+  });
+  if (loading) return <SpinComponent />;
+  if (error) return <AlertComponent message={error.message} type="error" />;
+
+  console.log('routes', routes)
+  return (
+    <div>
+      <Breadcrumb routes={routes} params={params} />
+      <JobTombstone job={data.jobs_by_pk} />
+    </div>
+  );
 }