IO-3075 Crisp in Rome Online

Signed-off-by: Allan Carr <allan.carr@thinkimex.com>

client/index.html

@@ -62,7 +62,17 @@
       t = d.getElementsByTagName("script")[0];
       t.parentNode.insertBefore(s, t);
     </script>
-
+    <script type="text/javascript">
+      window.$crisp = [];
+      window.CRISP_WEBSITE_ID = "36724f62-2eb0-4b29-9cdd-9905fb99913e";
+      (function () {
+        d = document;
+        s = d.createElement("script");
+        s.src = "https://client.crisp.chat/l.js";
+        s.async = 1;
+        d.getElementsByTagName("head")[0].appendChild(s);
+      })();
+    </script>
     <% } %>
     <script>
       !(function () {

client/src/components/card-payment-modal/card-payment-modal.component.jsx

@@ -133,15 +133,19 @@ const CardPaymentModalComponent = ({
       if (window.intellipay) {
         // eslint-disable-next-line no-eval
         eval(response.data);
-        SetIntellipayCallbackFunctions();
-        window.intellipay.autoOpen();
+        pollForIntelliPay(() => {
+          SetIntellipayCallbackFunctions();
+          window.intellipay.autoOpen();
+        });
       } else {
         const rg = document.createRange();
         const node = rg.createContextualFragment(response.data);
         document.documentElement.appendChild(node);
-        SetIntellipayCallbackFunctions();
-        window.intellipay.isAutoOpen = true;
-        window.intellipay.initialize();
+        pollForIntelliPay(() => {
+          SetIntellipayCallbackFunctions();
+          window.intellipay.isAutoOpen = true;
+          window.intellipay.initialize();
+        });
       }
     } catch (error) {
       notification.open({
@@ -345,3 +349,27 @@ const CardPaymentModalComponent = ({
 };
 
 export default connect(mapStateToProps, mapDispatchToProps)(CardPaymentModalComponent);
+
+//Poll for window.IntelliPay.fixAmount for 5 seconds. If it doesn't come up, just try anyways to force the possible error.
+function pollForIntelliPay(callbackFunction) {
+  const timeout = 5000;
+  const interval = 150; // Poll every 100 milliseconds
+  const startTime = Date.now();
+
+  function checkFixAmount() {
+    if (window.intellipay && window.intellipay.fixAmount !== undefined) {
+      callbackFunction();
+      return;
+    }
+
+    if (Date.now() - startTime >= timeout) {
+      console.log("Stopped polling IntelliPay after 10 seconds. Attemping to set functions anyways.");
+      callbackFunction();
+      return;
+    }
+
+    setTimeout(checkFixAmount, interval);
+  }
+
+  checkFixAmount();
+}

client/src/components/card-payment-modal/card-payment-modal.container.jsx

@@ -6,7 +6,7 @@ import { createStructuredSelector } from "reselect";
 import { toggleModalVisible } from "../../redux/modals/modals.actions";
 import { selectCardPayment } from "../../redux/modals/modals.selectors";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import CardPaymentModalComponent from "./card-payment-modal.component.";
+import CardPaymentModalComponent from "./card-payment-modal.component";
 
 const mapStateToProps = createStructuredSelector({
   cardPaymentModal: selectCardPayment,

client/src/components/error-boundary/error-boundary.component.jsx

@@ -1,10 +1,10 @@
+import * as Sentry from "@sentry/react";
 import { Button, Col, Collapse, Result, Row, Space } from "antd";
 import React from "react";
 import { withTranslation } from "react-i18next";
-import { logImEXEvent } from "../../firebase/firebase.utils";
-import * as Sentry from "@sentry/react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
 import InstanceRenderManager from "../../utils/instanceRenderMgr";
 
@@ -38,28 +38,23 @@ class ErrorBoundary extends React.Component {
   }
 
   handleErrorSubmit = () => {
-    InstanceRenderManager({
-      executeFunction: true,
-      args: [],
-      imex: () => {
-        window.$crisp.push([
-          "do",
-          "message:send",
-          [
-            "text",
-            `I hit the following error: \n\n
+    window.$crisp.push([
+      "do",
+      "message:send",
+      [
+        "text",
+        `I hit the following error: \n\n
               ${this.state.error.message}\n\n
               ${this.state.error.stack}\n\n
               URL:${window.location} as ${this.props.currentUser.email} for ${
                 this.props.bodyshop && this.props.bodyshop.name
               }
               `
-          ]
-        ]);
+      ]
+    ]);
+
+    window.$crisp.push(["do", "chat:open"]);
 
-        window.$crisp.push(["do", "chat:open"]);
-      }
-    });
     //     const errorDescription = `**Please add relevant details about what you were doing before you encountered this issue**
 
     // ----

client/src/components/header/header.component.jsx

@@ -650,14 +650,7 @@ function Header({
           icon: <Icon component={QuestionCircleFilled} />,
           label: t("menus.header.help"),
           onClick: () => {
-            window.open(
-              InstanceRenderManager({
-                imex: "https://help.imex.online/",
-                rome: "https://rometech.com//"
-              }),
-
-              "_blank"
-            );
+            window.open("https://help.imex.online/", "_blank");
           }
         },
         ...(InstanceRenderManager({

client/src/components/job-at-change/schedule-event.component.jsx

@@ -1,30 +1,30 @@
 import { AlertFilled } from "@ant-design/icons";
+import { useMutation } from "@apollo/client";
 import { Button, Divider, Dropdown, Form, Input, notification, Popover, Select, Space } from "antd";
 import parsePhoneNumber from "libphonenumber-js";
-import dayjs from "../../utils/day";
 import queryString from "query-string";
 import React, { useContext, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { Link, useLocation, useNavigate } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
+import SocketContext from "../../contexts/SocketIO/socketContext.jsx";
+import { UPDATE_APPOINTMENT } from "../../graphql/appointments.queries";
 import { openChatByPhone, setMessage } from "../../redux/messaging/messaging.actions";
 import { setModalContext } from "../../redux/modals/modals.actions";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
+import dayjs from "../../utils/day";
 import { GenerateDocument } from "../../utils/RenderTemplate";
 import { TemplateList } from "../../utils/TemplateConstants";
 import ChatOpenButton from "../chat-open-button/chat-open-button.component";
 import DataLabel from "../data-label/data-label.component";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+import ProductionListColumnComment from "../production-list-columns/production-list-columns.comment.component";
 import ScheduleManualEvent from "../schedule-manual-event/schedule-manual-event.component";
 import ScheduleAtChange from "./job-at-change.component";
 import ScheduleEventColor from "./schedule-event.color.component";
 import ScheduleEventNote from "./schedule-event.note.component";
-import { useMutation } from "@apollo/client";
-import { UPDATE_APPOINTMENT } from "../../graphql/appointments.queries";
-import ProductionListColumnComment from "../production-list-columns/production-list-columns.comment.component";
-import SocketContext from "../../contexts/SocketIO/socketContext.jsx";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -127,6 +127,7 @@ export function ScheduleEventComponent({
           <DataLabel label={t("jobs.fields.ownr_ph2")}>
             <ChatOpenButton phone={event.job && event.job.ownr_ph2} jobid={event.job.id} />
           </DataLabel>
+          <DataLabel hideIfNull label={t("jobs.fields.loss_of_use")}>{(event.job && event.job.loss_of_use) || ""}</DataLabel>
           <DataLabel label={t("jobs.fields.alt_transport")}>
             {(event.job && event.job.alt_transport) || ""}
             <ScheduleAtChange job={event && event.job} />

client/src/components/job-detail-lines/job-lines.component.jsx

@@ -519,6 +519,7 @@ export function JobLinesComponent({
               {selectedLines.length > 0 && ` (${selectedLines.length})`}
             </Button>
             <Button
+              id="job-lines-order-parts-button"
               disabled={(job && !job.converted) || (selectedLines.length > 0 ? false : true) || jobRO || technician}
               onClick={() => {
                 setPartsOrderContext({
@@ -541,6 +542,7 @@ export function JobLinesComponent({
               {selectedLines.length > 0 && ` (${selectedLines.length})`}
             </Button>
             <Button
+              id="job-lines-filter-parts-only-button"
               onClick={() => {
                 setState((state) => ({
                   ...state,
@@ -554,7 +556,7 @@ export function JobLinesComponent({
               <FilterFilled /> {t("jobs.actions.filterpartsonly")}
             </Button>
             <Dropdown menu={markMenu} trigger={["click"]}>
-              <Button>{t("jobs.actions.mark")}</Button>
+              <Button id="repair-data-mark-button">{t("jobs.actions.mark")}</Button>
             </Dropdown>
             <Button
               disabled={jobRO || technician}

client/src/components/jobs-convert-button/jobs-convert-button.component.jsx

@@ -1,7 +1,8 @@
 import { useMutation } from "@apollo/client";
 import { Button, Form, Input, notification, Popover, Select, Space, Switch } from "antd";
 import axios from "axios";
-import React, { useState } from "react";
+import { some } from "lodash";
+import React, { useCallback, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -18,7 +19,14 @@ const mapStateToProps = createStructuredSelector({
   jobRO: selectJobReadOnly
 });
 const mapDispatchToProps = (dispatch) => ({
-  insertAuditTrail: ({ jobid, operation, type }) => dispatch(insertAuditTrail({ jobid, operation, type }))
+  insertAuditTrail: ({ jobid, operation, type }) =>
+    dispatch(
+      insertAuditTrail({
+        jobid,
+        operation,
+        type
+      })
+    )
 });
 
 export function JobsConvertButton({ bodyshop, job, refetch, jobRO, insertAuditTrail, parentFormIsFieldsTouched }) {
@@ -27,6 +35,7 @@ export function JobsConvertButton({ bodyshop, job, refetch, jobRO, insertAuditTr
   const [mutationConvertJob] = useMutation(CONVERT_JOB_TO_RO);
   const { t } = useTranslation();
   const [form] = Form.useForm();
+  const allFormValues = Form.useWatch([], form);
 
   const handleConvert = async ({ employee_csr, category, ...values }) => {
     if (parentFormIsFieldsTouched()) {
@@ -69,6 +78,8 @@ export function JobsConvertButton({ bodyshop, job, refetch, jobRO, insertAuditTr
     setLoading(false);
   };
 
+  const submitDisabled = useCallback(() => some(allFormValues, (v) => v === undefined), [allFormValues]);
+
   const popMenu = (
     <div>
       <Form
@@ -77,9 +88,12 @@ export function JobsConvertButton({ bodyshop, job, refetch, jobRO, insertAuditTr
         onFinish={handleConvert}
         initialValues={{
           driveable: true,
-          towin: false,
+          towin: job.towin,
+          ca_gst_registrant: job.ca_gst_registrant,
           employee_csr: job.employee_csr,
-          category: job.category
+          category: job.category,
+          referral_source: job.referral_source,
+          referral_source_extra: job.referral_source_extra ?? ""
         }}
       >
         <Form.Item
@@ -209,7 +223,7 @@ export function JobsConvertButton({ bodyshop, job, refetch, jobRO, insertAuditTr
           <Switch />
         </Form.Item>
         <Space wrap>
-          <Button type="primary" danger onClick={() => form.submit()} loading={loading}>
+          <Button disabled={submitDisabled()} type="primary" danger onClick={() => form.submit()} loading={loading}>
             {t("jobs.actions.convert")}
           </Button>
           <Button onClick={() => setOpen(false)}>{t("general.actions.close")}</Button>
@@ -231,11 +245,6 @@ export function JobsConvertButton({ bodyshop, job, refetch, jobRO, insertAuditTr
         loading={loading}
         onClick={() => {
           setOpen(true);
-          form.setFieldsValue({
-            driveable: true,
-            towin: false,
-            employee_csr: job.employee_csr
-          });
         }}
       >
         {t("jobs.actions.convert")}

client/src/components/jobs-detail-rates/jobs-detail-rates.parts.component.jsx

@@ -982,7 +982,7 @@ export function JobsDetailRatesParts({ jobRO, expanded, required = true, form })
             <InputNumber min={0} max={100} precision={4} disabled={jobRO} />
           </Form.Item>
         </LayoutFormRow>
-        <LayoutFormRow>
+        <LayoutFormRow header={t("jobs.labels.cieca_pfo")}>
           <Form.Item label={t("jobs.fields.tax_tow_rt")} name="tax_tow_rt">
             <InputNumber min={0} max={100} precision={4} disabled={jobRO} />
           </Form.Item>

client/src/components/labor-allocations-table/labor-allocations-table.component.jsx

@@ -1,6 +1,5 @@
 import { EditFilled } from "@ant-design/icons";
 import { Alert, Card, Col, Row, Space, Table, Typography } from "antd";
-import _ from "lodash";
 import React, { useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -9,11 +8,11 @@ import { selectTechnician } from "../../redux/tech/tech.selectors";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { alphaSort } from "../../utils/sorters";
+import { HasFeatureAccess } from "../feature-wrapper/feature-wrapper.component";
 import LaborAllocationsAdjustmentEdit from "../labor-allocations-adjustment-edit/labor-allocations-adjustment-edit.component";
+import UpsellComponent, { upsellEnum } from "../upsell/upsell.component";
 import "./labor-allocations-table.styles.scss";
 import { CalculateAllocationsTotals } from "./labor-allocations-table.utility";
-import { HasFeatureAccess } from "../feature-wrapper/feature-wrapper.component";
-import UpsellComponent, { upsellEnum } from "../upsell/upsell.component";
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
   technician: selectTechnician
@@ -65,6 +64,7 @@ export function LaborAllocationsTable({
       key: "total",
       sorter: (a, b) => a.total - b.total,
       sortOrder: state.sortedInfo.columnKey === "total" && state.sortedInfo.order,
+      align: "right",
       render: (text, record) => record.total.toFixed(1)
     },
     {
@@ -73,6 +73,7 @@ export function LaborAllocationsTable({
       key: "hrs_claimed",
       sorter: (a, b) => a.claimed - b.claimed,
       sortOrder: state.sortedInfo.columnKey === "claimed" && state.sortedInfo.order,
+      align: "right",
       render: (text, record) => record.claimed && record.claimed.toFixed(1)
     },
     {
@@ -81,6 +82,7 @@ export function LaborAllocationsTable({
       key: "adjustments",
       sorter: (a, b) => a.adjustments - b.adjustments,
       sortOrder: state.sortedInfo.columnKey === "adjustments" && state.sortedInfo.order,
+      align: "right",
       render: (text, record) => (
         <Space wrap>
           {record.adjustments.toFixed(1)}
@@ -100,17 +102,17 @@ export function LaborAllocationsTable({
     {
       title: t("jobs.labels.difference"),
       dataIndex: "difference",
-
       key: "difference",
       sorter: (a, b) => a.difference - b.difference,
       sortOrder: state.sortedInfo.columnKey === "difference" && state.sortedInfo.order,
+      align: "right",
       render: (text, record) => (
         <strong
           style={{
-            color: record.difference >= 0 ? "green" : "red"
+            color: record.difference.toFixed(1) >= 0 ? "green" : "red"
           }}
         >
-          {_.round(record.difference, 1)}
+          {(Math.abs(record.difference) < 0.05 ? 0 : record.difference).toFixed(1)}
         </strong>
       )
     }
@@ -129,7 +131,6 @@ export function LaborAllocationsTable({
       ellipsis: true,
       render: (text, record) => `${record.op_code_desc || ""}${record.alt_partm ? ` ${record.alt_partm}` : ""}`
     },
-
     {
       title: t("joblines.fields.act_price"),
       dataIndex: "act_price",
@@ -187,7 +188,7 @@ export function LaborAllocationsTable({
       { hrs_total: 0, hrs_claimed: 0, adjustments: 0, difference: 0 }
     );
 
-  if (summary.difference !== 0 && typeof warningCallback === "function") {
+  if (Math.abs(summary.difference.toFixed(1)) !== 0 && typeof warningCallback === "function") {
     warningCallback({ key: "labor", warning: t("jobs.labels.outstandinghours") });
   }
 
@@ -217,19 +218,21 @@ export function LaborAllocationsTable({
             summary={() => (
               <Table.Summary.Row>
                 <Table.Summary.Cell>
-                  <Typography.Title level={4}>{t("general.labels.totals")}</Typography.Title>
+                  <Typography.Title level={4} style={{ margin: 0, lineHeight: 1 }}>
+                    {t("general.labels.totals")}
+                  </Typography.Title>
                 </Table.Summary.Cell>
-                <Table.Summary.Cell>{summary.hrs_total.toFixed(1)}</Table.Summary.Cell>
-                <Table.Summary.Cell>{summary.hrs_claimed.toFixed(1)}</Table.Summary.Cell>
-                <Table.Summary.Cell>{summary.adjustments.toFixed(1)}</Table.Summary.Cell>
-                <Table.Summary.Cell>
+                <Table.Summary.Cell align="right">{summary.hrs_total.toFixed(1)}</Table.Summary.Cell>
+                <Table.Summary.Cell align="right">{summary.hrs_claimed.toFixed(1)}</Table.Summary.Cell>
+                <Table.Summary.Cell align="right">{summary.adjustments.toFixed(1)}</Table.Summary.Cell>
+                <Table.Summary.Cell align="right">
                   <Typography.Text
                     style={{
                       fontWeight: "bold",
-                      color: summary.difference >= 0 ? "green" : "red"
+                      color: summary.difference.toFixed(1) >= 0 ? "green" : "red"
                     }}
                   >
-                    {summary.difference.toFixed(1)}
+                    {(Math.abs(summary.difference) < 0.05 ? 0 : summary.difference).toFixed(1)}
                   </Typography.Text>
                 </Table.Summary.Cell>
               </Table.Summary.Row>
@@ -261,11 +264,10 @@ export function LaborAllocationsTable({
           </Card>
         </Col>
       )}
-      {showWarning && summary.difference !== 0 && (
+      {showWarning && Math.abs(summary.difference.toFixed(1)) !== 0 && (
         <Alert style={{ margin: "8px 0px" }} type="warning" message={t("jobs.labels.outstandinghours")} />
       )}
     </Row>
   );
 }
-
 export default connect(mapStateToProps, null)(LaborAllocationsTable);

client/src/components/owner-find-modal/owner-find-modal.container.jsx

@@ -38,7 +38,11 @@ export default function OwnerFindModalContainer({
   }, [callSearchowners, modalProps.open, owner]);
 
   return (
-    <Modal title={t("owners.labels.existing_owners")} width={"80%"} {...modalProps}>
+    <Modal
+      title={<span id="owner-find-modal-title">{t("owners.labels.existing_owners")}</span>}
+      width={"80%"}
+      {...modalProps}
+    >
       {loading ? <LoadingSpinner /> : null}
       {error ? <AlertComponent message={error.message} type="error" /> : null}
       {owner ? (

client/src/graphql/appointments.queries.js

@@ -49,6 +49,7 @@ export const QUERY_ALL_ACTIVE_APPOINTMENTS = gql`
         est_ct_fn
         est_ct_ln
         comment
+        loss_of_use
         labhrs: joblines_aggregate(where: { mod_lbr_ty: { _neq: "LAR" }, removed: { _eq: false } }) {
           aggregate {
             sum {

client/src/pages/manage/manage.page.component.jsx

@@ -31,7 +31,7 @@ import { addAlerts } from "../../redux/application/application.actions.js";
 const JobsPage = lazy(() => import("../jobs/jobs.page"));
 
 const CardPaymentModalContainer = lazy(
-  () => import("../../components/card-payment-modal/card-payment-modal.container.")
+  () => import("../../components/card-payment-modal/card-payment-modal.container.jsx")
 );
 
 const JobsDetailPage = lazy(() => import("../jobs-detail/jobs-detail.page.container"));

client/src/redux/user/user.sagas.js

@@ -26,6 +26,7 @@ import {
   updateCurrentUser
 } from "../../firebase/firebase.utils";
 import { QUERY_EULA } from "../../graphql/bodyshop.queries";
+import cleanAxios from "../../utils/CleanAxios";
 import client from "../../utils/GraphQLClient";
 import dayjs from "../../utils/day";
 import InstanceRenderManager from "../../utils/instanceRenderMgr";
@@ -47,7 +48,6 @@ import {
   validatePasswordResetSuccess
 } from "./user.actions";
 import UserActionTypes from "./user.types";
-import cleanAxios from "../../utils/CleanAxios";
 
 const fpPromise = FingerprintJS.load();
 
@@ -234,16 +234,18 @@ export function* signInSuccessSaga({ payload }) {
   LogRocket.identify(payload.email);
 
   try {
+    window.$crisp.push(["set", "user:nickname", [payload.displayName || payload.email]]);
+    window.$crisp.push(["set", "session:segments", [["user"]]]);
     InstanceRenderManager({
       executeFunction: true,
       args: [],
       imex: () => {
-        window.$crisp.push(["set", "user:nickname", [payload.displayName || payload.email]]);
-        window.$crisp.push(["set", "session:segments", [["user"]]]);
+        window.$crisp.push(["set", "session:segments", [["imex"]]]);
       },
       rome: () => {
         window.$zoho.salesiq.visitor.name(payload.displayName || payload.email);
         window.$zoho.salesiq.visitor.email(payload.email);
+        window.$crisp.push(["set", "session:segments", [["rome"]]]);
       }
     });
   } catch (error) {

client/src/translations/en_us/common.json

@@ -2056,7 +2056,7 @@
         "parts": "Parts",
         "parts_lines": "Parts Lines",
         "parts_received": "Parts Rec.",
-        "parts_tax_rates": "Parts Tax rates",
+        "parts_tax_rates": "Profile - Parts",
         "partsfilter": "Parts Only",
         "partssubletstotal": "Parts & Sublets Total",
         "partstotal": "Parts Total (ex. Taxes)",

server/job/job-totals-USA.js

@@ -818,6 +818,7 @@ function CalculateTaxesTotals(job, otherTotals) {
     PAG: Dinero(),
     PAO: Dinero(),
     PAS: Dinero(),
+    PASL: Dinero(),
     PAP: Dinero(),
     PAM: Dinero(),