IO-3604 Tech Job Drawer

Signed-off-by: Allan Carr <allan@imexsystems.ca>

client/src/components/tech-lookup-jobs-drawer/tech-lookup-jobs-drawer.component.jsx

@@ -25,10 +25,7 @@ const mapDispatchToProps = (dispatch) => ({
 });
 
 export function TechLookupJobsDrawer({ bodyshop, setPrintCenterContext }) {
-  const breakpoints = Grid.useBreakpoint();
-  const selectedBreakpoint = Object.entries(breakpoints)
-    .filter(([, isOn]) => !!isOn)
-    .slice(-1)[0];
+  const screens = Grid.useBreakpoint();
 
   const bpoints = {
     xs: "100%",
@@ -36,10 +33,16 @@ export function TechLookupJobsDrawer({ bodyshop, setPrintCenterContext }) {
     md: "100%",
     lg: "100%",
     xl: "90%",
-    xxl: "85%"
+    xxl: "90%"
   };
 
-  const drawerPercentage = selectedBreakpoint ? bpoints[selectedBreakpoint[0]] : "100%";
+  let drawerPercentage = "100%";
+  if (screens.xxl) drawerPercentage = bpoints.xxl;
+  else if (screens.xl) drawerPercentage = bpoints.xl;
+  else if (screens.lg) drawerPercentage = bpoints.lg;
+  else if (screens.md) drawerPercentage = bpoints.md;
+  else if (screens.sm) drawerPercentage = bpoints.sm;
+  else if (screens.xs) drawerPercentage = bpoints.xs;
 
   const location = useLocation();
   const history = useNavigate();

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

@@ -10,12 +10,14 @@ import JobsCreateOwnerInfoContainer from "../../components/jobs-create-owner-inf
 import JobsCreateVehicleInfoContainer from "../../components/jobs-create-vehicle-info/jobs-create-vehicle-info.container";
 import JobCreateContext from "../../pages/jobs-create/jobs-create.context";
 
-export default function JobsCreateComponent({ form, isSubmitting }) {
+export default function JobsCreateComponent({ form }) {
   const [pageIndex, setPageIndex] = useState(0);
-  const [errorMessage, setErrorMessage] = useState(null);
-  const [state] = useContext(JobCreateContext);
-  const { t } = useTranslation();
 
+  const [errorMessage, setErrorMessage] = useState(null);
+
+  const [state] = useContext(JobCreateContext);
+
+  const { t } = useTranslation();
   const steps = [
     {
       title: t("jobs.labels.create.vehicleinfo"),
@@ -40,9 +42,11 @@ export default function JobsCreateComponent({ form, isSubmitting }) {
 
   const next = () => {
     setPageIndex(pageIndex + 1);
+    console.log("Next");
   };
   const prev = () => {
     setPageIndex(pageIndex - 1);
+    console.log("Previous");
   };
 
   const ProgressButtons = ({ top }) => {
@@ -75,19 +79,17 @@ export default function JobsCreateComponent({ form, isSubmitting }) {
             {pageIndex === steps.length - 1 && (
               <Button
                 type="primary"
-                loading={isSubmitting}
                 onClick={() => {
                   form
                     .validateFields()
                     .then(() => {
-                      form.submit();
+                      // NO OP
                     })
-                    .catch((error) => {
-                      console.log("error", error);
-                    });
+                    .catch((error) => console.log("error", error));
+                  form.submit();
                 }}
               >
-                {t("general.actions.done")}
+                Done
               </Button>
             )}
           </Space>
@@ -144,11 +146,13 @@ export default function JobsCreateComponent({ form, isSubmitting }) {
       ) : (
         <div>
           <ProgressButtons top />
+
           {errorMessage ? (
             <div>
               <AlertComponent title={errorMessage} type="error" />
             </div>
           ) : null}
+
           {steps.map((item, idx) => (
             <div
               key={idx}

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

@@ -46,7 +46,6 @@ function JobsCreateContainer({ bodyshop, setBreadcrumbs, setSelectedHeader, curr
   });
   const [form] = Form.useForm();
   const [state, setState] = contextState;
-  const [isSubmitting, setIsSubmitting] = useState(false);
   const [insertJob] = useMutation(INSERT_NEW_JOB);
   const [loadOwner, remoteOwnerData] = useLazyQuery(QUERY_OWNER_FOR_JOB_CREATION);
 
@@ -84,19 +83,16 @@ function JobsCreateContainer({ bodyshop, setBreadcrumbs, setSelectedHeader, curr
           newJobId: resp.data.insert_jobs.returning[0].id
         });
         logImEXEvent("manual_job_create_completed", {});
-        setIsSubmitting(false);
       })
       .catch((error) => {
         notification.error({
           title: t("jobs.errors.creating", { error: error })
         });
         setState({ ...state, error: error });
-        setIsSubmitting(false);
       });
   };
 
   const handleFinish = (values) => {
-    setIsSubmitting(true);
     let job = Object.assign(
       {},
       values,
@@ -301,7 +297,7 @@ function JobsCreateContainer({ bodyshop, setBreadcrumbs, setSelectedHeader, curr
             })
           }}
         >
-          <JobsCreateComponent form={form} isSubmitting={isSubmitting} />
+          <JobsCreateComponent form={form} />
         </Form>
       </RbacWrapper>
     </JobCreateContext.Provider>

client/src/translations/en_us/common.json

@@ -1295,7 +1295,6 @@
         "delete": "Delete",
         "deleteall": "Delete All",
         "deselectall": "Deselect All",
-        "done": "Done",
         "download": "Download",
         "edit": "Edit",
         "gotoadmin": "Go to Admin Panel",

client/src/translations/es/common.json

@@ -1295,7 +1295,6 @@
         "delete": "Borrar",
         "deleteall": "",
         "deselectall": "",
-        "done": "",
         "download": "",
         "edit": "Editar",
         "gotoadmin": "",

client/src/translations/fr/common.json

@@ -1295,7 +1295,6 @@
         "delete": "Effacer",
         "deleteall": "",
         "deselectall": "",
-        "done": "",
         "download": "",
         "edit": "modifier",
         "gotoadmin": "",