Added error handling for null groups RPS-55

src/components/molecules/job-group/job-group.molecule.jsx

@@ -7,6 +7,7 @@ import { createStructuredSelector } from "reselect";
 import { UPDATE_JOB } from "../../../graphql/jobs.queries";
 import ipcTypes from "../../../ipc.types";
 import { selectBodyshop } from "../../../redux/user/user.selectors";
+import { AlertFilled } from "@ant-design/icons";
 const { ipcRenderer } = window;
 
 const mapStateToProps = createStructuredSelector({
@@ -51,12 +52,20 @@ export function JobGroupMolecule({ bodyshop, jobId, group, job }) {
   );
 
   return (
-    <Dropdown overlay={menu} trigger={["click"]}>
-      <a href=" #" onClick={(e) => e.preventDefault()}>
-        {group}
-        <DownOutlined style={{ marginLeft: ".2rem" }} />
-        {loading && <LoadingOutlined />}
-      </a>
-    </Dropdown>
+    <>
+      <Dropdown overlay={menu} trigger={["click"]}>
+        <a href=" #" onClick={(e) => e.preventDefault()}>
+          {group}
+          <DownOutlined style={{ marginLeft: ".2rem" }} />
+          {loading && <LoadingOutlined />}
+        </a>
+      </Dropdown>
+      {!group && (
+        <div style={{ marginLeft: ".2rem" }}>
+          <AlertFilled style={{ color: "tomato" }} className="blink_me" />
+          <span style={{ color: "tomato" }}>No group set.</span>
+        </div>
+      )}
+    </>
   );
 }

src/components/pages/reporting/reporting.page.jsx

@@ -1,8 +1,13 @@
-import { Card } from "antd";
+import { Card, Typography } from "antd";
 import React from "react";
 import { connect } from "react-redux";
+import { Link } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
-import { selectDates } from "../../../redux/reporting/reporting.selectors";
+import { setSelectedJobId } from "../../../redux/application/application.actions";
+import {
+  selectDates,
+  selectReportingError,
+} from "../../../redux/reporting/reporting.selectors";
 import ReportingTitleAtom from "../../atoms/reporting-title/reporting-title.atom";
 import ReportingDatesMolecule from "../../molecules/reporting-dates/reporting-dates.molecule";
 import ReportingJobsListMolecule from "../../molecules/reporting-jobs-list/reporting-jobs-list.molecule";
@@ -12,19 +17,34 @@ import "./reporting.page.styles.scss";
 
 const mapStateToProps = createStructuredSelector({
   dates: selectDates,
+  error: selectReportingError,
 });
 const mapDispatchToProps = (dispatch) => ({
   //setUserLanguage: language => dispatch(setUserLanguage(language))
+  setSelectedJobId: (id) => dispatch(setSelectedJobId(id)),
 });
-export default connect(mapStateToProps, mapDispatchToProps)(ReportingPage);
 
-export function ReportingPage({ dates }) {
+export function ReportingPage({ dates, error, setSelectedJobId }) {
   return (
     <div className="reporting-container">
       <Card>
         <ReportingDatesMolecule />
       </Card>
-      {dates && dates.startDate && dates.endDate && (
+      {error && (
+        <div>
+          <Typography.Title level={4}>{error.message}</Typography.Title>
+          <ul>
+            {error.jobs.map((j, idx) => (
+              <li key={idx}>
+                <Link onClick={() => setSelectedJobId(j.id)} to={"/"}>
+                  {`${j.clm_no} - ${j.error}`}
+                </Link>
+              </li>
+            ))}
+          </ul>
+        </div>
+      )}
+      {!error && dates && dates.startDate && dates.endDate && (
         <div className="reporting-cards">
           <Card>
             <ReportingTitleAtom />
@@ -41,3 +61,5 @@ export function ReportingPage({ dates }) {
     </div>
   );
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(ReportingPage);

src/redux/reporting/reporting.reducer.js

@@ -13,11 +13,17 @@ const applicationReducer = (state = INITIAL_STATE, action) => {
       return {
         ...state,
         loading: true,
+        error: null,
         dates: {
           startDate: action.payload.startDate.toISOString(),
           endDate: action.payload.endDate.toISOString(),
         },
       };
+    case ReportingActionTypes.SET_REPORTING_ERROR:
+      return {
+        ...state,
+        error: action.payload,
+      };
     case ReportingActionTypes.SET_REPORTING_DATA:
       return { ...state, data: action.payload };
     case ReportingActionTypes.SET_SCORE_CARD:

src/redux/reporting/reporting.sagas.js

@@ -13,6 +13,7 @@ import {
   calculateScorecard,
   setReportingData,
   setScoreCard,
+  setReportingError,
 } from "./reporting.actions";
 import ReportingApplicationTypes from "./reporting.types";
 
@@ -62,6 +63,23 @@ export function* handleCalculateScoreCard({ payload: jobs }) {
     const targets = yield select((state) => state.user.bodyshop.targets);
     const groups = yield select((state) => state.user.bodyshop.groups);
 
+    //Check to ensure every job has a group.
+    const jobsWithNoGroup = jobs
+      .filter((j) => !j.group)
+      .map((j) => {
+        return { ...j, error: "No group set." };
+      });
+
+    if (jobsWithNoGroup.length > 0) {
+      yield put(
+        setReportingError({
+          message: "There is an issue with the following jobs.",
+          jobs: [...jobsWithNoGroup],
+        })
+      );
+      return;
+    }
+
     const scoreCard = {
       shopRpsTotalDollars: Dinero(),
       shopRpsExpectedDollars: Dinero(),
@@ -152,6 +170,7 @@ export function* handleCalculateScoreCard({ payload: jobs }) {
       event: "CALCULATE_SCORE_CARD_ERROR",
       error: error,
     });
+    yield put(setReportingError({ message: error, jobs: [] }));
   }
 }