Hasura changes to add searching + indexing. Header and card changes.

client/src/components/current-user-dropdown/current-user-dropdown.component.jsx

@@ -1,12 +1,13 @@
-import React from "react";
-import { Link } from "react-router-dom";
-import { Dropdown, Menu, Icon, Avatar, Row, Col } from "antd";
-import { useTranslation } from "react-i18next";
-import i18next from "i18next";
 import { useQuery } from "@apollo/react-hooks";
-import { GET_CURRENT_USER } from "../../graphql/local.queries";
+import { Avatar, Col, Dropdown, Icon, Menu, Row } from "antd";
+import i18next from "i18next";
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { Link } from "react-router-dom";
 import UserImage from "../../assets/User.svg";
+import { GET_CURRENT_USER } from "../../graphql/local.queries";
 import AlertComponent from "../alert/alert.component";
+import SignOut from "../sign-out/sign-out.component";
 
 export default function CurrentUserDropdown() {
   const { t } = useTranslation();
@@ -23,6 +24,9 @@ export default function CurrentUserDropdown() {
   };
   const menu = (
     <Menu mode='vertical' onClick={handleMenuClick}>
+      <Menu.Item>
+        <SignOut />
+      </Menu.Item>
       <Menu.Item>
         <Link to='/manage/profile'> {t("menus.currentuser.profile")}</Link>
       </Menu.Item>

client/src/components/header/header.component.jsx

@@ -1,13 +1,12 @@
+import { useApolloClient } from "@apollo/react-hooks";
+import { Col, Icon, Menu, Row } from "antd";
 import React from "react";
 import { Link } from "react-router-dom";
-import { useApolloClient } from "@apollo/react-hooks";
-import { Menu, Icon, Row, Col } from "antd";
+import CurrentUserDropdown from "../current-user-dropdown/current-user-dropdown.component";
+import GlobalSearch from "../global-search/global-search.component";
+import ManageSignInButton from "../manage-sign-in-button/manage-sign-in-button.component";
 import "./header.styles.scss";
 
-import SignOut from "../sign-out/sign-out.component";
-import ManageSignInButton from "../manage-sign-in-button/manage-sign-in-button.component";
-import GlobalSearch from "../global-search/global-search.component";
-import CurrentUserDropdown from "../current-user-dropdown/current-user-dropdown.component";
 
 export default ({ landingHeader, navItems, selectedNavItem }) => {
   const apolloClient = useApolloClient();
@@ -38,9 +37,7 @@ export default ({ landingHeader, navItems, selectedNavItem }) => {
           ))}
 
           {!landingHeader ? (
-            <Menu.Item>
-              <SignOut />
-            </Menu.Item>
+     null
           ) : (
             <Menu.Item>
               <ManageSignInButton />

client/src/components/job-detail-cards/job-detail-cards.component.jsx

@@ -56,11 +56,17 @@ export default function JobDetailCards({ selectedJob }) {
           </span>
         }
         title={
-          loading
-            ? t("general.labels.loading")
-            : data.jobs_by_pk.ro_number
-            ? `${t("jobs.fields.ro_number")} ${data.jobs_by_pk.ro_number}`
-            : `${t("jobs.fields.est_number")} ${data.jobs_by_pk.est_number}`
+          loading ? (
+            t("general.labels.loading")
+          ) : (
+            <Link to={`/manage/jobs/${data.jobs_by_pk.id}`}>
+              {data.jobs_by_pk.ro_number
+                ? `${t("jobs.fields.ro_number")} ${data.jobs_by_pk.ro_number}`
+                : `${t("jobs.fields.est_number")} ${
+                    data.jobs_by_pk.est_number
+                  }`}{" "}
+            </Link>
+          )
         }
         extra={[
           <Link

client/src/components/job-detail-cards/job-detail-cards.documents.component.jsx

@@ -1,8 +1,8 @@
+import { Carousel } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
-import CardTemplate from "./job-detail-cards.template.component";
-import { Carousel } from "antd";
 import "./job-detail-cards.styles.scss";
+import CardTemplate from "./job-detail-cards.template.component";
 
 export default function JobDetailCardsDocumentsComponent({ loading, data }) {
   const { t } = useTranslation();
@@ -19,15 +19,17 @@ export default function JobDetailCardsDocumentsComponent({ loading, data }) {
       loading={loading}
       title={t("jobs.labels.cards.documents")}
       extraLink={`/manage/jobs/${data.id}#documents`}>
-      {data.documents ? (
+      {data.documents.count > 0 ? (
         <Carousel autoplay>
           {data.documents.map(item => (
             <div key={item.id}>
-              <img src={item.thumb_url} />
+              <img src={item.thumb_url} alt={item.name} />
             </div>
           ))}
         </Carousel>
-      ) : null}
+      ) : (
+        <div>{t("documents.errors.nodocuments")}</div>
+      )}
     </CardTemplate>
   );
 }

client/src/components/jobs-documents/jobs-documents.component.jsx

@@ -1,4 +1,4 @@
-import { Button, Icon, Modal, notification, Upload } from "antd";
+import { Icon, Modal, notification, Upload } from "antd";
 import axios from "axios";
 import React, { useState } from "react";
 import { useMutation } from "react-apollo";
@@ -165,7 +165,7 @@ function JobsDocumentsComponent({ shopId, jobId, loading, data }) {
   });
   const CloudFrontUrl = "https://d18fc493a0fm4o.cloudfront.net";
   const url = `${CloudFrontUrl}/${btoa(imageRequest)}`;
-
+  console.log("url", url);
   return (
     <div className='clearfix'>
       <Upload.Dragger

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

@@ -34,7 +34,7 @@ export default withRouter(function JobsList({
       render: (text, record) => (
         <span>
           <Link to={"/manage/jobs/" + record.id}>
-            {record.ro_number ? record.ro_number : t("general.labels.na")}
+            {record.ro_number ? record.ro_number : "EST-" + record.est_number}
           </Link>
         </span>
       )
@@ -202,7 +202,9 @@ export default withRouter(function JobsList({
           return (
             <Input.Search
               placeholder='Search...'
-              onSearch={value => console.log(value)}
+              onSearch={value => {
+                console.log(value);
+              }}
               enterButton
             />
           );

client/src/components/sign-out/sign-out.component.jsx

@@ -1,12 +1,9 @@
-import React, { Component } from "react";
-//import { Redirect } from "react-router-dom";
+import React from "react";
+import { useTranslation } from "react-i18next";
 import firebase from "../../firebase/firebase.utils";
-export default class SignOut extends Component {
-  state = {
-    redirect: false
-  };
 
-  signOut = async () => {
+export default function SignoutComponent() {
+  const signOut = async () => {
     try {
       await firebase.auth().signOut();
       // this.setState({
@@ -17,17 +14,12 @@ export default class SignOut extends Component {
     }
   };
 
-  renderRedirect = () => {
-    if (this.state.redirect) {
-      //return <Redirect to="/signin" />;
-    }
-  };
-  render() {
-    return (
-      <div>
-        {this.renderRedirect()}
-        <div onClick={this.signOut}>Sign Out</div>
-      </div>
-    );
-  }
+  const { t } = useTranslation();
+
+  return (
+    <div>
+      {this.renderRedirect()}
+      <div onClick={signOut}>{t("user.actions.signout")}</div>
+    </div>
+  );
 }

client/src/graphql/apollo-error-handling.js

@@ -28,47 +28,56 @@ const errorLink = onError(
       console.log("We need a new token!");
       if (access_token && access_token !== "undefined") {
         // Let's refresh token through async request
-        return new Observable(observer => {
-          const unsubscribeFromAuth = auth.onAuthStateChanged(async user => {
-            console.log("Auth change in error handling.");
-            if (user) {
-              user
-                .getIdToken(true)
-                .then(function(idToken) {
-                  if (!idToken) {
-                    window.localStorage.removeItem("token");
-                    return console.log("Refresh token has expired");
-                  }
-                  console.log("Got a new token", idToken);
-                  window.localStorage.setItem("token", idToken);
 
-                  // reset the headers
-                  operation.setContext(({ headers = {} }) => ({
-                    headers: {
-                      // Re-add old headers
-                      ...headers,
-                      // Switch out old access token for new one
-                      authorization: idToken ? `Bearer ${idToken}` : ""
-                    }
-                  }));
-
-                  const subscriber = {
-                    next: observer.next.bind(observer),
-                    error: observer.error.bind(observer),
-                    complete: observer.complete.bind(observer)
-                  };
-                  console.log("About to resend the request.");
-                  // Retry last failed request
-                  forward(operation).subscribe(subscriber);
-                })
-                .catch(error => {
-                  // No refresh or client token available, we force user to login
-                  console.log("Hit an error.");
-                  observer.error(error);
-                });
-            }
-          });
+        auth.currentUser.getIdToken(true).then(token => {
+          if (token) {
+            window.localStorage.setItem("token", token);
+            operation.setContext(({ headers = {} }) => ({
+              headers: {
+                ...headers,
+                authorization: token ? `Bearer ${token}` : ""
+              }
+            }));
+            return forward(operation);
+          }
         });
+
+        // return new Observable(observer => {
+        //   auth.currentUser
+        //     .getIdToken(true)
+        //     .then(function(idToken) {
+        //       if (!idToken) {
+        //         window.localStorage.removeItem("token");
+        //         return console.log("Refresh token has expired");
+        //       }
+        //       console.log("Got a new token", idToken);
+        //       window.localStorage.setItem("token", idToken);
+
+        //       // reset the headers
+        //       operation.setContext(({ headers = {} }) => ({
+        //         headers: {
+        //           // Re-add old headers
+        //           ...headers,
+        //           // Switch out old access token for new one
+        //           authorization: idToken ? `Bearer ${idToken}` : ""
+        //         }
+        //       }));
+
+        //       const subscriber = {
+        //         next: observer.next.bind(observer),
+        //         error: observer.error.bind(observer),
+        //         complete: observer.complete.bind(observer)
+        //       };
+        //       console.log("About to resend the request.");
+        //       // Retry last failed request
+        //       forward(operation).subscribe(subscriber);
+        //     })
+        //     .catch(error => {
+        //       // No refresh or client token available, we force user to login
+        //       console.log("Hit an error.");
+        //       observer.error(error);
+        //     });
+        // });
       }
     }
   }

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

@@ -20,7 +20,6 @@ export default function JobsPage({ match, location }) {
 
   const { hash } = location;
   const [selectedJob, setSelectedJob] = useState(hash ? hash.substr(1) : null);
-  console.log("Jobs Page Render.");
 
   if (error) return <AlertComponent message={error.message} type='error' />;
   return (

client/src/translations/en_us/common.json

@@ -3,7 +3,8 @@
 		"documents": {
 			"errors": {
 				"getpresignurl": "Error obtaining presigned URL for document. ",
-				"insert": "Unable to upload file."
+				"insert": "Unable to upload file.",
+				"nodocuments": "There are no documents."
 			},
 			"labels": {
 				"upload": "Upload"

client/src/translations/es/common.json

@@ -3,7 +3,8 @@
 		"documents": {
 			"errors": {
 				"getpresignurl": "Error al obtener la URL prescrita para el documento.",
-				"insert": "Incapaz de cargar el archivo."
+				"insert": "Incapaz de cargar el archivo.",
+				"nodocuments": "No hay documentos"
 			},
 			"labels": {
 				"upload": "Subir"

client/src/translations/fr/common.json

@@ -3,7 +3,8 @@
 		"documents": {
 			"errors": {
 				"getpresignurl": "Erreur lors de l'obtention de l'URL présignée pour le document.",
-				"insert": "Incapable de télécharger le fichier."
+				"insert": "Incapable de télécharger le fichier.",
+				"nodocuments": "Il n'y a pas de documents."
 			},
 			"labels": {
 				"upload": "Télécharger"