Database auth is fully fixed and functional except for outbound firebase.

client/src/App/App.container.jsx

@@ -10,8 +10,8 @@ export default function Auth() {
 
   useEffect(() => {
     return firebase.auth().onAuthStateChanged(async user => {
-      console.log("User in App Container.js: ", user);
       if (user) {
+        console.log('Current User:', user)
         const token = await user.getIdToken();
         const idTokenResult = await user.getIdTokenResult();
         const hasuraClaim =
@@ -24,17 +24,12 @@ export default function Auth() {
           const metadataRef = firebase
             .database()
             .ref("metadata/" + user.uid + "/refreshTime");
-
           metadataRef.on("value", async () => {
             // Force refresh to pick up the latest custom claims changes.
             const token = await user.getIdToken(true);
             setAuthState({ status: "in", user, token });
           });
         }
-
-        console.log("#####Logged In. make a gql call to upsert", user);
-
-
       } else {
         setAuthState({ status: "out" });
       }

client/src/App/App.js

@@ -3,6 +3,7 @@ import { ApolloProvider } from "react-apollo";
 import { HttpLink } from "apollo-link-http";
 import ApolloClient from "apollo-client";
 import { InMemoryCache } from "apollo-cache-inmemory";
+import { resolvers, typeDefs } from "../graphql/resolvers";
 
 //Styling imports
 import "./App.css";
@@ -18,22 +19,18 @@ const graphqlEndpoint =
   "https://bodyshop-dev-db.herokuapp.com/v1/graphql";
 
 export default function App({ authState }) {
-  console.log("graphqlEndpoint", graphqlEndpoint);
-
   const isIn = authState.status === "in";
-
   const headers = isIn ? { Authorization: `Bearer ${authState.token}` } : {};
-
   const httpLink = new HttpLink({
     uri: graphqlEndpoint,
     headers
   });
-
   const client = new ApolloClient({
     link: httpLink,
-    cache: new InMemoryCache()
+    cache: new InMemoryCache(),
+    resolvers,
+    typeDefs
   });
-
   client.writeData({
     data: initialState
   });
@@ -41,7 +38,7 @@ export default function App({ authState }) {
   return (
     <ApolloProvider client={client}>
       <HeaderAppBarContainer />
-      <SignIn />
+      {isIn ? null : <SignIn />}
       <JobListContainer />
     </ApolloProvider>
   );

client/src/components/header-app-bar/header-app-bar.component.jsx

@@ -18,9 +18,11 @@ class HeaderAppBar extends Component {
         selectedKeys={selectedNavItem}
         mode="horizontal"
       >
-        {navItems.map(navItem => (
+        {
+          navItems.map(navItem => (
           <Menu.Item key={navItem.title}>{navItem.title}</Menu.Item>
-        ))}
+        ))
+      }
       </Menu>
 
       //   <Menu.Item key="mail">

client/src/components/header-app-bar/header-app-bar.container.jsx

@@ -3,7 +3,6 @@ import { Query } from "react-apollo";
 import { gql } from "apollo-boost";
 
 import { Spin, Alert } from "antd";
-
 import HeaderAppBar from "./header-app-bar.component";
 
 const GET_NAV_ITEMS = gql`
@@ -23,16 +22,16 @@ const GET_SELECTED_NAV_ITEM = gql`
 const HeaderAppBarContainer = () => (
   <Query query={GET_SELECTED_NAV_ITEM}>
     {({ loading, error, data: { selectedNavItem } }) => {
-      console.log("Selected Nav item", selectedNavItem);
       return (
         <Query query={GET_NAV_ITEMS}>
           {({ loading, error, data }) => {
             if (loading) return <Spin size="large" />;
             if (error) return <Alert message={error.message} />;
+            const parsedNavItems = JSON.parse(data.masterdata_by_pk.value)
             return (
               <HeaderAppBar
                 selectedNavItem={selectedNavItem}
-                navItems={data.masterdata_by_pk.value}
+                navItems={parsedNavItems}
               />
             );
           }}

client/src/components/job-list/job-list.component.jsx

@@ -1,6 +1,12 @@
 import React from "react";
 
-export default function JobList() {
-  //console.log("JobList props", this.props);
-  return <div>JobList</div>;
-}
+export default ({ jobs }) => (
+  <div>
+    <span>Job List</span>
+    <div>
+      {jobs.map(job => (
+        <p key={job.est_number}>{job.est_number}</p>
+      ))}
+    </div>
+  </div>
+);

client/src/components/job-list/job-list.container.jsx

@@ -8,8 +8,8 @@ import JobList from "./job-list.component";
 
 const GET_JOBS = gql`
   query get_jobs {
-    estimates {
-      ro_number
+    jobs {
+      est_number
     }
   }
 `;
@@ -20,7 +20,8 @@ const JobListContainer = () => (
       if (loading) return <Spin size="large" />;
       if (error) return <Alert message={error.message} />;
       console.log("JobListContainer Data:", data);
-      return <JobList jobs={data} />;
+
+      return <JobList jobs={data.jobs} />;
     }}
   </Query>
 );

client/src/firebase/firebase.utils.js

@@ -1,6 +1,7 @@
 import firebase from "firebase/app";
 import "firebase/firestore";
 import "firebase/auth";
+import "firebase/database"
 
 const config = {
   apiKey: "AIzaSyDV9MsSHZmpLtjoaTK_ObvjFaJ-nMSd2KA",