In Progress work for Jobs Form.

client/src/components/header/header.container.jsx

@@ -0,0 +1,47 @@
+import React from "react";
+import "./header.styles.scss";
+import { useQuery } from "react-apollo";
+import {
+  GET_LANDING_NAV_ITEMS,
+  GET_NAV_ITEMS
+} from "../../graphql/metadata.queries";
+import { GET_CURRENT_SELECTED_NAV_ITEM } from "../../graphql/local.queries";
+import LoadingSpinner from "../loading-spinner/loading-spinner.component";
+import AlertComponent from "../alert/alert.component";
+import HeaderComponent from "./header.component";
+
+export default ({ landingHeader, signedIn }) => {
+  const hookSelectedNavItem = useQuery(GET_CURRENT_SELECTED_NAV_ITEM);
+
+  let hookNavItems;
+  if (landingHeader) {
+    hookNavItems = useQuery(GET_LANDING_NAV_ITEMS, {
+      fetchPolicy: "network-only"
+    });
+  } else {
+    hookNavItems = useQuery(GET_NAV_ITEMS, {
+      fetchPolicy: "network-only"
+    });
+  }
+
+  if (hookNavItems.loading || hookSelectedNavItem.loading)
+    return <LoadingSpinner />;
+  if (hookNavItems.error)
+    return <AlertComponent message={hookNavItems.error.message} />;
+  if (hookSelectedNavItem.error)
+    return console.log(
+      "Unable to load Selected Navigation Item.",
+      hookSelectedNavItem.error
+    );
+
+  const { selectedNavItem } = hookSelectedNavItem.data;
+  const navItems = JSON.parse(hookNavItems.data.masterdata_by_pk.value);
+
+  return (
+    <HeaderComponent
+      landingHeader={landingHeader}
+      navItems={navItems}
+      selectedNavItem={selectedNavItem}
+    />
+  );
+};