Further refinement on jobs detail screen on header. BOD-155

client/src/components/jobs-detail-header-actions/jobs-detail-header-actions.component.jsx

@@ -6,18 +6,19 @@ import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { Link, useHistory } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
+import { setModalContext } from "../../redux/modals/modals.actions";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import AddToProduction from "./jobs-detail-header-actions.addtoproduction.util";
-import DuplicateJob from "./jobs-detail-header-actions.duplicate.util";
-import { setModalContext } from "../../redux/modals/modals.actions";
 import JobsDetaiLheaderCsi from "./jobs-detail-header-actions.csi.component";
+import DuplicateJob from "./jobs-detail-header-actions.duplicate.util";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
 });
 
 const mapDispatchToProps = (dispatch) => ({
-  //setUserLanguage: language => dispatch(setUserLanguage(language))
+  setScheduleContext: (context) =>
+    dispatch(setModalContext({ context: context, modal: "schedule" })),
   setInvoiceEnterContext: (context) =>
     dispatch(setModalContext({ context: context, modal: "invoiceEnter" })),
 });
@@ -26,35 +27,47 @@ export function JobsDetailHeaderActions({
   job,
   bodyshop,
   refetch,
+  setScheduleContext,
   setInvoiceEnterContext,
 }) {
   const { t } = useTranslation();
   const client = useApolloClient();
   const history = useHistory();
   const statusmenu = (
-    <Menu key="popovermenu">
-      <Menu.Item key="cccontract">
+    <Menu key='popovermenu'>
+      <Menu.Item
+        onClick={() => {
+          setScheduleContext({
+            actions: { refetch: refetch },
+            context: {
+              jobId: job.id,
+              job: job,
+            },
+          });
+        }}>
+        {t("jobs.actions.schedule")}
+      </Menu.Item>
+
+      <Menu.Item key='cccontract'>
         <Link
           to={{
             pathname: "/manage/courtesycars/contracts/new",
             state: { jobId: job.id },
-          }}
-        >
+          }}>
           {t("menus.jobsactions.newcccontract")}
         </Link>
       </Menu.Item>
       <Menu.Item
-        key="addtoproduction"
+        key='addtoproduction'
         disabled={!!!job.converted || !!job.inproduction}
-        onClick={() => AddToProduction(client, job.id, refetch)}
-      >
+        onClick={() => AddToProduction(client, job.id, refetch)}>
         {t("jobs.actions.addtoproduction")}
       </Menu.Item>
-      <Menu.Item key="duplicatejob">
+      <Menu.Item key='duplicatejob'>
         <Popconfirm
           title={t("jobs.labels.duplicateconfirm")}
-          okText="Yes"
-          cancelText="No"
+          okText='Yes'
+          cancelText='No'
           onClick={(e) => e.stopPropagation()}
           onConfirm={() =>
             DuplicateJob(
@@ -66,13 +79,12 @@ export function JobsDetailHeaderActions({
               }
             )
           }
-          getPopupContainer={(trigger) => trigger.parentNode}
-        >
+          getPopupContainer={(trigger) => trigger.parentNode}>
           {t("menus.jobsactions.duplicate")}
         </Popconfirm>
       </Menu.Item>
       <Menu.Item
-        key="postinvoices"
+        key='postinvoices'
         onClick={() => {
           setInvoiceEnterContext({
             actions: { refetch: refetch },
@@ -80,16 +92,14 @@ export function JobsDetailHeaderActions({
               job: job,
             },
           });
-        }}
-      >
+        }}>
         {t("jobs.actions.postInvoices")}
       </Menu.Item>
-      <Menu.Item key="closejob">
+      <Menu.Item key='closejob'>
         <Link
           to={{
             pathname: `/manage/jobs/${job.id}/close`,
-          }}
-        >
+          }}>
           {t("menus.jobsactions.closejob")}
         </Link>
       </Menu.Item>
@@ -97,7 +107,11 @@ export function JobsDetailHeaderActions({
     </Menu>
   );
   return (
-    <Dropdown overlay={statusmenu} trigger={["click"]} key="changestatus">
+    <Dropdown
+      className='imex-flex-row__margin'
+      overlay={statusmenu}
+      trigger={["click"]}
+      key='changestatus'>
       <Button>
         {t("general.labels.actions")} <DownCircleFilled />
       </Button>