Removed a few container pages as we will be using hooks instead. Cleaned up a few debug statements.

client/src/pages/jobs/jobs.page.container.jsx

@@ -1,6 +0,0 @@
-import React from "react";
-import JobsPage from "./jobs.pages";
-
-export default function JobsPageContainer() {
-  return <JobsPage />;
-}

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

@@ -0,0 +1,82 @@
+import React from "react";
+import { useQuery } from "@apollo/react-hooks";
+//import { GET_ALL_OPEN_JOBS } from "../../graphql/jobs.queries";
+import { Table, Divider, Icon } from "antd";
+
+import { GET_ALL_OPEN_JOBS } from "../../graphql/jobs.queries";
+
+export default function JobsPage() {
+  const {
+    loading,
+    error,
+    data: { jobs }
+  } = useQuery(GET_ALL_OPEN_JOBS);
+
+  const columns = [
+    {
+      title: "RO #",
+      dataIndex: "ro_number",
+      key: "ro_number"
+    },
+    {
+      title: "Est. #",
+      dataIndex: "est_number",
+      key: "est_number"
+    },
+    {
+      title: "Status",
+      dataIndex: "status",
+      key: "status"
+    },
+    {
+      title: "Customer",
+      dataIndex: "customer",
+      key: "customer",
+      render: (text, record) => {
+        return record.owner ? (
+          <div>{record.owner.first_name + " " + record.owner.last_name}</div>
+        ) : (
+          "No Customer"
+        );
+      }
+    },
+    {
+      title: "Vehicle",
+      dataIndex: "vehicle",
+      key: "vehicle",
+      render: (text, record) => {
+        return record.vehicle ? record.vehicle.v_make_desc : "No Vehicle";
+      }
+    },
+    {
+      title: "Action",
+      key: "action",
+      render: (text, record) => (
+        <span>
+          <a>Action 一 {record.ro_number}</a>
+          <Divider type="vertical" />
+          <a>Delete</a>
+          <Divider type="vertical" />
+          <a className="ant-dropdown-link">
+            More actions <Icon type="down" />
+          </a>
+        </span>
+      )
+    }
+  ];
+
+  // if (loading) return <Spin />;
+  if (error) return `Error! ${error.message}`;
+  console.log("$$$Develop (jobs.page.jsx) | jobs", jobs);
+  return (
+    <div>
+      <Table
+        loading={loading}
+        pagination={{ position: "bottom" }}
+        columns={columns.map(item => ({ ...item }))}
+        rowKey="id"
+        dataSource={jobs ? jobs : null}
+      />
+    </div>
+  );
+}

client/src/pages/jobs/jobs.pages.jsx

@@ -1,25 +0,0 @@
-import React from "react";
-import { useQuery } from "@apollo/react-hooks";
-//import { GET_ALL_OPEN_JOBS } from "../../graphql/jobs.queries";
-import { gql } from "apollo-boost";
-import Spin from "../../components/loading-spinner/loading-spinner.component";
-
-const g = gql`
-  {
-    associations {
-      id
-      shopid
-      useremail
-      active
-    }
-  }
-`;
-
-export default function JobsPage() {
-  const { loading, error, data } = useQuery(g);
-
-  if (loading) return <Spin />;
-  if (error) return `Error! ${error.message}`;
-  console.log(data);
-  return <div>Hi</div>;
-}