BOD-58 WIP For testing classes. No success.

client/src/pages/jobs-create/jobs-create.component.jsx

@@ -1,4 +1,4 @@
-import { Button, Steps } from "antd";
+import { Button, Steps, Result } from "antd";
 import React, { useContext, useState } from "react";
 import { useTranslation } from "react-i18next";
 import AlertComponent from "../../components/alert/alert.component";
@@ -6,6 +6,7 @@ import JobsCreateJobsInfo from "../../components/jobs-create-jobs-info/jobs-crea
 import JobsCreateOwnerInfoContainer from "../../components/jobs-create-owner-info/jobs-create-owner-info.container";
 import JobsCreateVehicleInfoContainer from "../../components/jobs-create-vehicle-info/jobs-create-vehicle-info.container";
 import JobCreateContext from "../../pages/jobs-create/jobs-create.context";
+import { Link } from "react-router-dom";
 
 export default function JobsCreateComponent({ form }) {
   const [pageIndex, setPageIndex] = useState(0);
@@ -50,7 +51,7 @@ export default function JobsCreateComponent({ form }) {
         )}
         {pageIndex < steps.length - 1 && (
           <Button
-            type="primary"
+            type='primary'
             onClick={() => {
               form
                 .validateFields()
@@ -63,13 +64,12 @@ export default function JobsCreateComponent({ form }) {
                   }
                 })
                 .catch(error => console.log("error", error));
-            }}
-          >
+            }}>
             Next
           </Button>
         )}
         {pageIndex === steps.length - 1 && (
-          <Button type="primary" htmlType="submit">
+          <Button type='primary' htmlType='submit'>
             Done
           </Button>
         )}
@@ -79,43 +79,64 @@ export default function JobsCreateComponent({ form }) {
 
   return (
     <div>
-      <Steps current={pageIndex}>
-        {steps.map((item, idx) => (
-          <Step
-            key={item.title}
-            title={item.title}
-            style={{ cursor: "pointer" }}
-            onClick={() => {
-              form
-                .validateFields()
-                .then(r => {
-                  if (steps[pageIndex].validation) {
-                    setErrorMessage(null);
-                    setPageIndex(idx);
-                  } else {
-                    setErrorMessage(steps[pageIndex].error);
-                  }
-                })
-                .catch(error => console.log("error", error));
-            }}
-          />
-        ))}
-      </Steps>
-      <ProgressButtons />
-
-      {errorMessage ? (
+      {state.created ? (
         <div>
-         
-          <AlertComponent message={errorMessage} type="error" />
+          <Result
+            status='success'
+            title={t("jobs.successes.creatednoclick")}
+            subTitle={t("jobs.successes.created_subtitle", {
+              est_number: state.newJobEstNum
+            })}
+            extra={[
+              <Link to={`/manage/jobs/${state.newJobId}`} key='gotojob'>
+                <Button type='primary'>{t("jobs.actions.gotojob")}</Button>
+              </Link>,
+              <Link to={`/manage/jobs/`} key='gotojoblist'>
+                <Button>{t("menus.header.activejobs")}</Button>
+              </Link>
+            ]}
+          />
         </div>
-      ) : null}
+      ) : (
+        <div>
+          <Steps current={pageIndex}>
+            {steps.map((item, idx) => (
+              <Step
+                key={item.title}
+                title={item.title}
+                style={{ cursor: "pointer" }}
+                onClick={() => {
+                  form
+                    .validateFields()
+                    .then(r => {
+                      if (steps[pageIndex].validation) {
+                        setErrorMessage(null);
+                        setPageIndex(idx);
+                      } else {
+                        setErrorMessage(steps[pageIndex].error);
+                      }
+                    })
+                    .catch(error => console.log("error", error));
+                }}
+              />
+            ))}
+          </Steps>
+          <ProgressButtons />
 
-      {steps.map((item, idx) => (
-        <div key={idx} style={{ display: idx === pageIndex ? "" : "none" }}>
-          {item.content}
+          {errorMessage ? (
+            <div>
+              <AlertComponent message={errorMessage} type='error' />
+            </div>
+          ) : null}
+
+          {steps.map((item, idx) => (
+            <div key={idx} style={{ display: idx === pageIndex ? "" : "none" }}>
+              {item.content}
+            </div>
+          ))}
+          <ProgressButtons />
         </div>
-      ))}
-      <ProgressButtons />
+      )}
     </div>
   );
 }

client/src/pages/jobs-create/jobs-create.container.jsx

@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from "react";
 import JobsCreateComponent from "./jobs-create.component";
-import { Form } from "antd";
+import { Form, notification } from "antd";
 import JobCreateContext from "./jobs-create.context";
 import { useMutation, useLazyQuery } from "@apollo/react-hooks";
 import { INSERT_NEW_JOB } from "../../graphql/jobs.queries";
@@ -8,19 +8,26 @@ import { QUERY_OWNER_FOR_JOB_CREATION } from "../../graphql/owners.queries";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import { useTranslation } from "react-i18next";
+
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
 });
 export default connect(mapStateToProps, null)(JobsCreateContainer);
 
 function JobsCreateContainer({ bodyshop }) {
+  const { t } = useTranslation();
   const contextState = useState({
     vehicle: { new: false, search: "", selectedid: null },
     owner: { new: false, search: "", selectedid: null },
-    job: null
+    job: null,
+    created: false,
+    error: null,
+    newJobId: null,
+    newJobEstNum: null
   });
   const [form] = Form.useForm();
-  const [state] = contextState;
+  const [state, setState] = contextState;
   const [insertJob] = useMutation(INSERT_NEW_JOB);
   const [loadOwner, RemoteOwnerData] = useLazyQuery(
     QUERY_OWNER_FOR_JOB_CREATION
@@ -37,7 +44,22 @@ function JobsCreateContainer({ bodyshop }) {
 
   const runInsertJob = job => {
     console.log("Job To Save", job);
-    insertJob({ variables: { job: job } });
+    insertJob({ variables: { job: job } })
+      .then(resp => {
+        setState({
+          ...state,
+          created: true,
+          error: null,
+          newJobId: resp.data.insert_jobs.returning[0].id,
+          newJobEstNum: resp.data.insert_jobs.returning[0].est_number
+        });
+      })
+      .catch(error => {
+        notification["error"]({
+          message: t("jobs.errors.creating", { error: error })
+        });
+        setState({ ...state, error: error });
+      });
   };
 
   const handleFinish = values => {