IO-2957 Resolve task reminders not sending with incorrect references.

feature/IO-2945-intellipaypostbackhandling

Approved-by: Patrick Fic

.circleci/config.yml

@@ -5,6 +5,7 @@ orbs:
   aws-s3: circleci/aws-s3@4.0.0
   aws-cli: circleci/aws-cli@4.0
   eb: circleci/aws-elastic-beanstalk@2.0.1
+  jira: circleci/jira@2.1.0
 jobs:
   imex-api-deploy:
     docker:
@@ -18,6 +19,12 @@ jobs:
             eb status --verbose
             eb deploy
             eb status
+      - jira/notify:
+          environment: Production (ImEX) - API
+          environment_type: production
+          job_type: deployment
+          pipeline_id: << pipeline.id >>
+          pipeline_number: << pipeline.number >>
 
   imex-hasura-migrate:
     docker:
@@ -33,11 +40,16 @@ jobs:
       - run:
           name: Execute migration
           command: |
-            npm install hasura-cli -g
+            curl -L https://github.com/hasura/graphql-engine/raw/stable/cli/get.sh | bash
             hasura migrate apply --endpoint https://db.imex.online/ --admin-secret << parameters.secret >>
             hasura metadata apply --endpoint https://db.imex.online/ --admin-secret << parameters.secret >>
             hasura metadata reload --endpoint https://db.imex.online/ --admin-secret << parameters.secret >>
-
+      - jira/notify:
+          environment: Production (ImEX) - Hasura
+          environment_type: production
+          pipeline_id: << pipeline.id >>
+          job_type: deployment
+          pipeline_number: << pipeline.number >>
   imex-app-build:
     docker:
       - image: cimg/node:18.18.2
@@ -62,6 +74,7 @@ jobs:
           to: "s3://imex-online-production/"
           arguments: "--exclude '*.map'"
 
+
   imex-app-beta-build:
     docker:
       - image: cimg/node:18.18.2
@@ -86,6 +99,12 @@ jobs:
           from: dist
           to: "s3://imex-online-beta/"
           arguments: "--exclude '*.map'"
+      - jira/notify:
+          environment: Production (ImEX) - Front End
+          environment_type: production
+          pipeline_id: << pipeline.id >>
+          job_type: deployment
+          pipeline_number: << pipeline.number >>
 
   rome-api-deploy:
     docker:
@@ -99,7 +118,12 @@ jobs:
             eb status --verbose
             eb deploy
             eb status
-
+      - jira/notify:
+          environment: Production (Rome) - API
+          environment_type: production
+          pipeline_id: << pipeline.id >>
+          job_type: deployment
+          pipeline_number: << pipeline.number >>
   rome-hasura-migrate:
     docker:
       - image: cimg/node:18.18.2
@@ -114,11 +138,16 @@ jobs:
       - run:
           name: Execute migration
           command: |
-            npm install hasura-cli -g
+            curl -L https://github.com/hasura/graphql-engine/raw/stable/cli/get.sh | bash
             hasura migrate apply --endpoint https://db.romeonline.io/ --admin-secret << parameters.secret >>
             hasura metadata apply --endpoint https://db.romeonline.io/ --admin-secret << parameters.secret >>
             hasura metadata reload --endpoint https://db.romeonline.io/ --admin-secret << parameters.secret >>
-
+      - jira/notify:
+          environment: Production (Rome) - Hasura
+          environment_type: production
+          pipeline_id: << pipeline.id >>
+          job_type: deployment
+          pipeline_number: << pipeline.number >>
   rome-app-build:
     docker:
       - image: cimg/node:18.18.2
@@ -143,6 +172,12 @@ jobs:
           from: dist
           to: "s3://rome-online-production/"
           arguments: "--exclude '*.map'"
+      - jira/notify:
+          environment: Production (Rome) - Front End
+          environment_type: production
+          pipeline_id: << pipeline.id >>
+          job_type: deployment
+          pipeline_number: << pipeline.number >>
 
   promanager-app-build:
     docker:
@@ -168,6 +203,12 @@ jobs:
           from: dist
           to: "s3://promanager-production/"
           arguments: "--exclude '*.map'"
+      - jira/notify:
+          environment: Production (ProManager) - Front End
+          environment_type: production
+          pipeline_id: << pipeline.id >>
+          job_type: deployment
+          pipeline_number: << pipeline.number >>
 
   test-rome-hasura-migrate:
     docker:
@@ -183,10 +224,18 @@ jobs:
       - run:
           name: Execute migration
           command: |
-            npm install hasura-cli -g
+            curl -L https://github.com/hasura/graphql-engine/raw/stable/cli/get.sh | bash
             hasura migrate apply --endpoint https://db.test.romeonline.io/ --admin-secret << parameters.secret >>
+            sleep 5
             hasura metadata apply --endpoint https://db.test.romeonline.io/ --admin-secret << parameters.secret >>
+            sleep 10
             hasura metadata reload --endpoint https://db.test.romeonline.io/ --admin-secret << parameters.secret >>
+      - jira/notify:
+          environment: Test (Rome) - Hasura
+          environment_type: testing
+          pipeline_id: << pipeline.id >>
+          job_type: deployment
+          pipeline_number: << pipeline.number >>
 
   test-rome-app-build:
     docker:
@@ -212,6 +261,12 @@ jobs:
           from: dist
           to: "s3://rome-online-test/"
           arguments: "--exclude '*.map'"
+      - jira/notify:
+          environment: Test (Rome) - Front End
+          environment_type: testing
+          pipeline_id: << pipeline.id >>
+          job_type: deployment
+          pipeline_number: << pipeline.number >>
 
   test-promanager-app-build:
     docker:
@@ -237,6 +292,12 @@ jobs:
           from: dist
           to: "s3://promanager-testing/"
           arguments: "--exclude '*.map'"
+      - jira/notify:
+          environment: Test (ProManager) - Front End
+          environment_type: testing
+          pipeline_id: << pipeline.id >>
+          job_type: deployment
+          pipeline_number: << pipeline.number >>
 
   test-hasura-migrate:
     docker:
@@ -252,10 +313,18 @@ jobs:
       - run:
           name: Execute migration
           command: |
-            npm install hasura-cli -g
+            curl -L https://github.com/hasura/graphql-engine/raw/stable/cli/get.sh | bash
             hasura migrate apply --endpoint https://db.test.bodyshop.app/ --admin-secret << parameters.secret >>
+            sleep 15
             hasura metadata apply --endpoint https://db.test.bodyshop.app/ --admin-secret << parameters.secret >>
+            sleep 30
             hasura metadata reload --endpoint https://db.test.bodyshop.app/ --admin-secret << parameters.secret >>
+      - jira/notify:
+          environment: Test (ImEX) - Hasura
+          environment_type: testing
+          pipeline_id: << pipeline.id >>
+          job_type: deployment
+          pipeline_number: << pipeline.number >>
 
   imex-test-app-build:
     docker:
@@ -302,7 +371,12 @@ jobs:
           from: dist
           to: "s3://imex-online-test-beta/"
           arguments: "--exclude '*.map'"
-
+      - jira/notify:
+          environment: Test (ImEX) - Front End
+          environment_type: testing
+          pipeline_id: << pipeline.id >>
+          job_type: deployment
+          pipeline_number: << pipeline.number >>
 
   admin-app-build:
     docker:
@@ -353,7 +427,7 @@ workflows:
           secret: ${HASURA_PROD_SECRET}
           filters:
             branches:
-              only: master
+              only: master-AIO
       - rome-api-deploy:
           filters:
             branches:
@@ -363,7 +437,7 @@ workflows:
             branches:
               only: master-AIO
       - rome-hasura-migrate:
-          secret: ${HASURA_PROD_SECRET}
+          secret: ${HASURA_ROME_PROD_SECRET}
           filters:
             branches:
               only: master-AIO

_reference/prHelper.html

@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>IMEX IO Extractor</title>
+  <style>
+    body {
+      font-family: Arial, sans-serif;
+      padding: 20px;
+    }
+    textarea {
+      width: 100%;
+      height: 200px;
+    }
+    .output-box {
+      margin-top: 20px;
+      padding: 10px;
+      border: 1px solid #ccc;
+      background-color: #f9f9f9;
+      min-height: 40px;
+    }
+    .copy-button {
+      margin-top: 10px;
+    }
+  </style>
+</head>
+<body>
+<h1>IMEX IO Extractor</h1>
+<textarea id="inputText" placeholder="Paste your text here..."></textarea>
+<br>
+<button onclick="extractIO()">Extract</button>
+
+<div class="output-box" id="outputBox" contenteditable="true"></div>
+<button class="copy-button" onclick="copyToClipboard()">Copy to Clipboard</button>
+
+<script>
+  function extractIO() {
+    const inputText = document.getElementById('inputText').value;
+    const ioNumbers = [...new Set(inputText.match(/IO-\d{4}/g))] // Extract unique IO-#### matches
+      .map(io => ({ io, num: parseInt(io.split('-')[1]) }))    // Extract number part for sorting
+      .sort((a, b) => a.num - b.num)                           // Sort by the number
+      .map(item => item.io);                                   // Extract sorted IO-####
+
+    document.getElementById('outputBox').innerText = ioNumbers.join(', '); // Display horizontally
+  }
+
+  function copyToClipboard() {
+    const outputBox = document.getElementById('outputBox');
+    const range = document.createRange();
+    range.selectNodeContents(outputBox);
+    const selection = window.getSelection();
+    selection.removeAllRanges();
+    selection.addRange(range);
+    document.execCommand('copy');
+  }
+</script>
+</body>
+</html>

client/.env.development.imex

@@ -1,5 +1,5 @@
-VITE_APP_GRAPHQL_ENDPOINT=https://db.dev.bodyshop.app/v1/graphql
-VITE_APP_GRAPHQL_ENDPOINT_WS=wss://db.dev.bodyshop.app/v1/graphql
+VITE_APP_GRAPHQL_ENDPOINT=https://db.dev.imex.online/v1/graphql
+VITE_APP_GRAPHQL_ENDPOINT_WS=wss://db.dev.imex.online/v1/graphql
 VITE_APP_GA_CODE=231099835
 VITE_APP_FIREBASE_CONFIG={"apiKey":"AIzaSyDPLT8GiDHDR1R4nI66Qi0BY1aYviDPioc","authDomain":"imex-dev.firebaseapp.com","databaseURL":"https://imex-dev.firebaseio.com","projectId":"imex-dev","storageBucket":"imex-dev.appspot.com","messagingSenderId":"759548147434","appId":"1:759548147434:web:e8239868a48ceb36700993","measurementId":"G-K5XRBVVB4S"}
 VITE_APP_CLOUDINARY_ENDPOINT_API=https://api.cloudinary.com/v1_1/io-test

client/.env.development.promanager

@@ -1,5 +1,5 @@
-VITE_APP_GRAPHQL_ENDPOINT=https://db.dev.bodyshop.app/v1/graphql
-VITE_APP_GRAPHQL_ENDPOINT_WS=wss://db.dev.bodyshop.app/v1/graphql
+VITE_APP_GRAPHQL_ENDPOINT=https://db.dev.imex.online/v1/graphql
+VITE_APP_GRAPHQL_ENDPOINT_WS=wss://db.dev.imex.online/v1/graphql
 VITE_APP_GA_CODE=231099835
 VITE_APP_FIREBASE_CONFIG={"apiKey":"AIzaSyDPLT8GiDHDR1R4nI66Qi0BY1aYviDPioc","authDomain":"imex-dev.firebaseapp.com","databaseURL":"https://imex-dev.firebaseio.com","projectId":"imex-dev","storageBucket":"imex-dev.appspot.com","messagingSenderId":"759548147434","appId":"1:759548147434:web:e8239868a48ceb36700993","measurementId":"G-K5XRBVVB4S"}
 VITE_APP_CLOUDINARY_ENDPOINT_API=https://api.cloudinary.com/v1_1/io-test

client/.env.development.rome

@@ -1,7 +1,8 @@
-VITE_APP_GRAPHQL_ENDPOINT=https://db.dev.bodyshop.app/v1/graphql
-VITE_APP_GRAPHQL_ENDPOINT_WS=wss://db.dev.bodyshop.app/v1/graphql
+VITE_APP_GRAPHQL_ENDPOINT=https://db.dev.imex.online/v1/graphql
+VITE_APP_GRAPHQL_ENDPOINT_WS=wss://db.dev.imex.online/v1/graphql
 VITE_APP_GA_CODE=231099835
-VITE_APP_FIREBASE_CONFIG={  "apiKey": "AIzaSyAuLQR9SV5LsVxjU8wh9hvFLdhcAHU6cxE",  "authDomain": "rome-prod-1.firebaseapp.com",  "projectId": "rome-prod-1",  "storageBucket": "rome-prod-1.appspot.com",  "messagingSenderId": "147786367145",  "appId": "1:147786367145:web:9d4cba68071c3f29a8a9b8",  "measurementId": "G-G8Z9DRHTZS"}
+# VITE_APP_FIREBASE_CONFIG={  "apiKey": "AIzaSyAuLQR9SV5LsVxjU8wh9hvFLdhcAHU6cxE",  "authDomain": "rome-prod-1.firebaseapp.com",  "projectId": "rome-prod-1",  "storageBucket": "rome-prod-1.appspot.com",  "messagingSenderId": "147786367145",  "appId": "1:147786367145:web:9d4cba68071c3f29a8a9b8",  "measurementId": "G-G8Z9DRHTZS"}
+VITE_APP_FIREBASE_CONFIG={"apiKey":"AIzaSyDPLT8GiDHDR1R4nI66Qi0BY1aYviDPioc","authDomain":"imex-dev.firebaseapp.com","databaseURL":"https://imex-dev.firebaseio.com","projectId":"imex-dev","storageBucket":"imex-dev.appspot.com","messagingSenderId":"759548147434","appId":"1:759548147434:web:e8239868a48ceb36700993","measurementId":"G-K5XRBVVB4S"}
 VITE_APP_CLOUDINARY_ENDPOINT_API=https://api.cloudinary.com/v1_1/io-test
 VITE_APP_CLOUDINARY_ENDPOINT=https://res.cloudinary.com/io-test
 VITE_APP_CLOUDINARY_API_KEY=957865933348715

client/index.html

@@ -2,6 +2,9 @@
 <html lang="en">
 <head>
   <meta charset="utf-8"/>
