Added breadcrumb object + breadcrumbs for major pages.

client/src/pages/contract-create/contract-create.page.container.jsx

@@ -9,11 +9,16 @@ import { useTranslation } from "react-i18next";
 import { INSERT_NEW_CONTRACT } from "../../graphql/cccontracts.queries";
 import { useMutation } from "@apollo/react-hooks";
 import { useHistory, useLocation } from "react-router-dom";
+import { setBreadcrumbs } from "../../redux/application/application.actions";
+
 const mapStateToProps = createStructuredSelector({
-  bodyshop: selectBodyshop
+  bodyshop: selectBodyshop,
+});
+const mapDispatchToProps = (dispatch) => ({
+  setBreadcrumbs: (breadcrumbs) => dispatch(setBreadcrumbs(breadcrumbs)),
 });
 
-export function ContractCreatePageContainer({ bodyshop }) {
+export function ContractCreatePageContainer({ bodyshop, setBreadcrumbs }) {
   const [form] = Form.useForm();
   const { t } = useTranslation();
   const history = useHistory();
@@ -24,45 +29,56 @@ export function ContractCreatePageContainer({ bodyshop }) {
   );
   const [insertContract] = useMutation(INSERT_NEW_CONTRACT);
 
-  console.log("location", location);
+  console.log("test");
 
-  const handleFinish = values => {
+  const handleFinish = (values) => {
     if (!!selectedCarState[0] && !!selectedJobState[0]) {
       insertContract({
         variables: {
           contract: {
             ...values,
             courtesycarid: selectedCarState[0],
-            jobid: selectedJobState[0]
-          }
-        }
+            jobid: selectedJobState[0],
+          },
+        },
       })
-        .then(response => {
+        .then((response) => {
           notification["success"]({
-            message: t("contracts.successes.saved")
+            message: t("contracts.successes.saved"),
           });
 
           history.push(
             `/manage/courtesycars/contracts/${response.data.insert_cccontracts.returning[0].id}`
           );
         })
-        .catch(error =>
+        .catch((error) =>
           notification["error"]({
             message: t("contracts.errors.saving", {
-              error: JSON.stringify(error)
-            })
+              error: JSON.stringify(error),
+            }),
           })
         );
     } else {
       notification["error"]({
-        message: t("contracts.errors.selectjobandcar")
+        message: t("contracts.errors.selectjobandcar"),
       });
     }
   };
 
   useEffect(() => {
     document.title = t("titles.contracts-create");
-  }, [t]);
+    setBreadcrumbs([
+      { link: "/manage/courtesycars", label: t("titles.bc.courtesycars") },
+      {
+        link: "/manage/courtesycars/contracts",
+        label: t("titles.bc.contracts"),
+      },
+      {
+        link: "/manage/courtesycars/contracts/new",
+        label: t("titles.bc.contracts-create"),
+      },
+    ]);
+  }, [t, setBreadcrumbs]);
 
   return (
     <Form form={form} autoComplete="no" onFinish={handleFinish}>
@@ -73,4 +89,7 @@ export function ContractCreatePageContainer({ bodyshop }) {
     </Form>
   );
 }
-export default connect(mapStateToProps, null)(ContractCreatePageContainer);
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(ContractCreatePageContainer);