+  <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
+  <meta http-equiv="Pragma" content="no-cache">
+  <meta http-equiv="Expires" content="0">
   <% if (env.VITE_APP_INSTANCE === 'IMEX') { %>
   <link rel="icon" href="/favicon.png"/>
   <% } %> <% if (env.VITE_APP_INSTANCE === 'ROME') { %>
@@ -46,77 +49,23 @@
   <% } %> <% if (env.VITE_APP_INSTANCE === 'ROME') { %>
   <meta name="description" content="Rome Online"/>
   <title>Rome Online</title>
-
-  <!--Use the below code snippet to provide real time updates to the live chat plugin without the need of copying and paste each time to your website when changes are made via PBX-->
-
-  <call-us-selector phonesystem-url=https://rometech.east.3cx.us:5001
-                    party="LiveChat528346"></call-us-selector>
-
-  <!--Incase you don't want real time updates to the live chat plugin when options are changed, use the below code snippet. Please note that each time you change the settings you will need to copy and paste the snippet code to your website-->
-
-  <!--<call-us
-  
-  phonesystem-url=https://rometech.east.3cx.us:5001
-  
-  style="position:fixed;font-size:16px;line-height:17px;z-index: 99999;right: 20px; bottom: 20px;"
-  
-  id="wp-live-chat-by-3CX"
-  
-  minimized="true"
-  
-  animation-style="noanimation"
-  
-  party="LiveChat528346"
-  
-  minimized-style="bubbleright"
-  
-  allow-call="true"
-  
-  allow-video="false"
-  
-  allow-soundnotifications="true"
-  
-  enable-mute="true"
-  
-  enable-onmobile="true"
-  
-  offline-enabled="true"
-  
-  enable="true"
-  
-  ignore-queueownership="false"
-  
-  authentication="both"
-  
-  show-operator-actual-name="true"
-  
-  aknowledge-received="true"
-  
-  gdpr-enabled="false"
-  
-  message-userinfo-format="name"
-  
-  message-dateformat="both"
-  
-  lang="browser"
-  
-  button-icon-type="default"
-  
-  greeting-visibility="none"
-  
-  greeting-offline-visibility="none"
-  
-  chat-delay="2000"
-  
-  enable-direct-call="true"
-  
-  enable-ga="false"
-  
-  ></call-us>-->
-
-  <script defer src=https://downloads-global.3cx.com/downloads/livechatandtalk/v1/callus.js
-          id="tcx-callus-js" charset="utf-8"></script>
-
+  <script type="text/javascript" id="zsiqchat">
+    var $zoho = $zoho || {};
+    $zoho.salesiq = $zoho.salesiq || {
+      widgetcode: "siq01bb8ac617280bdacddfeb528f07734dadc64ef3f05efef9f769c1ec171af666",
+      values: {},
+      ready: function () {
+      }
+    };
+    var d = document;
+    s = d.createElement("script");
+    s.type = "text/javascript";
+    s.id = "zsiqscript";
+    s.defer = true;
+    s.src = "https://salesiq.zohopublic.com/widget";
+    t = d.getElementsByTagName("script")[0];
+    t.parentNode.insertBefore(s, t);
+  </script>
 
   <% } %> <% if (env.VITE_APP_INSTANCE === 'PROMANAGER') { %>
   <title>ProManager</title>

client/package-lock.json

@@ -7,6 +7,7 @@
     "": {
       "name": "bodyshop",
       "version": "0.2.1",
+      "hasInstallScript": true,
       "dependencies": {
         "@ant-design/pro-layout": "^7.19.12",
         "@apollo/client": "^3.11.4",
@@ -109,7 +110,8 @@
         "vite-plugin-legacy": "^2.1.0",
         "vite-plugin-node-polyfills": "^0.22.0",
         "vite-plugin-pwa": "^0.20.1",
-        "vite-plugin-style-import": "^2.0.0"
+        "vite-plugin-style-import": "^2.0.0",
+        "workbox-window": "^7.1.0"
       },
       "engines": {
         "node": ">=18.18.2"
@@ -18429,6 +18431,7 @@
       "resolved": "https://registry.npmjs.org/workbox-window/-/workbox-window-7.1.0.tgz",
       "integrity": "sha512-ZHeROyqR+AS5UPzholQRDttLFqGMwP0Np8MKWAdyxsDETxq3qOAyXvqessc3GniohG6e0mAqSQyKOHmT8zPF7g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@types/trusted-types": "^2.0.2",
         "workbox-core": "7.1.0"

client/package.json

@@ -84,6 +84,7 @@
     "web-vitals": "^3.5.2"
   },
   "scripts": {
+    "postinstall": "echo 'when updating react-big-calendar, remember to check to localizer in the calendar wrapper'",
     "analyze": "source-map-explorer 'build/static/js/*.js'",
     "start": "vite",
     "build": "dotenvx run --env-file=.env.development.imex -- vite build",
@@ -153,6 +154,7 @@
     "vite-plugin-legacy": "^2.1.0",
     "vite-plugin-node-polyfills": "^0.22.0",
     "vite-plugin-pwa": "^0.20.1",
-    "vite-plugin-style-import": "^2.0.0"
+    "vite-plugin-style-import": "^2.0.0",
+    "workbox-window": "^7.1.0"
   }
 }

client/src/App/App.jsx

@@ -18,7 +18,6 @@ import { checkUserSession } from "../redux/user/user.actions";
 import { selectBodyshop, selectCurrentEula, selectCurrentUser } from "../redux/user/user.selectors";
 import PrivateRoute from "../components/PrivateRoute";
 import "./App.styles.scss";
-import handleBeta from "../utils/handleBeta";
 import Eula from "../components/eula/eula.component";
 import InstanceRenderMgr from "../utils/instanceRenderMgr";
 import ProductFruitsWrapper from "./ProductFruitsWrapper.jsx";
@@ -108,8 +107,6 @@ export function App({ bodyshop, checkUserSession, currentUser, online, setOnline
     return <LoadingSpinner message={t("general.labels.loggingin")} />;
   }
 
-  handleBeta();
-
   if (!online) {
     return (
       <Result

client/src/components/bill-detail-edit/bill-detail-edit-component.jsx

@@ -98,7 +98,7 @@ export function BillDetailEditcontainer({ setPartsOrderContext, insertAuditTrail
     });
 
     billlines.forEach((billline) => {
-      const { deductedfromlbr, inventories, jobline, ...il } = billline;
+      const { deductedfromlbr, inventories, jobline, original_actual_price, create_ppc, ...il } = billline;
       delete il.__typename;
 
       if (il.id) {

client/src/components/bill-form/bill-form.component.jsx

@@ -14,7 +14,6 @@ import dayjs from "../../utils/day";
 import InstanceRenderManager from "../../utils/instanceRenderMgr";
 import AlertComponent from "../alert/alert.component";
 import BillFormLinesExtended from "../bill-form-lines-extended/bill-form-lines-extended.component";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import FormFieldsChanged from "../form-fields-changed-alert/form-fields-changed-alert.component";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
 import JobSearchSelect from "../job-search-select/job-search-select.component";
@@ -22,6 +21,7 @@ import LayoutFormRow from "../layout-form-row/layout-form-row.component";
 import VendorSearchSelect from "../vendor-search-select/vendor-search-select.component";
 import BillFormLines from "./bill-form.lines.component";
 import { CalculateBillTotal } from "./bill-form.totals.utility";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -276,7 +276,7 @@ export function BillFormComponent({
             })
           ]}
         >
-          <FormDatePicker disabled={disabled} />
+          <DateTimePicker isDateOnly disabled={disabled} />
         </Form.Item>
         <Form.Item
           label={t("bills.fields.is_credit_memo")}

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

@@ -1,6 +1,6 @@
-import { DeleteFilled } from "@ant-design/icons";
+import { DeleteFilled, CopyFilled } from "@ant-design/icons";
 import { useLazyQuery, useMutation } from "@apollo/client";
-import { Button, Card, Col, Form, Input, Row, Space, Spin, Statistic, notification } from "antd";
+import { Button, Card, Col, Form, Input, Row, Space, Spin, Statistic, message, notification } from "antd";
 import axios from "axios";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
@@ -14,10 +14,12 @@ import { selectBodyshop } from "../../redux/user/user.selectors";
 import AuditTrailMapping from "../../utils/AuditTrailMappings";
 import CurrencyFormItemComponent from "../form-items-formatted/currency-form-item.component";
 import JobSearchSelectComponent from "../job-search-select/job-search-select.component";
+import { getCurrentUser } from "../../firebase/firebase.utils";
 
 const mapStateToProps = createStructuredSelector({
   cardPaymentModal: selectCardPayment,
-  bodyshop: selectBodyshop
+  bodyshop: selectBodyshop,
+  currentUser: getCurrentUser
 });
 
 const mapDispatchToProps = (dispatch) => ({
@@ -25,11 +27,17 @@ const mapDispatchToProps = (dispatch) => ({
   toggleModalVisible: () => dispatch(toggleModalVisible("cardPayment"))
 });
 
-const CardPaymentModalComponent = ({ bodyshop, cardPaymentModal, toggleModalVisible, insertAuditTrail }) => {
+const CardPaymentModalComponent = ({
+  bodyshop,
+  currentUser,
+  cardPaymentModal,
+  toggleModalVisible,
+  insertAuditTrail
+}) => {
   const { context, actions } = cardPaymentModal;
 
   const [form] = Form.useForm();
-
+  const [paymentLink, setPaymentLink] = useState();
   const [loading, setLoading] = useState(false);
   // const [insertPayment] = useMutation(INSERT_NEW_PAYMENT);
   const [insertPaymentResponse] = useMutation(INSERT_PAYMENT_RESPONSE);
@@ -37,7 +45,7 @@ const CardPaymentModalComponent = ({ bodyshop, cardPaymentModal, toggleModalVisi
 
   const [, { data, refetch, queryLoading }] = useLazyQuery(QUERY_RO_AND_OWNER_BY_JOB_PKS, {
     variables: { jobids: [context.jobid] },
-    skip: true
+    skip: !context?.jobid
   });
 
   //Initialize the intellipay window.
@@ -51,8 +59,7 @@ const CardPaymentModalComponent = ({ bodyshop, cardPaymentModal, toggleModalVisi
       //2024-04-25: Nothing is going to happen here anymore. We'll completely rely on the callback.
       //Add a slight delay to allow the refetch to properly get the data.
       setTimeout(() => {
-        if (actions && actions.refetch && typeof actions.refetch === "function")
-          actions.refetch();
+        if (actions && actions.refetch && typeof actions.refetch === "function") actions.refetch();
         setLoading(false);
         toggleModalVisible();
       }, 750);
@@ -86,7 +93,6 @@ const CardPaymentModalComponent = ({ bodyshop, cardPaymentModal, toggleModalVisi
     });
   };
 
-
   const handleIntelliPayCharge = async () => {
     setLoading(true);
     //Validate
@@ -101,7 +107,7 @@ const CardPaymentModalComponent = ({ bodyshop, cardPaymentModal, toggleModalVisi
       const response = await axios.post("/intellipay/lightbox_credentials", {
         bodyshop,
         refresh: !!window.intellipay,
-        paymentSplitMeta: form.getFieldsValue(),
+        paymentSplitMeta: form.getFieldsValue()
       });
 
       if (window.intellipay) {
@@ -126,6 +132,42 @@ const CardPaymentModalComponent = ({ bodyshop, cardPaymentModal, toggleModalVisi
     }
   };
 
+  const handleIntelliPayChargeShortLink = async () => {
+    setLoading(true);
+    //Validate
+    try {
+      await form.validateFields();
+    } catch (error) {
+      setLoading(false);
+      return;
+    }
+
+    try {
+      const { payments } = form.getFieldsValue();
+      const response = await axios.post("/intellipay/generate_payment_url", {
+        bodyshop,
+        amount: payments?.reduce((acc, val) => {
+          return acc + (val?.amount || 0);
+        }, 0),
+        account: payments && data && data.jobs.length > 0 ? data.jobs.map((j) => j.ro_number).join(", ") : null,
+        comment: btoa(JSON.stringify({ payments, userEmail: currentUser.email })),
+        paymentSplitMeta: form.getFieldsValue()
+      });
+      if (response.data) {
+        setPaymentLink(response.data?.shorUrl);
+        navigator.clipboard.writeText(response.data?.shorUrl);
+        message.success(t("general.actions.copied"));
+      }
+      setLoading(false);
+    } catch (error) {
+      notification.open({
+        type: "error",
+        message: t("job_payments.notifications.error.openingip")
+      });
+      setLoading(false);
+    }
+  };
+
   return (
     <Card title="Card Payment">
       <Spin spinning={loading}>
@@ -202,16 +244,14 @@ const CardPaymentModalComponent = ({ bodyshop, cardPaymentModal, toggleModalVisi
 
           <Form.Item
             shouldUpdate={(prevValues, curValues) =>
-              prevValues.payments?.map((p) => p?.jobid).join() !== curValues.payments?.map((p) => p?.jobid).join()
+              prevValues.payments?.map((p) => p?.jobid + p?.amount).join() !==
+              curValues.payments?.map((p) => p?.jobid + p?.amount).join()
             }
           >
             {() => {
               //If all of the job ids have been fileld in, then query and update the IP field.
               const { payments } = form.getFieldsValue();
-              if (
-                payments?.length > 0 &&
-                payments?.filter((p) => p?.jobid).length === payments?.length
-              ) {
+              if (payments?.length > 0 && payments?.filter((p) => p?.jobid).length === payments?.length) {
                 refetch({ jobids: payments.map((p) => p.jobid) });
               }
               return (
@@ -246,7 +286,6 @@ const CardPaymentModalComponent = ({ bodyshop, cardPaymentModal, toggleModalVisi
               const totalAmountToCharge = payments?.reduce((acc, val) => {
                 return acc + (val?.amount || 0);
               }, 0);
-
               return (
                 <Space style={{ float: "right" }}>
                   <Statistic title="Amount To Charge" value={totalAmountToCharge} precision={2} />
@@ -273,11 +312,36 @@ const CardPaymentModalComponent = ({ bodyshop, cardPaymentModal, toggleModalVisi
                   >
                     {t("job_payments.buttons.proceedtopayment")}
                   </Button>
+                  <Space direction="vertical" align="center">
+                    <Button
+                      type="primary"
+                      //  data-ipayname="submit"
+                      className="ipayfield"
+                      loading={queryLoading || loading}
+                      disabled={!(totalAmountToCharge > 0)}
+                      onClick={handleIntelliPayChargeShortLink}
+                    >
+                      {t("job_payments.buttons.create_short_link")}
+                    </Button>
+                  </Space>
                 </Space>
               );
             }}
           </Form.Item>
         </Form>
+        {paymentLink && (
+          <Space
+            style={{ cursor: "pointer", float: "right" }}
+            align="end"
+            onClick={() => {
+              navigator.clipboard.writeText(paymentLink);
+              message.success(t("general.actions.copied"));
+            }}
+          >
+            <div>{paymentLink}</div>
+            <CopyFilled />
+          </Space>
+        )}
       </Spin>
     </Card>
   );

client/src/components/contract-form/contract-form.component.jsx

@@ -8,8 +8,8 @@ import { DateFormatter } from "../../utils/DateFormatter";
 import ContractStatusSelector from "../contract-status-select/contract-status-select.component";
 import ContractsRatesChangeButton from "../contracts-rates-change-button/contracts-rates-change-button.component";
 import CourtesyCarFuelSlider from "../courtesy-car-fuel-select/courtesy-car-fuel-select.component";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import FormDateTimePicker from "../form-date-time-picker/form-date-time-picker.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component";
 import FormFieldsChanged from "../form-fields-changed-alert/form-fields-changed-alert.component";
 import InputPhone, { PhoneItemFormatterValidation } from "../form-items-formatted/phone-form-item.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
@@ -196,7 +196,7 @@ export default function ContractFormComponent({ form, create = false, selectedJo
                     }
                   ]}
                 >
-                  <FormDatePicker />
+                  <DateTimePicker isDateOnly />
                 </Form.Item>
                 {dlExpiresBeforeReturn && (
                   <Space style={{ color: "tomato" }}>
@@ -274,7 +274,7 @@ export default function ContractFormComponent({ form, create = false, selectedJo
           <InputPhone />
         </Form.Item>
         <Form.Item label={t("contracts.fields.driver_dob")} name="driver_dob">
-          <FormDatePicker />
+          <DateTimePicker isDateOnly />
         </Form.Item>
       </LayoutFormRow>
       <ContractsRatesChangeButton form={form} />

client/src/components/courtesy-car-form/courtesy-car-form.component.jsx

@@ -10,16 +10,12 @@ import { DateFormatter } from "../../utils/DateFormatter";
 import CourtesyCarFuelSlider from "../courtesy-car-fuel-select/courtesy-car-fuel-select.component";
 import CourtesyCarReadiness from "../courtesy-car-readiness-select/courtesy-car-readiness-select.component";
 import CourtesyCarStatus from "../courtesy-car-status-select/courtesy-car-status-select.component";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import FormFieldsChanged from "../form-fields-changed-alert/form-fields-changed-alert.component";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
-export default function CourtesyCarCreateFormComponent({
-  form,
-  saveLoading,
-  newCC,
-}) {
+export default function CourtesyCarCreateFormComponent({ form, saveLoading, newCC }) {
   const { t } = useTranslation();
   const client = useApolloClient();
 
@@ -161,16 +157,16 @@ export default function CourtesyCarCreateFormComponent({
           <Input />
         </Form.Item>
         <Form.Item label={t("courtesycars.fields.purchasedate")} name="purchasedate">
-          <FormDatePicker />
+          <DateTimePicker isDateOnly />
         </Form.Item>
         <Form.Item label={t("courtesycars.fields.servicestartdate")} name="servicestartdate">
-          <FormDatePicker />
+          <DateTimePicker isDateOnly />
         </Form.Item>
         <Form.Item label={t("courtesycars.fields.serviceenddate")} name="serviceenddate">
-          <FormDatePicker />
+          <DateTimePicker isDateOnly />
         </Form.Item>
         <Form.Item label={t("courtesycars.fields.leaseenddate")} name="leaseenddate">
-          <FormDatePicker />
+          <DateTimePicker isDateOnly />
         </Form.Item>
       </LayoutFormRow>
 
@@ -228,7 +224,7 @@ export default function CourtesyCarCreateFormComponent({
         </div>
         <div>
           <Form.Item label={t("courtesycars.fields.nextservicedate")} name="nextservicedate">
-            <FormDatePicker />
+            <DateTimePicker isDateOnly />
           </Form.Item>
           <Form.Item shouldUpdate={(p, c) => p.nextservicedate !== c.nextservicedate}>
             {() => {
@@ -260,7 +256,7 @@ export default function CourtesyCarCreateFormComponent({
         </Form.Item>
         <div>
           <Form.Item label={t("courtesycars.fields.registrationexpires")} name="registrationexpires">
-            <FormDatePicker />
+            <DateTimePicker isDateOnly />
           </Form.Item>
           <Form.Item shouldUpdate={(p, c) => p.registrationexpires !== c.registrationexpires}>
             {() => {
@@ -293,7 +289,7 @@ export default function CourtesyCarCreateFormComponent({
               }
             ]}
           >
-            <FormDatePicker />
+            <DateTimePicker isDateOnly />
           </Form.Item>
           <Form.Item shouldUpdate={(p, c) => p.insuranceexpires !== c.insuranceexpires}>
             {() => {

client/src/components/courtesy-car-return-modal/courtesy-car-return-modal.component.jsx

@@ -2,7 +2,7 @@ import { Form, InputNumber } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import CourtesyCarFuelSlider from "../courtesy-car-fuel-select/courtesy-car-fuel-select.component";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 export default function CourtesyCarReturnModalComponent() {
   const { t } = useTranslation();
@@ -19,7 +19,7 @@ export default function CourtesyCarReturnModalComponent() {
           }
         ]}
       >
-        <FormDatePicker />
+        <DateTimePicker isDateOnly />
       </Form.Item>
       <Form.Item
         label={t("contracts.fields.kmend")}

client/src/components/dms-post-form/dms-post-form.component.jsx

@@ -24,9 +24,9 @@ import i18n from "../../translations/i18n";
 import dayjs from "../../utils/day";
 import DmsCdkMakes from "../dms-cdk-makes/dms-cdk-makes.component";
 import DmsCdkMakesRefetch from "../dms-cdk-makes/dms-cdk-makes.refetch.component";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -164,7 +164,7 @@ export function DmsPostForm({ bodyshop, socket, job, logsRef }) {
                 <Input disabled />
               </Form.Item>
               <Form.Item name="inservicedate" label={t("jobs.fields.dms.inservicedate")}>
-                <FormDatePicker />
+                <DateTimePicker isDateOnly />
               </Form.Item>
             </LayoutFormRow>
             <Space>

client/src/components/eula/eula.component.jsx

@@ -4,7 +4,6 @@ import Markdown from "react-markdown";
 import { createStructuredSelector } from "reselect";
 import { selectCurrentEula, selectCurrentUser } from "../../redux/user/user.selectors";
 import { connect } from "react-redux";
-import { FormDatePicker } from "../form-date-picker/form-date-picker.component";
 import { INSERT_EULA_ACCEPTANCE } from "../../graphql/user.queries";
 import { useMutation } from "@apollo/client";
 import { acceptEula } from "../../redux/user/user.actions";
@@ -12,6 +11,7 @@ import { useTranslation } from "react-i18next";
 import day from "../../utils/day";
 
 import "./eula.styles.scss";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 const Eula = ({ currentEula, currentUser, acceptEula }) => {
   const [formReady, setFormReady] = useState(false);
@@ -216,7 +216,7 @@ const EulaFormComponent = ({ form, handleChange, onFinish, t }) => (
               }
             ]}
           >
-            <FormDatePicker onChange={handleChange} onlyToday aria-label={t("eula.labels.date_accepted")} />
+            <DateTimePicker isDateOnly onChange={handleChange} onlyToday aria-label={t("eula.labels.date_accepted")} />
           </Form.Item>
         </Col>
       </Row>

client/src/components/form-date-picker/form-date-picker.component.jsx

@@ -1,123 +0,0 @@
-import { DatePicker } from "antd";
-import dayjs from "../../utils/day";
-import React, { useRef } from "react";
-
-import { connect } from "react-redux";
-import { createStructuredSelector } from "reselect";
-import { selectBodyshop } from "../../redux/user/user.selectors";
-
-const mapStateToProps = createStructuredSelector({
-  bodyshop: selectBodyshop
-});
-const mapDispatchToProps = (dispatch) => ({
-  //setUserLanguage: language => dispatch(setUserLanguage(language))
-});
-export default connect(mapStateToProps, mapDispatchToProps)(FormDatePicker);
-
-const dateFormat = "MM/DD/YYYY";
-
-export function FormDatePicker({
-  bodyshop,
-  value,
-  onChange,
-  onBlur,
-  onlyFuture,
-  onlyToday,
-  isDateOnly = true,
-  ...restProps
-}) {
-  const ref = useRef();
-
-  const handleChange = (newDate) => {
-    if (value !== newDate && onChange) {
-      onChange(isDateOnly ? newDate && newDate.format("YYYY-MM-DD") : newDate);
-    }
-  };
-
-  const handleKeyDown = (e) => {
-    if (e.key.toLowerCase() === "t") {
-      if (onChange) {
-        onChange(isDateOnly ? dayjs().format("YYYY-MM-DD") : dayjs());
-      }
-    } else if (e.key.toLowerCase() === "enter") {
-      if (ref.current && ref.current.blur) ref.current.blur();
-    }
-  };
-
-  const handleBlur = (e) => {
-    const v = e.target.value;
-    if (!v) return;
-
-    const formats = [
-      "MMDDYY",
-      "MMDDYYYY",
-      "MM/DD/YY",
-      "MM/DD/YYYY",
-      "M/DD/YY",
-      "M/DD/YYYY",
-      "MM/D/YY",
-      "MM/D/YYYY",
-      "M/D/YY",
-      "M/D/YYYY",
-      "D/MM/YY",
-      "D/MM/YYYY",
-      "DD/M/YY",
-      "DD/M/YYYY",
-      "D/M/YY",
-      "D/M/YYYY"
-    ];
-
-    let _a;
-
-    // Iterate through formats to find the correct one
-    for (let format of formats) {
-      _a = dayjs(v, format);
-      if (v === _a.format(format)) {
-        break;
-      }
-    }
-
-    if (_a.isValid() && value && value.isValid && value.isValid()) {
-      _a.set({
-        hours: value.hours(),
-        minutes: value.minutes(),
-        seconds: value.seconds(),
-        milliseconds: value.milliseconds()
-      });
-    }
-
-    if (_a.isValid() && onChange) {
-      if (onlyFuture) {
-        if (dayjs().subtract(1, "day").isBefore(_a)) {
-          onChange(isDateOnly ? _a.format("YYYY-MM-DD") : _a);
-        } else {
-          onChange(isDateOnly ? dayjs().format("YYYY-MM-DD") : dayjs());
-        }
-      } else {
-        onChange(isDateOnly ? _a.format("YYYY-MM-DD") : _a);
-      }
-    }
-  };
-
-  return (
-    <div onKeyDown={handleKeyDown}>
-      <DatePicker
-        ref={ref}
-        value={value ? dayjs(value) : null}
-        onChange={handleChange}
-        format={dateFormat}
-        onBlur={onBlur || handleBlur}
-        showToday={false}
-        disabledTime
-        disabledDate={(d) => {
-          if (onlyToday) {
-            return !dayjs().isSame(d, "day");
-          } else if (onlyFuture) {
-            return dayjs().subtract(1, "day").isAfter(d);
-          }
-        }}
-        {...restProps}
-      />
-    </div>
-  );
-}

client/src/components/form-date-time-picker-enhanced/form-date-time-picker-enhanced.component.jsx

@@ -1,48 +0,0 @@
-import { DatePicker } from "antd";
-import dayjs from "../../utils/day.js";
-import React, { useRef } from "react";
-
-import { connect } from "react-redux";
-import { createStructuredSelector } from "reselect";
-import { selectBodyshop } from "../../redux/user/user.selectors.js";
-
-const mapStateToProps = createStructuredSelector({
-  bodyshop: selectBodyshop
-});
-const mapDispatchToProps = (dispatch) => ({
-  //setUserLanguage: language => dispatch(setUserLanguage(language))
-});
-export default connect(mapStateToProps, mapDispatchToProps)(FormDateTimePickerEnhanced);
-
-const dateFormat = "MM/DD/YYYY h:mm a";
-
-export function FormDateTimePickerEnhanced({
-  bodyshop,
-  value,
-  onBlur,
-  onlyFuture,
-  onlyToday,
-  isDateOnly = true,
-  ...restProps
-}) {
-  const ref = useRef();
-  return (
-    <div>
-      <DatePicker
-        ref={ref}
-        value={value ? dayjs(value) : null}
-        format={dateFormat}
-        onBlur={onBlur}
-        showToday={false}
-        disabledDate={(d) => {
-          if (onlyToday) {
-            return !dayjs().isSame(d, "day");
-          } else if (onlyFuture) {
-            return dayjs().subtract(1, "day").isAfter(d);
-          }
-        }}
-        {...restProps}
-      />
-    </div>
-  );
-}

client/src/components/form-date-time-picker/form-date-time-picker.component.jsx

@@ -1,46 +1,105 @@
-import React, { forwardRef } from "react";
-//import DatePicker from "react-datepicker";
-//import "react-datepicker/src/stylesheets/datepicker.scss";
-import { Space, TimePicker } from "antd";
+import { DatePicker } from "antd";
+import PropTypes from "prop-types";
+import React, { useCallback, useState } from "react";
+import { useTranslation } from "react-i18next";
 import dayjs from "../../utils/day";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
-//To be used as a form element only.
+import { fuzzyMatchDate } from "./formats.js";
 
-const DateTimePicker = ({ value, onChange, onBlur, id, onlyFuture, ...restProps }, ref) => {
-  // const handleChange = (newDate) => {
-  //   if (value !== newDate && onChange) {
-  //     onChange(newDate);
-  //   }
-  // };
+const DateTimePicker = ({ value, onChange, onBlur, id, onlyFuture, onlyToday, isDateOnly = false, ...restProps }) => {
+  const [isManualInput, setIsManualInput] = useState(false);
+  const { t } = useTranslation();
+
+  const handleChange = useCallback(
+    (newDate) => {
+      if (onChange) {
+        onChange(newDate || null);
+      }
+      setIsManualInput(false);
+    },
+    [onChange]
+  );
+
+  const handleBlur = useCallback(
+    (e) => {
+      // Bail if this is not a manual input
+      if (!isManualInput) {
+        return;
+      }
+      // Reset manual input flag
+      setIsManualInput(false);
+
+      const v = e?.target?.value;
+
+      if (!v) return;
+
+      let parsedDate = isDateOnly ? fuzzyMatchDate(v)?.startOf("day") : fuzzyMatchDate(v);
+
+      if (parsedDate && onChange) {
+        onChange(parsedDate);
+      }
+    },
+    [isManualInput, isDateOnly, onChange]
+  );
+
+  const handleKeyDown = useCallback(
+    (e) => {
+      setIsManualInput(true);
+
+      if (e.key.toLowerCase() === "t" && onChange) {
+        e.preventDefault();
+        setIsManualInput(false);
+        onChange(dayjs());
+      } else if (e.key.toLowerCase() === "enter") {
+        handleBlur(e);
+      }
+    },
+    [onChange, handleBlur]
+  );
+
+  const handleDisabledDate = useCallback(
+    (current) => {
+      if (onlyToday) {
+        return !dayjs().isSame(current, "day");
+      } else if (onlyFuture) {
+        return dayjs().subtract(1, "day").isAfter(current);
+      }
+      return false;
+    },
+    [onlyToday, onlyFuture]
+  );
 
   return (
-    <Space direction="vertical" style={{ width: "100%" }} id={id}>
-      <FormDatePicker
-        {...restProps}
-        {...(onlyFuture && {
-          disabledDate: (d) => dayjs().subtract(1, "day").isAfter(d)
-        })}
-        value={value}
-        onBlur={onBlur}
-        onChange={onChange}
-        onlyFuture={onlyFuture}
-        isDateOnly={false}
-      />
-
-      <TimePicker
+    <div onKeyDown={handleKeyDown} id={id} style={{ width: "100%" }}>
+      <DatePicker
+        showTime={
+          isDateOnly
+            ? false
+            : {
+                format: "hh:mm a",
+                minuteStep: 15,
+                defaultValue: dayjs(dayjs(), "HH:mm:ss")
+              }
+        }
+        format={isDateOnly ? "MM/DD/YYYY" : "MM/DD/YYYY hh:mm a"}
         value={value ? dayjs(value) : null}
-        {...(onlyFuture && {
-          disabledDate: (d) => dayjs().isAfter(d)
-        })}
-        onChange={onChange}
-        disableSeconds={true}
-        minuteStep={15}
-        onBlur={onBlur}
-        format="hh:mm a"
+        onChange={handleChange}
+        placeholder={isDateOnly ? t("general.labels.date") : t("general.labels.datetime")}
+        onBlur={onBlur || handleBlur}
+        disabledDate={handleDisabledDate}
         {...restProps}
       />
-    </Space>
+    </div>
   );
 };
 
-export default forwardRef(DateTimePicker);
+DateTimePicker.propTypes = {
+  value: PropTypes.any,
+  onChange: PropTypes.func,
+  onBlur: PropTypes.func,
+  id: PropTypes.string,
+  onlyFuture: PropTypes.bool,
+  onlyToday: PropTypes.bool,
+  isDateOnly: PropTypes.bool
+};
+
+export default React.memo(DateTimePicker);

client/src/components/form-date-time-picker/formats.js

@@ -0,0 +1,63 @@
+import dayjs from "../../utils/day";
+
+const dateFormats = [
+  "MMDDYYYY",
+  "MMDDYY",
+  "M/D/YYYY",
+  "MM/D/YYYY",
+  "M/DD/YYYY",
+  "MM/DD/YYYY",
+  "M/D/YY",
+  "MM/D/YY",
+  "M/DD/YY",
+  "MM/DD/YY"
+];
+
+const timeFormats = ["h:mm A", "h:mmA", "h A", "hA", "hh:mm A", "hh:mm:ss A"];
+
+const dateTimeFormats = [
+  ...["M/D/YYYY", "MM/D/YYYY", "M/DD/YYYY", "MM/DD/YYYY", "M/D/YY", "MM/D/YY", "M/DD/YY", "MM/DD/YY"].flatMap(
+    (dateFormat) => timeFormats.map((timeFormat) => `${dateFormat} ${timeFormat}`)
+  ),
+
+  ...["MMDDYYYY", "MMDDYY"].flatMap((dateFormat) => timeFormats.map((timeFormat) => `${dateFormat} ${timeFormat}`)),
+
+  "M/D/YYYY",
+  "MM/D/YYYY",
+  "M/DD/YYYY",
+  "MM/DD/YYYY",
+  "M/D/YY",
+  "MM/D/YY",
+  "M/DD/YY",
+  "MM/DD/YY",
+  "MMDDYYYY",
+  "MMDDYY"
+];
+
+const sanitizeInput = (input) =>
+  input
+    .trim()
+    .toUpperCase()
+    .replace(/\s*(am|pm)\s*/i, " $1")
+    .replaceAll(".", "/")
+    .replaceAll("-", "/");
+
+export const fuzzyMatchDate = (dateString) => {
+  const sanitizedInput = sanitizeInput(dateString);
+
+  for (const format of dateFormats) {
+    const parsedDate = dayjs(sanitizedInput, format, true);
+    if (parsedDate.isValid()) {
+      return parsedDate;
+    }
+  }
+
+  for (const format of dateTimeFormats) {
+    const parsedDateTime = dayjs(sanitizedInput, format, true);
+    if (parsedDateTime.isValid()) {
+      return parsedDateTime; // Return the dayjs object
+    }
+  }
+
+  return null; // If no matching format is found
+};

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

@@ -13,7 +13,6 @@ import Icon, {
   FileFilled,
   HomeFilled,
   ImportOutlined,
-  InfoCircleOutlined,
   LineChartOutlined,
   PaperClipOutlined,
   PhoneOutlined,
@@ -27,8 +26,8 @@ import Icon, {
   UserOutlined
 } from "@ant-design/icons";
 import { useSplitTreatments } from "@splitsoftware/splitio-react";
-import { Layout, Menu, Switch, Tooltip } from "antd";
-import React, { useEffect, useState } from "react";
+import { Layout, Menu } from "antd";
+import React from "react";
 import { useTranslation } from "react-i18next";
 import { BsKanban } from "react-icons/bs";
 import { FaCalendarAlt, FaCarCrash, FaCreditCard, FaFileInvoiceDollar, FaTasks } from "react-icons/fa";
@@ -43,7 +42,6 @@ import { selectRecentItems, selectSelectedHeader } from "../../redux/application
 import { setModalContext } from "../../redux/modals/modals.actions";
 import { signOutStart } from "../../redux/user/user.actions";
 import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
-import { checkBeta, handleBeta, setBeta } from "../../utils/handleBeta";
 import InstanceRenderManager from "../../utils/instanceRenderMgr";
 import { HasFeatureAccess } from "../feature-wrapper/feature-wrapper.component";
 
@@ -115,20 +113,22 @@ function Header({
     names: ["ImEXPay", "DmsAp", "Simple_Inventory"],
     splitKey: bodyshop && bodyshop.imexshopid
   });
-  const [betaSwitch, setBetaSwitch] = useState(false);
+
   const { t } = useTranslation();
 
-  useEffect(() => {
-    const isBeta = checkBeta();
-    setBetaSwitch(isBeta);
-  }, []);
-
-  const betaSwitchChange = (checked) => {
-    setBeta(checked);
-    setBetaSwitch(checked);
-    handleBeta();
+  const deleteBetaCookie = () => {
+    const cookieExists = document.cookie.split("; ").some((row) => row.startsWith(`betaSwitchImex=`));
+    if (cookieExists) {
+      const domain = window.location.hostname.split(".").slice(-2).join(".");
+      document.cookie = `betaSwitchImex=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/; domain=.${domain}`;
+      console.log(`betaSwitchImex cookie deleted`);
+    } else {
+      console.log(`betaSwitchImex cookie does not exist`);
+    }
   };
 
+  deleteBetaCookie();
+
   const accountingChildren = [];
 
   if (
@@ -695,31 +695,6 @@ function Header({
     }
   ];
 
-  InstanceRenderManager({
-    executeFunction: true,
-    args: [],
-    imex: () => {
-      menuItems.push({
-        key: "beta-switch",
-        id: "header-beta-switch",
-        style: { marginLeft: "auto" },
-        label: (
-          <Tooltip
-            title={`A more modern ${InstanceRenderManager({
-              imex: t("titles.imexonline"),
-              rome: t("titles.romeonline"),
-              promanager: t("titles.promanager")
-            })} is ready for you to try! You can switch back at any time.`}
-          >
-            <InfoCircleOutlined />
-            <span style={{ marginRight: 8 }}>Try the new app</span>
-            <Switch checked={betaSwitch} onChange={betaSwitchChange} />
-          </Tooltip>
-        )
-      });
-    }
-  });
-
   return (
     <Layout.Header>
       <Menu

client/src/components/job-scoreboard-add-button/job-scoreboard-add-button.component.jsx

@@ -10,8 +10,8 @@ import {
   QUERY_SCOREBOARD_ENTRY,
   UPDATE_SCOREBOARD_ENTRY
 } from "../../graphql/scoreboard.queries";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import LoadingSpinner from "../loading-spinner/loading-spinner.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 export default function ScoreboardAddButton({ job, disabled, ...otherBtnProps }) {
   const { t } = useTranslation();
@@ -86,7 +86,7 @@ export default function ScoreboardAddButton({ job, disabled, ...otherBtnProps })
                 }
               ]}
             >
-              <FormDatePicker />
+              <DateTimePicker isDateOnly />
             </Form.Item>
             <Form.Item
               label={t("scoreboard.fields.bodyhrs")}

client/src/components/job-totals-table/job-totals.table.totals.component.jsx

@@ -141,10 +141,14 @@ export function JobTotalsTableTotals({ bodyshop, job }) {
         key: t("jobs.fields.ded_amt"),
         total: job.job_totals.totals.custPayable.deductible
       },
-      // {
-      //   key: t("jobs.fields.federal_tax_payable"),
-      //   total: job.job_totals.totals.custPayable.federal_tax,
-      // },
+      ...(InstanceRenderManager({
+        imex: [{
+          key: t("jobs.fields.federal_tax_payable"),
+          total: job.job_totals.totals.custPayable.federal_tax
+        }],
+        rome: [],
+        promanager: "USE_ROME"
+      })),
       {
         key: t("jobs.fields.other_amount_payable"),
         total: job.job_totals.totals.custPayable.other_customer_amount

client/src/components/jobs-admin-dates/jobs-admin-dates.component.jsx

@@ -5,7 +5,6 @@ import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { UPDATE_JOB } from "../../graphql/jobs.queries";
 import AuditTrailMapping from "../../utils/AuditTrailMappings";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component";
 import FormFieldsChanged from "../form-fields-changed-alert/form-fields-changed-alert.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
@@ -20,7 +19,14 @@ const mapStateToProps = createStructuredSelector({
 });
 
 const mapDispatchToProps = (dispatch) => ({
-  insertAuditTrail: ({ jobid, operation, type }) => dispatch(insertAuditTrail({ jobid, operation, type }))
+  insertAuditTrail: ({ jobid, operation, type }) =>
+    dispatch(
+      insertAuditTrail({
+        jobid,
+        operation,
+        type
+      })
+    )
 });
 
 export default connect(mapStateToProps, mapDispatchToProps)(JobsAdminDatesChange);
@@ -87,7 +93,7 @@ export function JobsAdminDatesChange({ insertAuditTrail, job }) {
         <FormFieldsChanged form={form} />
         <LayoutFormRow header={t("jobs.forms.estdates")}>
           <Form.Item label={t("jobs.fields.date_estimated")} name="date_estimated">
-            <FormDatePicker format="MM/DD/YYYY" />
+            <DateTimePicker format="MM/DD/YYYY" isDateOnly />
           </Form.Item>
           <Form.Item label={t("jobs.fields.date_towin")} name="date_towin">
             <DateTimePicker />

client/src/components/jobs-create-jobs-info/jobs-create-jobs-info.component.jsx

@@ -1,18 +1,9 @@
-import {
-  Collapse,
-  Form,
-  Input,
-  InputNumber,
-  Select,
-  Space,
-  Switch,
-} from "antd";
+import { Collapse, Form, Input, InputNumber, Select, Space, Switch } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
 import FormItemEmail from "../form-items-formatted/email-form-item.component";
 import FormItemPhone, { PhoneItemFormatterValidation } from "../form-items-formatted/phone-form-item.component";
@@ -29,6 +20,7 @@ import JobsDetailRatesTaxes from "../jobs-detail-rates/jobs-detail-rates.taxes.c
 import JobsMarkPstExempt from "../jobs-mark-pst-exempt/jobs-mark-pst-exempt.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
 import InstanceRenderManager from "../../utils/instanceRenderMgr";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   //currentUser: selectCurrentUser
@@ -61,10 +53,7 @@ export function JobsCreateJobsInfo({ bodyshop, form, selected }) {
             <Form.Item label={t("jobs.fields.policy_no")} name="policy_no">
               <Input />
             </Form.Item>
-            <Form.Item
-              label={t("jobs.fields.regie_number")}
-              name="regie_number"
-            >
+            <Form.Item label={t("jobs.fields.regie_number")} name="regie_number">
               <Input />
             </Form.Item>
             <Form.Item label={t("jobs.fields.ins_co_nm")} name="ins_co_nm">
@@ -116,7 +105,7 @@ export function JobsCreateJobsInfo({ bodyshop, form, selected }) {
               <FormItemEmail email={getFieldValue("ins_ea")} />
             </Form.Item>
             <Form.Item label={t("jobs.fields.loss_date")} name="loss_date">
-              <FormDatePicker />
+              <DateTimePicker isDateOnly />
             </Form.Item>
             <Form.Item label={t("jobs.fields.kmin")} name="kmin">
               <Input />

client/src/components/jobs-create-vehicle-info/jobs-create-vehicle-info.new.component.jsx

@@ -2,9 +2,9 @@ import { Form, Input } from "antd";
 import React, { useContext } from "react";
 import { useTranslation } from "react-i18next";
 import JobCreateContext from "../../pages/jobs-create/jobs-create.context";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
 import JobsCreateVehicleInfoPredefined from "./jobs-create-vehicle-info.predefined.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 export default function JobsCreateVehicleInfoNewComponent({ form }) {
   const [state] = useContext(JobCreateContext);
@@ -113,7 +113,7 @@ export default function JobsCreateVehicleInfoNewComponent({ form }) {
           <Input disabled={!state.vehicle.new} />
         </Form.Item>
         <Form.Item label={t("vehicles.fields.v_prod_dt")} name={["vehicle", "data", "v_prod_dt"]}>
-          <FormDatePicker disabled={!state.vehicle.new} />
+          <DateTimePicker isDateOnly disabled={!state.vehicle.new} />
         </Form.Item>
       </LayoutFormRow>
       <LayoutFormRow grow>

client/src/components/jobs-detail-dates/jobs-detail-dates.component.jsx

@@ -5,7 +5,6 @@ import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectJobReadOnly } from "../../redux/application/application.selectors";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component";
 import FormRow from "../layout-form-row/layout-form-row.component";
 
@@ -30,7 +29,7 @@ export function JobsDetailDatesComponent({ jobRO, job, bodyshop }) {
     <div>
       <FormRow header={t("jobs.forms.estdates")}>
         <Form.Item label={t("jobs.fields.date_estimated")} name="date_estimated">
-          <FormDatePicker disabled={jobRO} />
+          <DateTimePicker disabled={jobRO} isDateOnly />
         </Form.Item>
         <Form.Item label={t("jobs.fields.date_open")} name="date_open">
           <DateTimePicker disabled={jobRO} />
@@ -45,7 +44,7 @@ export function JobsDetailDatesComponent({ jobRO, job, bodyshop }) {
 
       <FormRow header={t("jobs.forms.scheddates")}>
         <Form.Item label={t("jobs.fields.date_scheduled")} name="date_scheduled">
-          <FormDatePicker disabled={jobRO} />
+          <DateTimePicker disabled={jobRO} isDateOnly />
         </Form.Item>
         <Tooltip title={t("jobs.labels.scheduledinchange")}>
           <Form.Item label={t("jobs.fields.scheduled_in")} name="scheduled_in">
@@ -85,7 +84,6 @@ export function JobsDetailDatesComponent({ jobRO, job, bodyshop }) {
                 rules={[
                   {
                     required: jobInPostProduction
-                    //message: t("general.validation.required"),
                   }
                 ]}
               >

client/src/components/jobs-detail-general/jobs-detail-general.component.jsx

@@ -5,7 +5,6 @@ import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectJobReadOnly } from "../../redux/application/application.selectors";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
 import FormItemEmail from "../form-items-formatted/email-form-item.component";
 import FormItemPhone, { PhoneItemFormatterValidation } from "../form-items-formatted/phone-form-item.component";
@@ -13,6 +12,7 @@ import Car from "../job-damage-visual/job-damage-visual.component";
 import JobsDetailChangeEstimator from "../jobs-detail-change-estimator/jobs-detail-change-estimator.component";
 import JobsDetailChangeFileHandler from "../jobs-detail-change-filehandler/jobs-detail-change-filehandler.component";
 import FormRow from "../layout-form-row/layout-form-row.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   jobRO: selectJobReadOnly,
@@ -152,7 +152,7 @@ export function JobsDetailGeneral({ bodyshop, jobRO, job, form }) {
               <Input disabled={jobRO} />
             </Form.Item>
             <Form.Item label={t("jobs.fields.loss_date")} name="loss_date">
-              <FormDatePicker disabled={jobRO} />
+              <DateTimePicker isDateOnly disabled={jobRO} />
             </Form.Item>
             <Form.Item label={t("jobs.fields.loss_of_use")} name="loss_of_use">
               <Input disabled={jobRO} />

client/src/components/jobs-list/jobs-list.component.jsx

@@ -250,8 +250,8 @@ export function JobsList({ bodyshop }) {
     },
     {
       title: t("jobs.labels.estimator"),
-      dataIndex: "jobs.labels.estimator",
-      key: "jobs.labels.estimator",
+      dataIndex: "estimator",
+      key: "estimator",
       ellipsis: true,
       responsive: ["xl"],
       sorter: (a, b) =>

client/src/components/partner-ping/partner-ping.component.jsx

@@ -23,7 +23,7 @@ export function PartnerPingComponent({ bodyshop }) {
     // Execute the created function directly
     checkPartnerStatus(bodyshop);
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [bodyshop]);
+  }, [bodyshop?.id]);
 
   return <></>;
 }

client/src/components/parts-order-backorder-eta/parts-order-backorder-eta.component.jsx

@@ -8,8 +8,8 @@ import { logImEXEvent } from "../../firebase/firebase.utils";
 import { MUTATION_UPDATE_BO_ETA } from "../../graphql/parts-orders.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import { DateFormatter } from "../../utils/DateFormatter";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import { CalendarFilled } from "@ant-design/icons";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -62,7 +62,7 @@ export function PartsOrderBackorderEta({
     <div>
       <Form form={form} onFinish={handleFinish}>
         <Form.Item name="eta">
-          <FormDatePicker />
+          <DateTimePicker isDateOnly />
         </Form.Item>
         <Button type="primary" onClick={() => form.submit()}>
           {t("general.actions.save")}

client/src/components/parts-order-line-backorder-button/parts-order-line-backorder-button.component.jsx

@@ -7,7 +7,7 @@ import { createStructuredSelector } from "reselect";
 import { logImEXEvent } from "../../firebase/firebase.utils";
 import { MUTATION_BACKORDER_PART_LINE } from "../../graphql/parts-orders.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -71,7 +71,7 @@ export function PartsOrderLineBackorderButton({ partsOrderStatus, partsLineId, j
     <div>
       <Form form={form} onFinish={handleFinish}>
         <Form.Item name="eta">
-          <FormDatePicker />
+          <DateTimePicker isDateOnly />
         </Form.Item>
         <Button type="primary" onClick={() => form.submit()}>
           {t("parts_orders.actions.backordered")}

client/src/components/parts-order-list-table/parts-order-list-table-drawer.component.jsx

@@ -1,8 +1,7 @@
-import { DeleteFilled, EyeFilled } from "@ant-design/icons";
+import { DeleteFilled } from "@ant-design/icons";
 import { PageHeader } from "@ant-design/pro-layout";
 import { useLazyQuery, useMutation } from "@apollo/client";
 import { Button, Drawer, Grid, Popconfirm, Space, Table } from "antd";
-
 import queryString from "query-string";
 import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
@@ -83,47 +82,34 @@ export function PartsOrderListTableDrawerComponent({
     sortedInfo: {}
   });
 
-  const [returnfrombill, setReturnFromBill] = useState();
-  const [billData, setBillData] = useState();
+  const [billData, setBillData] = useState(null);
   const search = queryString.parse(useLocation().search);
   const selectedpartsorder = search.partsorderid;
 
-  const [billQuery] = useLazyQuery(QUERY_BILL_BY_PK);
   const [deletePartsOrder] = useMutation(DELETE_PARTS_ORDER);
   const parts_orders = billsQuery.data ? billsQuery.data.parts_orders : [];
   const { refetch } = billsQuery;
+  const [billQuery] = useLazyQuery(QUERY_BILL_BY_PK);
+  const selectedPartsOrderRecord = parts_orders.find((r) => r.id === selectedpartsorder);
 
   useEffect(() => {
-    if (returnfrombill === null) {
-      setBillData(null);
-    } else {
-      const fetchData = async () => {
-        const result = await billQuery({
-          variables: { billid: returnfrombill }
-        });
-        setBillData(result.data);
-      };
-      fetchData();
-    }
-  }, [returnfrombill, billQuery]);
+    const fetchData = async () => {
+      if (selectedPartsOrderRecord?.returnfrombill) {
+        try {
+          const { data } = await billQuery({
+            variables: { billid: selectedPartsOrderRecord.returnfrombill }
+          });
+          setBillData(data);
+        } catch (error) {
+          console.error("Error fetching bill data:", error);
+        }
+      } else setBillData(null);
+    };
+    fetchData();
+  }, [selectedPartsOrderRecord, billQuery]);
 
-  const recordActions = (record, showView = false) => (
+  const recordActions = (record) => (
     <Space direction="horizontal" wrap>
-      {showView && (
-        <Button
-          onClick={() => {
-            if (record.returnfrombill) {
-              setReturnFromBill(record.returnfrombill);
-            } else {
-              setReturnFromBill(null);
-            }
-            handleOnRowClick(record);
-          }}
-        >
-          <EyeFilled />
-        </Button>
-      )}
-
       <Button
         disabled={jobRO || record.return || record.vendor.id === bodyshop.inhousevendorid}
         onClick={() => {
@@ -133,16 +119,14 @@ export function PartsOrderListTableDrawerComponent({
             context: {
               jobId: job.id,
               job: job,
-              partsorderlines: record.parts_order_lines.map((pol) => {
-                return {
-                  joblineid: pol.job_line_id,
-                  id: pol.id,
-                  line_desc: pol.line_desc,
-                  quantity: pol.quantity,
-                  act_price: pol.act_price,
-                  oem_partno: pol.oem_partno
-                };
-              })
+              partsorderlines: record.parts_order_lines.map((pol) => ({
+                joblineid: pol.job_line_id,
+                id: pol.id,
+                line_desc: pol.line_desc,
+                quantity: pol.quantity,
+                act_price: pol.act_price,
+                oem_partno: pol.oem_partno
+              }))
             }
           });
         }}
@@ -167,7 +151,6 @@ export function PartsOrderListTableDrawerComponent({
         disabled={jobRO}
         onConfirm={async () => {
           //Delete the parts return.!
-
           await deletePartsOrder({
             variables: { partsOrderId: record.id },
             update(cache) {
@@ -191,7 +174,6 @@ export function PartsOrderListTableDrawerComponent({
           disabled={(jobRO ? !record.return : jobRO) || record.vendor.id === bodyshop.inhousevendorid}
           onClick={() => {
             logImEXEvent("parts_order_receive_bill");
-
             setBillEnterContext({
               actions: { refetch: refetch },
               context: {
@@ -199,24 +181,20 @@ export function PartsOrderListTableDrawerComponent({
                 bill: {
                   vendorid: record.vendor.id,
                   is_credit_memo: record.return,
-                  billlines: record.parts_order_lines.map((pol) => {
-                    return {
-                      joblineid: pol.job_line_id || "noline",
-                      line_desc: pol.line_desc,
-                      quantity: pol.quantity,
-
-                      actual_price: pol.act_price,
-
-                      cost_center: pol.jobline?.part_type
-                        ? bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid
-                          ? pol.jobline.part_type !== "PAE"
-                            ? pol.jobline.part_type
-                            : null
-                          : responsibilityCenters.defaults &&
-                            (responsibilityCenters.defaults.costs[pol.jobline.part_type] || null)
-                        : null
-                    };
-                  })
+                  billlines: record.parts_order_lines.map((pol) => ({
+                    joblineid: pol.job_line_id || "noline",
+                    line_desc: pol.line_desc,
+                    quantity: pol.quantity,
+                    actual_price: pol.act_price,
+                    cost_center: pol.jobline?.part_type
+                      ? bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid
+                        ? pol.jobline.part_type !== "PAE"
+                          ? pol.jobline.part_type
+                          : null
+                        : responsibilityCenters.defaults &&
+                          (responsibilityCenters.defaults.costs[pol.jobline.part_type] || null)
+                      : null
+                  }))
                 }
               }
             });
@@ -243,8 +221,6 @@ export function PartsOrderListTableDrawerComponent({
     setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
   };
 
-  const selectedPartsOrderRecord = parts_orders.find((r) => r.id === selectedpartsorder);
-
   const rowExpander = (record) => {
     const columns = [
       {

client/src/components/parts-order-modal/parts-order-modal-price-change.component.jsx

@@ -27,6 +27,10 @@ export default function PartsOrderModalPriceChange({ form, field }) {
         key: "25",
         label: t("parts_orders.labels.discount", { percent: "25%" })
       },
+      {
+        key: "40",
+        label: t("parts_orders.labels.discount", { percent: "40%" })
+      },
       {
         key: "custom",
         label: (

client/src/components/parts-order-modal/parts-order-modal.component.jsx

@@ -6,12 +6,12 @@ import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
 import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
 import VendorSearchSelect from "../vendor-search-select/vendor-search-select.component";
 import PartsOrderModalPriceChange from "./parts-order-modal-price-change.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -74,7 +74,7 @@ export function PartsOrderModalComponent({ bodyshop, vendorList, sendTypeState,
           ]}
           label={t("parts_orders.fields.deliver_by")}
         >
-          <FormDatePicker onlyFuture />
+          <DateTimePicker isDateOnly onlyFuture />
         </Form.Item>
         {job && job.special_coverage_policy && (
           <Tag color="tomato">

client/src/components/payment-form/payment-form.component.jsx

@@ -5,11 +5,11 @@ import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import DatePickerFormItem from "../form-date-picker/form-date-picker.component";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
 import JobSearchSelect from "../job-search-select/job-search-select.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
 import PaymentFormTotalPayments from "./payment-form.totalpayments.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -77,7 +77,7 @@ export function PaymentFormComponent({ form, bodyshop, disabled }) {
             }
           ]}
         >
-          <DatePickerFormItem disabled={disabled} />
+          <DateTimePicker isDateOnly disabled={disabled} />
         </Form.Item>
       </LayoutFormRow>
 

client/src/components/payments-generate-link/payments-generate-link.component.jsx

@@ -8,11 +8,12 @@ import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { openChatByPhone, setMessage } from "../../redux/messaging/messaging.actions";
-import { selectBodyshop } from "../../redux/user/user.selectors";
+import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
 import CurrencyFormItemComponent from "../form-items-formatted/currency-form-item.component";
 
 const mapStateToProps = createStructuredSelector({
-  bodyshop: selectBodyshop
+  bodyshop: selectBodyshop,
+  currentUser: selectCurrentUser
 });
 const mapDispatchToProps = (dispatch) => ({
   openChatByPhone: (phone) => dispatch(openChatByPhone(phone)),
@@ -20,7 +21,7 @@ const mapDispatchToProps = (dispatch) => ({
 });
 export default connect(mapStateToProps, mapDispatchToProps)(PaymentsGenerateLink);
 
-export function PaymentsGenerateLink({ bodyshop, callback, job, openChatByPhone, setMessage }) {
+export function PaymentsGenerateLink({ bodyshop, currentUser, callback, job, openChatByPhone, setMessage }) {
   const { t } = useTranslation();
   const [form] = Form.useForm();
 
@@ -30,29 +31,35 @@ export function PaymentsGenerateLink({ bodyshop, callback, job, openChatByPhone,
 
   const handleFinish = async ({ amount }) => {
     setLoading(true);
-
-    const p = parsePhoneNumber(job.ownr_ph1, "CA");
+    let p;
+    try {
+      p = parsePhoneNumber(job.ownr_ph1 || "", "CA");
+    } catch (error) {
+      console.log("Unable to parse phone number");
+    }
     setLoading(true);
     const response = await axios.post("/intellipay/generate_payment_url", {
       bodyshop,
       amount: amount,
       account: job.ro_number,
-      invoice: job.id
+      comment: btoa(JSON.stringify({ payments: [{ jobid: job.id, amount }], userEmail: currentUser.email }))
     });
     setLoading(false);
     setPaymentLink(response.data.shorUrl);
 
-    openChatByPhone({
-      phone_num: p.formatInternational(),
-      jobid: job.id
-    });
-    setMessage(
-      t("payments.labels.smspaymentreminder", {
-        shopname: bodyshop.shopname,
-        amount: amount,
-        payment_link: response.data.shorUrl
-      })
-    );
+    if (p) {
+      openChatByPhone({
+        phone_num: p.formatInternational(),
+        jobid: job.id
+      });
+      setMessage(
+        t("payments.labels.smspaymentreminder", {
+          shopname: bodyshop.shopname,
+          amount: amount,
+          payment_link: response.data.shorUrl
+        })
+      );
+    }
 
     //Add in confirmation & errors.
     if (callback) callback();

client/src/components/production-board-kanban/production-board-kanban-card.component.jsx

@@ -6,11 +6,11 @@ import {
   PauseCircleOutlined
 } from "@ant-design/icons";
 import { Card, Col, Row, Space, Tooltip } from "antd";
+import Dinero from "dinero.js";
 import React, { useMemo } from "react";
 import { useTranslation } from "react-i18next";
 import { Link } from "react-router-dom";
 import { DateTimeFormatter } from "../../utils/DateFormatter";
-import Dinero from "dinero.js";
 
 import ProductionAlert from "../production-list-columns/production-list-columns.alert.component";
 import ProductionListColumnProductionNote from "../production-list-columns/production-list-columns.productionnote.component";
@@ -18,8 +18,8 @@ import ProductionSubletsManageComponent from "../production-sublets-manage/produ
 
 import dayjs from "../../utils/day";
 
-import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
 import JobPartsQueueCount from "../job-parts-queue-count/job-parts-queue-count.component";
+import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
 
 const cardColor = (ssbuckets, totalHrs) => {
   const bucket = ssbuckets.find((bucket) => bucket.gte <= totalHrs && (!bucket.lt || bucket.lt > totalHrs));
@@ -213,21 +213,13 @@ const EstimatorToolTip = ({ metadata, cardSettings }) => {
 };
 
 const SubtotalTooltip = ({ metadata, cardSettings, t }) => {
-  const amount = metadata?.job_totals?.totals?.subtotal?.amount;
-  const dineroAmount = amount ? Dinero({ amount: parseInt(amount * 100) }).toFormat("0,0.00") : null;
+  const dineroAmount = Dinero(metadata?.job_totals?.totals?.subtotal ?? Dinero()).toFormat();
 
   return (
     cardSettings?.subtotal && (
       <Col span={cardSettings.compact ? 24 : 12}>
-        <EllipsesToolTip
-          title={!!amount ? `${t("production.statistics.currency_symbol")}${dineroAmount}` : null}
-          kiosk={cardSettings.kiosk}
-        >
-          {!!amount ? (
-            <span>{`${t("production.statistics.currency_symbol")}${dineroAmount}`}</span>
-          ) : (
-            <span>&nbsp;</span>
-          )}
+        <EllipsesToolTip title={`${dineroAmount}`} kiosk={cardSettings.kiosk}>
+          {dineroAmount}
         </EllipsesToolTip>
       </Col>
     )

client/src/components/production-board-kanban/production-board-kanban.container.jsx

@@ -1,8 +1,12 @@
-import React, { useEffect, useMemo } from "react";
+import React, { useEffect, useMemo, useRef } from "react";
 import { useQuery, useSubscription } from "@apollo/client";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
-import { QUERY_JOBS_IN_PRODUCTION, SUBSCRIPTION_JOBS_IN_PRODUCTION } from "../../graphql/jobs.queries";
+import {
+  QUERY_JOBS_IN_PRODUCTION,
+  SUBSCRIPTION_JOBS_IN_PRODUCTION,
+  SUBSCRIPTION_JOBS_IN_PRODUCTION_VIEW
+} from "../../graphql/jobs.queries";
 import { QUERY_KANBAN_SETTINGS } from "../../graphql/user.queries";
 import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
 import ProductionBoardKanbanComponent from "./production-board-kanban.component";
@@ -12,7 +16,9 @@ const mapStateToProps = createStructuredSelector({
   currentUser: selectCurrentUser
 });
 
-function ProductionBoardKanbanContainer({ bodyshop, currentUser }) {
+function ProductionBoardKanbanContainer({ bodyshop, currentUser, subscriptionType = "direct" }) {
+  const fired = useRef(false); // useRef to keep track of whether the subscription fired
+
   const combinedStatuses = useMemo(
     () => [
       ...bodyshop.md_ro_statuses.production_statuses,
@@ -28,9 +34,12 @@ function ProductionBoardKanbanContainer({ bodyshop, currentUser }) {
     onError: (error) => console.error(`Error fetching jobs in production: ${error.message}`)
   });
 
-  const { data: updatedJobs } = useSubscription(SUBSCRIPTION_JOBS_IN_PRODUCTION, {
-    onError: (error) => console.error(`Error subscribing to jobs in production: ${error.message}`)
-  });
+  const { data: updatedJobs } = useSubscription(
+    subscriptionType === "view" ? SUBSCRIPTION_JOBS_IN_PRODUCTION_VIEW : SUBSCRIPTION_JOBS_IN_PRODUCTION,
+    {
+      onError: (error) => console.error(`Error subscribing to jobs in production: ${error.message}`)
+    }
+  );
 
   const { loading: associationSettingsLoading, data: associationSettings } = useQuery(QUERY_KANBAN_SETTINGS, {
     variables: { email: currentUser.email },
@@ -40,10 +49,15 @@ function ProductionBoardKanbanContainer({ bodyshop, currentUser }) {
   // const currentReducerData = useSelector((state) => (state.trello.lanes ? state.trello : {}));
 
   useEffect(() => {
-    if (updatedJobs && data) {
-      refetch().catch((err) => console.error(`Error re-fetching jobs in production: ${err.message}`));
+    if (!updatedJobs) {
+      return;
     }
-  }, [updatedJobs, data, refetch]);
+    if (!fired.current) {
+      fired.current = true;
+      return;
+    }
+    refetch().catch((err) => console.error(`Error re-fetching jobs in production: ${err.message}`));
+  }, [updatedJobs, refetch]);
 
   const filteredAssociationSettings = useMemo(() => {
     return associationSettings?.associations[0] || null;

client/src/components/production-board-kanban/production-board-kanban.statistics.jsx

@@ -3,6 +3,7 @@ import { Card, Statistic } from "antd";
 import { useTranslation } from "react-i18next";
 import PropTypes from "prop-types";
 import { defaultKanbanSettings, statisticsItems } from "./settings/defaultKanbanSettings.js";
+import Dinero from "dinero.js";
 
 export const StatisticType = {
   HOURS: "hours",
@@ -32,7 +33,21 @@ const ProductionStatistics = ({ data, cardSettings, reducerData }) => {
   };
 
   const calculateTotalAmount = (items, key) => {
-    return items.reduce((acc, item) => acc + (item[key]?.totals?.subtotal?.amount || 0), 0);
+    return items.reduce((acc, item) => acc.add(Dinero(item[key]?.totals?.subtotal ?? Dinero())), Dinero({ amount: 0 }));
+  };
+
+  const calculateReducerTotalAmount = (lanes, key) => {
+    return lanes.reduce(
+      (acc, lane) => {
+        return acc.add(
+          lane.cards.reduce(
+            (laneAcc, card) => laneAcc.add(Dinero(card.metadata[key]?.totals?.subtotal ?? Dinero())),
+            Dinero({ amount: 0 })
+          )
+        );
+      },
+      Dinero({ amount: 0 })
+    );
   };
 
   const calculateReducerTotal = (lanes, key, subKey) => {
@@ -43,14 +58,6 @@ const ProductionStatistics = ({ data, cardSettings, reducerData }) => {
     }, 0);
   };
 
-  const calculateReducerTotalAmount = (lanes, key) => {
-    return lanes.reduce((acc, lane) => {
-      return (
-        acc + lane.cards.reduce((laneAcc, card) => laneAcc + (card.metadata[key]?.totals?.subtotal?.amount || 0), 0)
-      );
-    }, 0);
-  };
-
   const formatValue = (value, type) => {
     if (type === StatisticType.JOBS) {
       return value.toFixed(0);
@@ -87,9 +94,15 @@ const ProductionStatistics = ({ data, cardSettings, reducerData }) => {
   const totalAmountInProduction = useMemo(() => {
     if (!cardSettings.totalAmountInProduction) return null;
     const total = calculateTotalAmount(data, "job_totals");
-    return parseFloat(total.toFixed(2));
+    return total.toFormat("$0,0.00");
   }, [data, cardSettings.totalAmountInProduction]);
 
+  const totalAmountOnBoard = useMemo(() => {
+    if (!reducerData || !cardSettings.totalAmountOnBoard) return null;
+    const total = calculateReducerTotalAmount(reducerData.lanes, "job_totals");
+    return total.toFormat("$0,0.00");
+  }, [reducerData, cardSettings.totalAmountOnBoard]);
+
   const totalHrsOnBoard = useMemo(() => {
     if (!reducerData || !cardSettings.totalHrsOnBoard) return null;
     const total =
@@ -118,12 +131,6 @@ const ProductionStatistics = ({ data, cardSettings, reducerData }) => {
     [reducerData, cardSettings.jobsOnBoard]
   );
 
-  const totalAmountOnBoard = useMemo(() => {
-    if (!reducerData || !cardSettings.totalAmountOnBoard) return null;
-    const total = calculateReducerTotalAmount(reducerData.lanes, "job_totals");
-    return parseFloat(total.toFixed(2));
-  }, [reducerData, cardSettings.totalAmountOnBoard]);
-
   const tasksInProduction = useMemo(() => {
     if (!data || !cardSettings.tasksInProduction) return null;
     return data.reduce((acc, item) => acc + (item.tasks_aggregate?.aggregate?.count || 0), 0);
@@ -191,7 +198,6 @@ const ProductionStatistics = ({ data, cardSettings, reducerData }) => {
           <Statistic
             title={t(`production.statistics.${stat.label}`)}
             value={formatValue(stat.value, stat.type)}
-            prefix={stat.type === StatisticType.AMOUNT ? t("production.statistics.currency_symbol") : undefined}
             suffix={
               stat.type === StatisticType.HOURS
                 ? t("production.statistics.hours")

client/src/components/production-list-columns/production-list-columns.data.jsx

@@ -28,6 +28,11 @@ import ProductionListColumnCategory from "./production-list-columns.status.categ
 import ProductionListColumnStatus from "./production-list-columns.status.component";
 import ProductionListColumnTouchTime from "./prodution-list-columns.touchtime.component";
 
+const getEmployeeName = (employeeId, employees) => {
+  const employee = employees.find((e) => e.id === employeeId);
+  return employee ? `${employee.first_name} ${employee.last_name}` : "";
+};
+
 const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatments }) => {
   const { Enhanced_Payroll } = treatments;
   return [
@@ -293,6 +298,16 @@ const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatme
       ellipsis: true,
       sorter: (a, b) => statusSort(a.status, b.status, activeStatuses),
       sortOrder: state.sortedInfo.columnKey === "status" && state.sortedInfo.order,
+      filters:
+        activeStatuses
+          ?.map((s) => {
+            return {
+              text: s || "No Status*",
+              value: [s]
+            };
+          })
+          .sort((a, b) => statusSort(a.text, b.text, activeStatuses)) || [],
+      onFilter: (value, record) => value.includes(record.status),
       render: (text, record) => <ProductionListColumnStatus record={record} />
     },
     {
@@ -426,8 +441,8 @@ const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatme
       sortOrder: state.sortedInfo.columnKey === "employee_body" && state.sortedInfo.order,
       sorter: (a, b) =>
         alphaSort(
-          bodyshop.employees?.find((e) => e.id === a.employee_body)?.first_name,
-          bodyshop.employees?.find((e) => e.id === b.employee_body)?.first_name
+          getEmployeeName(a.employee_body, bodyshop.employees),
+          getEmployeeName(b.employee_body, bodyshop.employees)
         ),
       render: (text, record) => (
         <ProductionListEmployeeAssignment refetch={refetch} record={record} type="employee_body" />
@@ -440,8 +455,8 @@ const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatme
       sortOrder: state.sortedInfo.columnKey === "employee_prep" && state.sortedInfo.order,
       sorter: (a, b) =>
         alphaSort(
-          bodyshop.employees?.find((e) => e.id === a.employee_prep)?.first_name,
-          bodyshop.employees?.find((e) => e.id === b.employee_prep)?.first_name
+          getEmployeeName(a.employee_prep, bodyshop.employees),
+          getEmployeeName(b.employee_prep, bodyshop.employees)
         ),
       render: (text, record) => (
         <ProductionListEmployeeAssignment record={record} refetch={refetch} type="employee_prep" />
@@ -460,8 +475,8 @@ const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatme
       sortOrder: state.sortedInfo.columnKey === "employee_csr" && state.sortedInfo.order,
       sorter: (a, b) =>
         alphaSort(
-          bodyshop.employees?.find((e) => e.id === a.employee_csr)?.first_name,
-          bodyshop.employees?.find((e) => e.id === b.employee_csr)?.first_name
+          getEmployeeName(a.employee_csr, bodyshop.employees),
+          getEmployeeName(b.employee_csr, bodyshop.employees)
         ),
       render: (text, record) => (
         <ProductionListEmployeeAssignment refetch={refetch} record={record} type="employee_csr" />
@@ -474,8 +489,8 @@ const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatme
       sortOrder: state.sortedInfo.columnKey === "employee_refinish" && state.sortedInfo.order,
       sorter: (a, b) =>
         alphaSort(
-          bodyshop.employees?.find((e) => e.id === a.employee_refinish)?.first_name,
-          bodyshop.employees?.find((e) => e.id === b.employee_refinish)?.first_name
+          getEmployeeName(a.employee_refinish, bodyshop.employees),
+          getEmployeeName(b.employee_refinish, bodyshop.employees)
         ),
       render: (text, record) => (
         <ProductionListEmployeeAssignment record={record} refetch={refetch} type="employee_refinish" />

client/src/components/production-list-columns/production-list-columns.date.component.jsx

@@ -1,12 +1,12 @@
 import { useMutation } from "@apollo/client";
-import { Button, Card, Dropdown, Space, TimePicker } from "antd";
+import { Button, Card, Dropdown, Space } from "antd";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { logImEXEvent } from "../../firebase/firebase.utils";
 import { UPDATE_JOB } from "../../graphql/jobs.queries";
 import { DateFormatter } from "../../utils/DateFormatter";
 import dayjs from "../../utils/day";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 export default function ProductionListDate({ record, field, time, pastIndicator }) {
   const [updateAlert] = useMutation(UPDATE_JOB);
@@ -57,22 +57,14 @@ export default function ProductionListDate({ record, field, time, pastIndicator
         label: (
           <Card style={{ padding: "1rem" }} onClick={(e) => e.stopPropagation()}>
             <Space direction={"vertical"}>
-              <FormDatePicker
+              <DateTimePicker
                 onClick={(e) => e.stopPropagation()}
                 value={(record[field] && dayjs(record[field])) || null}
                 onChange={handleChange}
-                format="MM/DD/YYYY"
+                format={time ? "MM/DD/YYYY hh:mm a" : "MM/DD/YYYY"}
                 isDateOnly={!time}
+                showTime={time ? { format: "hh:mm a", minuteStep: 15 } : false}
               />
-              {time && (
-                <TimePicker
-                  onClick={(e) => e.stopPropagation()}
-                  value={(record[field] && dayjs(record[field])) || null}
-                  onChange={handleChange}
-                  minuteStep={15}
-                  format="hh:mm a"
-                />
-              )}
               <Button onClick={() => setOpen(false)}>{t("general.actions.close")}</Button>
             </Space>
           </Card>

client/src/components/production-list-save-config-button/production-list-save-config-button.component.jsx

@@ -1,93 +0,0 @@
-import { useMutation } from "@apollo/client";
-import React, { useState } from "react";
-import { connect } from "react-redux";
-import { createStructuredSelector } from "reselect";
-import { selectBodyshop } from "../../redux/user/user.selectors";
-import { Button, Form, Input, notification, Popover, Space } from "antd";
-import { useTranslation } from "react-i18next";
-import { UPDATE_SHOP } from "../../graphql/bodyshop.queries";
-import { logImEXEvent } from "../../firebase/firebase.utils";
-import { isFunction } from "lodash";
-
-const mapStateToProps = createStructuredSelector({
-  //currentUser: selectCurrentUser
-  bodyshop: selectBodyshop
-});
-const mapDispatchToProps = (dispatch) => ({
-  //setUserLanguage: language => dispatch(setUserLanguage(language))
-});
-
-export function ProductionListSaveConfigButton({ columns, bodyshop, tableState, onSave }) {
-  const [updateShop] = useMutation(UPDATE_SHOP);
-  const [loading, setLoading] = useState(false);
-  const [open, setOpen] = useState(false);
-  const [form] = Form.useForm();
-
-  const { t } = useTranslation();
-
-  const handleSaveConfig = async (values) => {
-    logImEXEvent("production_save_config");
-    setLoading(true);
-    const result = await updateShop({
-      variables: {
-        id: bodyshop.id,
-        shop: {
-          production_config: [
-            ...bodyshop.production_config.filter((b) => b.name !== values.name),
-            //Assign it to the name
-            {
-              name: values.name,
-              columns: {
-                columnKeys: columns.map((i) => {
-                  return { key: i.key, width: i.width };
-                }),
-                tableState
-              }
-            }
-          ]
-        }
-      }
-    });
-    if (!!!result.errors) {
-      notification["success"]({ message: t("bodyshop.successes.save") });
-      if (onSave && isFunction(onSave)) {
-        onSave();
-      }
-    } else {
-      notification["error"]({
-        message: t("bodyshop.errors.saving", {
-          error: JSON.stringify(result.errors)
-        })
-      });
-    }
-    form.resetFields();
-    setOpen(false);
-    setLoading(false);
-  };
-  const popMenu = (
-    <div>
-      <Form layout="vertical" form={form} onFinish={handleSaveConfig}>
-        <Form.Item label={t("production.labels.viewname")} name="name" rules={[{ required: true }]}>
-          <Input />
-        </Form.Item>
-
-        <Space wrap>
-          <Button type="primary" danger onClick={() => form.submit()} loading={loading}>
-            {t("general.actions.save")}
-          </Button>
-          <Button onClick={() => setOpen(false)}>{t("general.actions.close")}</Button>
-        </Space>
-      </Form>
-    </div>
-  );
-
-  return (
-    <Popover open={open} content={popMenu}>
-      <Button loading={loading} onClick={() => setOpen(true)}>
-        {t("production.actions.saveconfig")}
-      </Button>
-    </Popover>
-  );
-}
-
-export default connect(mapStateToProps, mapDispatchToProps)(ProductionListSaveConfigButton);

client/src/components/production-list-table/production-list-config-manager.component.jsx

@@ -0,0 +1,505 @@
+import { DeleteOutlined, ExclamationCircleOutlined, PlusOutlined } from "@ant-design/icons";
+import { useMutation } from "@apollo/client";
+import { Button, Form, Input, Modal, notification, Popconfirm, Popover, Select, Space } from "antd";
+import React, { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { UPDATE_ACTIVE_PROD_LIST_VIEW } from "../../graphql/associations.queries";
+import { UPDATE_SHOP } from "../../graphql/bodyshop.queries";
+import ProductionListColumns from "../production-list-columns/production-list-columns.data";
+import { useSplitTreatments } from "@splitsoftware/splitio-react";
+import { logImEXEvent } from "../../firebase/firebase.utils";
+import { isFunction } from "lodash";
+
+const { confirm } = Modal;
+
+export function ProductionListConfigManager({
+  refetch,
+  bodyshop,
+  technician,
+  currentUser,
+  state,
+  data,
+  columns,
+  setColumns,
+  setState,
+  onSave,
+  hasUnsavedChanges,
+  setHasUnsavedChanges
+}) {
+  const { t } = useTranslation();
+  const [updateDefaultProdView] = useMutation(UPDATE_ACTIVE_PROD_LIST_VIEW);
+  const [updateShop] = useMutation(UPDATE_SHOP);
+  const [loading, setLoading] = useState(false);
+  const [open, setOpen] = useState(false);
+  const [isAddingNewProfile, setIsAddingNewProfile] = useState(false);
+  const [form] = Form.useForm();
+
+  const [activeView, setActiveView] = useState(() => {
+    const assoc = bodyshop.associations.find((a) => a.useremail === currentUser.email);
+    return assoc && assoc.default_prod_list_view;
+  });
+
+  const defaultState = {
+    sortedInfo: {
+      columnKey: "ro_number",
+      order: null
+    },
+    filteredInfo: {}
+  };
+
+  const ensureDefaultState = (state) => {
+    return {
+      sortedInfo: state?.sortedInfo || defaultState.sortedInfo,
+      filteredInfo: state?.filteredInfo || defaultState.filteredInfo,
+      ...state
+    };
+  };
+
+  const createDefaultView = async () => {
+    const defaultConfig = {
+      name: t("production.constants.main_profile"),
+      columns: {
+        columnKeys: [
+          { key: "ro_number", width: 100 },
+          { key: "ownr", width: 100 },
+          { key: "vehicle", width: 100 },
+          { key: "ins_co_nm", width: 100 },
+          { key: "actual_in", width: 100 },
+          { key: "scheduled_completion", width: 100 },
+          { key: "labhrs", width: 100 },
+          { key: "employee_body", width: 100 },
+          { key: "larhrs", width: 100 },
+          { key: "employee_refinish", width: 100 },
+          { key: "tt", width: 100 },
+          { key: "status", width: 100 },
+          { key: "sublets", width: 100 },
+          { key: "viewdetail", width: 100 }
+        ],
+        tableState: ensureDefaultState(state)
+      }
+    };
+
+    const result = await updateShop({
+      variables: {
+        id: bodyshop.id,
+        shop: {
+          production_config: [defaultConfig]
+        }
+      }
+    });
+
+    if (!result.errors) {
+      await updateActiveProdView(t("production.constants.main_profile"));
+      window.location.reload(); // Reload the page
+    } else {
+      notification.error({
+        message: t("bodyshop.errors.creatingdefaultview", {
+          error: JSON.stringify(result.errors)
+        })
+      });
+    }
+  };
+
+  const {
+    treatments: { Enhanced_Payroll }
+  } = useSplitTreatments({
+    attributes: {},
+    names: ["Enhanced_Payroll"],
+    splitKey: bodyshop.imexshopid
+  });
+
+  const updateActiveProdView = async (viewName) => {
+    const assoc = bodyshop.associations.find((a) => a.useremail === currentUser.email);
+    if (assoc) {
+      await updateDefaultProdView({
+        variables: { assocId: assoc.id, view: viewName },
+        update(cache) {
+          cache.modify({
+            id: cache.identify(bodyshop),
+            fields: {
+              associations(existingAssociations) {
+                return existingAssociations.map((a) => {
+                  if (a.useremail !== currentUser.email) return a;
+                  return { ...a, default_prod_list_view: viewName };
+                });
+              }
+            }
+          });
+        }
+      });
+      setActiveView(viewName);
+      setHasUnsavedChanges(false);
+    }
+  };
+
+  const handleSelect = async (value) => {
+    if (hasUnsavedChanges) {
+      confirm({
+        title: t("general.labels.unsavedchanges"),
+        icon: <ExclamationCircleOutlined />,
+        content: t("general.messages.unsavedchangespopup"),
+        onOk: () => proceedWithSelect(value),
+        onCancel() {
+          // Do nothing if canceled
+        }
+      });
+    } else {
+      await proceedWithSelect(value);
+    }
+  };
+
+  const proceedWithSelect = async (value) => {
+    if (value === "add_new") {
+      setIsAddingNewProfile(true);
+      setOpen(true);
+      return;
+    }
+
+    const selectedConfig = bodyshop.production_config.find((pc) => pc.name === value);
+
+    // If the selected profile doesn't exist, revert to the main profile
+    if (!selectedConfig) {
+      const mainProfileConfig = bodyshop.production_config.find(
+        (pc) => pc.name === t("production.constants.main_profile")
+      );
+
+      if (mainProfileConfig) {
+        await updateActiveProdView(t("production.constants.main_profile"));
+        setColumns(
+          mainProfileConfig.columns.columnKeys.map((k) => {
+            return {
+              ...ProductionListColumns({
+                bodyshop,
+                refetch,
+                technician,
+                state: ensureDefaultState(state),
+                data: data,
+                activeStatuses: bodyshop.md_ro_statuses.active_statuses,
+                treatments: { Enhanced_Payroll }
+              }).find((e) => e.key === k.key),
+              width: k.width
+            };
+          })
+        );
+        const newState = ensureDefaultState(mainProfileConfig.columns.tableState);
+        setState(newState);
+
+        if (onSave && isFunction(onSave)) {
+          onSave();
+        }
+        return;
+      }
+    }
+
+    // If the selected profile exists, proceed as normal
+    if (selectedConfig) {
+      const newColumns = selectedConfig.columns.columnKeys.map((k) => {
+        return {
+          ...ProductionListColumns({
+            bodyshop,
+            refetch,
+            technician,
+            state: ensureDefaultState(state),
+            data: data,
+            activeStatuses: bodyshop.md_ro_statuses.active_statuses,
+            treatments: { Enhanced_Payroll }
+          }).find((e) => e.key === k.key),
+          width: k.width
+        };
+      });
+      setColumns(newColumns);
+      const newState = ensureDefaultState(selectedConfig.columns.tableState);
+      setState(newState);
+
+      await updateActiveProdView(value);
+      if (onSave && isFunction(onSave)) {
+        onSave();
+      }
+    }
+  };
+
+  const handleTrash = async (name) => {
+    if (name === t("production.constants.main_profile")) return;
+
+    const remainingConfigs = bodyshop.production_config.filter((b) => b.name !== name);
+
+    await updateShop({
+      variables: {
+        id: bodyshop.id,
+        shop: {
+          production_config: remainingConfigs
+        }
+      },
+      awaitRefetchQueries: true
+    });
+
+    if (name === activeView) {
+      // Only switch profiles if the deleted profile was the active profile
+      if (remainingConfigs.length > 0) {
+        const nextConfig = remainingConfigs[0];
+        await updateActiveProdView(nextConfig.name);
+        setColumns(
+          nextConfig.columns.columnKeys.map((k) => {
+            return {
+              ...ProductionListColumns({
+                technician,
+                state: ensureDefaultState(state),
+                refetch,
+                data: data,
+                activeStatuses: bodyshop.md_ro_statuses.active_statuses,
+                treatments: { Enhanced_Payroll }
+              }).find((e) => e.key === k.key),
+              width: k.width
+            };
+          })
+        );
+        setState(ensureDefaultState(nextConfig.columns.tableState));
+      } else {
+        await updateActiveProdView(null);
+        setColumns([]);
+        setState(defaultState);
+      }
+    } else {
+      // Revert back to the active view and load its columns and state
+      const activeConfig = bodyshop.production_config.find((pc) => pc.name === activeView);
+      if (activeConfig) {
+        await updateActiveProdView(activeView);
+        setColumns(
+          activeConfig.columns.columnKeys.map((k) => {
+            return {
+              ...ProductionListColumns({
+                technician,
+                state: ensureDefaultState(state),
+                refetch,
+                data: data,
+                activeStatuses: bodyshop.md_ro_statuses.active_statuses,
+                treatments: { Enhanced_Payroll }
+              }).find((e) => e.key === k.key),
+              width: k.width
+            };
+          })
+        );
+        setState(ensureDefaultState(activeConfig.columns.tableState));
+      }
+    }
+  };
+
+  const handleSaveConfig = async (values) => {
+    logImEXEvent("production_save_config");
+    setLoading(true);
+
+    const profileName = isAddingNewProfile ? values.name : activeView;
+
+    const result = await updateShop({
+      variables: {
+        id: bodyshop.id,
+        shop: {
+          production_config: [
+            ...bodyshop.production_config.filter((b) => b.name !== profileName),
+            {
+              name: profileName,
+              columns: {
+                columnKeys: columns.map((i) => ({ key: i.key, width: i.width })),
+                tableState: ensureDefaultState(state)
+              }
+            }
+          ]
+        }
+      }
+    });
+
+    if (!result.errors) {
+      notification.success({ message: t("bodyshop.successes.save") });
+      if (isAddingNewProfile) {
+        await updateActiveProdView(profileName);
+      }
+      if (onSave && isFunction(onSave)) {
+        onSave();
+      }
+      setHasUnsavedChanges(false);
+    } else {
+      notification.error({
+        message: t("bodyshop.errors.saving", {
+          error: JSON.stringify(result.errors)
+        })
+      });
+    }
+
+    form.resetFields();
+    setOpen(false);
+    setLoading(false);
+    setIsAddingNewProfile(false);
+  };
+
+  useEffect(() => {
+    const validateAndSetDefaultView = () => {
+      const configExists = bodyshop.production_config.some((pc) => pc.name === activeView);
+
+      if (!configExists) {
+        // If the default view doesn't exist, revert to the main profile
+        const mainProfileConfig = bodyshop.production_config.find(
+          (pc) => pc.name === t("production.constants.main_profile")
+        );
+
+        if (mainProfileConfig) {
+          setActiveView(t("production.constants.main_profile"));
+
+          setColumns(
+            mainProfileConfig.columns.columnKeys.map((k) => {
+              return {
+                ...ProductionListColumns({
+                  bodyshop,
+                  refetch,
+                  technician,
+                  state: ensureDefaultState(state),
+                  data: data,
+                  activeStatuses: bodyshop.md_ro_statuses.active_statuses,
+                  treatments: { Enhanced_Payroll }
+                }).find((e) => e.key === k.key),
+                width: k.width
+              };
+            })
+          );
+          setState(ensureDefaultState(mainProfileConfig.columns.tableState));
+
+          updateActiveProdView(t("production.constants.main_profile"));
+        }
+      } else {
+        // If the default view exists, set it as active
+        setActiveView(activeView);
+      }
+    };
+
+    if (!bodyshop.production_config || bodyshop.production_config.length === 0) {
+      createDefaultView().catch((e) => {
+        console.error("Something went wrong saving the production list view Config.");
+      });
+    } else {
+      validateAndSetDefaultView();
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [activeView, bodyshop.production_config]);
+
+  const popMenu = (
+    <div>
+      <Form layout="vertical" form={form} onFinish={handleSaveConfig}>
+        {isAddingNewProfile && (
+          <Form.Item
+            label={t("production.labels.viewname")}
+            name="name"
+            rules={[
+              { required: true, message: t("production.errors.name_required") },
+              {
+                validator: (_, value) => {
+                  if (!value) {
+                    return Promise.resolve();
+                  }
+                  const nameExists = bodyshop.production_config.some((pc) => pc.name === value);
+                  if (nameExists) {
+                    return Promise.reject(new Error(t("production.errors.name_exists")));
+                  }
+                  return Promise.resolve();
+                }
+              }
+            ]}
+          >
+            <Input />
+          </Form.Item>
+        )}
+        <Space wrap>
+          <Button
+            type="primary"
+            danger
+            onClick={() => form.submit()}
+            loading={loading}
+            disabled={form.getFieldsError().some(({ errors }) => errors.length)}
+          >
+            {t("general.actions.save")}
+          </Button>
+          {!isAddingNewProfile && (
+            <Button
+              type="default"
+              onClick={() => {
+                setIsAddingNewProfile(true);
+                setOpen(true);
+              }}
+            >
+              {t("general.actions.saveas")}
+            </Button>
+          )}
+          <Button
+            onClick={() => {
+              setIsAddingNewProfile(false);
+              setOpen(false);
+            }}
+          >
+            {t("general.actions.cancel")}
+          </Button>
+        </Space>
+      </Form>
+    </div>
+  );
+
+  return (
+    <Space>
+      <Button loading={loading} onClick={() => setOpen(true)} disabled={isAddingNewProfile || !hasUnsavedChanges}>
+        {t("production.actions.saveconfig")}
+      </Button>
+      <Popover open={open} content={popMenu} placement="bottom">
+        <Select
+          style={{
+            minWidth: "150px"
+          }}
+          onSelect={handleSelect}
+          placeholder={t("production.labels.selectview")}
+          optionLabelProp="label"
+          popupMatchSelectWidth={false}
+          value={activeView}
+          disabled={open || isAddingNewProfile} // Disable the Select box when the popover is open or adding a new profile
+        >
+          {bodyshop.production_config
+            .slice()
+            .sort((a, b) =>
+              a.name === t("production.constants.main_profile")
+                ? -1
+                : b.name === t("production.constants.main_profile")
+                  ? 1
+                  : 0
+            ) //
+            .map((config) => (
+              <Select.Option key={config.name} label={config.name}>
+                <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center" }}>
+                  <span
+                    style={{
+                      flex: 1,
+                      maxWidth: "80%",
+                      marginRight: "1rem",
+                      textOverflow: "ellipsis"
+                    }}
+                  >
+                    {config.name}
+                  </span>
+                  {config.name !== t("production.constants.main_profile") && (
+                    <Popconfirm
+                      placement="right"
+                      title={t("general.labels.areyousure")}
+                      onConfirm={() => handleTrash(config.name)}
+                      onCancel={(e) => e.stopPropagation()}
+                    >
+                      <DeleteOutlined onClick={(e) => e.stopPropagation()} />
+                    </Popconfirm>
+                  )}
+                </div>
+              </Select.Option>
+            ))}
+          <Select.Option key="add_new" label={t("production.labels.addnewprofile")}>
+            <div style={{ display: "flex", alignItems: "center" }}>
+              <PlusOutlined style={{ marginRight: "0.5rem" }} />
+              {t("production.labels.addnewprofile")}
+            </div>
+          </Select.Option>
+        </Select>
+      </Popover>
+    </Space>
+  );
+}

client/src/components/production-list-table/production-list-table-view-select.component.jsx

@@ -1,172 +0,0 @@
-import { DeleteOutlined } from "@ant-design/icons";
-import { useMutation } from "@apollo/client";
-import { Popconfirm, Select } from "antd";
-import React from "react";
-import { useTranslation } from "react-i18next";
-import { connect } from "react-redux";
-import { createStructuredSelector } from "reselect";
-import { UPDATE_ACTIVE_PROD_LIST_VIEW } from "../../graphql/associations.queries";
-import { UPDATE_SHOP } from "../../graphql/bodyshop.queries";
-import { selectTechnician } from "../../redux/tech/tech.selectors";
-import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
-import ProductionListColumns from "../production-list-columns/production-list-columns.data";
-import { useSplitTreatments } from "@splitsoftware/splitio-react";
-import { isFunction } from "lodash";
-
-const mapStateToProps = createStructuredSelector({
-  bodyshop: selectBodyshop,
-  technician: selectTechnician,
-  currentUser: selectCurrentUser
-});
-
-export function ProductionListTable({
-  refetch,
-  bodyshop,
-  technician,
-  currentUser,
-  state,
-  data,
-  setColumns,
-  setState,
-  onProfileChange
-}) {
-  const { t } = useTranslation();
-  const [updateDefaultProdView] = useMutation(UPDATE_ACTIVE_PROD_LIST_VIEW);
-  const [updateShop] = useMutation(UPDATE_SHOP);
-
-  const {
-    treatments: { Enhanced_Payroll }
-  } = useSplitTreatments({
-    attributes: {},
-    names: ["Enhanced_Payroll"],
-    splitKey: bodyshop.imexshopid
-  });
-
-  const handleSelect = async (value, option) => {
-    const newColumns = bodyshop.production_config
-      .filter((pc) => pc.name === value)[0]
-      .columns.columnKeys.map((k) => {
-        return {
-          ...ProductionListColumns({
-            bodyshop,
-            refetch,
-            technician,
-            state,
-            data: data,
-            activeStatuses: bodyshop.md_ro_statuses.active_statuses,
-            treatments: { Enhanced_Payroll }
-          }).find((e) => e.key === k.key),
-          width: k.width
-        };
-      });
-    setColumns(newColumns);
-    const newState = bodyshop.production_config.filter((pc) => pc.name === value)[0].columns.tableState;
-    setState(newState);
-
-    const assoc = bodyshop.associations.find((a) => a.useremail === currentUser.email);
-
-    if (assoc) {
-      await updateDefaultProdView({
-        variables: { assocId: assoc.id, view: value },
-        update(cache) {
-          cache.modify({
-            id: cache.identify(bodyshop),
-            fields: {
-              associations(existingAssociations, { readField }) {
-                return existingAssociations.map((a) => {
-                  if (a.useremail !== currentUser.email) return a;
-                  return { ...a, default_prod_list_view: value };
-                });
-              }
-            }
-          });
-        }
-      });
-    }
-
-    if (onProfileChange && isFunction(onProfileChange)) {
-      onProfileChange({ value, option, newColumns, newState, assoc });
-    }
-  };
-
-  const handleTrash = async (name) => {
-    await updateShop({
-      variables: {
-        id: bodyshop.id,
-        shop: {
-          production_config: bodyshop.production_config.filter((b) => b.name !== name)
-        }
-      },
-      awaitRefetchQueries: true
-    });
-
-    setColumns(
-      bodyshop.production_config[0].columns.columnKeys.map((k) => {
-        return {
-          ...ProductionListColumns({
-            technician,
-            state,
-            refetch,
-            data: data,
-            activeStatuses: bodyshop.md_ro_statuses.active_statuses,
-            treatments: { Enhanced_Payroll }
-          }).find((e) => e.key === k.key),
-          width: k.width
-        };
-      })
-    );
-
-    setState(bodyshop.production_config[0].columns.tableState);
-  };
-  const assoc = bodyshop.associations.find((a) => a.useremail === currentUser.email);
-
-  const defaultView = assoc && assoc.default_prod_list_view;
-  return (
-    <div style={{ width: "10rem" }}>
-      <Select
-        onSelect={handleSelect}
-        placeholder={t("production.labels.selectview")}
-        optionLabelProp="label"
-        popupMatchSelectWidth={false}
-        defaultValue={defaultView}
-      >
-        {bodyshop.production_config.map((config) => (
-          <Select.Option key={config.name} label={config.name}>
-            <div
-              style={{
-                display: "flex",
-                justifyContent: "space-between",
-                alignItems: "center"
-              }}
-            >
-              <span
-                style={{
-                  flex: 1,
-                  maxWidth: "80%",
-                  marginRight: "1rem",
-                  textOverflow: "ellipsis"
-                }}
-              >
-                {config.name}
-              </span>
-
-              <Popconfirm
-                placement="right"
-                title={t("general.labels.areyousure")}
-                onConfirm={() => handleTrash(config.name)}
-              >
-                <DeleteOutlined
-                  onClick={(e) => {
-                    e.stopPropagation();
-                  }}
-                />
-              </Popconfirm>
-            </div>
-          </Select.Option>
-        ))}
-      </Select>
-    </div>
-  );
-}
-
-export default connect(mapStateToProps, null)(ProductionListTable);

client/src/components/production-list-table/production-list-table.component.jsx

@@ -1,24 +1,23 @@
-import React, { useEffect, useMemo, useRef, useState } from "react";
-import { Button, Dropdown, Input, Space, Statistic, Table } from "antd";
+import { SyncOutlined } from "@ant-design/icons";
 import { PageHeader } from "@ant-design/pro-layout";
+import { useSplitTreatments } from "@splitsoftware/splitio-react";
+import { Button, Dropdown, Input, Space, Statistic, Table } from "antd";
+import _ from "lodash";
+import React, { useEffect, useMemo, useRef, useState } from "react";
 import ReactDragListView from "react-drag-listview";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectTechnician } from "../../redux/tech/tech.selectors";
 import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
+import Prompt from "../../utils/prompt.js";
+import AlertComponent from "../alert/alert.component.jsx";
 import ProductionListColumnsAdd from "../production-list-columns/production-list-columns.add.component";
 import ProductionListColumns from "../production-list-columns/production-list-columns.data";
 import ProductionListDetail from "../production-list-detail/production-list-detail.component";
-import ProductionListSaveConfigButton from "../production-list-save-config-button/production-list-save-config-button.component";
+import { ProductionListConfigManager } from "./production-list-config-manager.component.jsx";
 import ProductionListPrint from "./production-list-print.component";
-import ProductionListTableViewSelect from "./production-list-table-view-select.component";
 import ResizeableTitle from "./production-list-table.resizeable.component";
-import { useSplitTreatments } from "@splitsoftware/splitio-react";
-import { SyncOutlined } from "@ant-design/icons";
-import Prompt from "../../utils/prompt.js";
-import _ from "lodash";
-import AlertComponent from "../alert/alert.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -44,7 +43,7 @@ export function ProductionListTable({ loading, data, refetch, bodyshop, technici
   const initialStateRef = useRef(
     (bodyshop.production_config &&
       bodyshop.production_config.find((p) => p.name === defaultView)?.columns.tableState) ||
-      bodyshop.production_config[0]?.columns.tableState || {
+      (bodyshop.production_config && bodyshop.production_config[0]?.columns.tableState) || {
         sortedInfo: {},
         filteredInfo: { text: "" }
       }
@@ -270,23 +269,23 @@ export function ProductionListTable({ loading, data, refetch, bodyshop, technici
               data={data}
               onColumnAdd={addColumn}
             />
-            <ProductionListSaveConfigButton
+
+            <ProductionListConfigManager
               columns={columns}
-              tableState={state}
-              onSave={() => {
-                setHasUnsavedChanges(false);
-              }}
-            />
-            <ProductionListTableViewSelect
+              setColumns={setColumns}
               state={state}
               setState={setState}
-              setColumns={setColumns}
-              onProfileChange={() => {
-                initialStateRef.current = state;
-                setHasUnsavedChanges(false);
-              }}
               refetch={refetch}
               data={data}
+              bodyshop={bodyshop}
+              technician={technician}
+              currentUser={currentUser}
+              setHasUnsavedChanges={setHasUnsavedChanges}
+              hasUnsavedChanges={hasUnsavedChanges}
+              onSave={() => {
+                setHasUnsavedChanges(false);
+                initialStateRef.current = state;
+              }}
             />
             <Input
               onChange={(e) => setSearchText(e.target.value)}

client/src/components/production-list-table/production-list-table.container.jsx

@@ -4,12 +4,13 @@ import {
   QUERY_EXACT_JOB_IN_PRODUCTION,
   QUERY_EXACT_JOBS_IN_PRODUCTION,
   QUERY_JOBS_IN_PRODUCTION,
-  SUBSCRIPTION_JOBS_IN_PRODUCTION
+  SUBSCRIPTION_JOBS_IN_PRODUCTION,
+  SUBSCRIPTION_JOBS_IN_PRODUCTION_VIEW
 } from "../../graphql/jobs.queries";
 import ProductionListTable from "./production-list-table.component";
 import _ from "lodash";
 
-export default function ProductionListTableContainer() {
+export default function ProductionListTableContainer({ subscriptionType = "direct" }) {
   const { refetch, loading, data } = useQuery(QUERY_JOBS_IN_PRODUCTION, {
     pollInterval: 3600000,
     fetchPolicy: "network-only",
@@ -17,7 +18,9 @@ export default function ProductionListTableContainer() {
   });
   const client = useApolloClient();
   const [joblist, setJoblist] = useState([]);
-  const { data: updatedJobs } = useSubscription(SUBSCRIPTION_JOBS_IN_PRODUCTION);
+  const { data: updatedJobs } = useSubscription(
+    subscriptionType === "view" ? SUBSCRIPTION_JOBS_IN_PRODUCTION_VIEW : SUBSCRIPTION_JOBS_IN_PRODUCTION
+  );
 
   useEffect(() => {
     if (!(data && data.jobs)) return;

client/src/components/report-center-modal/report-center-modal-filters-sorters-component.jsx

@@ -6,7 +6,7 @@ import { useTranslation } from "react-i18next";
 import { getOrderOperatorsByType, getWhereOperatorsByType } from "../../utils/graphQLmodifier";
 import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
 import { generateInternalReflections } from "./report-center-modal-utils";
-import { FormDatePicker } from "../form-date-picker/form-date-picker.component.jsx";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 export default function ReportCenterModalFiltersSortersComponent({ form, bodyshop }) {
   return (
@@ -196,7 +196,8 @@ function FiltersSection({ filters, form, bodyshop }) {
                                 // We have a type of date, so we will use a date picker
                                 if (type === "date") {
                                   return (
-                                    <FormDatePicker
+                                    <DateTimePicker
+                                      isDateOnly
                                       disabled={!operator}
                                       onChange={(date) => form.setFieldValue(fieldPath, date)}
                                     />

client/src/components/report-center-modal/report-center-modal.component.jsx

@@ -34,28 +34,34 @@ export function ReportCenterModalComponent({ reportCenterModal, bodyshop }) {
   const [form] = Form.useForm();
   const [search, setSearch] = useState("");
   const {
-    treatments: { Enhanced_Payroll }
+    treatments: { Enhanced_Payroll, ADPPayroll }
   } = useSplitTreatments({
     attributes: {},
-    names: ["Enhanced_Payroll"],
+    names: ["Enhanced_Payroll", "ADPPayroll"],
     splitKey: bodyshop.imexshopid
   });
 
   const [loading, setLoading] = useState(false);
   const { t } = useTranslation();
   const Templates = TemplateList("report_center");
-  const ReportsList =
-    Enhanced_Payroll.treatment === "on"
-      ? Object.keys(Templates)
-          .map((key) => {
-            return Templates[key];
-          })
-          .filter((temp) => temp.enhanced_payroll === undefined || temp.enhanced_payroll === true)
-      : Object.keys(Templates)
-          .map((key) => {
-            return Templates[key];
-          })
-          .filter((temp) => temp.enhanced_payroll === undefined || temp.enhanced_payroll === false);
+  const ReportsList = Object.keys(Templates)
+    .map((key) => Templates[key])
+    .filter((temp) => {
+      const enhancedPayrollOn = Enhanced_Payroll.treatment === "on";
+      const adpPayrollOn = ADPPayroll.treatment === "on";
+
+      if (enhancedPayrollOn && adpPayrollOn) {
+        return temp.enhanced_payroll !== false || temp.adp_payroll !== false;
+      }
+      if (enhancedPayrollOn) {
+        return temp.enhanced_payroll !== false && temp.adp_payroll !== true;
+      }
+      if (adpPayrollOn) {
+        return temp.adp_payroll !== false && temp.enhanced_payroll !== true;
+      }
+
+      return temp.enhanced_payroll !== true && temp.adp_payroll !== true;
+    });
 
   const { open } = reportCenterModal;
 
@@ -104,7 +110,7 @@ export function ReportCenterModalComponent({ reportCenterModal, bodyshop }) {
         to: values.to,
         subject: Templates[values.key]?.subject
       },
-      values.sendbyexcel === "excel" ? "x" : values.sendby === "email" ? "e" : "p",
+      values.sendbytext === "text" ? values.sendbytext : values.sendbyexcel === "excel" ? "x" : values.sendby === "email" ? "e" : "p",
       id
     );
     setLoading(false);
@@ -291,7 +297,15 @@ export function ReportCenterModalComponent({ reportCenterModal, bodyshop }) {
                   </Radio.Group>
                 </Form.Item>
               );
-            if (reporttype !== "excel")
+            if (reporttype === "text")
+              return (
+                <Form.Item label={t("general.labels.sendby")} name="sendbytext" initialValue="text">
+                  <Radio.Group>
+                    <Radio value="text">{t("general.labels.text")}</Radio>
+                  </Radio.Group>
+                </Form.Item>
+              );
+            if (reporttype !== "excel" || reporttype !== "text")
               return (
                 <Form.Item label={t("general.labels.sendby")} name="sendby" initialValue="print">
                   <Radio.Group>

client/src/components/schedule-calendar-wrapper/localizer.js

@@ -0,0 +1,505 @@
+import isBetween from "dayjs/plugin/isBetween";
+import isSameOrAfter from "dayjs/plugin/isSameOrAfter";
+import isSameOrBefore from "dayjs/plugin/isSameOrBefore";
+import localeData from "dayjs/plugin/localeData";
+import localizedFormat from "dayjs/plugin/localizedFormat";
+import minMax from "dayjs/plugin/minMax";
+import utc from "dayjs/plugin/utc";
+import { DateLocalizer } from "react-big-calendar";
+
+function arrayWithHoles(arr) {
+  if (Array.isArray(arr)) return arr;
+}
+
+function iterableToArrayLimit(arr, i) {
+  if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
+  var _arr = [];
+  var _n = true;
+  var _d = false;
+  var _e = undefined;
+  try {
+    for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
+      _arr.push(_s.value);
+      if (i && _arr.length === i) break;
+    }
+  } catch (err) {
+    _d = true;
+    _e = err;
+  } finally {
+    try {
+      if (!_n && _i["return"] != null) _i["return"]();
+    } finally {
+      if (_d) throw _e;
+    }
+  }
+  return _arr;
+}
+
+function unsupportedIterableToArray(o, minLen) {
+  if (!o) return;
+  if (typeof o === "string") return arrayLikeToArray(o, minLen);
+  var n = Object.prototype.toString.call(o).slice(8, -1);
+  if (n === "Object" && o.constructor) n = o.constructor.name;
+  if (n === "Map" || n === "Set") return Array.from(o);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return arrayLikeToArray(o, minLen);
+}
+
+function arrayLikeToArray(arr, len) {
+  if (len == null || len > arr.length) len = arr.length;
+  for (var i = 0, arr2 = new Array(len); i < len; i++) {
+    arr2[i] = arr[i];
+  }
+  return arr2;
+}
+
+function nonIterableRest() {
+  throw new TypeError(
+    "Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."
+  );
+}
+
+function _slicedToArray(arr, i) {
+  return arrayWithHoles(arr) || iterableToArrayLimit(arr, i) || unsupportedIterableToArray(arr, i) || nonIterableRest();
+}
+
+function fixUnit(unit) {
+  var datePart = unit ? unit.toLowerCase() : unit;
+  if (datePart === "FullYear") {
+    datePart = "year";
+  } else if (!datePart) {
+    datePart = undefined;
+  }
+  return datePart;
+}
+
+var timeRangeFormat = function timeRangeFormat(_ref3, culture, local) {
+  var start = _ref3.start,
+    end = _ref3.end;
+  return local.format(start, "LT", culture) + " – " + local.format(end, "LT", culture);
+};
+var timeRangeStartFormat = function timeRangeStartFormat(_ref4, culture, local) {
+  var start = _ref4.start;
+  return local.format(start, "LT", culture) + " – ";
+};
+var timeRangeEndFormat = function timeRangeEndFormat(_ref5, culture, local) {
+  var end = _ref5.end;
+  return " – " + local.format(end, "LT", culture);
+};
+var weekRangeFormat = function weekRangeFormat(_ref, culture, local) {
+  var start = _ref.start,
+    end = _ref.end;
+  return (
+    local.format(start, "MMMM DD", culture) +
+    " – " +
+    // updated to use this localizer 'eq()' method
+    local.format(end, local.eq(start, end, "month") ? "DD" : "MMMM DD", culture)
+  );
+};
+var dateRangeFormat = function dateRangeFormat(_ref2, culture, local) {
+  var start = _ref2.start,
+    end = _ref2.end;
+  return local.format(start, "L", culture) + " – " + local.format(end, "L", culture);
+};
+
+var formats = {
+  dateFormat: "DD",
+  dayFormat: "DD ddd",
+  weekdayFormat: "ddd",
+  selectRangeFormat: timeRangeFormat,
+  eventTimeRangeFormat: timeRangeFormat,
+  eventTimeRangeStartFormat: timeRangeStartFormat,
+  eventTimeRangeEndFormat: timeRangeEndFormat,
+  timeGutterFormat: "LT",
+  monthHeaderFormat: "MMMM YYYY",
+  dayHeaderFormat: "dddd MMM DD",
+  dayRangeHeaderFormat: weekRangeFormat,
+  agendaHeaderFormat: dateRangeFormat,
+  agendaDateFormat: "ddd MMM DD",
+  agendaTimeFormat: "LT",
+  agendaTimeRangeFormat: timeRangeFormat
+};
+
+const localizer = (dayjsLib) => {
+  // load dayjs plugins
+  dayjsLib.extend(isBetween);
+  dayjsLib.extend(isSameOrAfter);
+  dayjsLib.extend(isSameOrBefore);
+  dayjsLib.extend(localeData);
+  dayjsLib.extend(localizedFormat);
+  dayjsLib.extend(minMax);
+  dayjsLib.extend(utc);
+  var locale = function locale(dj, c) {
+    return c ? dj.locale(c) : dj;
+  };
+
+  // if the timezone plugin is loaded,
+  // then use the timezone aware version
+
+  //TODO This was the issue entirely...
+  //  var dayjs = dayjsLib.tz ? dayjsLib.tz : dayjsLib;
+  var dayjs = dayjsLib;
+
+  function getTimezoneOffset(date) {
+    // ensures this gets cast to timezone
+    return dayjs(date).toDate().getTimezoneOffset();
+  }
+
+  function getDstOffset(start, end) {
+    var _st$tz$$x$$timezone;
+    // convert to dayjs, in case
+    var st = dayjs(start);
+    var ed = dayjs(end);
+    // if not using the dayjs timezone plugin
+    if (!dayjs.tz) {
+      return st.toDate().getTimezoneOffset() - ed.toDate().getTimezoneOffset();
+    }
+    /**
+     * If a default timezone has been applied, then
+     * use this to get the proper timezone offset, otherwise default
+     * the timezone to the browser local
+     */
+    var tzName =
+      (_st$tz$$x$$timezone = st.tz().$x.$timezone) !== null && _st$tz$$x$$timezone !== void 0
+        ? _st$tz$$x$$timezone
+        : dayjsLib.tz.guess();
+    // invert offsets to be inline with moment.js
+    var startOffset = -dayjs.tz(+st, tzName).utcOffset();
+    var endOffset = -dayjs.tz(+ed, tzName).utcOffset();
+    return startOffset - endOffset;
+  }
+
+  function getDayStartDstOffset(start) {
+    var dayStart = dayjs(start).startOf("day");
+    return getDstOffset(dayStart, start);
+  }
+
+  /*** BEGIN localized date arithmetic methods with dayjs ***/
+  function defineComparators(a, b, unit) {
+    var datePart = fixUnit(unit);
+    var dtA = datePart ? dayjs(a).startOf(datePart) : dayjs(a);
+    var dtB = datePart ? dayjs(b).startOf(datePart) : dayjs(b);
+    return [dtA, dtB, datePart];
+  }
+
+  function startOf() {
+    var date = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+    var unit = arguments.length > 1 ? arguments[1] : undefined;
+    var datePart = fixUnit(unit);
+    if (datePart) {
+      return dayjs(date).startOf(datePart).toDate();
+    }
+    return dayjs(date).toDate();
+  }
+
+  function endOf() {
+    var date = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+    var unit = arguments.length > 1 ? arguments[1] : undefined;
+    var datePart = fixUnit(unit);
+    if (datePart) {
+      return dayjs(date).endOf(datePart).toDate();
+    }
+    return dayjs(date).toDate();
+  }
+
+  // dayjs comparison operations *always* convert both sides to dayjs objects
+  // prior to running the comparisons
+  function eq(a, b, unit) {
+    var _defineComparators = defineComparators(a, b, unit),
+      _defineComparators2 = _slicedToArray(_defineComparators, 3),
+      dtA = _defineComparators2[0],
+      dtB = _defineComparators2[1],
+      datePart = _defineComparators2[2];
+    return dtA.isSame(dtB, datePart);
+  }
+
+  function neq(a, b, unit) {
+    return !eq(a, b, unit);
+  }
+
+  function gt(a, b, unit) {
+    var _defineComparators3 = defineComparators(a, b, unit),
+      _defineComparators4 = _slicedToArray(_defineComparators3, 3),
+      dtA = _defineComparators4[0],
+      dtB = _defineComparators4[1],
+      datePart = _defineComparators4[2];
+    return dtA.isAfter(dtB, datePart);
+  }
+
+  function lt(a, b, unit) {
+    var _defineComparators5 = defineComparators(a, b, unit),
+      _defineComparators6 = _slicedToArray(_defineComparators5, 3),
+      dtA = _defineComparators6[0],
+      dtB = _defineComparators6[1],
+      datePart = _defineComparators6[2];
+    return dtA.isBefore(dtB, datePart);
+  }
+
+  function gte(a, b, unit) {
+    var _defineComparators7 = defineComparators(a, b, unit),
+      _defineComparators8 = _slicedToArray(_defineComparators7, 3),
+      dtA = _defineComparators8[0],
+      dtB = _defineComparators8[1],
+      datePart = _defineComparators8[2];
+    return dtA.isSameOrBefore(dtB, datePart);
+  }
+
+  function lte(a, b, unit) {
+    var _defineComparators9 = defineComparators(a, b, unit),
+      _defineComparators10 = _slicedToArray(_defineComparators9, 3),
+      dtA = _defineComparators10[0],
+      dtB = _defineComparators10[1],
+      datePart = _defineComparators10[2];
+    return dtA.isSameOrBefore(dtB, datePart);
+  }
+
+  function inRange(day, min, max) {
+    var unit = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : "day";
+    var datePart = fixUnit(unit);
+    var djDay = dayjs(day);
+    var djMin = dayjs(min);
+    var djMax = dayjs(max);
+    return djDay.isBetween(djMin, djMax, datePart, "[]");
+  }
+
+  function min(dateA, dateB) {
+    var dtA = dayjs(dateA);
+    var dtB = dayjs(dateB);
+    var minDt = dayjsLib.min(dtA, dtB);
+    return minDt.toDate();
+  }
+
+  function max(dateA, dateB) {
+    var dtA = dayjs(dateA);
+    var dtB = dayjs(dateB);
+    var maxDt = dayjsLib.max(dtA, dtB);
+    return maxDt.toDate();
+  }
+
+  function merge(date, time) {
+    if (!date && !time) return null;
+    var tm = dayjs(time).format("HH:mm:ss");
+    var dt = dayjs(date).startOf("day").format("MM/DD/YYYY");
+    // We do it this way to avoid issues when timezone switching
+    return dayjsLib("".concat(dt, " ").concat(tm), "MM/DD/YYYY HH:mm:ss").toDate();
+  }
+
+  function add(date, adder, unit) {
+    var datePart = fixUnit(unit);
+    return dayjs(date).add(adder, datePart).toDate();
+  }
+
+  function range(start, end) {
+    var unit = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "day";
+    var datePart = fixUnit(unit);
+    // because the add method will put these in tz, we have to start that way
+    var current = dayjs(start).toDate();
+    var days = [];
+    while (lte(current, end)) {
+      days.push(current);
+      current = add(current, 1, datePart);
+    }
+    return days;
+  }
+
+  function ceil(date, unit) {
+    var datePart = fixUnit(unit);
+    var floor = startOf(date, datePart);
+    return eq(floor, date) ? floor : add(floor, 1, datePart);
+  }
+
+  function diff(a, b) {
+    var unit = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "day";
+    var datePart = fixUnit(unit);
+    // don't use 'defineComparators' here, as we don't want to mutate the values
+    var dtA = dayjs(a);
+    var dtB = dayjs(b);
+    return dtB.diff(dtA, datePart);
+  }
+
+  function minutes(date) {
+    var dt = dayjs(date);
+    return dt.minutes();
+  }
+
+  function firstOfWeek(culture) {
+    var data = culture ? dayjsLib.localeData(culture) : dayjsLib.localeData();
+    return data ? data.firstDayOfWeek() : 0;
+  }
+
+  function firstVisibleDay(date) {
+    return dayjs(date).startOf("month").startOf("week").toDate();
+  }
+
+  function lastVisibleDay(date) {
+    return dayjs(date).endOf("month").endOf("week").toDate();
+  }
+
+  function visibleDays(date) {
+    var current = firstVisibleDay(date);
+    var last = lastVisibleDay(date);
+    var days = [];
+    while (lte(current, last)) {
+      days.push(current);
+      current = add(current, 1, "d");
+    }
+    return days;
+  }
+
+  /*** END localized date arithmetic methods with dayjs ***/
+
+  /**
+   * Moved from TimeSlots.js, this method overrides the method of the same name
+   * in the localizer.js, using dayjs to construct the js Date
+   * @param {Date} dt - date to start with
+   * @param {Number} minutesFromMidnight
+   * @param {Number} offset
+   * @returns {Date}
+   */
+  function getSlotDate(dt, minutesFromMidnight, offset) {
+    return dayjs(dt)
+      .startOf("day")
+      .minute(minutesFromMidnight + offset)
+      .toDate();
+  }
+
+  // dayjs will automatically handle DST differences in it's calculations
+  function getTotalMin(start, end) {
+    return diff(start, end, "minutes");
+  }
+
+  function getMinutesFromMidnight(start) {
+    var dayStart = dayjs(start).startOf("day");
+    var day = dayjs(start);
+    return day.diff(dayStart, "minutes") + getDayStartDstOffset(start);
+  }
+
+  // These two are used by DateSlotMetrics
+  function continuesPrior(start, first) {
+    var djStart = dayjs(start);
+    var djFirst = dayjs(first);
+    return djStart.isBefore(djFirst, "day");
+  }
+
+  function continuesAfter(start, end, last) {
+    var djEnd = dayjs(end);
+    var djLast = dayjs(last);
+    return djEnd.isSameOrAfter(djLast, "minutes");
+  }
+
+  function daySpan(start, end) {
+    var startDay = dayjs(start);
+    var endDay = dayjs(end);
+    return endDay.diff(startDay, "day");
+  }
+
+  // These two are used by eventLevels
+  function sortEvents(_ref6) {
+    var _ref6$evtA = _ref6.evtA,
+      aStart = _ref6$evtA.start,
+      aEnd = _ref6$evtA.end,
+      aAllDay = _ref6$evtA.allDay,
+      _ref6$evtB = _ref6.evtB,
+      bStart = _ref6$evtB.start,
+      bEnd = _ref6$evtB.end,
+      bAllDay = _ref6$evtB.allDay;
+    var startSort = +startOf(aStart, "day") - +startOf(bStart, "day");
+    var durA = daySpan(aStart, aEnd);
+    var durB = daySpan(bStart, bEnd);
+    return (
+      startSort ||
+      // sort by start Day first
+      durB - durA ||
+      // events spanning multiple days go first
+      !!bAllDay - !!aAllDay ||
+      // then allDay single day events
+      +aStart - +bStart ||
+      // then sort by start time *don't need dayjs conversion here
+      +aEnd - +bEnd // then sort by end time *don't need dayjs conversion here either
+    );
+  }
+
+  function inEventRange(_ref7) {
+    var _ref7$event = _ref7.event,
+      start = _ref7$event.start,
+      end = _ref7$event.end,
+      _ref7$range = _ref7.range,
+      rangeStart = _ref7$range.start,
+      rangeEnd = _ref7$range.end;
+    var startOfDay = dayjs(start).startOf("day");
+    var eEnd = dayjs(end);
+    var rStart = dayjs(rangeStart);
+    var rEnd = dayjs(rangeEnd);
+    var startsBeforeEnd = startOfDay.isSameOrBefore(rEnd, "day");
+    // when the event is zero duration we need to handle a bit differently
+    var sameMin = !startOfDay.isSame(eEnd, "minutes");
+    var endsAfterStart = sameMin ? eEnd.isAfter(rStart, "minutes") : eEnd.isSameOrAfter(rStart, "minutes");
+    return startsBeforeEnd && endsAfterStart;
+  }
+
+  function isSameDate(date1, date2) {
+    var dt = dayjs(date1);
+    var dt2 = dayjs(date2);
+    return dt.isSame(dt2, "day");
+  }
+
+  /**
+   * This method, called once in the localizer constructor, is used by eventLevels
+   * 'eventSegments()' to assist in determining the 'span' of the event in the display,
+   * specifically when using a timezone that is greater than the browser native timezone.
+   * @returns number
+   */
+  function browserTZOffset() {
+    /**
+     * Date.prototype.getTimezoneOffset horrifically flips the positive/negative from
+     * what you see in it's string, so we have to jump through some hoops to get a value
+     * we can actually compare.
+     */
+    var dt = new Date();
+    var neg = /-/.test(dt.toString()) ? "-" : "";
+    var dtOffset = dt.getTimezoneOffset();
+    var comparator = Number("".concat(neg).concat(Math.abs(dtOffset)));
+    // dayjs correctly provides positive/negative offset, as expected
+    var mtOffset = dayjs().utcOffset();
+    return mtOffset > comparator ? 1 : 0;
+  }
+
+  return new DateLocalizer({
+    formats: formats,
+    firstOfWeek: firstOfWeek,
+    firstVisibleDay: firstVisibleDay,
+    lastVisibleDay: lastVisibleDay,
+    visibleDays: visibleDays,
+    format: function format(value, _format, culture) {
+      return locale(dayjs(value), culture).format(_format);
+    },
+    lt: lt,
+    lte: lte,
+    gt: gt,
+    gte: gte,
+    eq: eq,
+    neq: neq,
+    merge: merge,
+    inRange: inRange,
+    startOf: startOf,
+    endOf: endOf,
+    range: range,
+    add: add,
+    diff: diff,
+    ceil: ceil,
+    min: min,
+    max: max,
+    minutes: minutes,
+    getSlotDate: getSlotDate,
+    getTimezoneOffset: getTimezoneOffset,
+    getDstOffset: getDstOffset,
+    getTotalMin: getTotalMin,
+    getMinutesFromMidnight: getMinutesFromMidnight,
+    continuesPrior: continuesPrior,
+    continuesAfter: continuesAfter,
+    sortEvents: sortEvents,
+    inEventRange: inEventRange,
+    isSameDate: isSameDate,
+    browserTZOffset: browserTZOffset
+  });
+};
+export default localizer;

client/src/components/schedule-calendar-wrapper/scheduler-calendar-wrapper.component.jsx

@@ -1,7 +1,7 @@
 import dayjs from "../../utils/day";
 import queryString from "query-string";
 import React from "react";
-import { Calendar, dayjsLocalizer } from "react-big-calendar";
+import { Calendar } from "react-big-calendar";
 import { connect } from "react-redux";
 import { Link, useLocation, useNavigate } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
@@ -14,12 +14,13 @@ import { selectProblemJobs } from "../../redux/application/application.selectors
 import { Alert, Collapse, Space } from "antd";
 import { Trans, useTranslation } from "react-i18next";
 import InstanceRenderManager from "../../utils/instanceRenderMgr";
+import local from "./localizer";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
   problemJobs: selectProblemJobs
 });
-const localizer = dayjsLocalizer(dayjs);
+const localizer = local(dayjs);
 
 export function ScheduleCalendarWrapperComponent({
   bodyshop,

client/src/components/scoreboard-entry-edit/scoreboard-entry-edit.component.jsx

@@ -4,7 +4,7 @@ import dayjs from "../../utils/day";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { UPDATE_SCOREBOARD_ENTRY } from "../../graphql/scoreboard.queries";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 export default function ScoreboardEntryEdit({ entry }) {
   const [open, setOpen] = useState(false);
@@ -52,7 +52,7 @@ export default function ScoreboardEntryEdit({ entry }) {
                   }
                 ]}
               >
-                <FormDatePicker />
+                <DateTimePicker isDateOnly />
               </Form.Item>
               <Form.Item
                 label={t("scoreboard.fields.bodyhrs")}

client/src/components/scoreboard-targets-table/scoreboard-targets-table.util.js

@@ -4,7 +4,7 @@ export const CalculateWorkingDaysThisMonth = () => dayjs().endOf("month").busine
 
 export const CalculateWorkingDaysInPeriod = (start, end) => dayjs(end).businessDiff(dayjs(start));
 
-export const CalculateWorkingDaysAsOfToday = () => dayjs().businessDaysInMonth().length;
+export const CalculateWorkingDaysAsOfToday = () => dayjs().endOf("day").businessDiff(dayjs().startOf("month"));
 
 export const CalculateWorkingDaysLastMonth = () =>
   dayjs().subtract(1, "month").endOf("month").businessDaysInMonth().length;

client/src/components/shop-employees/shop-employees-add-vacation.component.jsx

@@ -5,7 +5,7 @@ import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { logImEXEvent } from "../../firebase/firebase.utils";
 import { INSERT_VACATION } from "../../graphql/employees.queries";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 export default function ShopEmployeeAddVacation({ employee }) {
   const { t } = useTranslation();
@@ -64,7 +64,7 @@ export default function ShopEmployeeAddVacation({ employee }) {
             }
           ]}
         >
-          <FormDatePicker />
+          <DateTimePicker isDateOnly />
         </Form.Item>
         <Form.Item
           label={t("employees.fields.vacation.end")}
@@ -90,7 +90,7 @@ export default function ShopEmployeeAddVacation({ employee }) {
             })
           ]}
         >
-          <FormDatePicker />
+          <DateTimePicker isDateOnly />
         </Form.Item>
 
         <Space wrap>

client/src/components/shop-employees/shop-employees-form.component.jsx

@@ -21,12 +21,12 @@ import { selectBodyshop } from "../../redux/user/user.selectors";
 import CiecaSelect from "../../utils/Ciecaselect";
 import { DateFormatter } from "../../utils/DateFormatter";
 import AlertComponent from "../alert/alert.component";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
 import ShopEmployeeAddVacation from "./shop-employees-add-vacation.component";
 import queryString from "query-string";
 import { useSplitTreatments } from "@splitsoftware/splitio-react";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -266,10 +266,10 @@ export function ShopEmployeesFormComponent({ bodyshop }) {
               }
             ]}
           >
-            <FormDatePicker />
+            <DateTimePicker isDateOnly />
           </Form.Item>
           <Form.Item label={t("employees.fields.termination_date")} name="termination_date">
-            <FormDatePicker />
+            <DateTimePicker isDateOnly />
           </Form.Item>
           <Form.Item
             label={t("employees.fields.user_email")}

client/src/components/shop-info/shop-info.component.jsx

@@ -20,6 +20,7 @@ import ShopInfoTaskPresets from "./shop-info.task-presets.component";
 import queryString from "query-string";
 import InstanceRenderManager from "../../utils/instanceRenderMgr";
 import ShopInfoRoGuard from "./shop-info.roguard.component";
+import ShopInfoIntellipay from "./shop-intellipay-config.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -135,6 +136,17 @@ export function ShopInfoComponent({ bodyshop, form, saveLoading }) {
       ],
       rome: "USE_IMEX",
       promanager: []
+    }),
+    ...InstanceRenderManager({
+      imex: [],
+      rome: [
+        {
+          key: "intellipay",
+          label: t("bodyshop.labels.intellipay"),
+          children: <ShopInfoIntellipay form={form} />
+        }
+      ],
+      promanager: []
     })
   ];
   return (

client/src/components/shop-info/shop-info.general.component.jsx

@@ -7,13 +7,13 @@ import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import DatePickerRanges from "../../utils/DatePickerRanges";
+import InstanceRenderManager from "../../utils/instanceRenderMgr";
+import FeatureWrapper, { HasFeatureAccess } from "../feature-wrapper/feature-wrapper.component";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
 import FormItemEmail from "../form-items-formatted/email-form-item.component";
 import PhoneFormItem, { PhoneItemFormatterValidation } from "../form-items-formatted/phone-form-item.component";
 import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
-import InstanceRenderManager from "../../utils/instanceRenderMgr";
-import FeatureWrapper, { HasFeatureAccess } from "../feature-wrapper/feature-wrapper.component";
 // TODO: Client Update, this might break
 const timeZonesList = Intl.supportedValuesOf("timeZone");
 const mapStateToProps = createStructuredSelector({
@@ -28,10 +28,10 @@ export function ShopInfoGeneral({ form, bodyshop }) {
   const { t } = useTranslation();
 
   const {
-    treatments: { ClosingPeriod }
+    treatments: { ClosingPeriod, ADPPayroll }
   } = useSplitTreatments({
     attributes: {},
-    names: ["ClosingPeriod"],
+    names: ["ClosingPeriod", "ADPPayroll"],
     splitKey: bodyshop && bodyshop.imexshopid
   });
 
@@ -98,7 +98,6 @@ export function ShopInfoGeneral({ form, bodyshop }) {
         <Form.Item label={t("bodyshop.fields.email")} name="email">
           <Input />
         </Form.Item>
-
         <Form.Item
           label={t("bodyshop.fields.phone")}
           name="phone"
@@ -356,14 +355,22 @@ export function ShopInfoGeneral({ form, bodyshop }) {
             <Select mode="tags" />
           </Form.Item>
           {ClosingPeriod.treatment === "on" && (
-            <>
-              <Form.Item
-                name={["accountingconfig", "ClosingPeriod"]}
-                label={t("bodyshop.fields.closingperiod")} //{t("reportcenter.labels.dates")}
-              >
-                <DatePicker.RangePicker format="MM/DD/YYYY" presets={DatePickerRanges} />
-              </Form.Item>
-            </>
+            <Form.Item
+              name={["accountingconfig", "ClosingPeriod"]}
+              label={t("bodyshop.fields.closingperiod")} //{t("reportcenter.labels.dates")}
+            >
+              <DatePicker.RangePicker format="MM/DD/YYYY" presets={DatePickerRanges} />
+            </Form.Item>
+          )}
+          {ADPPayroll.treatment === "on" && (
+            <Form.Item name={["accountingconfig", "companyCode"]} label={t("bodyshop.fields.companycode")}>
+              <Input />
+            </Form.Item>
+          )}
+          {ADPPayroll.treatment === "on" && (
+            <Form.Item name={["accountingconfig", "batchID"]} label={t("bodyshop.fields.batchid")}>
+              <Input />
+            </Form.Item>
           )}
         </LayoutFormRow>
       </FeatureWrapper>

client/src/components/shop-info/shop-info.rbac.component.jsx

@@ -30,219 +30,226 @@ export function ShopInfoRbacComponent({ form, bodyshop }) {
   return (
     <RbacWrapper action="shop:rbac">
       <LayoutFormRow>
-        {...HasFeatureAccess({ featureName: "export", bodyshop }) ? [
-          <Form.Item
-            label={t("bodyshop.fields.rbac.accounting.exportlog")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "accounting:exportlog"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.accounting.payables")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "accounting:payables"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.accounting.payments")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "accounting:payments"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.accounting.receivables")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "accounting:receivables"]}
-          >
-            <InputNumber />
-          </Form.Item>
-        ]:[]}
-        {...HasFeatureAccess({ featureName: "bills", bodyshop }) ? [
-          <Form.Item
-            label={t("bodyshop.fields.rbac.bills.delete")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "bills:delete"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.bills.enter")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "bills:enter"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.bills.list")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "bills:list"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.bills.reexport")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "bills:reexport"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.bills.view")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "bills:view"]}
-          >
-            <InputNumber />
-          </Form.Item>
-        ]:[]}
-
-        {...HasFeatureAccess({ featureName: "courtesycars", bodyshop }) ? [
-          <Form.Item
-            label={t("bodyshop.fields.rbac.contracts.create")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "contracts:create"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.contracts.detail")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "contracts:detail"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.contracts.list")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "contracts:list"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.courtesycar.create")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "courtesycar:create"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.courtesycar.detail")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "courtesycar:detail"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.courtesycar.list")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "courtesycar:list"]}
-          >
-            <InputNumber />
-          </Form.Item>
-        ]:[]}
-        {...HasFeatureAccess({ featureName: "csi", bodyshop }) ? [
-          <Form.Item
-            label={t("bodyshop.fields.rbac.csi.export")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "csi:export"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.csi.page")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "csi:page"]}
-          >
-            <InputNumber />
-          </Form.Item>
-        ]:[]}
+        {...HasFeatureAccess({ featureName: "export", bodyshop })
+          ? [
+              <Form.Item
+                label={t("bodyshop.fields.rbac.accounting.exportlog")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "accounting:exportlog"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.accounting.payables")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "accounting:payables"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.accounting.payments")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "accounting:payments"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.accounting.receivables")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "accounting:receivables"]}
+              >
+                <InputNumber />
+              </Form.Item>
+            ]
+          : []}
+        {...HasFeatureAccess({ featureName: "bills", bodyshop })
+          ? [
+              <Form.Item
+                label={t("bodyshop.fields.rbac.bills.delete")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "bills:delete"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.bills.enter")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "bills:enter"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.bills.list")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "bills:list"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.bills.reexport")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "bills:reexport"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.bills.view")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "bills:view"]}
+              >
+                <InputNumber />
+              </Form.Item>
+            ]
+          : []}
+        {...HasFeatureAccess({ featureName: "courtesycars", bodyshop })
+          ? [
+              <Form.Item
+                label={t("bodyshop.fields.rbac.contracts.create")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "contracts:create"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.contracts.detail")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "contracts:detail"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.contracts.list")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "contracts:list"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.courtesycar.create")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "courtesycar:create"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.courtesycar.detail")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "courtesycar:detail"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.courtesycar.list")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "courtesycar:list"]}
+              >
+                <InputNumber />
+              </Form.Item>
+            ]
+          : []}
+        {...HasFeatureAccess({ featureName: "csi", bodyshop })
+          ? [
+              <Form.Item
+                label={t("bodyshop.fields.rbac.csi.export")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "csi:export"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.csi.page")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "csi:page"]}
+              >
+                <InputNumber />
+              </Form.Item>
+            ]
+          : []}
         <Form.Item
           label={t("bodyshop.fields.rbac.employees.page")}
           rules={[
@@ -255,6 +262,18 @@ export function ShopInfoRbacComponent({ form, bodyshop }) {
         >
           <InputNumber />
         </Form.Item>
+        <Form.Item
+          label={t("bodyshop.fields.rbac.employee_teams.page")}
+          rules={[
+            {
+              required: true
+              //message: t("general.validation.required"),
+            }
+          ]}
+          name={["md_rbac", "employee_teams:page"]}
+        >
+          <InputNumber />
+        </Form.Item>
         <Form.Item
           label={t("bodyshop.fields.rbac.jobs.admin")}
           rules={[
@@ -435,31 +454,6 @@ export function ShopInfoRbacComponent({ form, bodyshop }) {
         >
           <InputNumber />
         </Form.Item>
-        <Form.Item
-          label={t("bodyshop.fields.rbac.employees.page")}
-          rules={[
-            {
-              required: true
-              //message: t("general.validation.required"),
-            }
-          ]}
-          name={["md_rbac", "employees:page"]}
-        >
-          <InputNumber />
-        </Form.Item>
-        <Form.Item
-          label={t("bodyshop.fields.rbac.employee_teams.page")}
-          rules={[
-            {
-              required: true
-              //message: t("general.validation.required"),
-            }
-          ]}
-          name={["md_rbac", "employee_teams:page"]}
-        >
-          <InputNumber />
-        </Form.Item>
-
         <Form.Item
           label={t("bodyshop.fields.rbac.payments.enter")}
           rules={[
@@ -522,7 +516,6 @@ export function ShopInfoRbacComponent({ form, bodyshop }) {
             <InputNumber />
           </Form.Item>
         )}
-
         <Form.Item
           label={t("bodyshop.fields.rbac.production.list")}
           rules={[
@@ -561,128 +554,118 @@ export function ShopInfoRbacComponent({ form, bodyshop }) {
             <InputNumber />
           </Form.Item>
         )}
-        {...HasFeatureAccess({ featureName: "timetickets", bodyshop }) ? [
-          <Form.Item
-            label={t("bodyshop.fields.rbac.shiftclock.view")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "shiftclock:view"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.shop.config")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "shop:config"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.timetickets.edit")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "timetickets:edit"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.timetickets.shiftedit")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "timetickets:shiftedit"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.timetickets.editcommitted")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "timetickets:editcommitted"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.ttapprovals.view")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "ttapprovals:view"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.ttapprovals.approve")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "ttapprovals:approve"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.timetickets.enter")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "timetickets:enter"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.timetickets.list")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "timetickets:list"]}
-          >
-            <InputNumber />
-          </Form.Item>,
-          <Form.Item
-            label={t("bodyshop.fields.rbac.timetickets.shiftedit")}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-            name={["md_rbac", "timetickets:shiftedit"]}
-          >
-            <InputNumber />
-          </Form.Item>
-        ]:[]}
+        {...HasFeatureAccess({ featureName: "timetickets", bodyshop })
+          ? [
+              <Form.Item
+                label={t("bodyshop.fields.rbac.shiftclock.view")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "shiftclock:view"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.shop.config")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "shop:config"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.timetickets.edit")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "timetickets:edit"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.timetickets.shiftedit")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "timetickets:shiftedit"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.timetickets.editcommitted")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "timetickets:editcommitted"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.ttapprovals.view")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "ttapprovals:view"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.ttapprovals.approve")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "ttapprovals:approve"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.timetickets.enter")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "timetickets:enter"]}
+              >
+                <InputNumber />
+              </Form.Item>,
+              <Form.Item
+                label={t("bodyshop.fields.rbac.timetickets.list")}
+                rules={[
+                  {
+                    required: true
+                    //message: t("general.validation.required"),
+                  }
+                ]}
+                name={["md_rbac", "timetickets:list"]}
+              >
+                <InputNumber />
+              </Form.Item>
+            ]
+          : []}
         <Form.Item
           label={t("bodyshop.fields.rbac.shop.vendors")}
           rules={[
@@ -757,7 +740,6 @@ export function ShopInfoRbacComponent({ form, bodyshop }) {
             <InputNumber />
           </Form.Item>
         )}
-
         <Form.Item
           label={t("bodyshop.fields.rbac.users.editaccess")}
           rules={[

client/src/components/shop-info/shop-intellipay-config.component.jsx

@@ -0,0 +1,54 @@
+import { Alert, Form, InputNumber, Switch } from "antd";
+import React from "react";
+import { useTranslation } from "react-i18next";
+import LayoutFormRow from "../layout-form-row/layout-form-row.component";
+
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+export default connect(mapStateToProps, mapDispatchToProps)(ShopInfoIntellipay);
+
+export function ShopInfoIntellipay({ bodyshop, form }) {
+  const { t } = useTranslation();
+
+  return (
+    <>
+      <Form.Item dependencies={[["intellipay_config", "enable_cash_discount"]]}>
+        {() => {
+          const { intellipay_config } = form.getFieldsValue();
+
+          if (intellipay_config?.enable_cash_discount)
+            return <Alert message={t("bodyshop.labels.intellipay_cash_discount")} />;
+        }}
+      </Form.Item>
+
+      <LayoutFormRow noDivider>
+        <Form.Item
+          label={t("bodyshop.fields.intellipay_config.enable_cash_discount")}
+          valuePropName="checked"
+          name={["intellipay_config", "enable_cash_discount"]}
+        >
+          <Switch />
+        </Form.Item>
+        <Form.Item
+          label={t("bodyshop.fields.intellipay_config.cash_discount_percentage")}
+          valuePropName="checked"
+          dependencies={[["intellipay_config", "enable_cash_discount"]]}
+          name={["intellipay_config", "cash_discount_percentage"]}
+          rules={[
+            ({ getFieldsValue }) => ({ required: form.getFieldValue(["intellipay_config", "enable_cash_discount"]) })
+          ]}
+        >
+          <InputNumber min={0} max={100} precision={1} suffix='%'/>
+        </Form.Item>
+      </LayoutFormRow>
+    </>
+  );
+}

client/src/components/task-upsert-modal/task-upsert-modal.component.jsx

@@ -1,14 +1,13 @@
 import { Col, Form, Input, Row, Select, Switch } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
-import { FormDatePicker } from "../form-date-picker/form-date-picker.component.jsx";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors.js";
 import dayjs from "../../utils/day";
 import { connect } from "react-redux";
 import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component.jsx";
 import JobSearchSelectComponent from "../job-search-select/job-search-select.component.jsx";
-import { FormDateTimePickerEnhanced } from "../form-date-time-picker-enhanced/form-date-time-picker-enhanced.component.jsx";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -246,7 +245,8 @@ export function TaskUpsertModalComponent({
         </Col>
         <Col span={8}>
           <Form.Item label={t("tasks.fields.due_date")} name="due_date">
-            <FormDatePicker
+            <DateTimePicker
+              isDateOnly
               onlyFuture
               format="MM/DD/YYYY"
               presets={generatePresets(selectedJobDetails)}
@@ -278,12 +278,7 @@ export function TaskUpsertModalComponent({
               }
             ]}
           >
-            <FormDateTimePickerEnhanced
-              onlyFuture
-              showTime
-              minuteStep={15}
-              presets={generatePresets(selectedJobDetails)}
-            />
+            <DateTimePicker onlyFuture presets={generatePresets(selectedJobDetails)} />
           </Form.Item>
         </Col>
       </Row>

client/src/components/tech-job-print-tickets/tech-job-print-tickets.component.jsx

@@ -1,5 +1,4 @@
 import { Button, Card, DatePicker, Form, Popover, Radio, Space } from "antd";
-import dayjs from "../../utils/day";
 import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -7,10 +6,12 @@ import { createStructuredSelector } from "reselect";
 import { logImEXEvent } from "../../firebase/firebase.utils";
 import { selectTechnician } from "../../redux/tech/tech.selectors";
 import DatePIckerRanges from "../../utils/DatePickerRanges";
+import dayjs from "../../utils/day";
 import { GenerateDocument } from "../../utils/RenderTemplate";
 import { TemplateList } from "../../utils/TemplateConstants";
 
 const mapStateToProps = createStructuredSelector({
+  bodyshop: selectTechnician,
   technician: selectTechnician
 });
 const mapDispatchToProps = (dispatch) => ({
@@ -18,7 +19,7 @@ const mapDispatchToProps = (dispatch) => ({
 });
 export default connect(mapStateToProps, mapDispatchToProps)(TechJobPrintTickets);
 
-export function TechJobPrintTickets({ technician, event, attendacePrint }) {
+export function TechJobPrintTickets({ bodyshop, technician, event, attendacePrint }) {
   const { t } = useTranslation();
 
   const [loading, setLoading] = useState(false);
@@ -57,7 +58,8 @@ export function TechJobPrintTickets({ technician, event, attendacePrint }) {
           subject:
             attendacePrint === true ? Templates.attendance_employee.subject : Templates.timetickets_employee.subject
         },
-        values.sendby // === "email" ? "e" : "p"
+        values.sendby,
+        bodyshop
       );
     } catch (error) {
       console.log(error);

client/src/components/time-ticket-list/time-ticket-list-team-pay.component.jsx

@@ -7,9 +7,9 @@ import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { GET_JOB_INFO_DRAW_CALCULATIONS } from "../../graphql/jobs-lines.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import JobSearchSelectComponent from "../job-search-select/job-search-select.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -71,7 +71,7 @@ export function TimeTicketListTeamPay({ bodyshop, context, actions }) {
                 }
               ]}
             >
-              <FormDatePicker />
+              <DateTimePicker isDateOnly />
             </Form.Item>
           </LayoutFormRow>
 

client/src/components/time-ticket-list/time-ticket-list.component.jsx

@@ -1,6 +1,6 @@
 import { EditFilled, SyncOutlined } from "@ant-design/icons";
+import { useSplitTreatments } from "@splitsoftware/splitio-react";
 import { Button, Card, Checkbox, Space, Table } from "antd";
-import dayjs from "../../utils/day";
 import React, { useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -10,10 +10,10 @@ import { setModalContext } from "../../redux/modals/modals.actions";
 import { selectAuthLevel, selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
 import { DateFormatter, DateTimeFormatter } from "../../utils/DateFormatter";
 import { onlyUnique } from "../../utils/arrayHelper";
+import dayjs from "../../utils/day";
 import { alphaSort, dateSort } from "../../utils/sorters";
-import RbacWrapper, { HasRbacAccess } from "../rbac-wrapper/rbac-wrapper.component";
+import { HasRbacAccess } from "../rbac-wrapper/rbac-wrapper.component";
 import TimeTicketEnterButton from "../time-ticket-enter-button/time-ticket-enter-button.component";
-import { useSplitTreatments } from "@splitsoftware/splitio-react";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -52,6 +52,10 @@ export function TimeTicketList({
     splitKey: bodyshop.imexshopid
   });
 
+  const canEditCommittedTimeTickets = HasRbacAccess({ bodyshop, authLevel, action: "timetickets:editcommitted" });
+  const canEditTimeTickets = HasRbacAccess({ bodyshop, authLevel, action: "timetickets:edit" });
+  const canEditShiftTickets = HasRbacAccess({ bodyshop, authLevel, action: "timetickets:shiftedit" });
+
   const totals = useMemo(() => {
     if (timetickets)
       return timetickets.reduce(
@@ -65,6 +69,18 @@ export function TimeTicketList({
     return { productivehrs: 0, actualhrs: 0 };
   }, [timetickets]);
 
+  const isDisabled = (record) => {
+    if (disabled === true || !record.id) return true;
+
+    const isShiftTicket = !record.ciecacode;
+    const isCommitted = record.committed_at;
+    if (isShiftTicket) {
+      return !(canEditShiftTickets && (!isCommitted || canEditCommittedTimeTickets));
+    }
+    
+    return !(canEditTimeTickets && (!isCommitted || canEditCommittedTimeTickets));
+  };
+
   const columns = [
     ...(Enhanced_Payroll.treatment === "on"
       ? [
@@ -165,7 +181,7 @@ export function TimeTicketList({
       key: "memo",
       sorter: (a, b) => alphaSort(a.memo, b.memo),
       sortOrder: state.sortedInfo.columnKey === "memo" && state.sortedInfo.order,
-      render: (text, record) => (record.clockon || record.clockoff ? t(record.memo) : record.memo)
+      render: (text, record) => (record.memo?.startsWith("timetickets.labels") ? t(record.memo) : record.memo)
     },
     ...(Enhanced_Payroll.treatment === "on"
       ? [
@@ -206,76 +222,55 @@ export function TimeTicketList({
                 return null;
               }
             }
-          },
-  
+          }
         ]),
-        {
-          title: t("timetickets.fields.created_by"),
-          dataIndex: "created_by",
-          key: "created_by",
-          sorter: (a, b) => alphaSort(a.created_by, b.created_by),
-          sortOrder: state.sortedInfo.columnKey === "created_by" && state.sortedInfo.order,
-          render: (text, record) => record.created_by
-        },
-        // {
-        //   title: "Pay",
-        //   dataIndex: "pay",
-        //   key: "pay",
-        //   render: (text, record) =>
-        //     Dinero({ amount: Math.round(record.rate * 100) })
-        //       .multiply(record.flat_rate ? record.productivehrs : record.actualhrs)
-        //       .toFormat("$0.00"),
-        // },
-        {
-          title: t("general.labels.actions"),
-          dataIndex: "actions",
-          key: "actions",
-          render: (text, record) => (
-            <Space wrap>
-              {techConsole && (
-                <TimeTicketEnterButton
-                  actions={{ refetch }}
-                  context={{ id: record.id, timeticket: record }}
-                  disabled={!record.job || disabled}
-                >
-                  <EditFilled />
-                </TimeTicketEnterButton>
-              )}
-              {!techConsole && (
-                <RbacWrapper
-                  action="timetickets:edit"
-                  noauth={() => {
-                    return <div />;
-                  }}
-                >
-                  <TimeTicketEnterButton
-                    actions={{ refetch }}
-                    context={{
-                      id: record.id,
-                      timeticket: record
-                    }}
-                    disabled={
-                      HasRbacAccess({
-                        bodyshop,
-                        authLevel: authLevel,
-                        action: "timetickets:editcommitted"
-                      }) &&
-                      HasRbacAccess({
-                        bodyshop,
-                        authLevel: authLevel,
-                        action: "timetickets:shiftedit"
-                      })
-                        ? disabled
-                        : !record.jobid
-                    }
-                  >
-                    <EditFilled />
-                  </TimeTicketEnterButton>
-                </RbacWrapper>
-              )}
-            </Space>
-          )
-        }
+    {
+      title: t("timetickets.fields.created_by"),
+      dataIndex: "created_by",
+      key: "created_by",
+      sorter: (a, b) => alphaSort(a.created_by, b.created_by),
+      sortOrder: state.sortedInfo.columnKey === "created_by" && state.sortedInfo.order,
+      render: (text, record) => record.created_by
+    },
+    // {
+    //   title: "Pay",
+    //   dataIndex: "pay",
+    //   key: "pay",
+    //   render: (text, record) =>
+    //     Dinero({ amount: Math.round(record.rate * 100) })
+    //       .multiply(record.flat_rate ? record.productivehrs : record.actualhrs)
+    //       .toFormat("$0.00"),
+    // },
+    {
+      title: t("general.labels.actions"),
+      dataIndex: "actions",
+      key: "actions",
+      render: (text, record) => (
+        <Space wrap>
+          {techConsole && (
+            <TimeTicketEnterButton
+              actions={{ refetch }}
+              context={{ id: record.id, timeticket: record }}
+              disabled={!record.job || disabled}
+            >
+              <EditFilled />
+            </TimeTicketEnterButton>
+          )}
+          {!techConsole && (
+            <TimeTicketEnterButton
+              actions={{ refetch }}
+              context={{
+                id: record.id,
+                timeticket: record
+              }}
+              disabled={isDisabled(record)}
+            >
+              <EditFilled />
+            </TimeTicketEnterButton>
+          )}
+        </Space>
+      )
+    }
   ];
 
   const handleTableChange = (pagination, filters, sorter) => {

client/src/components/time-ticket-modal/time-ticket-modal.component.jsx

@@ -1,4 +1,5 @@
 import { useLazyQuery } from "@apollo/client";
+import { useSplitTreatments } from "@splitsoftware/splitio-react";
 import { Form, Input, InputNumber, Select, Switch } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
@@ -7,8 +8,10 @@ import { createStructuredSelector } from "reselect";
 import { GET_LINE_TICKET_BY_PK } from "../../graphql/jobs-lines.queries";
 import { selectAuthLevel, selectBodyshop } from "../../redux/user/user.selectors";
 import EmployeeSearchSelect from "../employee-search-select/employee-search-select.component";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
-import FormDateTimePicker from "../form-date-time-picker/form-date-time-picker.component";
+import {
+  default as DateTimePicker,
+  default as FormDateTimePicker
+} from "../form-date-time-picker/form-date-time-picker.component";
 import JobSearchSelect from "../job-search-select/job-search-select.component";
 import LaborAllocationsTable from "../labor-allocations-table/labor-allocations-table.component";
 import { CalculateAllocationsTotals } from "../labor-allocations-table/labor-allocations-table.utility";
@@ -16,7 +19,6 @@ import LayoutFormRow from "../layout-form-row/layout-form-row.component";
 import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
 import { HasRbacAccess } from "../rbac-wrapper/rbac-wrapper.component";
 import TimeTicketList from "../time-ticket-list/time-ticket-list.component";
-import { useSplitTreatments } from "@splitsoftware/splitio-react";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -60,8 +62,8 @@ export function TimeTicketModalComponent({
               {item.cost_center === "timetickets.labels.shift"
                 ? t(item.cost_center)
                 : bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber || Enhanced_Payroll.treatment === "on"
-                ? t(`joblines.fields.lbr_types.${item.cost_center.toUpperCase()}`)
-                : item.cost_center}
+                  ? t(`joblines.fields.lbr_types.${item.cost_center.toUpperCase()}`)
+                  : item.cost_center}
             </Select.Option>
           ))}
       </Select>
@@ -69,13 +71,7 @@ export function TimeTicketModalComponent({
   };
 
   const MemoInput = ({ value, ...props }) => {
-    return (
-      <Input
-        value={value?.startsWith("timetickets.") ? t(value) : value}
-        {...props}
-        disabled={value?.startsWith("timetickets.") || disabled}
-      />
-    );
+    return <Input value={value?.startsWith("timetickets.labels") ? t(value) : value} {...props} />;
   };
 
   return (
@@ -111,7 +107,7 @@ export function TimeTicketModalComponent({
             }
           ]}
         >
-          <FormDatePicker />
+          <DateTimePicker isDateOnly />
         </Form.Item>
         <Form.Item
           name="employeeid"
@@ -333,7 +329,9 @@ export function LaborAllocationContainer({ jobid, loading, lineTicketData, hideT
         timetickets={lineTicketData.timetickets}
         adjustments={lineTicketData.jobs_by_pk.lbr_adjustments}
       />
-      {!hideTimeTickets && <TimeTicketList loading={loading} timetickets={lineTicketData.timetickets} techConsole />}
+      {!hideTimeTickets && (
+        <TimeTicketList loading={loading} timetickets={jobid ? lineTicketData.timetickets : []} techConsole />
+      )}
     </div>
   );
 }

client/src/components/time-ticket-shift-active/time-ticket-shift-active.component.jsx

@@ -39,7 +39,7 @@ export default function TimeTicketShiftActive({ timetickets, refetch, isTechCons
               renderItem={(ticket) => (
                 <List.Item>
                   <Card
-                    title={t(ticket.memo)}
+                    title={ticket.memo?.startsWith("timetickets.labels") ? t(ticket.memo) : ticket.memo}
                     actions={[
                       <TechClockOffButton
                         jobId={ticket.jobid}

client/src/components/update-alert/update-alert.component.jsx

@@ -1,13 +1,14 @@
 import { AlertOutlined } from "@ant-design/icons";
-import { Alert, Button, Col, Row, Space } from "antd";
+import { Alert, Button, Col, notification, Row, Space } from "antd";
 import i18n from "i18next";
-import React, { useEffect } from "react";
+import React, { useCallback, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectUpdateAvailable } from "../../redux/application/application.selectors";
 import { useRegisterSW } from "virtual:pwa-register/react";
 import InstanceRenderManager from "../../utils/instanceRenderMgr";
+import useCountDown from "../../utils/countdownHook";
 
 const mapStateToProps = createStructuredSelector({
   updateAvailable: selectUpdateAvailable
@@ -19,6 +20,15 @@ const mapDispatchToProps = (dispatch) => ({
 
 export function UpdateAlert({ updateAvailable }) {
   const { t } = useTranslation();
+  const [timerStarted, setTimerStarted] = useState(false);
+  const [loading, setLoading] = useState(false);
+  const [
+    timeLeft,
+    {
+      start //pause, resume, reset
+    }
+  ] = useCountDown(180000, 1000);
+
   const {
     offlineReady: [offlineReady],
     needRefresh: [needRefresh],
@@ -31,7 +41,7 @@ export function UpdateAlert({ updateAvailable }) {
           () => {
             r.update();
           },
-          10 * 60 * 1000
+          30 * 60 * 1000
         );
       }
     },
@@ -40,11 +50,43 @@ export function UpdateAlert({ updateAvailable }) {
     }
   });
 
+  const ReloadNewVersion = useCallback(() => {
+    setLoading(true);
+    updateServiceWorker(true);
+    setTimeout(() => {
+      window.location.reload(true);
+    }, 5000);
+  }, [updateServiceWorker]);
+
   useEffect(() => {
-    if (import.meta.env.DEV) {
-      console.log(`SW Status => Refresh? ${needRefresh} - offlineReady? ${offlineReady}`);
+    if (needRefresh) {
+      start();
+      setTimerStarted(true);
     }
-  }, [needRefresh, offlineReady]);
+  }, [start, needRefresh, offlineReady]);
+
+  useEffect(() => {
+    if (needRefresh && timerStarted && timeLeft < 60000) {
+      notification.open({
+        type: "warning",
+        closable: false,
+        duration: 65000,
+        key: "autoupdate",
+        message: t("general.actions.autoupdate", {
+          time: (timeLeft / 1000).toFixed(0),
+          app: InstanceRenderManager({
+            imex: "$t(titles.imexonline)",
+            rome: "$t(titles.romeonline)",
+            promanager: "$t(titles.promanager)"
+          })
+        }),
+        placement: "bottomRight"
+      });
+    }
+    if (needRefresh && timerStarted && timeLeft <= 0) {
+      ReloadNewVersion();
+    }
+  }, [timeLeft, t, needRefresh, ReloadNewVersion, timerStarted]);
 
   if (!needRefresh) return null;
 
@@ -75,9 +117,10 @@ export function UpdateAlert({ updateAvailable }) {
               <Button onClick={() => window.open("https://imex-online.noticeable.news/", "_blank")}>
                 {i18n.t("general.actions.viewreleasenotes")}
               </Button>
-              <Button type="primary" onClick={() => updateServiceWorker(true)}>
-                {i18n.t("general.actions.refresh")}
+              <Button loading={loading} type="primary" onClick={() => ReloadNewVersion()}>
+                {i18n.t("general.actions.refresh")} {`(${(timeLeft / 1000).toFixed(0)} s)`}
               </Button>
+              <Button onClick={() => start(300000)}>{i18n.t("general.actions.delay")}</Button>
             </Space>
           </Col>
         </Row>

client/src/components/vehicle-detail-form/vehicle-detail-form.component.jsx

@@ -1,9 +1,9 @@
 import { Form, Input } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import FormFieldsChanged from "../form-fields-changed-alert/form-fields-changed-alert.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 export default function VehicleDetailFormComponent({ form, loading }) {
   const { t } = useTranslation();
@@ -102,7 +102,7 @@ export default function VehicleDetailFormComponent({ form, loading }) {
           <Input />
         </Form.Item>
         <Form.Item label={t("vehicles.fields.v_prod_dt")} name="v_prod_dt">
-          <FormDatePicker />
+          <DateTimePicker isDateOnly />
         </Form.Item>
 
         <Form.Item label={t("vehicles.fields.v_paint_codes", { number: 1 })} name={["v_paint_codes", "paint_cd1"]}>

client/src/components/vendor-search-select/vendor-search-select.component.jsx

@@ -5,7 +5,7 @@ import PhoneNumberFormatter from "../../utils/PhoneFormatter";
 
 const { Option } = Select;
 
-//To be used as a form element only.
+// To be used as a form element only.
 
 const VendorSearchSelect = ({ value, onChange, options, onSelect, disabled, preferredMake, showPhone }, ref) => {
   const [option, setOption] = useState(value);
@@ -33,9 +33,25 @@ const VendorSearchSelect = ({ value, onChange, options, onSelect, disabled, pref
         if (!value || !options) return label;
         const discount = options?.find((o) => o.id === value)?.discount;
         return (
-          <div className="imex-flex-row" style={{ width: "100%" }}>
-            <div style={{ flex: 1 }}>{label}</div>
-
+          <div
+            style={{
+              display: "flex",
+              alignItems: "center",
+              flexWrap: "nowrap",
+              width: "100%"
+            }}
+          >
+            <div
+              style={{
+                flex: 1,
+                minWidth: 0,
+                overflow: "hidden",
+                textOverflow: "ellipsis",
+                whiteSpace: "nowrap"
+              }}
+            >
+              {label}
+            </div>
             {discount && discount !== 0 ? <Tag color="green">{`${discount * 100}%`}</Tag> : null}
           </div>
         );
@@ -45,36 +61,67 @@ const VendorSearchSelect = ({ value, onChange, options, onSelect, disabled, pref
       optionFilterProp="name"
       onSelect={onSelect}
       disabled={disabled || false}
-      optionLabelProp={"name"}
+      optionLabelProp="name"
     >
-      {favorites
-        ? favorites.map((o) => (
-            <Option key={`favorite-${o.id}`} value={o.id} name={o.name} discount={o.discount}>
-              <div className="imex-flex-row">
-                <div style={{ flex: 1 }}>{o.name}</div>
-                <Space style={{ marginLeft: "1rem" }}>
-                  <HeartOutlined style={{ color: "red" }} />
-                  {o.phone && showPhone && <PhoneNumberFormatter>{o.phone}</PhoneNumberFormatter>}
-                  {o.discount && o.discount !== 0 ? <Tag color="green">{`${o.discount * 100}%`}</Tag> : null}
-                </Space>
+      {favorites &&
+        favorites.map((o) => (
+          <Option key={`favorite-${o.id}`} value={o.id} name={o.name} discount={o.discount}>
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                flexWrap: "nowrap",
+                width: "100%"
+              }}
+            >
+              <div
+                style={{
+                  flex: 1,
+                  minWidth: 0,
+                  overflow: "hidden",
+                  textOverflow: "ellipsis",
+                  whiteSpace: "nowrap"
+                }}
+              >
+                {o.name}
               </div>
-            </Option>
-          ))
-        : null}
-      {options
-        ? options.map((o) => (
-            <Option key={o.id} value={o.id} name={o.name} discount={o.discount}>
-              <div className="imex-flex-row" style={{ width: "100%" }}>
-                <div style={{ flex: 1 }}>{o.name}</div>
-
-                <Space style={{ marginLeft: "1rem" }}>
-                  {o.phone && showPhone && <PhoneNumberFormatter>{o.phone}</PhoneNumberFormatter>}
-                  {o.discount && o.discount !== 0 ? <Tag color="green">{`${o.discount * 100}%`}</Tag> : null}
-                </Space>
+              <Space style={{ marginLeft: "1rem" }}>
+                <HeartOutlined style={{ color: "red" }} />
+                {o.phone && showPhone && <PhoneNumberFormatter>{o.phone}</PhoneNumberFormatter>}
+                {o.discount && o.discount !== 0 ? <Tag color="green">{`${o.discount * 100}%`}</Tag> : null}
+              </Space>
+            </div>
+          </Option>
+        ))}
+      {options &&
+        options.map((o) => (
+          <Option key={o.id} value={o.id} name={o.name} discount={o.discount}>
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                flexWrap: "nowrap",
+                width: "100%"
+              }}
+            >
+              <div
+                style={{
+                  flex: 1,
+                  minWidth: 0,
+                  overflow: "hidden",
+                  textOverflow: "ellipsis",
+                  whiteSpace: "nowrap"
+                }}
+              >
+                {o.name}
               </div>
-            </Option>
-          ))
-        : null}
+              <Space style={{ marginLeft: "1rem" }}>
+                {o.phone && showPhone && <PhoneNumberFormatter>{o.phone}</PhoneNumberFormatter>}
+                {o.discount && o.discount !== 0 ? <Tag color="green">{`${o.discount * 100}%`}</Tag> : null}
+              </Space>
+            </div>
+          </Option>
+        ))}
     </Select>
   );
 };

client/src/firebase/firebase.utils.js

@@ -5,7 +5,6 @@ import { getFirestore } from "firebase/firestore";
 import { getMessaging, getToken, onMessage } from "firebase/messaging";
 import { store } from "../redux/store";
 import axios from "axios";
-import { checkBeta } from "../utils/handleBeta";
 
 const config = JSON.parse(import.meta.env.VITE_APP_FIREBASE_CONFIG);
 initializeApp(config);
@@ -88,7 +87,7 @@ export const logImEXEvent = (eventName, additionalParams, stateProp = null) => {
     operationName: eventName,
     variables: additionalParams,
     dbevent: false,
-    env: checkBeta() ? "beta" : "master"
+    env: `master-AIO|${import.meta.env.VITE_APP_GIT_SHA_DATE}`
   });
   // console.log(
   //   "%c[Analytics]",

client/src/graphql/bodyshop.queries.js

@@ -138,7 +138,8 @@ export const QUERY_BODYSHOP = gql`
       tt_enforce_hours_for_tech_console
       md_tasks_presets
       use_paint_scale_data
-            md_ro_guard
+      intellipay_config
+      md_ro_guard
       employee_teams(order_by: { name: asc }, where: { active: { _eq: true } }) {
         id
         name
@@ -266,7 +267,8 @@ export const UPDATE_SHOP = gql`
         enforce_conversion_category
         tt_enforce_hours_for_tech_console
         md_tasks_presets
-                md_ro_guard
+        intellipay_config
+        md_ro_guard
         employee_teams(order_by: { name: asc }, where: { active: { _eq: true } }) {
           id
           name

client/src/graphql/jobs.queries.js

@@ -2461,6 +2461,14 @@ export const SUBSCRIPTION_JOBS_IN_PRODUCTION = gql`
     }
   }
 `;
+export const SUBSCRIPTION_JOBS_IN_PRODUCTION_VIEW = gql`
+  subscription SUBSCRIPTION_JOBS_IN_PRODUCTION_VIEW {
+    jobs: jobs_inproduction {
+      id
+      updated_at
+    }
+  }
+`;
 
 export const QUERY_JOBS_IN_PRODUCTION = gql`
   query QUERY_JOBS_IN_PRODUCTION {

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

@@ -571,7 +571,7 @@ export function Manage({ conflict, bodyshop }) {
 
   return (
     <>
-      <ChatAffixContainer bodyshop={bodyshop} chatVisible={chatVisible} />
+      {import.meta.env.PROD && <ChatAffixContainer bodyshop={bodyshop} chatVisible={chatVisible} />}
       <Layout style={{ minHeight: "100vh" }} className="layout-container">
         <UpdateAlert />
         <HeaderContainer />

client/src/pages/production-board/production-board.component.jsx

@@ -1,6 +1,26 @@
 import React from "react";
 import ProductionBoardKanbanContainer from "../../components/production-board-kanban/production-board-kanban.container";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import { useSplitTreatments } from "@splitsoftware/splitio-react";
+const mapStateToProps = createStructuredSelector({
+  //currentUser: selectCurrentUser
+  bodyshop: selectBodyshop
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+export default connect(mapStateToProps, mapDispatchToProps)(ProductionBoardComponent);
 
-export default function ProductionBoardComponent() {
-  return <ProductionBoardKanbanContainer />;
+export function ProductionBoardComponent({ bodyshop }) {
+  const {
+    treatments: { Production_Use_View }
+  } = useSplitTreatments({
+    attributes: {},
+    names: ["Production_Use_View"],
+    splitKey: bodyshop && bodyshop.imexshopid
+  });
+
+  return <ProductionBoardKanbanContainer subscriptionType={Production_Use_View.treatment} />;
 }

client/src/pages/production-list/production-list.component.jsx

@@ -2,11 +2,31 @@ import React from "react";
 import NoteUpsertModal from "../../components/note-upsert-modal/note-upsert-modal.container";
 import ProductionListTable from "../../components/production-list-table/production-list-table.container";
 
-export default function ProductionListComponent() {
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import { useSplitTreatments } from "@splitsoftware/splitio-react";
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+export default connect(mapStateToProps, mapDispatchToProps)(ProductionListComponent);
+
+export function ProductionListComponent({ bodyshop }) {
+  const {
+    treatments: { Production_Use_View }
+  } = useSplitTreatments({
+    attributes: {},
+    names: ["Production_Use_View"],
+    splitKey: bodyshop && bodyshop.imexshopid
+  });
+
   return (
     <>
       <NoteUpsertModal />
-      <ProductionListTable />
+      <ProductionListTable subscriptionType={Production_Use_View.treatment} />
     </>
   );
 }

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

@@ -1,21 +1,21 @@
 import { Tabs } from "antd";
-import React, { useEffect } from "react";
-import { useLocation, useNavigate } from "react-router-dom";
 import queryString from "query-string";
+import React, { useEffect } from "react";
 import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { useLocation, useNavigate } from "react-router-dom";
+import { createStructuredSelector } from "reselect";
+import RbacWrapper from "../../components/rbac-wrapper/rbac-wrapper.component";
+import ShopCsiConfig from "../../components/shop-csi-config/shop-csi-config.component";
 import ShopEmployeesContainer from "../../components/shop-employees/shop-employees.container";
 import ShopInfoContainer from "../../components/shop-info/shop-info.container";
-import ShopCsiConfig from "../../components/shop-csi-config/shop-csi-config.component";
-import RbacWrapper from "../../components/rbac-wrapper/rbac-wrapper.component";
-import InstanceRenderManager from "../../utils/instanceRenderMgr";
-import { connect } from "react-redux";
-import { createStructuredSelector } from "reselect";
+import ShopInfoUsersComponent from "../../components/shop-users/shop-users.component";
 import { setBreadcrumbs, setSelectedHeader } from "../../redux/application/application.actions";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import ShopInfoUsersComponent from "../../components/shop-users/shop-users.component";
+import InstanceRenderManager from "../../utils/instanceRenderMgr";
 
-import ShopTeamsContainer from "../../components/shop-teams/shop-teams.container";
 import { HasFeatureAccess } from "../../components/feature-wrapper/feature-wrapper.component";
+import ShopTeamsContainer from "../../components/shop-teams/shop-teams.container";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop

client/src/pages/tech-lookup/tech-lookup.container.jsx

@@ -3,6 +3,7 @@ import { useTranslation } from "react-i18next";
 import RbacWrapperComponent from "../../components/rbac-wrapper/rbac-wrapper.component";
 import TechLookupJobsList from "../../components/tech-lookup-jobs-list/tech-lookup-jobs-list.component";
 import InstanceRenderManager from "../../utils/instanceRenderMgr";
+import TechLookupJobsDrawer from "../../components/tech-lookup-jobs-drawer/tech-lookup-jobs-drawer.component";
 
 export default function TechLookupContainer() {
   const { t } = useTranslation();
@@ -20,6 +21,7 @@ export default function TechLookupContainer() {
   return (
     <div>
       <RbacWrapperComponent action="jobs:list-active">
+        <TechLookupJobsDrawer />
         <TechLookupJobsList />
       </RbacWrapperComponent>
     </div>

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

@@ -9,7 +9,6 @@ import ErrorBoundary from "../../components/error-boundary/error-boundary.compon
 import FeatureWrapper from "../../components/feature-wrapper/feature-wrapper.component";
 import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
 import TechHeader from "../../components/tech-header/tech-header.component";
-import TechLookupJobsDrawer from "../../components/tech-lookup-jobs-drawer/tech-lookup-jobs-drawer.component";
 import TechSider from "../../components/tech-sider/tech-sider.component";
 import UpdateAlert from "../../components/update-alert/update-alert.component";
 import { selectTechnician } from "../../redux/tech/tech.selectors";
@@ -68,7 +67,7 @@ export function TechPage({ technician }) {
       <Layout>
         <UpdateAlert />
         <TechHeader />
-        <TechLookupJobsDrawer />
+
         <TaskUpsertModalContainer />
         <Content className="tech-content-container">
           <ErrorBoundary>

client/src/redux/messaging/messaging.sagas.js

@@ -36,7 +36,8 @@ export function* openChatByPhone({ payload }) {
       data: { conversations }
     } = yield client.query({
       query: CONVERSATION_ID_BY_PHONE,
-      variables: { phone: p.number }
+      variables: { phone: p.number },
+      fetchPolicy: 'no-cache'
     });
 
     if (conversations.length === 0) {

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

@@ -10,7 +10,7 @@ import {
   signInWithEmailAndPassword,
   signOut
 } from "firebase/auth";
-import { doc, getDoc, setDoc } from "firebase/firestore";
+import { arrayUnion, doc, getDoc, setDoc, updateDoc } from "firebase/firestore";
 import { getToken } from "firebase/messaging";
 import i18next from "i18next";
 import LogRocket from "logrocket";
@@ -48,6 +48,7 @@ import {
   validatePasswordResetSuccess
 } from "./user.actions";
 import UserActionTypes from "./user.types";
+import cleanAxios from "../../utils/CleanAxios";
 
 const fpPromise = FingerprintJS.load();
 
@@ -177,10 +178,24 @@ export function* setInstanceIdSaga({ payload: uid }) {
     // Get the visitor identifier when you need it.
     const fp = yield fpPromise;
     const result = yield fp.get();
-    yield setDoc(userInstanceRef, {
-      timestamp: new Date(),
-      fingerprint: result.visitorId
-    });
+    const res = yield cleanAxios.get("https://api.ipify.org/?format=json");
+    const udoc = yield getDoc(userInstanceRef);
+
+    if (!udoc.data()) {
+      yield setDoc(userInstanceRef, {
+        timestamp: new Date(),
+        fingerprint: result.visitorId,
+        //totalFingerprint: result,
+        ip: [res.data.ip]
+      });
+    } else {
+      yield updateDoc(userInstanceRef, {
+        timestamp: new Date(),
+        fingerprint: result.visitorId,
+        //totalFingerprint: result,
+        ip: arrayUnion(res.data.ip)
+      });
+    }
 
     yield put(setLocalFingerprint(result.visitorId));
     yield delay(5 * 60 * 1000);

client/src/translations/en_us/common.json

@@ -230,7 +230,7 @@
         "markexported": "Mark Exported",
         "markforreexport": "Mark for Re-export",
         "new": "New Bill",
-        "nobilllines": "This part has not yet been recieved.",
+        "nobilllines": "",
         "noneselected": "No bill selected.",
         "onlycmforinvoiced": "Only credit memos can be entered for any Job that has been invoiced, exported, or voided.",
         "printlabels": "Print Labels",
@@ -270,6 +270,7 @@
         "testrender": "Test Render"
       },
       "errors": {
+        "creatingdefaultview": "Error creating default view.",
         "loading": "Unable to load shop details. Please call technical support.",
         "saving": "Error encountered while saving. {{message}}"
       },
@@ -284,19 +285,21 @@
         },
         "appt_length": "Default Appointment Length",
         "attach_pdf_to_email": "Attach PDF copy to sent emails?",
+        "batchid": "ADP Batch ID",
         "bill_allow_post_to_closed": "Allow Bills to be posted to Closed Jobs",
         "bill_federal_tax_rate": "Bills - Federal Tax Rate %",
         "bill_local_tax_rate": "Bill - Local Tax Rate %",
         "bill_state_tax_rate": "Bill - Provincial/State Tax Rate %",
         "city": "City",
         "closingperiod": "Closing Period",
+        "companycode": "ADP Company Code",
         "country": "Country",
         "dailybodytarget": "Scoreboard - Daily Body Target",
         "dailypainttarget": "Scoreboard - Daily Paint Target",
         "default_adjustment_rate": "Default Labor Deduction Adjustment Rate",
         "deliver": {
-          "templates": "Delivery Templates",
-          "require_actual_delivery_date": "Require Actual Delivery"
+          "require_actual_delivery_date": "Require Actual Delivery",
+          "templates": "Delivery Templates"
         },
         "dms": {
           "apcontrol": "AP Control Number",
@@ -329,6 +332,10 @@
           "next_contact_hours": "Automatic Next Contact Date - Hours from Intake",
           "templates": "Intake Templates"
         },
+        "intellipay_config": {
+          "cash_discount_percentage": "Cash Discount %",
+          "enable_cash_discount": "Enable Cash Discounting"
+        },
         "invoice_federal_tax_rate": "Invoices - Federal Tax Rate",
         "invoice_local_tax_rate": "Invoices - Local Tax Rate",
         "invoice_state_tax_rate": "Invoices - State Tax Rate",
@@ -660,6 +667,8 @@
         "filehandlers": "Adjusters",
         "insurancecos": "Insurance Companies",
         "intakechecklist": "Intake Checklist",
+        "intellipay": "IntelliPay",
+        "intellipay_cash_discount": "Please ensure that cash discounting has been enabled on your merchant account. Reach out to IntelliPay Support if you need assistance. ",
         "jobstatuses": "Job Statuses",
         "laborrates": "Labor Rates",
         "licensing": "Licensing",
@@ -699,7 +708,10 @@
         "workingdays": "Working Days"
       },
       "successes": {
-        "save": "Shop configuration saved successfully. "
+        "areyousure": "Are you sure you want to continue?",
+        "defaultviewcreated": "Default view created successfully.",
+        "save": "Shop configuration saved successfully. ",
+        "unsavedchanges": "Unsaved changes will be lost. Are you sure you want to continue?"
       },
       "validation": {
         "centermustexist": "The chosen responsibility center does not exist.",
@@ -1129,8 +1141,8 @@
     },
     "general": {
       "actions": {
-        "defaults": "Defaults",
         "add": "Add",
+        "autoupdate": "{{app}} will automatically update in {{time}} seconds. Please save all changes.",
         "calculate": "Calculate",
         "cancel": "Cancel",
         "clear": "Clear",
@@ -1138,6 +1150,8 @@
         "copied": "Copied!",
         "copylink": "Copy Link",
         "create": "Create",
+        "defaults": "Defaults",
+        "delay": "Delay Update (5 mins)",
         "delete": "Delete",
         "deleteall": "Delete All",
         "deselectall": "Deselect All",
@@ -1149,10 +1163,12 @@
         "print": "Print",
         "refresh": "Refresh",
         "remove": "Remove",
+        "remove_alert": "Are you sure you want to dismiss the alert?",
         "reset": "Reset your changes.",
         "resetpassword": "Reset Password",
         "save": "Save",
         "saveandnew": "Save and New",
+        "saveas": "Save As",
         "selectall": "Select All",
         "send": "Send",
         "sendbysms": "Send by SMS",
@@ -1160,8 +1176,7 @@
         "submit": "Submit",
         "tryagain": "Try Again",
         "view": "View",
-        "viewreleasenotes": "See What's Changed",
-        "remove_alert": "Are you sure you want to dismiss the alert?"
+        "viewreleasenotes": "See What's Changed"
       },
       "errors": {
         "fcm": "You must allow notification permissions to have real time messaging.  Click to try again.",
@@ -1183,6 +1198,8 @@
         "clear": "Clear",
         "confirmpassword": "Confirm Password",
         "created_at": "Created At",
+        "date": "Select Date",
+        "datetime": "Select Date & Time",
         "email": "Email",
         "errors": "Errors",
         "excel": "Excel",
@@ -1242,6 +1259,7 @@
         "tuesday": "Tuesday",
         "tvmode": "TV Mode",
         "unknown": "Unknown",
+        "unsavedchanges": "Unsaved changes.",
         "username": "Username",
         "view": "View",
         "wednesday": "Wednesday",
@@ -1355,6 +1373,7 @@
     },
     "job_payments": {
       "buttons": {
+        "create_short_link": "Generate Short Link",
         "goback": "Go Back",
         "proceedtopayment": "Proceed to Payment",
         "refundpayment": "Refund Payment"
@@ -2731,38 +2750,6 @@
       }
     },
     "production": {
-      "options": {
-        "small": "Small",
-        "medium": "Medium",
-        "large": "Large",
-        "vertical": "Vertical",
-        "horizontal": "Horizontal"
-      },
-      "settings": {
-        "layout": "Layout",
-        "information": "Information",
-        "statistics_title": "Statistics",
-        "board_settings": "Board Settings",
-        "filters_title": "Filters",
-        "filters": {
-          "md_ins_cos": "Insurance Companies",
-          "md_estimators": "Estimators"
-        },
-        "statistics": {
-          "total_hours_in_production": "Hours in Production",
-          "total_lab_in_production": "Body Hours in Production",
-          "total_lar_in_production": "Refinish Hours in Production",
-          "total_amount_in_production": "Dollars in Production",
-          "jobs_in_production": "Jobs in Production",
-          "total_hours_on_board": "Hours on Board",
-          "total_lab_on_board": "Body Hours on Board",
-          "total_lar_on_board": "Refinish Hours on Board",
-          "total_amount_on_board": "Dollars on Board",
-          "total_jobs_on_board": "Jobs on Board",
-          "tasks_in_production": "Tasks in Production",
-          "tasks_on_board": "Tasks on Board"
-        }
-      },
       "actions": {
         "addcolumns": "Add Columns",
         "bodypriority-clear": "Clear Body Priority",
@@ -2777,27 +2764,23 @@
         "suspend": "Suspend",
         "unsuspend": "Unsuspend"
       },
+      "constants": {
+        "main_profile": "Default"
+      },
       "errors": {
         "boardupdate": "Error encountered updating Job. {{message}}",
+        "name_exists": "A Profile with this name already exists. Please choose a different name.",
+        "name_required": "Profile name is required.",
         "removing": "Error removing from production board. {{error}}",
         "settings": "Error saving board settings: {{error}}"
       },
       "labels": {
-        "kiosk_mode": "Kiosk Mode",
-        "on": "On",
-        "off": "Off",
-        "wide": "Wide",
-        "tall": "Tall",
-        "vertical": "Vertical",
-        "horizontal": "Horizontal",
-        "orientation": "Board Orientation",
-        "card_size": "Card Size",
-        "model_info": "Vehicle Info",
         "actual_in": "Actual In",
+        "addnewprofile": "Add New Profile",
         "alert": "Alert",
-        "tasks": "Tasks",
         "alertoff": "Remove alert from Job",
         "alerton": "Add alert to Job",
+        "alerts": "Alerts",
         "ats": "Alternative Transportation",
         "bodyhours": "B",
         "bodypriority": "B/P",
@@ -2807,6 +2790,7 @@
             "qbo_usa": "QBO USA"
           }
         },
+        "card_size": "Card Size",
         "cardcolor": "Colored Cards",
         "cardsettings": "Card Settings",
         "clm_no": "Claim Number",
@@ -2815,47 +2799,88 @@
         "detailpriority": "D/P",
         "employeeassignments": "Employee Assignments",
         "employeesearch": "Employee Search",
+        "estimator": "Estimator",
+        "horizontal": "Horizontal",
         "ins_co_nm": "Insurance Company Name",
         "jobdetail": "Job Details",
+        "kiosk_mode": "Kiosk Mode",
         "laborhrs": "Labor Hours",
         "legend": "Legend:",
+        "model_info": "Vehicle Info",
         "note": "Production Note",
+        "off": "Off",
+        "on": "On",
+        "orientation": "Board Orientation",
         "ownr_nm": "Customer Name",
         "paintpriority": "P/P",
         "partsstatus": "Parts Status",
-        "estimator": "Estimator",
-        "subtotal": "Subtotal",
         "production_note": "Production Note",
         "refinishhours": "R",
         "scheduled_completion": "Scheduled Completion",
         "selectview": "Select a View",
         "stickyheader": "Sticky Header (BETA)",
         "sublets": "Sublets",
+        "subtotal": "Subtotal",
+        "tall": "Tall",
+        "tasks": "Tasks",
         "totalhours": "Total Hrs ",
         "touchtime": "T/T",
+        "vertical": "Vertical",
         "viewname": "View Name",
-        "alerts": "Alerts"
+        "wide": "Wide"
+      },
+      "options": {
+        "horizontal": "Horizontal",
+        "large": "Large",
+        "medium": "Medium",
+        "small": "Small",
+        "vertical": "Vertical"
+      },
+      "settings": {
+        "board_settings": "Board Settings",
+        "filters": {
+          "md_estimators": "Estimators",
+          "md_ins_cos": "Insurance Companies"
+        },
+        "filters_title": "Filters",
+        "information": "Information",
+        "layout": "Layout",
+        "statistics": {
+          "jobs_in_production": "Jobs in Production",
+          "tasks_in_production": "Tasks in Production",
+          "tasks_on_board": "Tasks on Board",
+          "total_amount_in_production": "Dollars in Production",
+          "total_amount_on_board": "Dollars on Board",
+          "total_hours_in_production": "Hours in Production",
+          "total_hours_on_board": "Hours on Board",
+          "total_jobs_on_board": "Jobs on Board",
+          "total_lab_in_production": "Body Hours in Production",
+          "total_lab_on_board": "Body Hours on Board",
+          "total_lar_in_production": "Refinish Hours in Production",
+          "total_lar_on_board": "Refinish Hours on Board"
+        },
+        "statistics_title": "Statistics"
+      },
+      "statistics": {
+        "currency_symbol": "$",
+        "hours": "Hours",
+        "jobs": "Jobs",
+        "jobs_in_production": "Jobs in Production",
+        "tasks": "Tasks",
+        "tasks_in_production": "Tasks in Production",
+        "tasks_on_board": "Tasks on Board",
+        "total_amount_in_production": "Dollars in Production",
+        "total_amount_on_board": "Dollars on Board",
+        "total_hours_in_production": "Hours in Production",
+        "total_hours_on_board": "Hours on Board",
+        "total_jobs_on_board": "Jobs on Board",
+        "total_lab_in_production": "Body Hours in Production",
+        "total_lab_on_board": "Body Hours on Board",
+        "total_lar_in_production": "Refinish Hours in Production",
+        "total_lar_on_board": "Refinish Hours on Board"
       },
       "successes": {
         "removed": "Job removed from production."
-      },
-      "statistics": {
-        "total_hours_in_production": "Hours in Production",
-        "total_lab_in_production": "Body Hours in Production",
-        "total_lar_in_production": "Refinish Hours in Production",
-        "total_amount_in_production": "Dollars in Production",
-        "jobs_in_production": "Jobs in Production",
-        "total_hours_on_board": "Hours on Board",
-        "total_lab_on_board": "Body Hours on Board",
-        "total_lar_on_board": "Refinish Hours on Board",
-        "total_amount_on_board": "Dollars on Board",
-        "total_jobs_on_board": "Jobs on Board",
-        "tasks_in_production": "Tasks in Production",
-        "tasks_on_board": "Tasks on Board",
-        "tasks": "Tasks",
-        "hours": "Hours",
-        "currency_symbol": "$",
-        "jobs": "Jobs"
       }
     },
     "profile": {
@@ -2913,6 +2938,8 @@
         "vendor": "Vendor"
       },
       "templates": {
+        "adp_payroll_flat": "ADP Payroll - Flat Rate",
+        "adp_payroll_straight": "ADP Payroll - Straight Time",
         "anticipated_revenue": "Anticipated Revenue",
         "ar_aging": "AR Aging",
         "attendance_detail": "Attendance (All Employees)",
@@ -3404,6 +3431,18 @@
       "vehicledetail": "Vehicle Details {{vehicle}} | {{app}}",
       "vehicles": "All Vehicles | {{app}}"
     },
+    "trello": {
+      "labels": {
+        "add_card": "Add Card",
+        "add_lane": "Add Lane",
+        "cancel": "Cancel",
+        "delete_lane": "Delete Lane",
+        "description": "Description",
+        "label": "Label",
+        "lane_actions": "Lane Actions",
+        "title": "Title"
+      }
+    },
     "tt_approvals": {
       "actions": {
         "approveselected": "Approve Selected"
@@ -3542,18 +3581,6 @@
       "validation": {
         "unique_vendor_name": "You must enter a unique vendor name."
       }
-    },
-    "trello": {
-      "labels": {
-        "add_card": "Add Card",
-        "add_lane": "Add Lane",
-        "delete_lane": "Delete Lane",
-        "lane_actions": "Lane Actions",
-        "title": "Title",
-        "description": "Description",
-        "label": "Label",
-        "cancel": "Cancel"
-      }
     }
   }
 }

client/src/utils/TemplateConstants.js

@@ -2158,6 +2158,32 @@ export const TemplateList = (type, context) => {
               field: i18n.t("tasks.fields.created_at")
             },
             group: "jobs"
+          },
+          adp_payroll_flat: {
+            title: i18n.t("reportcenter.templates.adp_payroll_flat"),
+            subject: i18n.t("reportcenter.templates.adp_payroll_flat"),
+            key: "adp_payroll_flat",
+            reporttype: "text",
+            disabled: false,
+            rangeFilter: {
+              object: i18n.t("reportcenter.labels.objects.timetickets"),
+              field: i18n.t("timetickets.fields.committed_at")
+            },
+            group: "payroll",
+            adp_payroll: true
+          },
+          adp_payroll_straight: {
+            title: i18n.t("reportcenter.templates.adp_payroll_straight"),
+            subject: i18n.t("reportcenter.templates.adp_payroll_straight"),
+            key: "adp_payroll_straight",
+            reporttype: "text",
+            disabled: false,
+            rangeFilter: {
+              object: i18n.t("reportcenter.labels.objects.timetickets"),
+              field: i18n.t("timetickets.fields.date")
+            },
+            group: "payroll",
+            adp_payroll: true
           }
         }
       : {}),

client/src/utils/countdownHook.js

@@ -0,0 +1,84 @@
+import React from "react";
+
+const useCountDown = (timeToCount = 60 * 1000, interval = 1000) => {
+  const [timeLeft, setTimeLeft] = React.useState(0);
+  const timer = React.useRef({});
+
+  const run = (ts) => {
+    if (!timer.current.started) {
+      timer.current.started = ts;
+      timer.current.lastInterval = ts;
+    }
+
+    const localInterval = Math.min(interval, timer.current.timeLeft || Infinity);
+    if (ts - timer.current.lastInterval >= localInterval) {
+      timer.current.lastInterval += localInterval;
+      setTimeLeft((timeLeft) => {
+        timer.current.timeLeft = timeLeft - localInterval;
+        return timer.current.timeLeft;
+      });
+    }
+
+    if (ts - timer.current.started < timer.current.timeToCount) {
+      timer.current.requestId = window.requestAnimationFrame(run);
+    } else {
+      timer.current = {};
+      setTimeLeft(0);
+    }
+  };
+
+  const start = React.useCallback(
+    (ttc) => {
+      window.cancelAnimationFrame(timer.current.requestId);
+
+      const newTimeToCount = ttc !== undefined ? ttc : timeToCount;
+      timer.current.started = null;
+      timer.current.lastInterval = null;
+      timer.current.timeToCount = newTimeToCount;
+      timer.current.requestId = window.requestAnimationFrame(run);
+
+      setTimeLeft(newTimeToCount);
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
+
+  const pause = React.useCallback(() => {
+    window.cancelAnimationFrame(timer.current.requestId);
+    timer.current.started = null;
+    timer.current.lastInterval = null;
+    timer.current.timeToCount = timer.current.timeLeft;
+  }, []);
+
+  const resume = React.useCallback(
+    () => {
+      if (!timer.current.started && timer.current.timeLeft > 0) {
+        window.cancelAnimationFrame(timer.current.requestId);
+        timer.current.requestId = window.requestAnimationFrame(run);
+      }
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
+
+  const reset = React.useCallback(() => {
+    if (timer.current.timeLeft) {
+      window.cancelAnimationFrame(timer.current.requestId);
+      timer.current = {};
+      setTimeLeft(0);
+    }
+  }, []);
+
+  const actions = React.useMemo(
+    () => ({ start, pause, resume, reset }), // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
+
+  React.useEffect(() => {
+    return () => window.cancelAnimationFrame(timer.current.requestId);
+  }, []);
+
+  return [timeLeft, actions];
+};
+
+export default useCountDown;

client/src/utils/handleBeta.js

@@ -1,47 +0,0 @@
-export const BETA_KEY = "betaSwitchImex";
-
-export const checkBeta = () => {
-  const cookie = document.cookie.split("; ").find((row) => row.startsWith(BETA_KEY));
-  return cookie ? cookie.split("=")[1] === "true" : false;
-};
-
-export const setBeta = (value) => {
-  const domain = window.location.hostname.split(".").slice(-2).join(".");
-  document.cookie = `${BETA_KEY}=${value}; path=/; domain=.${domain}`;
-};
-
-export const handleBeta = () => {
-  if (window.location.hostname.startsWith("localhost")) {
-    console.log("Not on beta or test, so no need to handle beta.");
-    return;
-  }
-
-  const isBeta = checkBeta();
-  const currentHostName = window.location.hostname;
-
-  // Determine if the host name starts with "beta" or "www.beta"
-  const isBetaHost = currentHostName.startsWith("beta.");
-  const isBetaHostWithWWW = currentHostName.startsWith("www.beta.");
-
-  if (isBeta) {
-    // If beta is on and we are not on a beta domain, redirect to the beta version
-    if (!isBetaHost && !isBetaHostWithWWW) {
-      const newHostName = currentHostName.startsWith("www.")
-        ? `www.beta.${currentHostName.replace(/^www\./, "")}`
-        : `beta.${currentHostName}`;
-      const href = `${window.location.protocol}//${newHostName}${window.location.pathname}${window.location.search}${window.location.hash}`;
-      window.location.replace(href);
-    }
-    // Otherwise, if beta is on and we're already on a beta domain, stay there
-  } else {
-    // If beta is off and we are on a beta domain, redirect to the non-beta version
-    if (isBetaHost || isBetaHostWithWWW) {
-      const newHostName = currentHostName.replace(/^www\.beta\./, "www.").replace(/^beta\./, "");
-      const href = `${window.location.protocol}//${newHostName}${window.location.pathname}${window.location.search}${window.location.hash}`;
-      window.location.replace(href);
-    }
-    // Otherwise, if beta is off and we're not on a beta domain, stay there
-  }
-};
-
-export default handleBeta;

hasura/config.yaml

@@ -1,5 +1,5 @@
 version: 2
-endpoint: https://db.dev.bodyshop.app
+endpoint: https://db.dev.imex.online
 admin_secret: Dev-BodyShopApp!
 metadata_directory: metadata
 actions:

hasura/metadata/cron_triggers.yaml

@@ -1,3 +1,27 @@
+- name: AutoHouse Data Pump
+  webhook: '{{HASURA_API_URL}}/data/ah'
+  schedule: 0 6 * * *
+  include_in_metadata: true
+  payload: {}
+  headers:
+    - name: x-imex-auth
+      value_from_env: DATAPUMP_AUTH
+- name: Claimscorp Data Pump
+  webhook: '{{HASURA_API_URL}}/data/cc'
+  schedule: 30 6 * * *
+  include_in_metadata: true
+  payload: {}
+  headers:
+    - name: x-imex-auth
+      value_from_env: DATAPUMP_AUTH
+- name: Kaizen Data Pump
+  webhook: '{{HASURA_API_URL}}/data/kaizen'
+  schedule: 30 5 * * *
+  include_in_metadata: true
+  payload: {}
+  headers:
+    - name: x-imex-auth
+      value_from_env: DATAPUMP_AUTH
 - name: Task Reminders
   webhook: '{{HASURA_API_URL}}/tasks-remind-handler'
   schedule: '*/15 * * * *'

hasura/metadata/tables.yaml

@@ -918,6 +918,7 @@
           - bill_tax_rates
           - cdk_configuration
           - cdk_dealerid
+          - chatterid
           - city
           - claimscorpid
           - convenient_company
@@ -939,6 +940,7 @@
           - inhousevendorid
           - insurance_vendor_id
           - intakechecklist
+          - intellipay_config
           - jc_hourly_rates
           - jobsizelimit
           - last_name_first
@@ -1040,6 +1042,7 @@
           - inhousevendorid
           - insurance_vendor_id
           - intakechecklist
+          - intellipay_config
           - jc_hourly_rates
           - last_name_first
           - localmediaserverhttp
@@ -4240,6 +4243,63 @@
                 - active:
                     _eq: true
   event_triggers:
+    - name: job_modified
+      definition:
+        enable_manual: false
+        update:
+          columns:
+            - clm_no
+            - v_make_desc
+            - date_next_contact
+            - status
+            - employee_csr
+            - employee_prep
+            - clm_total
+            - suspended
+            - employee_body
+            - ro_number
+            - actual_in
+            - ownr_co_nm
+            - v_model_yr
+            - comment
+            - job_totals
+            - v_vin
+            - ownr_fn
+            - scheduled_completion
+            - special_coverage_policy
+            - v_color
+            - ca_gst_registrant
+            - scheduled_delivery
+            - actual_delivery
+            - actual_completion
+            - kanbanparent
+            - est_ct_fn
+            - employee_refinish
+            - ownr_ph1
+            - date_last_contacted
+            - alt_transport
+            - inproduction
+            - est_ct_ln
+            - production_vars
+            - category
+            - v_model_desc
+            - date_invoiced
+            - est_co_nm
+            - ownr_ln
+      retry_conf:
+        interval_sec: 10
+        num_retries: 0
+        timeout_sec: 60
+      webhook_from_env: HASURA_API_URL
+      headers:
+        - name: event-secret
+          value_from_env: EVENT_SECRET
+      request_transform:
+        method: POST
+        query_params: {}
+        template_engine: Kriti
+        url: '{{$base_url}}/job/job-updated'
+        version: 2
     - name: job_status_transition
       definition:
         enable_manual: true
@@ -4299,6 +4359,35 @@
         template_engine: Kriti
         url: '{{$base_url}}/opensearch'
         version: 2
+- table:
+    name: jobs_inproduction
+    schema: public
+  object_relationships:
+    - name: bodyshop
+      using:
+        manual_configuration:
+          column_mapping:
+            shopid: id
+          insertion_order: null
+          remote_table:
+            name: bodyshops
+            schema: public
+  select_permissions:
+    - role: user
+      permission:
+        columns:
+          - id
+          - shopid
+          - updated_at
+        filter:
+          bodyshop:
+            associations:
+              _and:
+                - user:
+                    authid:
+                      _eq: X-Hasura-User-Id
+                - active:
+                    _eq: true
 - table:
     name: masterdata
     schema: public

hasura/migrations/1726511165929_alter_table_public_bodyshops_add_column_intellipay_config/down.sql

@@ -0,0 +1,4 @@
+-- Could not auto-generate a down migration.
+-- Please write an appropriate down migration for the SQL below:
+-- alter table "public"."bodyshops" add column "intellipay_config" jsonb
+--  not null default jsonb_build_object();

hasura/migrations/1726511165929_alter_table_public_bodyshops_add_column_intellipay_config/up.sql

@@ -0,0 +1,2 @@
+alter table "public"."bodyshops" add column "intellipay_config" jsonb
+ not null default jsonb_build_object();

hasura/migrations/1726528225033_alter_table_public_bodyshops_add_column_chatterid/down.sql

@@ -0,0 +1,4 @@
+-- Could not auto-generate a down migration.
+-- Please write an appropriate down migration for the SQL below:
+-- alter table "public"."bodyshops" add column "chatterid" text
+--  null;

hasura/migrations/1726528225033_alter_table_public_bodyshops_add_column_chatterid/up.sql

@@ -0,0 +1,2 @@
+alter table "public"."bodyshops" add column "chatterid" text
+ null;

hasura/migrations/1726768560738_drop_index_courtesycars_idx_fleet/down.sql

@@ -0,0 +1,2 @@
+CREATE  INDEX "courtesycars_idx_fleet" on
+  "public"."courtesycars" using btree ("fleetnumber");

hasura/migrations/1726768560738_drop_index_courtesycars_idx_fleet/up.sql

@@ -0,0 +1 @@
+DROP INDEX IF EXISTS "public"."courtesycars_idx_fleet";

hasura/migrations/1726768733548_drop_index_idx_jobs_ownrfn/down.sql

@@ -0,0 +1,2 @@
+CREATE  INDEX "idx_jobs_ownrfn" on
+  "public"."jobs" using gin ("ownr_fn");

hasura/migrations/1726768733548_drop_index_idx_jobs_ownrfn/up.sql

@@ -0,0 +1 @@
+DROP INDEX IF EXISTS "public"."idx_jobs_ownrfn";

hasura/migrations/1726768747444_drop_index_idx_jobs_ownrln/down.sql

@@ -0,0 +1,2 @@
+CREATE  INDEX "idx_jobs_ownrln" on
+  "public"."jobs" using gin ("ownr_ln");

hasura/migrations/1726768747444_drop_index_idx_jobs_ownrln/up.sql

@@ -0,0 +1 @@
+DROP INDEX IF EXISTS "public"."idx_jobs_ownrln";