Merge branch 'master' into feature/america

Release/2023 11 10

.circleci/config.yml

@@ -68,6 +68,120 @@ jobs:
           from: build
           to: "s3://imex-online-production/"
       - jira/notify
+      
+  rome-api-deploy:
+    docker:
+      - image: "cimg/base:stable"
+    steps:
+      - checkout
+      - eb/setup
+      - run:
+          command: |
+            eb init romeonline-productionapi -r us-east-2 -p "Node.js 16 running on 64bit Amazon Linux 2"
+            eb status --verbose
+            eb deploy
+            eb status
+      - jira/notify
+
+  rome-hasura-migrate:
+    docker:
+      - image: cimg/node:16.15.0
+    parameters:
+      secret:
+        type: string
+        default: $HASURA_PROD_SECRET
+    working_directory: ~/repo/hasura
+    steps:
+      - checkout:
+          path: ~/repo
+      - run:
+          name: Execute migration
+          command: |
+            npm install hasura-cli -g
+            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 >>
+
+  rome-app-build:
+    docker:
+      - image: cimg/node:16.15.0
+
+    working_directory: ~/repo/client
+
+    steps:
+      - checkout:
+          path: ~/repo
+
+      - restore_cache:
+          name: Restore Yarn Package Cache
+          keys:
+            - yarn-packages-{{ checksum "yarn.lock" }}
+      - run:
+          name: Install Dependencies
+          command: yarn install --frozen-lockfile --cache-folder ~/.cache/yarn
+      - save_cache:
+          name: Save Yarn Package Cache
+          key: yarn-packages-{{ checksum "yarn.lock" }}
+          paths:
+            - ~/.cache/yarn
+
+      - run: yarn run build
+
+      - aws-s3/sync:
+          from: build
+          to: "s3://rome-online-production/"
+      - jira/notify
+
+  test-rome-hasura-migrate:
+    docker:
+      - image: cimg/node:16.15.0
+    parameters:
+      secret:
+        type: string
+        default: $HASURA_ROME_TEST_SECRET
+    working_directory: ~/repo/hasura
+    steps:
+      - checkout:
+          path: ~/repo
+      - run:
+          name: Execute migration
+          command: |
+            npm install hasura-cli -g
+            echo ${HASURA_TEST_SECRET}
+            hasura migrate apply --endpoint https://db.test.romeonline.io/ --admin-secret << parameters.secret >>
+            hasura metadata apply --endpoint https://db.test.romeonline.io/ --admin-secret << parameters.secret >>
+            hasura metadata reload --endpoint https://db.test.romeonline.io/ --admin-secret << parameters.secret >>
+
+  test-rome-app-build:
+    docker:
+      - image: cimg/node:16.15.0
+
+    working_directory: ~/repo/client
+
+    steps:
+      - checkout:
+          path: ~/repo
+
+      - restore_cache:
+          name: Restore Yarn Package Cache
+          keys:
+            - yarn-packages-{{ checksum "yarn.lock" }}
+      - run:
+          name: Install Dependencies
+          command: yarn install --frozen-lockfile --cache-folder ~/.cache/yarn
+      - save_cache:
+          name: Save Yarn Package Cache
+          key: yarn-packages-{{ checksum "yarn.lock" }}
+          paths:
+            - ~/.cache/yarn
+
+      - run: yarn run build:test
+
+      - aws-s3/sync:
+          from: build
+          to: "s3://rome-online-test/"
+      - jira/notify
+
 
   test-hasura-migrate:
     docker:
@@ -165,6 +279,19 @@ workflows:
           filters:
             branches:
               only: master
+      - rome-api-deploy:
+          filters:
+            branches:
+              only: rome/master
+      - rome-app-build:
+          filters:
+            branches:
+              only: rome/master
+      - rome-hasura-migrate:
+          secret: ${HASURA_PROD_SECRET}
+          filters:
+            branches:
+              only: rome/master
       - test-app-build:
           filters:
             branches:
@@ -174,6 +301,15 @@ workflows:
           filters:
             branches:
               only: test
+      - test-rome-app-build:
+          filters:
+            branches:
+              only: rome/test
+      - test-rome-hasura-migrate:
+          secret: ${HASURA_ROME_TEST_SECRET}
+          filters:
+            branches:
+              only: rome/test
       #- admin-app-build:
       #filters:
       #branches:

README.MD

@@ -1,14 +1,3 @@
-Yarn Dependency Management:
-To force upgrades for some packages:
-yarn upgrade-interactive --latest
-
-To Start Hasura CLI:
-npx hasura console
-
-Migrating to Staging:
-npx hasura migrate apply --endpoint https://db.imex.online/ --admin-secret 'Production-ImEXOnline!@#'
-npx hasura migrate apply --endpoint https://db.test.bodyshop.app/ --admin-secret 'Test-ImEXOnlineBySnaptSoftware!'
-
 NGROK TEsting:
 ./ngrok.exe http http://localhost:4000 -host-header="localhost:4000"
 
@@ -21,4 +10,4 @@ hasura migrate apply --version "1620771761757" --skip-execution --endpoint https
 hasura migrate status --endpoint https://db.imex.online/ --admin-secret 'Production-ImEXOnline!@#'
 
 Generate the license file: 
-$ generate-license-file --input package.json --output third-party-licenses.txt --overwrite
+$ generate-license-file --input package.json --output third-party-licenses.txt --overwrite

client/.env.development

@@ -1,13 +1,14 @@
 REACT_APP_GRAPHQL_ENDPOINT=https://db.dev.bodyshop.app/v1/graphql
 REACT_APP_GRAPHQL_ENDPOINT_WS=wss://db.dev.bodyshop.app/v1/graphql
 REACT_APP_GA_CODE=231099835
-REACT_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"}
+REACT_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"}
 REACT_APP_CLOUDINARY_ENDPOINT_API=https://api.cloudinary.com/v1_1/io-test
 REACT_APP_CLOUDINARY_ENDPOINT=https://res.cloudinary.com/io-test
 REACT_APP_CLOUDINARY_API_KEY=957865933348715
 REACT_APP_CLOUDINARY_THUMB_TRANSFORMATIONS=c_fill,h_250,w_250
-REACT_APP_FIREBASE_PUBLIC_VAPID_KEY='BG3tzU7L2BXlGZ_3VLK4PNaRceoEXEnmHfxcVbRMF5o5g05ejslhVPki9kBM9cBBT-08Ad9kN3HSpS6JmrWD6h4'
+REACT_APP_FIREBASE_PUBLIC_VAPID_KEY='BP1B7ZTYpn-KMt6nOxlld6aS8Skt3Q7ZLEqP0hAvGHxG4UojPYiXZ6kPlzZkUC5jH-EcWXomTLtmadAIxurfcHo'
 REACT_APP_STRIPE_PUBLIC_KEY=pk_test_51GqB4TJl3nQjrZ0wCQWAxAhlNF8jKe0tipIa6ExBaxwJGitwvFsIZUEua4dUzaMIAuXp4qwYHXx7lgjyQSwP0Pe900vzm38C7g
-REACT_APP_AXIOS_BASE_API_URL=https://api.imex.online/
+REACT_APP_AXIOS_BASE_API_URL=http://localhost:4000
 REACT_APP_REPORTS_SERVER_URL=https://reports3.test.imex.online
-REACT_APP_SPLIT_API=ts615lqgnmk84thn72uk18uu5pgce6e0l4rc
+REACT_APP_SPLIT_API=ts615lqgnmk84thn72uk18uu5pgce6e0l4rc
+REACT_APP_COUNTRY=USA

client/.env.production

@@ -1,13 +1,13 @@
-REACT_APP_GRAPHQL_ENDPOINT=https://db.imex.online/v1/graphql
-REACT_APP_GRAPHQL_ENDPOINT_WS=wss://db.imex.online/v1/graphql
+REACT_APP_GRAPHQL_ENDPOINT=https://db.romeonline.io/v1/graphql
+REACT_APP_GRAPHQL_ENDPOINT_WS=wss://db.romeonline.io/v1/graphql
 REACT_APP_GA_CODE=231103507
-REACT_APP_FIREBASE_CONFIG={"apiKey":"AIzaSyDSezy-jGJreo7ulgpLdlpOwAOrgcaEkhU","authDomain":"imex-prod.firebaseapp.com","databaseURL":"https://imex-prod.firebaseio.com","projectId":"imex-prod","storageBucket":"imex-prod.appspot.com","messagingSenderId":"253497221485","appId":"1:253497221485:web:3c81c483b94db84b227a64","measurementId":"G-NTWBKG2L0M"}
+REACT_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"}
 REACT_APP_CLOUDINARY_ENDPOINT_API=https://api.cloudinary.com/v1_1/bodyshop
 REACT_APP_CLOUDINARY_ENDPOINT=https://res.cloudinary.com/bodyshop
 REACT_APP_CLOUDINARY_API_KEY=473322739956866
 REACT_APP_CLOUDINARY_THUMB_TRANSFORMATIONS=c_fill,h_250,w_250
-REACT_APP_FIREBASE_PUBLIC_VAPID_KEY='BMgZT1NZztW2DsJl8Mg2L04hgY9FzAg6b8fbzgNAfww2VDzH3VE63Ot9EaP_U7KWS2JT-7HPHaw0T_Tw_5vkZc8'
+REACT_APP_FIREBASE_PUBLIC_VAPID_KEY='BP1B7ZTYpn-KMt6nOxlld6aS8Skt3Q7ZLEqP0hAvGHxG4UojPYiXZ6kPlzZkUC5jH-EcWXomTLtmadAIxurfcHo'
 REACT_APP_STRIPE_PUBLIC_KEY=pk_test_51GqB4TJl3nQjrZ0wCQWAxAhlNF8jKe0tipIa6ExBaxwJGitwvFsIZUEua4dUzaMIAuXp4qwYHXx7lgjyQSwP0Pe900vzm38C7g
-REACT_APP_AXIOS_BASE_API_URL=https://api.imex.online/
-REACT_APP_REPORTS_SERVER_URL=https://reports.imex.online
+REACT_APP_AXIOS_BASE_API_URL=https://api.romeonline.io/
+REACT_APP_REPORTS_SERVER_URL=https://reports.romeonline.io
 REACT_APP_SPLIT_API=et9pjkik6bn67he5evpmpr1agoo7gactphgk

client/.env.test

@@ -1,14 +1,14 @@
-REACT_APP_GRAPHQL_ENDPOINT=https://db.test.bodyshop.app/v1/graphql
-REACT_APP_GRAPHQL_ENDPOINT_WS=wss://db.test.bodyshop.app/v1/graphql
-REACT_APP_GA_CODE=231099835
-REACT_APP_FIREBASE_CONFIG={   "apiKey":"AIzaSyBw7_GTy7GtQyfkIRPVrWHEGKfcqeyXw0c",   "authDomain":"imex-test.firebaseapp.com",   "projectId":"imex-test",   "storageBucket":"imex-test.appspot.com",   "messagingSenderId":"991923618608",   "appId":"1:991923618608:web:633437569cdad78299bef5",   "measurementId":"G-TW0XLZEH18"}
+REACT_APP_GRAPHQL_ENDPOINT=https://db.test.romeonline.io/v1/graphql
+REACT_APP_GRAPHQL_ENDPOINT_WS=wss://db.test.romeonline.io/v1/graphql
+REACT_APP_GA_CODE=231103507
+REACT_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"}
 REACT_APP_CLOUDINARY_ENDPOINT_API=https://api.cloudinary.com/v1_1/bodyshop
 REACT_APP_CLOUDINARY_ENDPOINT=https://res.cloudinary.com/bodyshop
 REACT_APP_CLOUDINARY_API_KEY=473322739956866
 REACT_APP_CLOUDINARY_THUMB_TRANSFORMATIONS=c_fill,h_250,w_250
-REACT_APP_FIREBASE_PUBLIC_VAPID_KEY='BN2GcDPjipR5MTEosO5dT4CfQ3cmrdBIsI4juoOQrRijn_5aRiHlwj1mlq0W145mOusx6xynEKl_tvYJhpCc9lo'
+REACT_APP_FIREBASE_PUBLIC_VAPID_KEY='BP1B7ZTYpn-KMt6nOxlld6aS8Skt3Q7ZLEqP0hAvGHxG4UojPYiXZ6kPlzZkUC5jH-EcWXomTLtmadAIxurfcHo'
 REACT_APP_STRIPE_PUBLIC_KEY=pk_test_51GqB4TJl3nQjrZ0wCQWAxAhlNF8jKe0tipIa6ExBaxwJGitwvFsIZUEua4dUzaMIAuXp4qwYHXx7lgjyQSwP0Pe900vzm38C7g
-REACT_APP_AXIOS_BASE_API_URL=https://api.test.imex.online/
-REACT_APP_REPORTS_SERVER_URL=https://reports3.test.imex.online
+REACT_APP_AXIOS_BASE_API_URL=https://api.test.romeonline.io/
+REACT_APP_REPORTS_SERVER_URL=https://reports.test.romeonline.io
 REACT_APP_IS_TEST=true
 REACT_APP_SPLIT_API=ts615lqgnmk84thn72uk18uu5pgce6e0l4rc

client/craco.config.js

@@ -12,7 +12,7 @@ module.exports = {
         authToken:
           "6b45b028a02342db97a9a2f92c0959058665443d379d4a3a876430009e744260",
         org: "snapt-software",
-        project: "imexonline",
+        project: "rome-online",
         release: process.env.REACT_APP_GIT_SHA,
 
         // webpack-specific configuration
@@ -27,7 +27,7 @@ module.exports = {
           lessOptions: {
             modifyVars: {
               ...(process.env.NODE_ENV === "development"
-                ? { "@primary-color": "#a51d1d" }
+                ? { "@primary-color": "#B22234" }
                 : {
                     //"@primary-color": "#1DA57A"
                   }),

client/package.json

@@ -4,71 +4,71 @@
   "private": true,
   "proxy": "http://localhost:4000",
   "dependencies": {
-    "@apollo/client": "^3.6.9",
+    "@apollo/client": "^3.7.9",
     "@asseinfo/react-kanban": "^2.2.0",
-    "@craco/craco": "^6.4.5",
-    "@fingerprintjs/fingerprintjs": "^3.3.3",
+    "@craco/craco": "^7.0.0",
+    "@fingerprintjs/fingerprintjs": "^3.4.2",
     "@jsreport/browser-client": "^3.1.0",
-    "@sentry/react": "^7.7.0",
-    "@sentry/tracing": "^7.7.0",
-    "@splitsoftware/splitio-react": "^1.6.0",
-    "@stripe/react-stripe-js": "^1.9.0",
-    "@stripe/stripe-js": "^1.32.0",
+    "@sentry/react": "^7.40.0",
+    "@sentry/tracing": "^7.40.0",
+    "@splitsoftware/splitio-react": "^1.8.1",
     "@tanem/react-nprogress": "^5.0.8",
-    "antd": "^4.22.3",
-    "apollo-link-logger": "^2.0.0",
-    "axios": "^0.27.2",
-    "craco-less": "^1.20.0",
+    "antd": "^4.24.8",
+    "apollo-link-logger": "^2.0.1",
+    "axios": "^1.3.4",
+    "craco-less": "^2.0.0",
     "dinero.js": "^1.9.1",
     "dotenv": "^16.0.1",
     "enquire-js": "^0.2.1",
     "env-cmd": "^10.1.0",
     "exifr": "^7.1.3",
-    "firebase": "^9.9.1",
-    "graphql": "^16.5.0",
-    "i18next": "^21.8.14",
-    "i18next-browser-languagedetector": "^6.1.4",
+    "firebase": "^9.17.1",
+    "graphql": "^16.6.0",
+    "i18next": "^22.4.10",
+    "i18next-browser-languagedetector": "^7.0.1",
     "jsoneditor": "^9.9.0",
     "jsreport-browser-client-dist": "^1.3.0",
-    "libphonenumber-js": "^1.10.9",
+    "libphonenumber-js": "^1.10.21",
     "logrocket": "^3.0.1",
-    "markerjs2": "^2.22.0",
+    "markerjs2": "^2.28.1",
     "moment-business-days": "^1.2.0",
-    "moment-timezone": "^0.5.34",
-    "normalize-url": "^7.0.3",
-    "phone": "^3.1.23",
+    "moment-timezone": "^0.5.41",
+    "normalize-url": "^8.0.0",
+    "phone": "^3.1.35",
     "preval.macro": "^5.0.0",
     "prop-types": "^15.8.1",
-    "query-string": "^7.1.1",
+    "query-string": "^7.1.3",
     "rc-queue-anim": "^2.0.0",
     "rc-scroll-anim": "^2.7.6",
     "react": "^17.0.2",
-    "react-big-calendar": "^1.5.0",
+    "react-big-calendar": "^1.6.8",
     "react-color": "^2.19.3",
     "react-cookie": "^4.1.1",
     "react-dom": "^17.0.2",
     "react-drag-listview": "^0.2.1",
-    "react-grid-gallery": "^0.5.5",
+    "react-grid-gallery": "^1.0.0",
     "react-grid-layout": "^1.3.4",
-    "react-i18next": "^11.18.1",
-    "react-icons": "^4.4.0",
-    "react-number-format": "^4.9.3",
-    "react-redux": "^7.2.8",
+    "react-i18next": "^12.2.0",
+    "react-icons": "^4.7.1",
+    "react-image-lightbox": "^5.1.4",
+    "react-intersection-observer": "^9.4.3",
+    "react-number-format": "^5.1.3",
+    "react-redux": "^8.0.5",
     "react-resizable": "^3.0.4",
     "react-router-dom": "^5.3.0",
-    "react-scripts": "^4.0.3",
+    "react-scripts": "^5.0.1",
     "react-sticky": "^6.0.3",
     "react-sublime-video": "^0.2.5",
     "react-virtualized": "^9.22.3",
-    "recharts": "^2.1.12",
-    "redux": "^4.2.0",
+    "recharts": "^2.4.3",
+    "redux": "^4.2.1",
     "redux-persist": "^6.0.0",
-    "redux-saga": "^1.1.3",
+    "redux-saga": "^1.2.2",
     "redux-state-sync": "^3.1.4",
-    "reselect": "^4.1.6",
-    "sass": "^1.54.0",
-    "socket.io-client": "^4.5.1",
-    "styled-components": "^5.3.5",
+    "reselect": "^4.1.7",
+    "sass": "^1.58.3",
+    "socket.io-client": "^4.6.1",
+    "styled-components": "^5.3.6",
     "subscriptions-transport-ws": "^0.11.0",
     "web-vitals": "^2.1.4",
     "workbox-background-sync": "^6.5.3",
@@ -119,7 +119,7 @@
     "react-error-overlay": "6.0.9"
   },
   "devDependencies": {
-    "@sentry/webpack-plugin": "^1.19.0",
+    "@sentry/webpack-plugin": "^1.20.0",
     "@testing-library/cypress": "^8.0.3",
     "cypress": "^10.3.1",
     "eslint-plugin-cypress": "^2.12.1",

client/public/firebase-messaging-sw.js

@@ -28,6 +28,17 @@ switch (this.location.hostname) {
       // measurementId: "${config.measurementId}",
     };
     break;
+  case "romeonline.io":
+    firebaseConfig = {
+      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",
+    };
+    break;
   case "imex.online":
   default:
     firebaseConfig = {

client/public/index.html

@@ -2,23 +2,81 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <link rel="icon" href="%PUBLIC_URL%/favicon.png" />
+    <link rel="icon" href="%PUBLIC_URL%/ro-favicon.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#002366" />
-    <meta name="description" content="ImEX Online" />
+    <meta name="description" content="Rome Online" />
     <!-- <link rel="apple-touch-icon" href="logo192.png" /> -->
+
+    <!--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>
+
     <link rel="apple-touch-icon" href="logo192.png" />
-    <script type="text/javascript">
-      window.$crisp = [];
-      window.CRISP_WEBSITE_ID = "36724f62-2eb0-4b29-9cdd-9905fb99913e";
-      (function () {
-        d = document;
-        s = d.createElement("script");
-        s.src = "https://client.crisp.chat/l.js";
-        s.async = 1;
-        d.getElementsByTagName("head")[0].appendChild(s);
-      })();
-    </script>
     <script>
       !(function () {
         "use strict";
@@ -77,7 +135,7 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>ImEX Online</title>
+    <title>Rome Online</title>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>

client/public/manifest.json

@@ -1,6 +1,6 @@
 {
-  "short_name": "ImEX Online",
-  "name": "ImEX Online",
+  "short_name": "Rome Online",
+  "name": "Rome Online",
   "description": "The ultimate bodyshop management system.",
   "icons": [
     {

client/src/App/App.container.jsx

@@ -27,6 +27,12 @@ export default function AppContainer() {
         //componentSize="small"
         input={{ autoComplete: "new-password" }}
         locale={enLocale}
+        theme={{
+          token: {
+            colorPrimary: "#326ade",
+            colorInfo: "#326ade"
+          },
+        }}
         form={{
           validateMessages: {
             // eslint-disable-next-line no-template-curly-in-string

client/src/App/App.jsx

@@ -77,9 +77,9 @@ export function App({
     if (currentUser.authorized && bodyshop) {
       client.setAttribute("imexshopid", bodyshop.imexshopid);
 
+      LogRocket.init("rome-online/rome-online");
       if (client.getTreatment("LogRocket_Tracking") === "on") {
-        console.log("LR Start");
-        LogRocket.init("gvfvfw/bodyshopapp");
+        LogRocket.init("rome-online/rome-online");
       }
     }
   }, [bodyshop, client, currentUser.authorized]);
@@ -109,7 +109,7 @@ export function App({
 
   return (
     <Switch>
-      <Suspense fallback={<LoadingSpinner message="ImEX Online" />}>
+      <Suspense fallback={<LoadingSpinner />}>
         <ErrorBoundary>
           <Route exact path="/" component={LandingPage} />
         </ErrorBoundary>

client/src/App/App.styles.scss

@@ -143,8 +143,28 @@
   }
 }
 
-
-//Update row highlighting on production board. 
+//Update row highlighting on production board.
 .ant-table-tbody > tr.ant-table-row:hover > td {
-  background: #eaeaea !important;
-}
+  background: #e7f3ff !important;
+}
+
+.ant-table-tbody > tr.ant-table-row-selected > td {
+  background: #e6f7ff !important;
+}
+
+.job-line-manual {
+  color: tomato;
+  font-style: italic;
+}
+
+td.ant-table-column-sort {
+  background-color: transparent;
+}
+
+.ant-table-tbody > tr.ant-table-row:nth-child(2n) > td {
+  background-color: #f4f4f4;
+}
+
+.rowWithColor > td {
+  background-color: var(--bgColor) !important;
+}

client/src/components/_test/paymentMethod.jsx

@@ -1,96 +0,0 @@
-import {
-  PaymentRequestButtonElement,
-  useStripe,
-} from "@stripe/react-stripe-js";
-import React, { useEffect, useState } from "react";
-import { connect } from "react-redux";
-import { createStructuredSelector } from "reselect";
-import { logImEXEvent } from "../../firebase/firebase.utils";
-import { setEmailOptions } from "../../redux/email/email.actions";
-import { selectBodyshop } from "../../redux/user/user.selectors";
-import { TemplateList } from "../../utils/TemplateConstants";
-
-const mapStateToProps = createStructuredSelector({
-  bodyshop: selectBodyshop,
-});
-
-const mapDispatchToProps = (dispatch) => ({
-  setEmailOptions: (e) => dispatch(setEmailOptions(e)),
-});
-
-function Test({ bodyshop, setEmailOptions }) {
-  const stripe = useStripe();
-
-  const [paymentRequest, setPaymentRequest] = useState(null);
-  useEffect(() => {
-    if (stripe) {
-      const pr = stripe.paymentRequest({
-        country: "CA",
-        displayItems: [{ label: "Deductible", amount: 1099 }],
-        currency: "cad",
-        total: {
-          label: "Demo total",
-          amount: 1099,
-        },
-        requestPayerName: true,
-        requestPayerEmail: true,
-      });
-
-      // Check the availability of the Payment Request API.
-      pr.canMakePayment().then((result) => {
-        if (result) {
-          setPaymentRequest(pr);
-        } else {
-          // var details = {
-          //   total: { label: "", amount: { currency: "CAD", value: "0.00" } },
-          // };
-          new PaymentRequest(
-            [{ supportedMethods: ["basic-card"] }],
-            {}
-            //  details
-          ).show();
-        }
-      });
-    }
-  }, [stripe]);
-
-  if (paymentRequest) {
-    return (
-      <div style={{ height: "300px" }}>
-        <PaymentRequestButtonElement options={{ paymentRequest }} />
-      </div>
-    );
-  }
-
-  return (
-    <div>
-      <button
-        onClick={() => {
-          setEmailOptions({
-            messageOptions: {
-              to: ["patrickwf@gmail.com"],
-              replyTo: bodyshop.email,
-            },
-            template: {
-              name: TemplateList().parts_order.key,
-              variables: {
-                id: "a7c2d4e1-f519-42a9-a071-c48cf0f22979",
-              },
-            },
-          });
-        }}
-      >
-        send email
-      </button>
-      <button
-        onClick={() => {
-          logImEXEvent("IMEXEVENT", { somethignArThare: 5 });
-        }}
-      >
-        Log an ImEX Event.
-      </button>
-    </div>
-  );
-}
-
-export default connect(mapStateToProps, mapDispatchToProps)(Test);

client/src/components/_test/payment_response.json

@@ -0,0 +1,63 @@
+{
+  "status": 24201299,
+  "custid": 19607899,
+  "paymentid": 24201299,
+  "response": "A",
+  "authcode": "498680",
+  "declinereason": "Approved",
+  "fee": 0,
+  "invoice": "",
+  "account": "john",
+  "amount": 1000,
+  "amountincludesfee": false,
+  "total": 1000,
+  "paymenttype": "C",
+  "methodhint": "VI ***1111",
+  "cardbrand": "Visa",
+  "cardnumdisplay": "***1111",
+  "receiptelements": {
+    "authcode": "498680",
+    "cust_srv_ph_num": "1-555-555-5555",
+    "rcpt_pg_ftr_txt": "Thank You\nPlease Come Again",
+    "rcpt_currency": "USD",
+    "responsecode": "A",
+    "rcpt_pay_mthd": "Visa",
+    "transid": "C00 915799",
+    "merch_disp_nm": "CP Devel Test",
+    "rcpt_input_mthd": "Keyed",
+    "rcpt_pg_hdr_txt": "Welcome!",
+    "rcpt_tran_time": "Thursday February 23 2023, 11:25:36 pm +08",
+    "rcpt_trans_type": "Normal Transaction (Sale)",
+    "message": "Approved",
+    "rcpt_dba_addr": "1234 Storefront Ave\nSome City, UT 84111",
+    "avsdata": "N",
+    "receiptrequirements": "S",
+    "rcpt_cardnum": "************1111",
+    "cv2result": "M",
+    "rfnd_policy_txt": "<b>No Refunds</b>\nStore Credit Only",
+    "labels": {
+      "tranref": "REF#",
+      "tid": "TID",
+      "validationcode": "ValCode",
+      "emvapplicationid": "AID",
+      "emvatc": "ATC",
+      "rcpt_pay_mthd": "Pay Method",
+      "transid": "TransID",
+      "rcpt_input_mthd": "IMode",
+      "emvtsi": "TSI",
+      "emvac": "AC",
+      "rcpt_trans_type": "TranType",
+      "emvapplicationname": "PApp",
+      "visarewards": "RewardsProg"
+    }
+  },
+  "receipttoken": "H4sIAAAAAAAAACXMTQuCMBgA4P/ynh3tw_3dBI/ipQ8NOtRN53QiblpBRfTfCzo/8LwhxGAdZCCwFYoJJFQjI2kvHdGu74lVkgmrWyWNhASW5jW7cB87yHjKKePGJODnxrrnMl7dDTKmEJlSOqV/_N30XPpyj2Eddq57_KKZ8FLzmh_G1VQnVfhjiXGK1XYTc/h8AVOkf4qUAAAA",
+  "call": "card_payment",
+  "nonce": "488b5568-b5c1-4f38-8b2f-3b050f3abb11P",
+  "hmac": "JyPAJ9Yx0SlYBTtqns1OxAFRt+xF3l2UiLPO5zTDRBE=",
+  "paymentreferenceid": "C19607899P24201299",
+  "cardnum": "...1111",
+  "email": "",
+  "nameOnCard": "John Allen",
+  "cardType": "visa"
+}

client/src/components/_test/test.component.jsx

@@ -1,9 +0,0 @@
-import React from "react";
-import QboAuthorizeComponent from "../qbo-authorize/qbo-authorize.component";
-export default function Test() {
-  return (
-    <div>
-      <QboAuthorizeComponent />
-    </div>
-  );
-}

client/src/components/_test/test.page.jsx

@@ -0,0 +1,31 @@
+import { Button } from "antd";
+import React from "react";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { setModalContext } from "../../redux/modals/modals.actions";
+
+const mapStateToProps = createStructuredSelector({});
+
+const mapDispatchToProps = (dispatch) => ({
+  setRefundPaymentContext: (context) =>
+    dispatch(setModalContext({ context: context, modal: "refund_payment" })),
+});
+
+function Test({ setRefundPaymentContext, refundPaymentModal }) {
+  console.log("refundPaymentModal", refundPaymentModal);
+  return (
+    <div>
+      <Button
+        onClick={() =>
+          setRefundPaymentContext({
+            context: {},
+          })
+        }
+      >
+        Open Modal
+      </Button>
+    </div>
+  );
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(Test);

client/src/components/accounting-payments-table/accounting-payments-table.component.jsx

@@ -107,11 +107,6 @@ export function AccountingPayablesTableComponent({
       dataIndex: "transactionid",
       key: "transactionid",
     },
-    {
-      title: t("payments.fields.stripeid"),
-      dataIndex: "stripeid",
-      key: "stripeid",
-    },
     {
       title: t("payments.fields.created_at"),
       dataIndex: "created_at",

client/src/components/bill-delete-button/bill-delete-button.component.jsx

@@ -6,7 +6,7 @@ import { useTranslation } from "react-i18next";
 import { DELETE_BILL } from "../../graphql/bills.queries";
 import RbacWrapper from "../rbac-wrapper/rbac-wrapper.component";
 
-export default function BillDeleteButton({ bill }) {
+export default function BillDeleteButton({ bill, callback }) {
   const [loading, setLoading] = useState(false);
   const { t } = useTranslation();
   const [deleteBill] = useMutation(DELETE_BILL);
@@ -36,6 +36,8 @@ export default function BillDeleteButton({ bill }) {
 
     if (!!!result.errors) {
       notification["success"]({ message: t("bills.successes.deleted") });
+
+      if (callback && typeof callback === "function") callback(bill.id);
     } else {
       //Check if it's an fkey violation.
       const error = JSON.stringify(result.errors);

client/src/components/bill-enter-modal/bill-enter-modal.container.jsx

@@ -1,18 +1,18 @@
 import { useApolloClient, useMutation } from "@apollo/client";
-import { Button, Checkbox, Form, Modal, notification, Space } from "antd";
+import { Button, Checkbox, Form, Modal, Space, notification } from "antd";
 import _ from "lodash";
-import React, { useEffect, useState, useMemo } from "react";
+import React, { useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { INSERT_NEW_BILL } from "../../graphql/bills.queries";
+import { UPDATE_INVENTORY_LINES } from "../../graphql/inventory.queries";
 import { UPDATE_JOB_LINE } from "../../graphql/jobs-lines.queries";
 import {
   QUERY_JOB_LBR_ADJUSTMENTS,
   UPDATE_JOB,
 } from "../../graphql/jobs.queries";
 import { MUTATION_MARK_RETURN_RECEIVED } from "../../graphql/parts-orders.queries";
-import { UPDATE_INVENTORY_LINES } from "../../graphql/inventory.queries";
 import { insertAuditTrail } from "../../redux/application/application.actions";
 import { toggleModalVisible } from "../../redux/modals/modals.actions";
 import { selectBillEnterModal } from "../../redux/modals/modals.selectors";
@@ -20,15 +20,16 @@ import {
   selectBodyshop,
   selectCurrentUser,
 } from "../../redux/user/user.selectors";
-import confirmDialog from "../../utils/asyncConfirm";
 import AuditTrailMapping from "../../utils/AuditTrailMappings";
-import BillFormContainer from "../bill-form/bill-form.container";
-import { CalculateBillTotal } from "../bill-form/bill-form.totals.utility";
-import { handleUpload } from "../documents-upload/documents-upload.utility";
-import { handleUpload as handleLocalUpload } from "../documents-local-upload/documents-local-upload.utility";
-import useLocalStorage from "../../utils/useLocalStorage";
 import { GenerateDocument } from "../../utils/RenderTemplate";
 import { TemplateList } from "../../utils/TemplateConstants";
+import confirmDialog from "../../utils/asyncConfirm";
+import useLocalStorage from "../../utils/useLocalStorage";
+import BillFormContainer from "../bill-form/bill-form.container";
+import { CalculateBillTotal } from "../bill-form/bill-form.totals.utility";
+import { handleUpload as handleLocalUpload } from "../documents-local-upload/documents-local-upload.utility";
+import { handleUpload } from "../documents-upload/documents-upload.utility";
+import { useTreatments } from "@splitsoftware/splitio-react";
 
 const mapStateToProps = createStructuredSelector({
   billEnterModal: selectBillEnterModal,
@@ -37,8 +38,8 @@ const mapStateToProps = createStructuredSelector({
 });
 const mapDispatchToProps = (dispatch) => ({
   toggleModalVisible: () => dispatch(toggleModalVisible("billEnter")),
-  insertAuditTrail: ({ jobid, operation }) =>
-    dispatch(insertAuditTrail({ jobid, operation })),
+  insertAuditTrail: ({ jobid, billid, operation }) =>
+    dispatch(insertAuditTrail({ jobid, billid, operation })),
 });
 
 const Templates = TemplateList("job_special");
@@ -63,6 +64,11 @@ function BillEnterModalContainer({
     "enter_bill_generate_label",
     false
   );
+  const { Enhanced_Payroll } = useTreatments(
+    ["Enhanced_Payroll"],
+    {},
+    bodyshop.imexshopid
+  );
   const formValues = useMemo(() => {
     return {
       ...billEnterModal.context.bill,
@@ -98,6 +104,7 @@ function BillEnterModalContainer({
     } = values;
 
     let adjustmentsToInsert = {};
+    let payrollAdjustmentsToInsert = [];
 
     const r1 = await insertBill({
       variables: {
@@ -116,25 +123,67 @@ function BillEnterModalContainer({
                     ...restI
                   } = i;
 
-                  if (deductedfromlbr) {
-                    adjustmentsToInsert[lbr_adjustment.mod_lbr_ty] =
-                      (adjustmentsToInsert[lbr_adjustment.mod_lbr_ty] || 0) -
-                      restI.actual_price / lbr_adjustment.rate;
+                  if (Enhanced_Payroll.treatment === "on") {
+                    if (
+                      deductedfromlbr &&
+                      true //payroll is on
+                    ) {
+                      payrollAdjustmentsToInsert.push({
+                        id: i.joblineid,
+                        convertedtolbr: true,
+                        convertedtolbr_data: {
+                          mod_lb_hrs: lbr_adjustment.mod_lb_hrs * -1,
+                          mod_lbr_ty: lbr_adjustment.mod_lbr_ty,
+                        },
+                      });
+                    }
+                  } else {
+                    if (deductedfromlbr) {
+                      adjustmentsToInsert[lbr_adjustment.mod_lbr_ty] =
+                        (adjustmentsToInsert[lbr_adjustment.mod_lbr_ty] || 0) -
+                        restI.actual_price / lbr_adjustment.rate;
+                    }
                   }
+
                   return {
                     ...restI,
                     deductedfromlbr: deductedfromlbr,
                     lbr_adjustment,
                     joblineid: i.joblineid === "noline" ? null : i.joblineid,
+                    applicable_taxes: {
+                      federal:
+                        (i.applicable_taxes && i.applicable_taxes.federal) ||
+                        false,
+                      state:
+                        (i.applicable_taxes && i.applicable_taxes.state) ||
+                        false,
+                      local:
+                        (i.applicable_taxes && i.applicable_taxes.local) ||
+                        false,
+                    },
                   };
                 }),
             },
           },
         ],
       },
-      refetchQueries: ["QUERY_PARTS_BILLS_BY_JOBID"],
+      refetchQueries: ["QUERY_PARTS_BILLS_BY_JOBID", "GET_JOB_BY_PK"],
     });
 
+    await Promise.all(
+      payrollAdjustmentsToInsert.map((li) => {
+        return updateJobLines({
+          variables: {
+            lineId: li.id,
+            line: {
+              convertedtolbr: li.convertedtolbr,
+              convertedtolbr_data: li.convertedtolbr_data,
+            },
+          },
+        });
+      })
+    );
+
     const adjKeys = Object.keys(adjustmentsToInsert);
     if (adjKeys.length > 0) {
       //Query the adjustments, merge, and update them.
@@ -305,16 +354,18 @@ function BillEnterModalContainer({
     insertAuditTrail({
       jobid: values.jobid,
       billid: billId,
-      operation: AuditTrailMapping.billposted(remainingValues.invoice_number),
+      operation: AuditTrailMapping.billposted(
+        r1.data.insert_bills.returning[0].invoice_number
+      ),
     });
 
     if (enterAgain) {
-      form.resetFields();
-      form.resetFields();
+      // form.resetFields();
       form.setFieldsValue({
         ...formValues,
         billlines: [],
       });
+      form.resetFields();
     } else {
       toggleModalVisible();
     }

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

@@ -1,6 +1,6 @@
 import Icon, { UploadOutlined } from "@ant-design/icons";
 import { useApolloClient } from "@apollo/client";
-import { MdOpenInNew } from "react-icons/md";
+import { useTreatments } from "@splitsoftware/splitio-react";
 import {
   Alert,
   Divider,
@@ -12,14 +12,17 @@ import {
   Switch,
   Upload,
 } from "antd";
+import moment from "moment";
 import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
+import { MdOpenInNew } from "react-icons/md";
 import { connect } from "react-redux";
 import { Link } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
 import { CHECK_BILL_INVOICE_NUMBER } from "../../graphql/bills.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 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";
@@ -28,8 +31,6 @@ 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 { useTreatments } from "@splitsoftware/splitio-react";
-import BillFormLinesExtended from "../bill-form-lines-extended/bill-form-lines-extended.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -49,6 +50,7 @@ export function BillFormComponent({
   job,
   loadOutstandingReturns,
   loadInventory,
+  preferredMake,
 }) {
   const { t } = useTranslation();
   const client = useApolloClient();
@@ -58,6 +60,11 @@ export function BillFormComponent({
     {},
     bodyshop.imexshopid
   );
+  const { ClosingPeriod } = useTreatments(
+    ["ClosingPeriod"],
+    {},
+    bodyshop.imexshopid
+  );
 
   const handleVendorSelect = (props, opt) => {
     setDiscount(opt.discount);
@@ -179,6 +186,7 @@ export function BillFormComponent({
           <VendorSearchSelect
             disabled={disabled}
             options={vendorAutoCompleteOptions}
+            preferredMake={preferredMake}
             onSelect={handleVendorSelect}
           />
         </Form.Item>
@@ -259,6 +267,37 @@ export function BillFormComponent({
               required: true,
               //message: t("general.validation.required"),
             },
+            ({ getFieldValue }) => ({
+              validator(rule, value) {
+                if (
+                  ClosingPeriod.treatment === "on" &&
+                  bodyshop.accountingconfig.ClosingPeriod
+                ) {
+                  if (
+                    moment(value)
+                      .startOf("day")
+                      .isSameOrAfter(
+                        moment(
+                          bodyshop.accountingconfig.ClosingPeriod[0]
+                        ).startOf("day")
+                      ) &&
+                    moment(value)
+                      .startOf("day")
+                      .isSameOrBefore(
+                        moment(
+                          bodyshop.accountingconfig.ClosingPeriod[1]
+                        ).endOf("day")
+                      )
+                  ) {
+                    return Promise.resolve();
+                  } else {
+                    return Promise.reject(t("bills.validation.closingperiod"));
+                  }
+                } else {
+                  return Promise.resolve();
+                }
+              },
+            }),
           ]}
         >
           <FormDatePicker disabled={disabled} />
@@ -327,13 +366,15 @@ export function BillFormComponent({
         )}
       </LayoutFormRow>
       <LayoutFormRow>
-        <Form.Item
-          span={3}
-          label={t("bills.fields.federal_tax_rate")}
-          name="federal_tax_rate"
-        >
-          <CurrencyInput min={0} disabled={disabled} />
-        </Form.Item>
+        {
+          // <Form.Item
+          //   span={3}
+          //   label={t("bills.fields.federal_tax_rate")}
+          //   name="federal_tax_rate"
+          // >
+          //   <CurrencyInput min={0} disabled={disabled} />
+          // </Form.Item>
+        }
         <Form.Item
           span={3}
           label={t("bills.fields.state_tax_rate")}
@@ -341,13 +382,15 @@ export function BillFormComponent({
         >
           <CurrencyInput min={0} disabled={disabled} />
         </Form.Item>
-        <Form.Item
-          span={3}
-          label={t("bills.fields.local_tax_rate")}
-          name="local_tax_rate"
-        >
-          <CurrencyInput min={0} />
-        </Form.Item>
+        {
+          //   <Form.Item
+          //     span={3}
+          //     label={t("bills.fields.local_tax_rate")}
+          //     name="local_tax_rate"
+          //   >
+          //     <CurrencyInput min={0} />
+          //   </Form.Item>
+        }
         <Form.Item shouldUpdate span={15}>
           {() => {
             const values = form.getFieldsValue([
@@ -373,21 +416,25 @@ export function BillFormComponent({
                       value={totals.subtotal.toFormat()}
                       precision={2}
                     />
-                    <Statistic
-                      title={t("bills.labels.federal_tax")}
-                      value={totals.federalTax.toFormat()}
-                      precision={2}
-                    />
+                    {
+                      // <Statistic
+                      //   title={t("bills.labels.federal_tax")}
+                      //   value={totals.federalTax.toFormat()}
+                      //   precision={2}
+                      // />
+                    }
                     <Statistic
                       title={t("bills.labels.state_tax")}
                       value={totals.stateTax.toFormat()}
                       precision={2}
                     />
-                    <Statistic
-                      title={t("bills.labels.local_tax")}
-                      value={totals.localTax.toFormat()}
-                      precision={2}
-                    />
+                    {
+                      // <Statistic
+                      //   title={t("bills.labels.local_tax")}
+                      //   value={totals.localTax.toFormat()}
+                      //   precision={2}
+                      // />
+                    }
                     <Statistic
                       title={t("bills.labels.entered_total")}
                       value={totals.enteredTotal.toFormat()}

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

@@ -1,16 +1,16 @@
 import { useLazyQuery, useQuery } from "@apollo/client";
+import { useTreatments } from "@splitsoftware/splitio-react";
 import React from "react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
+import { QUERY_OUTSTANDING_INVENTORY } from "../../graphql/inventory.queries";
 import { GET_JOB_LINES_TO_ENTER_BILL } from "../../graphql/jobs-lines.queries";
+import { QUERY_UNRECEIVED_LINES } from "../../graphql/parts-orders.queries";
 import { SEARCH_VENDOR_AUTOCOMPLETE } from "../../graphql/vendors.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import BillFormComponent from "./bill-form.component";
 import BillCmdReturnsTableComponent from "../bill-cm-returns-table/bill-cm-returns-table.component";
-import { QUERY_UNRECEIVED_LINES } from "../../graphql/parts-orders.queries";
 import BillInventoryTable from "../bill-inventory-table/bill-inventory-table.component";
-import { QUERY_OUTSTANDING_INVENTORY } from "../../graphql/inventory.queries";
-import { useTreatments } from "@splitsoftware/splitio-react";
+import BillFormComponent from "./bill-form.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -59,6 +59,7 @@ export function BillFormContainer({
         disableInvNumber={disableInvNumber}
         loadOutstandingReturns={loadOutstandingReturns}
         loadInventory={loadInventory}
+        preferredMake={lineData ? lineData.jobs_by_pk.v_make_desc : null}
       />
       {!billEdit && (
         <BillCmdReturnsTableComponent

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

@@ -1,14 +1,15 @@
 import { DeleteFilled, DollarCircleFilled } from "@ant-design/icons";
 import { useTreatments } from "@splitsoftware/splitio-react";
 import {
-  Button, Form,
+  Button,
+  Form,
   Input,
   InputNumber,
   Select,
   Space,
   Switch,
   Table,
-  Tooltip
+  Tooltip,
 } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
@@ -39,12 +40,19 @@ export function BillEnterModalLinesComponent({
   billid,
 }) {
   const { t } = useTranslation();
-  const { setFieldsValue, getFieldsValue, getFieldValue } = form;
+  const { setFieldsValue, getFieldsValue, getFieldValue, setFieldValue } = form;
   const { Simple_Inventory } = useTreatments(
     ["Simple_Inventory"],
     {},
     bodyshop && bodyshop.imexshopid
   );
+
+  const { Enhanced_Payroll } = useTreatments(
+    ["Enhanced_Payroll"],
+    {},
+    bodyshop.imexshopid
+  );
+
   const columns = (remove) => {
     return [
       {
@@ -375,12 +383,31 @@ export function BillEnterModalLinesComponent({
                 "rate",
               ]);
 
+              const billline = getFieldValue(["billlines", record.name]);
+
+              const jobline = lineData.find(
+                (line) => line.id === billline?.joblineid
+              );
+
+              const employeeTeamName = bodyshop.employee_teams.find(
+                (team) => team.id === jobline?.assigned_team
+              );
+
               if (getFieldValue(["billlines", record.name, "deductedfromlbr"]))
                 return (
                   <div>
+                    <Space>
+                      {t("joblines.fields.assigned_team", {
+                        name: employeeTeamName?.name,
+                      })}
+                      {`${jobline.mod_lb_hrs} units/${t(
+                        `joblines.fields.lbr_types.${jobline.mod_lbr_ty}`
+                      )}`}
+                    </Space>
                     <Form.Item
                       label={t("joblines.fields.mod_lbr_ty")}
                       key={`${index}modlbrty`}
+                      initialValue={jobline ? jobline.mod_lbr_ty : null}
                       rules={[
                         {
                           required: true,
@@ -434,22 +461,44 @@ export function BillEnterModalLinesComponent({
                         </Select.Option>
                       </Select>
                     </Form.Item>
-                    <Form.Item
-                      label={t("jobs.labels.adjustmentrate")}
-                      name={[record.name, "lbr_adjustment", "rate"]}
-                      initialValue={bodyshop.default_adjustment_rate}
-                      rules={[
-                        {
-                          required: true,
-                          //message: t("general.validation.required"),
-                        },
-                      ]}
-                    >
-                      <InputNumber precision={2} min={0.01} />
-                    </Form.Item>
-                    {price &&
-                      adjustmentRate &&
-                      `${(price / adjustmentRate).toFixed(1)} hrs`}
+                    {Enhanced_Payroll.treatment === "on" ? (
+                      <Form.Item
+                        label={t("billlines.labels.mod_lbr_adjustment")}
+                        name={[record.name, "lbr_adjustment", "mod_lb_hrs"]}
+                        rules={[
+                          {
+                            required: true,
+                            //message: t("general.validation.required"),
+                          },
+                        ]}
+                      >
+                        <InputNumber
+                          precision={5}
+                          min={0.01}
+                          max={jobline ? jobline.mod_lb_hrs : 0}
+                        />
+                      </Form.Item>
+                    ) : (
+                      <Form.Item
+                        label={t("jobs.labels.adjustmentrate")}
+                        name={[record.name, "lbr_adjustment", "rate"]}
+                        initialValue={bodyshop.default_adjustment_rate}
+                        rules={[
+                          {
+                            required: true,
+                            //message: t("general.validation.required"),
+                          },
+                        ]}
+                      >
+                        <InputNumber precision={2} min={0.01} />
+                      </Form.Item>
+                    )}
+
+                    <Space>
+                      {price &&
+                        adjustmentRate &&
+                        `${(price / adjustmentRate).toFixed(1)} hrs`}
+                    </Space>
                   </div>
                 );
               return <></>;
@@ -457,21 +506,21 @@ export function BillEnterModalLinesComponent({
           </Form.Item>
         ),
       },
-      {
-        title: t("billlines.fields.federal_tax_applicable"),
-        dataIndex: "applicable_taxes.federal",
-        editable: true,
+      // {
+      //   title: t("billlines.fields.federal_tax_applicable"),
+      //   dataIndex: "applicable_taxes.federal",
+      //   editable: true,
 
-        formItemProps: (field) => {
-          return {
-            key: `${field.index}fedtax`,
-            valuePropName: "checked",
-            initialValue: true,
-            name: [field.name, "applicable_taxes", "federal"],
-          };
-        },
-        formInput: (record, index) => <Switch disabled={disabled} />,
-      },
+      //   formItemProps: (field) => {
+      //     return {
+      //       key: `${field.index}fedtax`,
+      //       valuePropName: "checked",
+      //       //  initialValue: true,
+      //       name: [field.name, "applicable_taxes", "federal"],
+      //     };
+      //   },
+      //   formInput: (record, index) => <Switch disabled={disabled} />,
+      // },
       {
         title: t("billlines.fields.state_tax_applicable"),
         dataIndex: "applicable_taxes.state",
@@ -486,20 +535,20 @@ export function BillEnterModalLinesComponent({
         },
         formInput: (record, index) => <Switch disabled={disabled} />,
       },
-      {
-        title: t("billlines.fields.local_tax_applicable"),
-        dataIndex: "applicable_taxes.local",
-        editable: true,
+      // {
+      //   title: t("billlines.fields.local_tax_applicable"),
+      //   dataIndex: "applicable_taxes.local",
+      //   editable: true,
 
-        formItemProps: (field) => {
-          return {
-            key: `${field.index}localtax`,
-            valuePropName: "checked",
-            name: [field.name, "applicable_taxes", "local"],
-          };
-        },
-        formInput: (record, index) => <Switch disabled={disabled} />,
-      },
+      //   formItemProps: (field) => {
+      //     return {
+      //       key: `${field.index}localtax`,
+      //       valuePropName: "checked",
+      //       name: [field.name, "applicable_taxes", "local"],
+      //     };
+      //   },
+      //   formInput: (record, index) => <Switch disabled={disabled} />,
+      // },
       {
         title: t("general.labels.actions"),
 

client/src/components/bill-form/bill-form.totals.utility.js

@@ -19,14 +19,14 @@ export const CalculateBillTotal = (invoice) => {
       }).multiply(i.quantity || 1);
 
       subtotal = subtotal.add(itemTotal);
-      if (i.applicable_taxes.federal) {
+      if (i.applicable_taxes?.federal) {
         federalTax = federalTax.add(
           itemTotal.percentage(federal_tax_rate || 0)
         );
       }
-      if (i.applicable_taxes.state)
+      if (i.applicable_taxes?.state)
         stateTax = stateTax.add(itemTotal.percentage(state_tax_rate || 0));
-      if (i.applicable_taxes.local)
+      if (i.applicable_taxes?.local)
         localTax = localTax.add(itemTotal.percentage(local_tax_rate || 0));
     }
   });

client/src/components/bill-line-search-select/bill-line-search-select.component.jsx

@@ -63,6 +63,12 @@ const BillLineSearchSelect = (
                   item.oem_partno ? ` - ${item.oem_partno}` : ""
                 }${item.alt_partno ? ` (${item.alt_partno})` : ""}`.trim()}
               </span>
+              {item.act_price === 0 && item.mod_lb_hrs > 0 && (
+                <span style={{ float: "right", paddingleft: "1rem" }}>
+                  {`${item.mod_lb_hrs} units`}
+                </span>
+              )}
+
               <span style={{ float: "right", paddingleft: "1rem" }}>
                 {item.act_price
                   ? `$${item.act_price && item.act_price.toFixed(2)}`

client/src/components/breadcrumbs/breadcrumbs.component.jsx

@@ -7,7 +7,9 @@ import { createStructuredSelector } from "reselect";
 import { selectBreadcrumbs } from "../../redux/application/application.selectors";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import GlobalSearch from "../global-search/global-search.component";
+import GlobalSearchOs from "../global-search/global-search-os.component";
 import "./breadcrumbs.styles.scss";
+import { useTreatments } from "@splitsoftware/splitio-react";
 
 const mapStateToProps = createStructuredSelector({
   breadcrumbs: selectBreadcrumbs,
@@ -15,6 +17,12 @@ const mapStateToProps = createStructuredSelector({
 });
 
 export function BreadCrumbs({ breadcrumbs, bodyshop }) {
+  const { OpenSearch } = useTreatments(
+    ["OpenSearch"],
+    {},
+    bodyshop && bodyshop.imexshopid
+  );
+
   return (
     <Row className="breadcrumb-container">
       <Col xs={24} sm={24} md={16}>
@@ -38,7 +46,7 @@ export function BreadCrumbs({ breadcrumbs, bodyshop }) {
         </Breadcrumb>
       </Col>
       <Col xs={24} sm={24} md={8}>
-        <GlobalSearch />
+        {OpenSearch.treatment === "on" ? <GlobalSearchOs /> : <GlobalSearch />}
       </Col>
     </Row>
   );

client/src/components/ca-bc-pvrt-calculator/ca-bc-pvrt-calculator.component.jsx

@@ -10,7 +10,10 @@ export default function CABCpvrtCalculator({ disabled, form }) {
 
   const handleFinish = async (values) => {
     logImEXEvent("job_ca_bc_pvrt_calculate");
-    form.setFieldsValue({ ca_bc_pvrt: ((values.rate||0) * (values.days||0)).toFixed(2) });
+    form.setFieldsValue({
+      ca_bc_pvrt: ((values.rate || 0) * (values.days || 0)).toFixed(2),
+    });
+    form.setFields([{ name: "ca_bc_pvrt", touched: true }]);
     setVisibility(false);
   };
 

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

@@ -0,0 +1,374 @@
+import { DeleteFilled } from "@ant-design/icons";
+import { useLazyQuery, useMutation } from "@apollo/client";
+import {
+  Button,
+  Card,
+  Col,
+  Form,
+  Input,
+  Row,
+  Space,
+  Spin,
+  Statistic,
+  notification,
+} from "antd";
+import axios from "axios";
+import moment from "moment";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import {
+  INSERT_PAYMENT_RESPONSE,
+  QUERY_RO_AND_OWNER_BY_JOB_PKS,
+} from "../../graphql/payment_response.queries";
+import { INSERT_NEW_PAYMENT } from "../../graphql/payments.queries";
+import { insertAuditTrail } from "../../redux/application/application.actions";
+import { toggleModalVisible } from "../../redux/modals/modals.actions";
+import { selectCardPayment } from "../../redux/modals/modals.selectors";
+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";
+
+const mapStateToProps = createStructuredSelector({
+  cardPaymentModal: selectCardPayment,
+  bodyshop: selectBodyshop,
+});
+
+const mapDispatchToProps = (dispatch) => ({
+  insertAuditTrail: ({ jobid, operation }) =>
+    dispatch(insertAuditTrail({ jobid, operation })),
+  toggleModalVisible: () => dispatch(toggleModalVisible("cardPayment")),
+});
+
+const CardPaymentModalComponent = ({
+  bodyshop,
+  cardPaymentModal,
+  toggleModalVisible,
+  insertAuditTrail,
+}) => {
+  const { context } = cardPaymentModal;
+
+  const [form] = Form.useForm();
+
+  const [loading, setLoading] = useState(false);
+  const [insertPayment] = useMutation(INSERT_NEW_PAYMENT);
+  const [insertPaymentResponse] = useMutation(INSERT_PAYMENT_RESPONSE);
+  const { t } = useTranslation();
+
+  const [, { data, refetch, queryLoading }] = useLazyQuery(
+    QUERY_RO_AND_OWNER_BY_JOB_PKS,
+    {
+      variables: { jobids: [context.jobid] },
+      skip: true,
+    }
+  );
+
+  console.log("🚀 ~ file: card-payment-modal.component..jsx:61 ~ data:", data);
+  //Initialize the intellipay window.
+  const SetIntellipayCallbackFunctions = () => {
+    console.log("*** Set IntelliPay callback functions.");
+    window.intellipay.runOnClose(() => {
+      //window.intellipay.initialize();
+    });
+
+    window.intellipay.runOnApproval(async function (response) {
+      console.warn("*** Running On Approval Script ***");
+      form.setFieldValue("paymentResponse", response);
+      form.submit();
+    });
+
+    window.intellipay.runOnNonApproval(async function (response) {
+      // Mutate unsuccessful payment
+
+      const { payments } = form.getFieldsValue();
+
+      await insertPaymentResponse({
+        variables: {
+          paymentResponse: payments.map((payment) => ({
+            amount: payment.amount,
+            bodyshopid: bodyshop.id,
+            jobid: payment.jobid,
+            declinereason: response.declinereason,
+            ext_paymentid: response.paymentid.toString(),
+            successful: false,
+            response,
+          })),
+        },
+      });
+
+      payments.forEach((payment) =>
+        insertAuditTrail({
+          jobid: payment.jobid,
+          operation: AuditTrailMapping.failedpayment(),
+        })
+      );
+    });
+  };
+
+  const handleFinish = async (values) => {
+    try {
+      await insertPayment({
+        variables: {
+          paymentInput: values.payments.map((payment) => ({
+            amount: payment.amount,
+            transactionid: (values.paymentResponse.paymentid || "").toString(),
+            payer: t("payments.labels.customer"),
+            type: values.paymentResponse.cardbrand,
+            jobid: payment.jobid,
+            date: moment(Date.now()),
+            payment_responses: {
+              data: [
+                {
+                  amount: payment.amount,
+                  bodyshopid: bodyshop.id,
+
+                  jobid: payment.jobid,
+                  declinereason: values.paymentResponse.declinereason,
+                  ext_paymentid: values.paymentResponse.paymentid.toString(),
+                  successful: true,
+                  response: values.paymentResponse,
+                },
+              ],
+            },
+          })),
+        },
+        refetchQueries: ["GET_JOB_BY_PK"],
+      });
+      toggleModalVisible();
+    } catch (error) {
+      console.error(error);
+      notification.open({
+        type: "error",
+        message: t("payments.errors.inserting", { error: error.message }),
+      });
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const handleIntelliPayCharge = async () => {
+    setLoading(true);
+
+    //Validate
+    try {
+      await form.validateFields();
+    } catch (error) {
+      setLoading(false);
+      return;
+    }
+
+    try {
+      const response = await axios.post("/intellipay/lightbox_credentials", {
+        bodyshop,
+        refresh: !!window.intellipay,
+      });
+
+      if (window.intellipay) {
+        // eslint-disable-next-line no-eval
+        eval(response.data);
+        SetIntellipayCallbackFunctions();
+        window.intellipay.autoOpen();
+      } else {
+        var rg = document.createRange();
+        let node = rg.createContextualFragment(response.data);
+        document.documentElement.appendChild(node);
+        SetIntellipayCallbackFunctions();
+        window.intellipay.isAutoOpen = true;
+        window.intellipay.initialize();
+      }
+    } catch (error) {
+      notification.open({
+        type: "error",
+        message: t("job_payments.notifications.error.openingip"),
+      });
+      setLoading(false);
+    }
+  };
+
+  return (
+    <Card title="Card Payment">
+      <Spin spinning={loading}>
+        <Form
+          onFinish={handleFinish}
+          form={form}
+          layout="vertical"
+          initialValues={{
+            payments: context.jobid ? [{ jobid: context.jobid }] : [],
+          }}
+        >
+          <Form.List name={["payments"]}>
+            {(fields, { add, remove, move }) => {
+              return (
+                <div>
+                  {fields.map((field, index) => (
+                    <Form.Item key={field.key}>
+                      <Row gutter={[16, 16]}>
+                        <Col span={16}>
+                          <Form.Item
+                            key={`${index}jobid`}
+                            label={t("jobs.fields.ro_number")}
+                            name={[field.name, "jobid"]}
+                            rules={[
+                              {
+                                required: true,
+                                //message: t("general.validation.required"),
+                              },
+                            ]}
+                          >
+                            <JobSearchSelectComponent
+                              notExported={false}
+                              clm_no
+                            />
+                          </Form.Item>
+                        </Col>
+                        <Col span={6}>
+                          <Form.Item
+                            key={`${index}amount`}
+                            label={t("payments.fields.amount")}
+                            name={[field.name, "amount"]}
+                            rules={[
+                              {
+                                required: true,
+                                //message: t("general.validation.required"),
+                              },
+                            ]}
+                          >
+                            <CurrencyFormItemComponent />
+                          </Form.Item>
+                        </Col>
+                        <Col span={2}>
+                          <DeleteFilled
+                            style={{ margin: "1rem" }}
+                            onClick={() => {
+                              remove(field.name);
+                            }}
+                          />
+                        </Col>
+                      </Row>
+                    </Form.Item>
+                  ))}
+                  <Form.Item>
+                    <Button
+                      type="dashed"
+                      onClick={() => {
+                        add();
+                      }}
+                      style={{ width: "100%" }}
+                    >
+                      {t("general.actions.add")}
+                    </Button>
+                  </Form.Item>
+                </div>
+              );
+            }}
+          </Form.List>
+
+          <Form.Item
+            shouldUpdate={(prevValues, curValues) =>
+              prevValues.payments?.map((p) => p?.jobid).join() !==
+              curValues.payments?.map((p) => p?.jobid).join()
+            }
+          >
+            {() => {
+              console.log("Updating the owner info section.");
+              //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
+              ) {
+                console.log("**Calling refetch.");
+                refetch({ jobids: payments.map((p) => p.jobid) });
+              }
+              console.log(
+                "Acc info",
+                data,
+                payments && data && data.jobs.length > 0
+                  ? data.jobs.map((j) => j.ro_number).join(", ")
+                  : null
+              );
+              return (
+                <>
+                  <Input
+                    className="ipayfield"
+                    data-ipayname="account"
+                    //type="hidden"
+                    value={
+                      payments && data && data.jobs.length > 0
+                        ? data.jobs.map((j) => j.ro_number).join(", ")
+                        : null
+                    }
+                    hidden
+                  />
+                  <Input
+                    className="ipayfield"
+                    data-ipayname="email"
+                    // type="hidden"
+                    value={
+                      payments && data && data.jobs.length > 0
+                        ? data.jobs.filter((j) => j.ownr_ea)[0]?.ownr_ea
+                        : null
+                    }
+                    hidden
+                  />
+                </>
+              );
+            }}
+          </Form.Item>
+          <Form.Item
+            shouldUpdate={(prevValues, curValues) =>
+              prevValues.payments?.map((p) => p?.amount).join() !==
+              curValues.payments?.map((p) => p?.amount).join()
+            }
+          >
+            {() => {
+              const { payments } = form.getFieldsValue();
+              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}
+                  />
+                  <Input
+                    className="ipayfield"
+                    data-ipayname="amount"
+                    //type="hidden"
+                    value={totalAmountToCharge?.toFixed(2)}
+                    hidden
+                  />
+                  <Button
+                    type="primary"
+                    //  data-ipayname="submit"
+                    className="ipayfield"
+                    loading={queryLoading || loading}
+                    disabled={!(totalAmountToCharge > 0)}
+                    onClick={handleIntelliPayCharge}
+                  >
+                    {t("job_payments.buttons.proceedtopayment")}
+                  </Button>
+                </Space>
+              );
+            }}
+          </Form.Item>
+
+          {/* Lightbox payment response when it is completed */}
+          <Form.Item name="paymentResponse" hidden>
+            <Input type="hidden" />
+          </Form.Item>
+        </Form>
+      </Spin>
+    </Card>
+  );
+};
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(CardPaymentModalComponent);

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

@@ -0,0 +1,57 @@
+import { Button, Modal } from "antd";
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { toggleModalVisible } from "../../redux/modals/modals.actions";
+import { selectCardPayment } from "../../redux/modals/modals.selectors";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import CardPaymentModalComponent from "./card-payment-modal.component.";
+
+const mapStateToProps = createStructuredSelector({
+  cardPaymentModal: selectCardPayment,
+  bodyshop: selectBodyshop,
+});
+
+const mapDispatchToProps = (dispatch) => ({
+  toggleModalVisible: () => dispatch(toggleModalVisible("cardPayment")),
+});
+
+function CardPaymentModalContainer({
+  cardPaymentModal,
+  toggleModalVisible,
+  bodyshop,
+}) {
+  const { visible } = cardPaymentModal;
+  const { t } = useTranslation();
+
+  const handleCancel = () => {
+    toggleModalVisible();
+  };
+
+  const handleOK = () => {
+    toggleModalVisible();
+  };
+
+  return (
+    <Modal
+      open={visible}
+      onOk={handleOK}
+      onCancel={handleCancel}
+      footer={[
+        <Button key="back" onClick={handleCancel}>
+          {t("job_payments.buttons.goback")}
+        </Button>,
+      ]}
+      width="80%"
+      destroyOnClose
+    >
+      <CardPaymentModalComponent />
+    </Modal>
+  );
+}
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(CardPaymentModalContainer);

client/src/components/chat-conversation-list/chat-conversation-list.component.jsx

@@ -1,12 +1,19 @@
 import { Badge, List, Tag } from "antd";
 import React from "react";
 import { connect } from "react-redux";
+import {
+  AutoSizer,
+  CellMeasurer,
+  CellMeasurerCache,
+  List as VirtualizedList,
+} from "react-virtualized";
 import { createStructuredSelector } from "reselect";
 import { setSelectedConversation } from "../../redux/messaging/messaging.actions";
 import { selectSelectedConversation } from "../../redux/messaging/messaging.selectors";
 import { TimeAgoFormatter } from "../../utils/DateFormatter";
 import PhoneFormatter from "../../utils/PhoneFormatter";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+
 import "./chat-conversation-list.styles.scss";
 
 const mapStateToProps = createStructuredSelector({
@@ -18,59 +25,95 @@ const mapDispatchToProps = (dispatch) => ({
     dispatch(setSelectedConversation(conversationId)),
 });
 
-export function ChatConversationListComponent({
+function ChatConversationListComponent({
   conversationList,
   selectedConversation,
   setSelectedConversation,
+  loadMoreConversations,
 }) {
+  const cache = new CellMeasurerCache({
+    fixedWidth: true,
+    defaultHeight: 60,
+  });
+
+  const rowRenderer = ({ index, key, style, parent }) => {
+    const item = conversationList[index];
+
+    return (
+      <CellMeasurer
+        key={key}
+        cache={cache}
+        parent={parent}
+        columnIndex={0}
+        rowIndex={index}
+      >
+        <List.Item
+          onClick={() => setSelectedConversation(item.id)}
+          className={`chat-list-item ${
+            item.id === selectedConversation
+              ? "chat-list-selected-conversation"
+              : null
+          }`}
+          style={style}
+        >
+          <div
+            style={{
+              display: "inline-block",
+            }}
+          >
+            {item.label && <div className="chat-name">{item.label}</div>}
+            {item.job_conversations.length > 0 ? (
+              <div className="chat-name">
+                {item.job_conversations.map((j, idx) => (
+                  <div key={idx}>
+                    <OwnerNameDisplay ownerObject={j.job} />
+                  </div>
+                ))}
+              </div>
+            ) : (
+              <PhoneFormatter>{item.phone_num}</PhoneFormatter>
+            )}
+          </div>
+          <div style={{ display: "inline-block" }}>
+            <div>
+              {item.job_conversations.length > 0
+                ? item.job_conversations.map((j, idx) => (
+                    <Tag key={idx} className="ro-number-tag">
+                      {j.job.ro_number}
+                    </Tag>
+                  ))
+                : null}
+            </div>
+            <TimeAgoFormatter>{item.updated_at}</TimeAgoFormatter>
+          </div>
+          <Badge count={item.messages_aggregate.aggregate.count || 0} />
+        </List.Item>
+      </CellMeasurer>
+    );
+  };
+
   return (
     <div className="chat-list-container">
-      <List
-        bordered
-        dataSource={conversationList}
-        renderItem={(item) => (
-          <List.Item
-            key={item.id}
-            onClick={() => setSelectedConversation(item.id)}
-            className={`chat-list-item ${
-              item.id === selectedConversation
-                ? "chat-list-selected-conversation"
-                : null
-            }`}
-          >
-            <div sryle={{ display: "inline-block" }}>
-              {item.label && <div className="chat-name">{item.label}</div>}
-              {item.job_conversations.length > 0 ? (
-                <div className="chat-name">
-                  {item.job_conversations.map((j, idx) => (
-                    <div key={idx}>
-                      <OwnerNameDisplay ownerObject={j.job} />
-                    </div>
-                  ))}
-                </div>
-              ) : (
-                <PhoneFormatter>{item.phone_num}</PhoneFormatter>
-              )}
-            </div>
-            <div sryle={{ display: "inline-block" }}>
-              <div>
-                {item.job_conversations.length > 0
-                  ? item.job_conversations.map((j, idx) => (
-                      <Tag key={idx} className="ro-number-tag">
-                        {j.job.ro_number}
-                      </Tag>
-                    ))
-                  : null}
-              </div>
-              <TimeAgoFormatter>{item.updated_at}</TimeAgoFormatter>
-            </div>
-            <Badge count={item.messages_aggregate.aggregate.count || 0} />
-          </List.Item>
+      <AutoSizer>
+        {({ height, width }) => (
+          <VirtualizedList
+            height={height}
+            width={width}
+            rowCount={conversationList.length}
+            rowHeight={cache.rowHeight}
+            rowRenderer={rowRenderer}
+            onScroll={({ scrollTop, scrollHeight, clientHeight }) => {
+              if (scrollTop + clientHeight === scrollHeight) {
+                loadMoreConversations();
+              }
+            }}
+          />
         )}
-      />
+      </AutoSizer>
     </div>
   );
 }
+
 export default connect(
   mapStateToProps,
   mapDispatchToProps

client/src/components/chat-conversation-list/chat-conversation-list.styles.scss

@@ -3,8 +3,9 @@
 }
 .chat-list-container {
   flex: 1;
-  overflow: auto;
+  overflow: hidden;
   height: 100%;
+  border: 1px solid gainsboro;
 }
 
 .chat-list-item {
@@ -21,4 +22,6 @@
   .ro-number-tag {
     align-self: baseline;
   }
+  padding: 12px 24px;
+  border-bottom: 1px solid gainsboro;
 }

client/src/components/chat-conversation/chat-conversation.container.jsx

@@ -42,6 +42,7 @@ export function ChatConversationContainer({ bodyshop, selectedConversation }) {
     MARK_MESSAGES_AS_READ_BY_CONVERSATION,
     {
       variables: { conversationId: selectedConversation },
+      refetchQueries: ["UNREAD_CONVERSATION_COUNT"],
       update(cache) {
         cache.modify({
           id: cache.identify({

client/src/components/chat-open-button/chat-open-button.component.jsx

@@ -8,15 +8,23 @@ import PhoneNumberFormatter from "../../utils/PhoneFormatter";
 
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import { searchingForConversation } from "../../redux/messaging/messaging.selectors";
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
+  searchingForConversation: searchingForConversation,
 });
 
 const mapDispatchToProps = (dispatch) => ({
   openChatByPhone: (phone) => dispatch(openChatByPhone(phone)),
 });
 
-export function ChatOpenButton({ bodyshop, phone, jobid, openChatByPhone }) {
+export function ChatOpenButton({
+  bodyshop,
+  searchingForConversation,
+  phone,
+  jobid,
+  openChatByPhone,
+}) {
   const { t } = useTranslation();
   if (!phone) return <></>;
 
@@ -29,7 +37,7 @@ export function ChatOpenButton({ bodyshop, phone, jobid, openChatByPhone }) {
       onClick={(e) => {
         e.stopPropagation();
         const p = parsePhoneNumber(phone, "CA");
-
+        if (searchingForConversation) return; //This is to prevent finding the same thing twice.
         if (p && p.isValid()) {
           openChatByPhone({ phone_num: p.formatInternational(), jobid: jobid });
         } else {

client/src/components/chat-popup/chat-popup.component.jsx

@@ -4,13 +4,16 @@ import {
   ShrinkOutlined,
   SyncOutlined,
 } from "@ant-design/icons";
-import { useQuery } from "@apollo/client";
+import { useLazyQuery, useQuery } from "@apollo/client";
 import { Badge, Card, Col, Row, Space, Tag, Tooltip, Typography } from "antd";
-import React, { useEffect, useState } from "react";
+import React, { useCallback, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
-import { CONVERSATION_LIST_QUERY } from "../../graphql/conversations.queries";
+import {
+  CONVERSATION_LIST_QUERY,
+  UNREAD_CONVERSATION_COUNT,
+} from "../../graphql/conversations.queries";
 import { toggleChatVisible } from "../../redux/messaging/messaging.actions";
 import {
   selectChatVisible,
@@ -37,12 +40,21 @@ export function ChatPopupComponent({
 }) {
   const { t } = useTranslation();
   const [pollInterval, setpollInterval] = useState(0);
-  const { loading, data, refetch, called } = useQuery(CONVERSATION_LIST_QUERY, {
+
+  const { data: unreadData } = useQuery(UNREAD_CONVERSATION_COUNT, {
     fetchPolicy: "network-only",
     nextFetchPolicy: "network-only",
     ...(pollInterval > 0 ? { pollInterval } : {}),
   });
 
+  const [getConversations, { loading, data, refetch, fetchMore }] =
+    useLazyQuery(CONVERSATION_LIST_QUERY, {
+      fetchPolicy: "network-only",
+      nextFetchPolicy: "network-only",
+      skip: !chatVisible,
+      ...(pollInterval > 0 ? { pollInterval } : {}),
+    });
+
   const fcmToken = sessionStorage.getItem("fcmtoken");
 
   useEffect(() => {
@@ -54,15 +66,24 @@ export function ChatPopupComponent({
   }, [fcmToken]);
 
   useEffect(() => {
-    if (called && chatVisible) refetch();
-  }, [chatVisible, called, refetch]);
+    if (chatVisible)
+      getConversations({
+        variables: {
+          offset: 0,
+        },
+      });
+  }, [chatVisible, getConversations]);
 
-  const unreadCount = data
-    ? data.conversations.reduce(
-        (acc, val) => val.messages_aggregate.aggregate.count + acc,
-        0
-      )
-    : 0;
+  const loadMoreConversations = useCallback(() => {
+    if (data)
+      fetchMore({
+        variables: {
+          offset: data.conversations.length,
+        },
+      });
+  }, [data, fetchMore]);
+
+  const unreadCount = unreadData?.messages_aggregate.aggregate.count || 0;
 
   return (
     <Badge count={unreadCount}>
@@ -97,6 +118,7 @@ export function ChatPopupComponent({
                 ) : (
                   <ChatConversationListComponent
                     conversationList={data ? data.conversations : []}
+                    loadMoreConversations={loadMoreConversations}
                   />
                 )}
               </Col>

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

@@ -59,6 +59,14 @@ export default function ContractsCarsComponent({
       sortOrder:
         state.sortedInfo.columnKey === "model" && state.sortedInfo.order,
     },
+    {
+      title: t("courtesycars.fields.color"),
+      dataIndex: "color",
+      key: "color",
+      sorter: (a, b) => alphaSort(a.color, b.color),
+      sortOrder:
+        state.sortedInfo.columnKey === "color" && state.sortedInfo.order,
+    },
     {
       title: t("courtesycars.fields.plate"),
       dataIndex: "plate",
@@ -93,6 +101,9 @@ export default function ContractsCarsComponent({
             (cc.model || "")
               .toLowerCase()
               .includes(state.search.toLowerCase()) ||
+            (cc.color || "")
+              .toLowerCase()
+              .includes(state.search.toLowerCase()) ||
             (cc.plate || "").toLowerCase().includes(state.search.toLowerCase())
         );
 

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

@@ -4,7 +4,7 @@ import moment from "moment";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import { DateFormatter } from "../../utils/DateFormatter";
-import ContractLicenseDecodeButton from "../contract-license-decode-button/contract-license-decode-button.component";
+//import ContractLicenseDecodeButton from "../contract-license-decode-button/contract-license-decode-button.component";
 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";
@@ -165,7 +165,9 @@ export default function ContractFormComponent({
               />
             </div>
           )}
-          <ContractLicenseDecodeButton form={form} />
+          {
+            //<ContractLicenseDecodeButton form={form} />
+          }
         </Space>
       </div>
       <LayoutFormRow header={t("contracts.labels.driverinformation")}>

client/src/components/courtesy-cars-list/courtesy-cars-list.component.jsx

@@ -9,15 +9,15 @@ import {
   Table,
   Tooltip,
 } from "antd";
+import moment from "moment";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Link } from "react-router-dom";
 import { DateTimeFormatter } from "../../utils/DateFormatter";
-import { alphaSort } from "../../utils/sorters";
-import { OwnerNameDisplayFunction } from "../owner-name-display/owner-name-display.component";
-import moment from "moment";
 import { GenerateDocument } from "../../utils/RenderTemplate";
 import { TemplateList } from "../../utils/TemplateConstants";
+import { alphaSort } from "../../utils/sorters";
+import { OwnerNameDisplayFunction } from "../owner-name-display/owner-name-display.component";
 export default function CourtesyCarsList({ loading, courtesycars, refetch }) {
   const [state, setState] = useState({
     sortedInfo: {},
@@ -115,6 +115,14 @@ export default function CourtesyCarsList({ loading, courtesycars, refetch }) {
       sortOrder:
         state.sortedInfo.columnKey === "model" && state.sortedInfo.order,
     },
+    {
+      title: t("courtesycars.fields.color"),
+      dataIndex: "color",
+      key: "color",
+      sorter: (a, b) => alphaSort(a.color, b.color),
+      sortOrder:
+        state.sortedInfo.columnKey === "color" && state.sortedInfo.order,
+    },
     {
       title: t("courtesycars.fields.plate"),
       dataIndex: "plate",

client/src/components/dashboard-components/scheduled-in-today/scheduled-in-today.component.jsx

@@ -0,0 +1,244 @@
+import {
+  BranchesOutlined,
+  ExclamationCircleFilled,
+  PauseCircleOutlined,
+} from "@ant-design/icons";
+import { Card, Space, Table, Tooltip } from "antd";
+import moment from "moment";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Link } from "react-router-dom";
+import ChatOpenButton from "../../chat-open-button/chat-open-button.component";
+import OwnerNameDisplay from "../../owner-name-display/owner-name-display.component";
+import DashboardRefreshRequired from "../refresh-required.component";
+
+export default function DashboardScheduledInToday({ data, ...cardProps }) {
+  const { t } = useTranslation();
+  const [state, setState] = useState({
+    sortedInfo: {},
+  });
+  if (!data) return null;
+  if (!data.scheduled_in_today)
+    return <DashboardRefreshRequired {...cardProps} />;
+
+  const appt = []; // Flatten Data
+  data.scheduled_in_today.forEach((item) => {
+    if (item.job) {
+      var i = {
+        canceled: item.canceled,
+        id: item.id,
+        alt_transport: item.job.alt_transport,
+        clm_no: item.job.clm_no,
+        jobid: item.job.jobid,
+        ins_co_nm: item.job.ins_co_nm,
+        iouparent: item.job.iouparent,
+        ownerid: item.job.ownerid,
+        ownr_co_nm: item.job.ownr_co_nm,
+        ownr_ea: item.job.ownr_ea,
+        ownr_fn: item.job.ownr_fn,
+        ownr_ln: item.job.ownr_ln,
+        ownr_ph1: item.job.ownr_ph1,
+        ownr_ph2: item.job.ownr_ph2,
+        production_vars: item.job.production_vars,
+        ro_number: item.job.ro_number,
+        suspended: item.job.suspended,
+        v_make_desc: item.job.v_make_desc,
+        v_model_desc: item.job.v_model_desc,
+        v_model_yr: item.job.v_model_yr,
+        v_vin: item.job.v_vin,
+        vehicleid: item.job.vehicleid,
+        note: item.note,
+        start: moment(item.start).format("hh:mm a"),
+        title: item.title,
+      };
+      appt.push(i);
+    }
+  });
+  appt.sort(function (a, b) {
+    return new moment(a.start) - new moment(b.start);
+  });
+
+  const columns = [
+    {
+      title: t("jobs.fields.ro_number"),
+      dataIndex: "ro_number",
+      key: "ro_number",
+      render: (text, record) => (
+        <Link
+          to={"/manage/jobs/" + record.jobid}
+          onClick={(e) => e.stopPropagation()}
+        >
+          <Space>
+            {record.ro_number || t("general.labels.na")}
+            {record.production_vars && record.production_vars.alert ? (
+              <ExclamationCircleFilled className="production-alert" />
+            ) : null}
+            {record.suspended && (
+              <PauseCircleOutlined style={{ color: "orangered" }} />
+            )}
+            {record.iouparent && (
+              <Tooltip title={t("jobs.labels.iou")}>
+                <BranchesOutlined style={{ color: "orangered" }} />
+              </Tooltip>
+            )}
+          </Space>
+        </Link>
+      ),
+    },
+    {
+      title: t("jobs.fields.owner"),
+      dataIndex: "owner",
+      key: "owner",
+      ellipsis: true,
+      responsive: ["md"],
+      render: (text, record) => {
+        return record.ownerid ? (
+          <Link
+            to={"/manage/owners/" + record.ownerid}
+            onClick={(e) => e.stopPropagation()}
+          >
+            <OwnerNameDisplay ownerObject={record} />
+          </Link>
+        ) : (
+          <span>
+            <OwnerNameDisplay ownerObject={record} />
+          </span>
+        );
+      },
+    },
+    {
+      title: t("jobs.fields.ownr_ph1"),
+      dataIndex: "ownr_ph1",
+      key: "ownr_ph1",
+      ellipsis: true,
+      responsive: ["md"],
+      render: (text, record) => (
+        <ChatOpenButton phone={record.ownr_ph1} jobid={record.jobid} />
+      ),
+    },
+    {
+      title: t("jobs.fields.ownr_ph2"),
+      dataIndex: "ownr_ph2",
+      key: "ownr_ph2",
+      ellipsis: true,
+      responsive: ["md"],
+      render: (text, record) => (
+        <ChatOpenButton phone={record.ownr_ph2} jobid={record.jobid} />
+      ),
+    },
+    {
+      title: t("jobs.fields.ownr_ea"),
+      dataIndex: "ownr_ea",
+      key: "ownr_ea",
+      ellipsis: true,
+      responsive: ["md"],
+      render: (text, record) => (
+        <ChatOpenButton phone={record.ownr_ea} jobid={record.jobid} />
+      ),
+    },
+    {
+      title: t("jobs.fields.vehicle"),
+      dataIndex: "vehicle",
+      key: "vehicle",
+      ellipsis: true,
+      render: (text, record) => {
+        return record.vehicleid ? (
+          <Link
+            to={"/manage/vehicles/" + record.vehicleid}
+            onClick={(e) => e.stopPropagation()}
+          >
+            {`${record.v_model_yr || ""} ${record.v_make_desc || ""} ${
+              record.v_model_desc || ""
+            }`}
+          </Link>
+        ) : (
+          <span>{`${record.v_model_yr || ""} ${record.v_make_desc || ""} ${
+            record.v_model_desc || ""
+          }`}</span>
+        );
+      },
+    },
+    {
+      title: t("jobs.fields.ins_co_nm"),
+      dataIndex: "ins_co_nm",
+      key: "ins_co_nm",
+      ellipsis: true,
+      responsive: ["md"],
+    },
+    {
+      title: t("appointments.fields.time"),
+      dataIndex: "start",
+      key: "start",
+      ellipsis: true,
+      responsive: ["md"],
+    },
+    {
+      title: t("appointments.fields.alt_transport"),
+      dataIndex: "alt_transport",
+      key: "alt_transport",
+      ellipsis: true,
+      responsive: ["md"],
+    },
+  ];
+
+  const handleTableChange = (sorter) => {
+    setState({ ...state, sortedInfo: sorter });
+  };
+
+  return (
+    <Card
+      title={t("dashboard.titles.scheduledintoday", {
+        date: moment().startOf("day").format("MM/DD/YYYY"),
+      })}
+      {...cardProps}
+    >
+      <div style={{ height: "100%" }}>
+        <Table
+          onChange={handleTableChange}
+          pagination={{ position: "top", defaultPageSize: 50 }}
+          columns={columns}
+          scroll={{ x: true, y: "calc(100% - 2em)" }}
+          rowKey="id"
+          style={{ height: "85%" }}
+          dataSource={appt}
+        />
+      </div>
+    </Card>
+  );
+}
+
+export const DashboardScheduledInTodayGql = `
+  scheduled_in_today: appointments(where: {start: {_gte: "${moment()
+    .startOf("day")
+    .toISOString()}", _lte: "${moment()
+  .endOf("day")
+  .toISOString()}"}, canceled: {_eq: false}, block: {_neq: true}}) {
+    canceled
+    id
+    job {
+      alt_transport
+      clm_no
+      jobid: id
+      ins_co_nm
+      iouparent
+      ownerid
+      ownr_co_nm
+      ownr_ea
+      ownr_fn
+      ownr_ln
+      ownr_ph1
+      ownr_ph2
+      production_vars
+      ro_number
+      suspended
+      v_make_desc
+      v_model_desc
+      v_model_yr
+      v_vin
+      vehicleid
+    }
+    note
+    start
+    title
+  }
+`;

client/src/components/dashboard-components/scheduled-out-today/scheduled-out-today.component.jsx

@@ -0,0 +1,210 @@
+import {
+  BranchesOutlined,
+  ExclamationCircleFilled,
+  PauseCircleOutlined,
+} from "@ant-design/icons";
+import { Card, Space, Table, Tooltip } from "antd";
+import moment from "moment";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Link } from "react-router-dom";
+import ChatOpenButton from "../../chat-open-button/chat-open-button.component";
+import OwnerNameDisplay from "../../owner-name-display/owner-name-display.component";
+import DashboardRefreshRequired from "../refresh-required.component";
+
+export default function DashboardScheduledOutToday({ data, ...cardProps }) {
+  const { t } = useTranslation();
+  const [state, setState] = useState({
+    sortedInfo: {},
+  });
+  if (!data) return null;
+  if (!data.scheduled_out_today)
+    return <DashboardRefreshRequired {...cardProps} />;
+
+  data.scheduled_out_today.forEach((item) => {
+    item.scheduled_completion= moment(item.scheduled_completion).format("hh:mm a")
+  });
+  data.scheduled_out_today.sort(function (a, b) {
+    return new Date(a.scheduled_completion) - new Date(b.scheduled_completion);
+  });
+
+  const columns = [
+    {
+      title: t("jobs.fields.ro_number"),
+      dataIndex: "ro_number",
+      key: "ro_number",
+      render: (text, record) => (
+        <Link
+          to={"/manage/jobs/" + record.jobid}
+          onClick={(e) => e.stopPropagation()}
+        >
+          <Space>
+            {record.ro_number || t("general.labels.na")}
+            {record.production_vars && record.production_vars.alert ? (
+              <ExclamationCircleFilled className="production-alert" />
+            ) : null}
+            {record.suspended && (
+              <PauseCircleOutlined style={{ color: "orangered" }} />
+            )}
+            {record.iouparent && (
+              <Tooltip title={t("jobs.labels.iou")}>
+                <BranchesOutlined style={{ color: "orangered" }} />
+              </Tooltip>
+            )}
+          </Space>
+        </Link>
+      ),
+    },
+    {
+      title: t("jobs.fields.owner"),
+      dataIndex: "owner",
+      key: "owner",
+      ellipsis: true,
+      responsive: ["md"],
+      render: (text, record) => {
+        return record.ownerid ? (
+          <Link
+            to={"/manage/owners/" + record.ownerid}
+            onClick={(e) => e.stopPropagation()}
+          >
+            <OwnerNameDisplay ownerObject={record} />
+          </Link>
+        ) : (
+          <span>
+            <OwnerNameDisplay ownerObject={record} />
+          </span>
+        );
+      },
+    },
+    {
+      title: t("jobs.fields.ownr_ph1"),
+      dataIndex: "ownr_ph1",
+      key: "ownr_ph1",
+      ellipsis: true,
+      responsive: ["md"],
+      render: (text, record) => (
+        <ChatOpenButton phone={record.ownr_ph1} jobid={record.jobid} />
+      ),
+    },
+    {
+      title: t("jobs.fields.ownr_ph2"),
+      dataIndex: "ownr_ph2",
+      key: "ownr_ph2",
+      ellipsis: true,
+      responsive: ["md"],
+      render: (text, record) => (
+        <ChatOpenButton phone={record.ownr_ph2} jobid={record.jobid} />
+      ),
+    },
+    {
+      title: t("jobs.fields.ownr_ea"),
+      dataIndex: "ownr_ea",
+      key: "ownr_ea",
+      ellipsis: true,
+      responsive: ["md"],
+      render: (text, record) => (
+        <ChatOpenButton phone={record.ownr_ea} jobid={record.jobid} />
+      ),
+    },
+    {
+      title: t("jobs.fields.vehicle"),
+      dataIndex: "vehicle",
+      key: "vehicle",
+      ellipsis: true,
+      render: (text, record) => {
+        return record.vehicleid ? (
+          <Link
+            to={"/manage/vehicles/" + record.vehicleid}
+            onClick={(e) => e.stopPropagation()}
+          >
+            {`${record.v_model_yr || ""} ${record.v_make_desc || ""} ${
+              record.v_model_desc || ""
+            }`}
+          </Link>
+        ) : (
+          <span>{`${record.v_model_yr || ""} ${record.v_make_desc || ""} ${
+            record.v_model_desc || ""
+          }`}</span>
+        );
+      },
+    },
+    {
+      title: t("jobs.fields.ins_co_nm"),
+      dataIndex: "ins_co_nm",
+      key: "ins_co_nm",
+      ellipsis: true,
+      responsive: ["md"],
+    },
+    {
+      title: t("jobs.fields.scheduled_completion"),
+      dataIndex: "scheduled_completion",
+      key: "scheduled_completion",
+      ellipsis: true,
+      responsive: ["md"],
+    },
+    {
+      title: t("appointments.fields.alt_transport"),
+      dataIndex: "alt_transport",
+      key: "alt_transport",
+      ellipsis: true,
+      responsive: ["md"],
+    },
+  ];
+
+  const handleTableChange = (sorter) => {
+    setState({ ...state, sortedInfo: sorter });
+  };
+
+  return (
+    <Card
+      title={t("dashboard.titles.scheduledouttoday", {
+        date: moment().startOf("day").format("MM/DD/YYYY"),
+      })}
+      {...cardProps}
+    >
+      <div style={{ height: "100%" }}>
+        <Table
+          onChange={handleTableChange}
+          pagination={{ position: "top", defaultPageSize: 50 }}
+          columns={columns}
+          scroll={{ x: true, y: "calc(100% - 2em)" }}
+          rowKey="id"
+          style={{ height: "85%" }}
+          dataSource={data.scheduled_out_today}
+        />
+      </div>
+    </Card>
+  );
+}
+
+export const DashboardScheduledOutTodayGql = `
+  scheduled_out_today: jobs(where: {
+    date_invoiced: {_is_null: true}, 
+    ro_number: {_is_null: false}, 
+    voided: {_eq: false}, 
+    scheduled_completion: {_gte: "${moment().startOf("day").toISOString()}", 
+    _lte: "${moment().endOf("day").toISOString()}"}}) {
+      alt_transport
+      clm_no
+      jobid: id
+      ins_co_nm
+      iouparent
+      ownerid
+      ownr_co_nm
+      ownr_ea
+      ownr_fn
+      ownr_ln
+      ownr_ph1
+      ownr_ph2
+      production_vars
+      ro_number
+      scheduled_completion
+      suspended
+      v_make_desc
+      v_model_desc
+      v_model_yr
+      v_vin
+      vehicleid
+
+  }
+`;

client/src/components/dashboard-grid/dashboard-grid.component.jsx

@@ -1,6 +1,6 @@
 import Icon, { SyncOutlined } from "@ant-design/icons";
 import { gql, useMutation, useQuery } from "@apollo/client";
-import { Button, Dropdown, Menu, notification, PageHeader, Space } from "antd";
+import { Button, Dropdown, Menu, PageHeader, Space, notification } from "antd";
 import i18next from "i18next";
 import _ from "lodash";
 import moment from "moment";
@@ -37,6 +37,12 @@ import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
 //Combination of the following:
 // /node_modules/react-grid-layout/css/styles.css
 // /node_modules/react-resizable/css/styles.css
+import DashboardScheduledInToday, {
+  DashboardScheduledInTodayGql,
+} from "../dashboard-components/scheduled-in-today/scheduled-in-today.component";
+import DashboardScheduledOutToday, {
+  DashboardScheduledOutTodayGql,
+} from "../dashboard-components/scheduled-out-today/scheduled-out-today.component";
 import "./dashboard-grid.styles.scss";
 import { GenerateDashboardData } from "./dashboard-grid.utils";
 
@@ -268,6 +274,28 @@ const componentList = {
     w: 2,
     h: 2,
   },
+  ScheduleInToday: {
+    label: i18next.t("dashboard.titles.scheduledintoday", {
+      date: moment().startOf("day").format("MM/DD/YYYY"),
+    }),
+    component: DashboardScheduledInToday,
+    gqlFragment: DashboardScheduledInTodayGql,
+    minW: 10,
+    minH: 2,
+    w: 10,
+    h: 2,
+  },
+  ScheduleOutToday: {
+    label: i18next.t("dashboard.titles.scheduledouttoday", {
+      date: moment().startOf("day").format("MM/DD/YYYY"),
+    }),
+    component: DashboardScheduledOutToday,
+    gqlFragment: DashboardScheduledOutTodayGql,
+    minW: 10,
+    minH: 2,
+    w: 10,
+    h: 2,
+  },
 };
 
 const createDashboardQuery = (state) => {
@@ -283,8 +311,12 @@ const createDashboardQuery = (state) => {
       monthly_sales: jobs(where: {_and: [
         { voided: {_eq: false}},
         {date_invoiced: {_gte: "${moment()
-        .startOf("month").startOf('day').toISOString()}"}}, {date_invoiced: {_lte: "${moment()
-    .endOf("month").endOf('day').toISOString()}"}}]}) {
+          .startOf("month")
+          .startOf("day")
+          .toISOString()}"}}, {date_invoiced: {_lte: "${moment()
+    .endOf("month")
+    .endOf("day")
+    .toISOString()}"}}]}) {
     id
     ro_number
     date_invoiced

client/src/components/data-label/data-label.component.jsx

@@ -8,6 +8,8 @@ export default function DataLabel({
   vertical,
   visible = true,
   valueStyle = {},
+  valueClassName,
+  onValueClick,
   ...props
 }) {
   if (!visible || (hideIfNull && !!!children)) return null;
@@ -16,7 +18,7 @@ export default function DataLabel({
     <div {...props} style={{ display: "flex" }}>
       <div
         style={{
-          flex: 2,
+         // flex: 2,
           marginRight: ".2rem",
         }}
       >
@@ -28,7 +30,10 @@ export default function DataLabel({
           marginLeft: ".3rem",
           fontWeight: "bolder",
           wordWrap: "break-word",
+          cursor: onValueClick !== undefined ? "pointer" : "",
         }}
+        className={valueClassName}
+        onClick={onValueClick}
       >
         {typeof children === "string" ? (
           <Typography.Text style={valueStyle}>{children}</Typography.Text>

client/src/components/dms-allocations-summary-ap/dms-allocations-summary-ap.component.jsx

@@ -66,7 +66,7 @@ export function DmsAllocationsSummaryAp({ socket, bodyshop, billids, title }) {
       key: "status",
     },
     {
-      title: t("jobs.fields.ro_number"),
+      title: t("bills.fields.invoice_number"),
       dataIndex: ["Posting", "Reference"],
       key: "reference",
     },

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

@@ -11,6 +11,7 @@ import {
   Select,
   Space,
   Statistic,
+  Switch,
   Typography,
 } from "antd";
 import Dinero from "dinero.js";
@@ -183,6 +184,20 @@ export function DmsPostForm({ bodyshop, socket, job, logsRef }) {
             <Space>
               <DmsCdkMakes form={form} socket={socket} job={job} />
               <DmsCdkMakesRefetch />
+              <Form.Item
+                name="dms_unsold"
+                label={t("jobs.fields.dms.dms_unsold")}
+                initialValue={false}
+              >
+                <Switch />
+              </Form.Item>
+              <Form.Item
+                name="dms_model_override"
+                label={t("jobs.fields.dms.dms_model_override")}
+                initialValue={false}
+              >
+                <Switch />
+              </Form.Item>
             </Space>
           </div>
         )}

client/src/components/email-overlay/email-overlay.component.jsx

@@ -1,28 +1,28 @@
 import { UploadOutlined, UserAddOutlined } from "@ant-design/icons";
 import {
+  Button,
   Divider,
+  Dropdown,
   Form,
   Input,
+  Menu,
   Select,
+  Space,
   Tabs,
   Upload,
-  Space,
-  Menu,
-  Dropdown,
-  Button,
 } from "antd";
+import _ from "lodash";
 import React from "react";
 import { useTranslation } from "react-i18next";
-import EmailDocumentsComponent from "../email-documents/email-documents.component";
-import _ from "lodash";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
+import { selectEmailConfig } from "../../redux/email/email.selectors";
 import {
   selectBodyshop,
   selectCurrentUser,
 } from "../../redux/user/user.selectors";
 import { CreateExplorerLinkForJob } from "../../utils/localmedia";
-import { selectEmailConfig } from "../../redux/email/email.selectors";
+import EmailDocumentsComponent from "../email-documents/email-documents.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -54,6 +54,15 @@ export function EmailOverlayComponent({
       ]),
     });
   };
+  const handle_CC_Click = ({ item, key, keyPath }) => {
+    const email = item.props.value;
+    form.setFieldsValue({
+      cc: _.uniq([
+        ...(form.getFieldValue("cc") || ""),
+        ...(typeof email === "string" ? [email] : email),
+      ]),
+    });
+  };
 
   const menu = (
     <div>
@@ -74,6 +83,25 @@ export function EmailOverlayComponent({
     </div>
   );
 
+  const menuCC = (
+    <div>
+      <Menu onClick={handle_CC_Click}>
+        {bodyshop.employees
+          .filter((e) => e.user_email)
+          .map((e, idx) => (
+            <Menu.Item value={e.user_email} key={idx}>
+              {`${e.first_name} ${e.last_name}`}
+            </Menu.Item>
+          ))}
+        {bodyshop.md_to_emails.map((e, idx) => (
+          <Menu.Item value={e.emails} key={idx + "group"}>
+            {e.label}
+          </Menu.Item>
+        ))}
+      </Menu>
+    </div>
+  );
+
   return (
     <div>
       <Form.Item
@@ -122,7 +150,23 @@ export function EmailOverlayComponent({
       >
         <Select mode="tags" tokenSeparators={[",", ";"]} />
       </Form.Item>
-      <Form.Item label={t("emails.fields.cc")} name="cc">
+      <Form.Item
+        label={
+          <Space>
+            {t("emails.fields.cc")}
+            <Dropdown overlay={menuCC}>
+              <a
+                className="ant-dropdown-link"
+                href=" #"
+                onClick={(e) => e.preventDefault()}
+              >
+                <UserAddOutlined />
+              </a>
+            </Dropdown>
+          </Space>
+        }
+        name="cc"
+      >
         <Select mode="tags" tokenSeparators={[",", ";"]} />
       </Form.Item>
       <Form.Item

client/src/components/email-overlay/email-overlay.container.jsx

@@ -109,7 +109,7 @@ export function EmailOverlayContainer({
               ]
             : []),
         ],
-        media: selectedMedia.filter((m) => m.isSelected).map((m) => m.src),
+        media: selectedMedia.filter((m) => m.isSelected).map((m) => m.fullsize),
         //attachments,
       });
       notification["success"]({ message: t("emails.successes.sent") });

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

@@ -1,10 +1,10 @@
 import { Select, Space, Tag } from "antd";
-import React, { forwardRef } from "react";
+import React from "react";
 import { useTranslation } from "react-i18next";
 const { Option } = Select;
 //To be used as a form element only.
 
-const EmployeeSearchSelect = ({ options, ...props }, ref) => {
+const EmployeeSearchSelect = ({ options, ...props }) => {
   const { t } = useTranslation();
 
   return (
@@ -39,4 +39,4 @@ const EmployeeSearchSelect = ({ options, ...props }, ref) => {
     </Select>
   );
 };
-export default forwardRef(EmployeeSearchSelect);
+export default EmployeeSearchSelect;

client/src/components/employee-team-search-select/employee-team-search-select.component.jsx

@@ -0,0 +1,33 @@
+import { useQuery } from "@apollo/client";
+import { Select } from "antd";
+import React, { forwardRef } from "react";
+import { QUERY_TEAMS } from "../../graphql/employee_teams.queries";
+import AlertComponent from "../alert/alert.component";
+
+//To be used as a form element only.
+
+const EmployeeTeamSearchSelect = ({ ...props }, ref) => {
+  const { loading, error, data } = useQuery(QUERY_TEAMS);
+
+  if (error) return <AlertComponent message={JSON.stringify(error)} />;
+  return (
+    <Select
+      showSearch
+      allowClear
+      loading={loading}
+      style={{
+        width: 400,
+      }}
+      options={
+        data
+          ? data.employee_teams.map((e) => ({
+              value: JSON.stringify(e),
+              label: e.name,
+            }))
+          : []
+      }
+      {...props}
+    />
+  );
+};
+export default forwardRef(EmployeeTeamSearchSelect);

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

@@ -40,22 +40,22 @@ class ErrorBoundary extends React.Component {
   }
 
   handleErrorSubmit = () => {
-    window.$crisp.push([
-      "do",
-      "message:send",
-      [
-        "text",
-        `I hit the following error: \n\n 
-    ${this.state.error.message}\n\n
-    ${this.state.error.stack}\n\n
-    URL:${window.location} as ${this.props.currentUser.email} for ${
-          this.props.bodyshop && this.props.bodyshop.name
-        }
-    `,
-      ],
-    ]);
+    // window.$crisp.push([
+    //   "do",
+    //   "message:send",
+    //   [
+    //     "text",
+    //     `I hit the following error: \n\n 
+    // ${this.state.error.message}\n\n
+    // ${this.state.error.stack}\n\n
+    // URL:${window.location} as ${this.props.currentUser.email} for ${
+    //       this.props.bodyshop && this.props.bodyshop.name
+    //     }
+    // `,
+    //   ],
+    // ]);
 
-    window.$crisp.push(["do", "chat:open"]);
+    // window.$crisp.push(["do", "chat:open"]);
     //     const errorDescription = `**Please add relevant details about what you were doing before you encountered this issue**
 
     // ----

client/src/components/form-items-formatted/read-only-form-item.component.jsx

@@ -1,9 +1,26 @@
 import Dinero from "dinero.js";
 import React, { forwardRef } from "react";
 
-const ReadOnlyFormItem = ({ value, type = "text", onChange }, ref) => {
+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))
+});
+
+const ReadOnlyFormItem = (
+  { bodyshop, value, type = "text", onChange },
+  ref
+) => {
   if (!value) return null;
   switch (type) {
+    case "employee":
+      const emp = bodyshop.employees.find((e) => e.id === value);
+      return `${emp?.first_name} ${emp?.last_name}`;
+
     case "text":
       return <div>{value}</div>;
     case "currency":
@@ -14,4 +31,8 @@ const ReadOnlyFormItem = ({ value, type = "text", onChange }, ref) => {
       return <div>{value}</div>;
   }
 };
-export default forwardRef(ReadOnlyFormItem);
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(forwardRef(ReadOnlyFormItem));

client/src/components/global-search/global-search-os.component.jsx

@@ -0,0 +1,216 @@
+import { AutoComplete, Divider, Input, Space } from "antd";
+import axios from "axios";
+import _ from "lodash";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Link, useHistory } from "react-router-dom";
+import PhoneNumberFormatter from "../../utils/PhoneFormatter";
+import OwnerNameDisplay, {
+  OwnerNameDisplayFunction,
+} from "../owner-name-display/owner-name-display.component";
+import VehicleVinDisplay from "../vehicle-vin-display/vehicle-vin-display.component";
+
+export default function GlobalSearchOs() {
+  const { t } = useTranslation();
+  const history = useHistory();
+  const [loading, setLoading] = useState(false);
+  const [data, setData] = useState(false);
+
+  const executeSearch = async (v) => {
+    if (v && v && v !== "" && v.length >= 3) {
+      try {
+        setLoading(true);
+        const searchData = await axios.post("/search", {
+          search: v,
+        });
+
+        const resultsByType = {
+          payments: [],
+          jobs: [],
+          bills: [],
+          owners: [],
+          vehicles: [],
+        };
+
+        searchData.data.hits.hits.forEach((hit) => {
+          resultsByType[hit._index].push(hit._source);
+        });
+        setData([
+          {
+            label: renderTitle(t("menus.header.search.jobs")),
+            options: resultsByType.jobs.map((job) => {
+              return {
+                key: job.id,
+                value: job.ro_number || "N/A",
+                label: (
+                  <Link to={`/manage/jobs/${job.id}`}>
+                    <Space size="small" split={<Divider type="vertical" />}>
+                      <strong>{job.ro_number || t("general.labels.na")}</strong>
+                      <span>{`${job.status || ""}`}</span>
+                      <span>
+                        <OwnerNameDisplay ownerObject={job} />
+                      </span>
+                      <span>{`${job.v_model_yr || ""} ${
+                        job.v_make_desc || ""
+                      } ${job.v_model_desc || ""}`}</span>
+                      <span>{`${job.clm_no || ""}`}</span>
+                    </Space>
+                  </Link>
+                ),
+              };
+            }),
+          },
+          {
+            label: renderTitle(t("menus.header.search.owners")),
+            options: resultsByType.owners.map((owner) => {
+              return {
+                key: owner.id,
+                value: OwnerNameDisplayFunction(owner),
+                label: (
+                  <Link to={`/manage/owners/${owner.id}`}>
+                    <Space
+                      size="small"
+                      split={<Divider type="vertical" />}
+                      wrap
+                    >
+                      <span>
+                        <OwnerNameDisplay ownerObject={owner} />
+                      </span>
+                      <PhoneNumberFormatter>
+                        {owner.ownr_ph1}
+                      </PhoneNumberFormatter>
+                      <PhoneNumberFormatter>
+                        {owner.ownr_ph2}
+                      </PhoneNumberFormatter>
+                    </Space>
+                  </Link>
+                ),
+              };
+            }),
+          },
+          {
+            label: renderTitle(t("menus.header.search.vehicles")),
+            options: resultsByType.vehicles.map((vehicle) => {
+              return {
+                key: vehicle.id,
+                value: `${vehicle.v_model_yr || ""} ${
+                  vehicle.v_make_desc || ""
+                } ${vehicle.v_model_desc || ""}`,
+                label: (
+                  <Link to={`/manage/vehicles/${vehicle.id}`}>
+                    <Space size="small" split={<Divider type="vertical" />}>
+                      <span>
+                        {`${vehicle.v_model_yr || ""} ${
+                          vehicle.v_make_desc || ""
+                        } ${vehicle.v_model_desc || ""}`}
+                      </span>
+                      <span>{vehicle.plate_no || ""}</span>
+                      <span>
+                        <VehicleVinDisplay>
+                          {vehicle.v_vin || ""}
+                        </VehicleVinDisplay>
+                      </span>
+                    </Space>
+                  </Link>
+                ),
+              };
+            }),
+          },
+          {
+            label: renderTitle(t("menus.header.search.payments")),
+            options: resultsByType.payments.map((payment) => {
+              return {
+                key: payment.id,
+                value: `${payment.job?.ro_number} ${payment.amount}`,
+                label: (
+                  <Link to={`/manage/jobs/${payment.job?.id}`}>
+                    <Space size="small" split={<Divider type="vertical" />}>
+                      <span>{payment.paymentnum}</span>
+                      <span>{payment.job?.ro_number}</span>
+                      <span>{payment.memo || ""}</span>
+                      <span>{payment.amount || ""}</span>
+                      <span>{payment.transactionid || ""}</span>
+                    </Space>
+                  </Link>
+                ),
+              };
+            }),
+          },
+          {
+            label: renderTitle(t("menus.header.search.bills")),
+            options: resultsByType.bills.map((bill) => {
+              return {
+                key: bill.id,
+                value: `${bill.invoice_number} - ${bill.vendor.name}`,
+                label: (
+                  <Link to={`/manage/bills?billid=${bill.id}`}>
+                    <Space size="small" split={<Divider type="vertical" />}>
+                      <span>{bill.invoice_number}</span>
+                      <span>{bill.vendor.name}</span>
+                      <span>{bill.date}</span>
+                    </Space>
+                  </Link>
+                ),
+              };
+            }),
+          },
+          // {
+          //   label: renderTitle(t("menus.header.search.phonebook")),
+          //   options: resultsByType.search_phonebook.map((pb) => {
+          //     return {
+          //       key: pb.id,
+          //       value: `${pb.firstname || ""} ${pb.lastname || ""} ${
+          //         pb.company || ""
+          //       }`,
+          //       label: (
+          //         <Link to={`/manage/phonebook?phonebookentry=${pb.id}`}>
+          //           <Space size="small" split={<Divider type="vertical" />}>
+          //             <span>{`${pb.firstname || ""} ${pb.lastname || ""} ${
+          //               pb.company || ""
+          //             }`}</span>
+          //             <PhoneNumberFormatter>{pb.phone1}</PhoneNumberFormatter>
+          //             <span>{pb.email}</span>
+          //           </Space>
+          //         </Link>
+          //       ),
+          //     };
+          //   }),
+          // },
+        ]);
+      } catch (error) {
+        console.log("Error while fetching search results", error);
+      } finally {
+        setLoading(false);
+      }
+    }
+  };
+  const debouncedExecuteSearch = _.debounce(executeSearch, 750);
+
+  const handleSearch = (value) => {
+    debouncedExecuteSearch(value);
+  };
+
+  const renderTitle = (title) => {
+    return <span>{title}</span>;
+  };
+
+  return (
+    <AutoComplete
+      options={data}
+      onSearch={handleSearch}
+      defaultActiveFirstOption
+      onSelect={(val, opt) => {
+        history.push(opt.label.props.to);
+      }}
+      onClear={() => setData([])}
+    >
+      <Input.Search
+        size="large"
+        placeholder={t("general.labels.globalsearch")}
+        enterButton
+        allowClear
+        loading={loading}
+      />
+    </AutoComplete>
+  );
+}

client/src/components/global-search/global-search.component.jsx

@@ -1,6 +1,5 @@
 import { useLazyQuery } from "@apollo/client";
-import { LoadingOutlined } from "@ant-design/icons";
-import { AutoComplete, Divider, Space } from "antd";
+import { AutoComplete, Divider, Input, Space } from "antd";
 import _ from "lodash";
 import React from "react";
 import { useTranslation } from "react-i18next";
@@ -19,11 +18,18 @@ export default function GlobalSearch() {
     useLazyQuery(GLOBAL_SEARCH_QUERY);
 
   const executeSearch = (v) => {
-    if (v && v.variables.search && v.variables.search !== "") callSearch(v);
+    if (
+      v &&
+      v.variables.search &&
+      v.variables.search !== "" &&
+      v.variables.search.length >= 3
+    )
+      callSearch(v);
   };
   const debouncedExecuteSearch = _.debounce(executeSearch, 750);
 
   const handleSearch = (value) => {
+    console.log("Handle Search");
     debouncedExecuteSearch({ variables: { search: value } });
   };
 
@@ -38,7 +44,7 @@ export default function GlobalSearch() {
           options: data.search_jobs.map((job) => {
             return {
               key: job.id,
-              value: job.ro_number,
+              value: job.ro_number || "N/A",
               label: (
                 <Link to={`/manage/jobs/${job.id}`}>
                   <Space size="small" split={<Divider type="vertical" />}>
@@ -178,13 +184,18 @@ export default function GlobalSearch() {
     <AutoComplete
       options={options}
       onSearch={handleSearch}
-      suffixIcon={loading && <LoadingOutlined spin />}
       defaultActiveFirstOption
-      placeholder={t("general.labels.globalsearch")}
-      allowClear
       onSelect={(val, opt) => {
         history.push(opt.label.props.to);
       }}
-    ></AutoComplete>
+    >
+      <Input.Search
+        size="large"
+        placeholder={t("general.labels.globalsearch")}
+        enterButton
+        allowClear
+        loading={loading}
+      />
+    </AutoComplete>
   );
 }

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

@@ -1,10 +1,9 @@
-import { useTreatments } from "@splitsoftware/splitio-react";
 import Icon, {
   BankFilled,
   BarChartOutlined,
   CarFilled,
-  ClockCircleFilled,
   CheckCircleOutlined,
+  ClockCircleFilled,
   DashboardFilled,
   DollarCircleFilled,
   ExportOutlined,
@@ -26,6 +25,7 @@ import Icon, {
   UnorderedListOutlined,
   UserOutlined,
 } from "@ant-design/icons";
+import { useTreatments } from "@splitsoftware/splitio-react";
 import { Layout, Menu } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
@@ -70,6 +70,8 @@ const mapDispatchToProps = (dispatch) => ({
   setReportCenterContext: (context) =>
     dispatch(setModalContext({ context: context, modal: "reportCenter" })),
   signOutStart: () => dispatch(signOutStart()),
+  setCardPaymentContext: (context) =>
+    dispatch(setModalContext({ context: context, modal: "cardPayment" })),
 });
 
 function Header({
@@ -83,6 +85,7 @@ function Header({
   setPaymentContext,
   setReportCenterContext,
   recentItems,
+  setCardPaymentContext,
 }) {
   const { Simple_Inventory } = useTreatments(
     ["Simple_Inventory"],
@@ -94,6 +97,11 @@ function Header({
     {},
     bodyshop && bodyshop.imexshopid
   );
+  const { ImEXPay } = useTreatments(
+    ["ImEXPay"],
+    {},
+    bodyshop && bodyshop.imexshopid
+  );
 
   const { t } = useTranslation();
 
@@ -240,19 +248,44 @@ function Header({
           >
             {t("menus.header.enterpayment")}
           </Menu.Item>
+          {ImEXPay.treatment === "on" && (
+            <Menu.Item
+              key="entercardpayments"
+              onClick={() => {
+                setCardPaymentContext({
+                  actions: {},
+                  context: {},
+                });
+              }}
+              icon={<Icon component={FaCreditCard} />}
+            >
+              {t("menus.header.entercardpayment")}
+            </Menu.Item>
+          )}
           <Menu.Divider key="div5" />
           <Menu.Item key="timetickets" icon={<FieldTimeOutlined />}>
             <Link to="/manage/timetickets">
               {t("menus.header.timetickets")}
             </Link>
           </Menu.Item>
+          {bodyshop?.md_tasks_presets?.use_approvals && (
+            <Menu.Item key="ttapprovals" icon={<FieldTimeOutlined />}>
+              <Link to="/manage/ttapprovals">
+                {t("menus.header.ttapprovals")}
+              </Link>
+            </Menu.Item>
+          )}
           <Menu.Item
             key="entertimetickets"
             icon={<Icon component={GiPlayerTime} />}
             onClick={() => {
               setTimeTicketContext({
                 actions: {},
-                context: {},
+                context: {
+                  created_by: currentUser.displayName
+                    ? currentUser.email.concat(" | ", currentUser.displayName)
+                    : currentUser.email,
+                },
               });
             }}
           >
@@ -311,7 +344,9 @@ function Header({
           icon={<SettingOutlined />}
         >
           <Menu.Item key="shop" icon={<Icon component={GiSettingsKnobs} />}>
-            <Link to="/manage/shop">{t("menus.header.shop_config")}</Link>
+            <Link to="/manage/shop?tab=info">
+              {t("menus.header.shop_config")}
+            </Link>
           </Menu.Item>
           <Menu.Item key="dashboard" icon={<DashboardFilled />}>
             <Link to="/manage/dashboard">{t("menus.header.dashboard")}</Link>
@@ -354,20 +389,12 @@ function Header({
           <Menu.Item
             key="help"
             onClick={() => {
-              window.open("https://help.imex.online/", "_blank");
+              window.open("https://rometech.com/", "_blank");
             }}
             icon={<Icon component={QuestionCircleFilled} />}
           >
             {t("menus.header.help")}
           </Menu.Item>
-          <Menu.Item
-            key="rescue"
-            onClick={() => {
-              window.open("https://imexrescue.com/", "_blank");
-            }}
-          >
-            {t("menus.header.rescueme")}
-          </Menu.Item>
           <Menu.Item key="shiftclock">
             <Link to="/manage/shiftclock">{t("menus.header.shiftclock")}</Link>
           </Menu.Item>

client/src/components/job-3rd-party-modal/job-3rd-party-modal.component.jsx

@@ -5,6 +5,7 @@ import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { SEARCH_VENDOR_AUTOCOMPLETE_WITH_ADDR } from "../../graphql/vendors.queries";
+import { selectTechnician } from "../../redux/tech/tech.selectors";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import { GenerateDocument } from "../../utils/RenderTemplate";
 import { TemplateList } from "../../utils/TemplateConstants";
@@ -13,13 +14,14 @@ import VendorSearchSelect from "../vendor-search-select/vendor-search-select.com
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
+  technician: selectTechnician,
 });
 const mapDispatchToProps = (dispatch) => ({
   //setUserLanguage: language => dispatch(setUserLanguage(language))
 });
 export default connect(mapStateToProps, mapDispatchToProps)(Jobd3RdPartyModal);
 
-export function Jobd3RdPartyModal({ bodyshop, jobId, job }) {
+export function Jobd3RdPartyModal({ bodyshop, jobId, job, technician }) {
   const [isModalVisible, setIsModalVisible] = useState(false);
   const { t } = useTranslation();
   const [form] = Form.useForm();
@@ -212,7 +214,9 @@ export function Jobd3RdPartyModal({ bodyshop, jobId, job }) {
             ]}
           >
             <Radio.Group>
-              <Radio value={"e"}>{t("parts_orders.labels.email")}</Radio>
+              {!technician ? (
+                <Radio value={"e"}>{t("parts_orders.labels.email")}</Radio>
+              ) : null}
               <Radio value={"p"}>{t("parts_orders.labels.print")}</Radio>
             </Radio.Group>
           </Form.Item>

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

@@ -3,9 +3,12 @@ import {
   Button,
   Divider,
   Dropdown,
+  Form,
+  Input,
   Menu,
   notification,
   Popover,
+  Select,
   Space,
 } from "antd";
 import parsePhoneNumber from "libphonenumber-js";
@@ -27,11 +30,13 @@ import { GenerateDocument } from "../../utils/RenderTemplate";
 import { TemplateList } from "../../utils/TemplateConstants";
 import ChatOpenButton from "../chat-open-button/chat-open-button.component";
 import DataLabel from "../data-label/data-label.component";
+import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
 import ScheduleManualEvent from "../schedule-manual-event/schedule-manual-event.component";
 import ScheduleAtChange from "./job-at-change.component";
 import ScheduleEventColor from "./schedule-event.color.component";
 import ScheduleEventNote from "./schedule-event.note.component";
-import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+import { useMutation } from "@apollo/client";
+import { UPDATE_APPOINTMENT } from "../../graphql/appointments.queries";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -56,13 +61,44 @@ export function ScheduleEventComponent({
   const [visible, setVisible] = useState(false);
   const history = useHistory();
   const searchParams = queryString.parse(useLocation().search);
-
+  const [updateAppointment] = useMutation(UPDATE_APPOINTMENT);
+  const [title, setTitle] = useState(event.title);
   const blockContent = (
-    <div>
-      <Button onClick={() => handleCancel(event.id)} disabled={event.arrived}>
-        {t("appointments.actions.cancel")}
+    <Space direction="vertical" wrap>
+      <Input
+        value={title}
+        onChange={(e) => setTitle(e.currentTarget.value)}
+        onBlur={async () => {
+          await updateAppointment({
+            variables: {
+              appid: event.id,
+              app: {
+                title: title,
+              },
+            },
+            optimisticResponse: {
+              update_appointments: {
+                __typename: "appointments_mutation_response",
+                returning: [
+                  {
+                    ...event,
+                    title: title,
+                    __typename: "appointments",
+                  },
+                ],
+              },
+            },
+          });
+        }}
+      />
+
+      <Button
+        onClick={() => handleCancel({ id: event.id })}
+        disabled={event.arrived}
+      >
+        {t("appointments.actions.unblock")}
       </Button>
-    </div>
+    </Space>
   );
 
   const popoverContent = (
@@ -203,10 +239,56 @@ export function ScheduleEventComponent({
             <Button>{t("appointments.actions.sendreminder")}</Button>
           </Dropdown>
         ) : null}
+        {event.arrived ? (
+          <Button
+            // onClick={() => handleCancel(event.id)}
+            disabled={event.arrived}
+          >
+            {t("appointments.actions.cancel")}
+          </Button>
+        ) : (
+          <Popover
+            trigger="click"
+            disabled={event.arrived}
+            content={
+              <Form
+                layout="vertical"
+                onFinish={({ lost_sale_reason }) => {
+                  handleCancel({ id: event.id, lost_sale_reason });
+                }}
+              >
+                <Form.Item
+                  name="lost_sale_reason"
+                  label={t("jobs.fields.lost_sale_reason")}
+                  rules={[
+                    {
+                      required: true,
+                      //message: t("general.validation.required"),
+                    },
+                  ]}
+                >
+                  <Select
+                    options={bodyshop.md_lost_sale_reasons.map((lsr) => ({
+                      label: lsr,
+                      value: lsr,
+                    }))}
+                  />
+                </Form.Item>
+                <Button htmlType="submit">
+                  {t("appointments.actions.cancel")}
+                </Button>
+              </Form>
+            }
+          >
+            <Button
+              // onClick={() => handleCancel(event.id)}
+              disabled={event.arrived}
+            >
+              {t("appointments.actions.cancel")}
+            </Button>
+          </Popover>
+        )}
 
-        <Button onClick={() => handleCancel(event.id)} disabled={event.arrived}>
-          {t("appointments.actions.cancel")}
-        </Button>
         {event.isintake ? (
           <Button
             disabled={event.arrived}
@@ -249,7 +331,7 @@ export function ScheduleEventComponent({
   const RegularEvent = event.isintake ? (
     <Space
       wrap
-      size='small'
+      size="small"
       style={{
         backgroundColor:
           event.color && event.color.hex ? event.color.hex : event.color,

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

@@ -11,7 +11,7 @@ export default function ScheduleEventContainer({ bodyshop, event, refetch }) {
   const { t } = useTranslation();
   const [cancelAppointment] = useMutation(CANCEL_APPOINTMENT_BY_ID);
   const [updateJob] = useMutation(UPDATE_JOB);
-  const handleCancel = async (id) => {
+  const handleCancel = async ({ id, lost_sale_reason }) => {
     logImEXEvent("schedule_cancel_appt");
 
     const cancelAppt = await cancelAppointment({
@@ -38,7 +38,8 @@ export default function ScheduleEventContainer({ bodyshop, event, refetch }) {
           job: {
             date_scheduled: null,
             scheduled_in: null,
-            scheduled_completion:null,
+            scheduled_completion: null,
+            lost_sale_reason,
             status: bodyshop.md_ro_statuses.default_imported,
           },
         },

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

@@ -1,47 +1,52 @@
 import { Button, notification } from "antd";
 import Axios from "axios";
 import React, { useState } from "react";
-import { useMutation } from "@apollo/client";
 import { useTranslation } from "react-i18next";
-import { UPDATE_JOB } from "../../graphql/jobs.queries";
-import Dinero from "dinero.js";
-export default function JobCalculateTotals({ job, disabled }) {
+export default function JobCalculateTotals({ job, disabled, refetch }) {
   const { t } = useTranslation();
   const [loading, setLoading] = useState(false);
-  const [updateJob] = useMutation(UPDATE_JOB);
 
   const handleCalculate = async () => {
-    setLoading(true);
-    const newTotals = (
-      await Axios.post("/job/totals", {
-        job: job,
-      })
-    ).data;
+    try {
+      setLoading(true);
 
-    const result = await updateJob({
-      refetchQueries: ["GET_JOB_BY_PK"],
-      awaitRefetchQueries: true,
-      variables: {
-        jobId: job.id,
-        job: {
-          job_totals: newTotals,
-          clm_total: Dinero(newTotals.totals.total_repairs).toFormat("0.00"),
-          owner_owing: Dinero(newTotals.totals.custPayable.total).toFormat(
-            "0.00"
-          ),
-        },
-      },
-    });
-    if (!!!result.errors) {
-      notification["success"]({ message: t("jobs.successes.updated") });
-    } else {
+      await Axios.post("/job/totalsssu", {
+        id: job.id,
+      });
+
+      if (refetch) refetch();
+      // const result = await updateJob({
+      //   refetchQueries: ["GET_JOB_BY_PK"],
+      //   awaitRefetchQueries: true,
+      //   variables: {
+      //     jobId: job.id,
+      //     job: {
+      //       job_totals: newTotals,
+      //       clm_total: Dinero(newTotals.totals.total_repairs).toFormat("0.00"),
+      //       owner_owing: Dinero(newTotals.totals.custPayable.total).toFormat(
+      //         "0.00"
+      //       ),
+      //     },
+      //   },
+      // });
+      // if (!!!result.errors) {
+      //   notification["success"]({ message: t("jobs.successes.updated") });
+      // } else {
+      //   notification["error"]({
+      //     message: t("jobs.errors.updating", {
+      //       error: JSON.stringify(result.errors),
+      //     }),
+      //   });
+      // }
+    } catch (error) {
       notification["error"]({
         message: t("jobs.errors.updating", {
-          error: JSON.stringify(result.errors),
+          error: JSON.stringify(error),
         }),
       });
+    } finally {
+      setLoading(false);
     }
-    setLoading(false);
   };
 
   return (

client/src/components/job-checklist/components/job-checklist-form/job-checklist-form.component.jsx

@@ -1,5 +1,6 @@
 import { useMutation } from "@apollo/client";
 import { Button, Card, Form, Input, notification, Switch } from "antd";
+import moment from "moment-business-days";
 import queryString from "query-string";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
@@ -12,16 +13,15 @@ import {
   MARK_LATEST_APPOINTMENT_ARRIVED,
 } from "../../../../graphql/appointments.queries";
 import { UPDATE_JOB } from "../../../../graphql/jobs.queries";
+import { UPDATE_OWNER } from "../../../../graphql/owners.queries";
+import { insertAuditTrail } from "../../../../redux/application/application.actions";
 import {
   selectBodyshop,
   selectCurrentUser,
 } from "../../../../redux/user/user.selectors";
+import AuditTrailMapping from "../../../../utils/AuditTrailMappings";
 import ConfigFormComponents from "../../../config-form-components/config-form-components.component";
 import DateTimePicker from "../../../form-date-time-picker/form-date-time-picker.component";
-import moment from "moment-business-days";
-import { insertAuditTrail } from "../../../../redux/application/application.actions";
-import AuditTrailMapping from "../../../../utils/AuditTrailMappings";
-import { UPDATE_OWNER } from "../../../../graphql/owners.queries";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -230,6 +230,7 @@ export function JobChecklistForm({
                 )),
             scheduled_delivery:
               job.scheduled_delivery && moment(job.scheduled_delivery),
+            production_vars: job.production_vars,
           }),
           ...(type === "deliver" && {
             removeFromProduction: true,

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

@@ -32,9 +32,9 @@ const mapDispatchToProps = (dispatch) => ({
 });
 
 const span = {
-  sm: { span: 24 },
-  md: { span: 12 },
-  lg: { span: 8 },
+  lg: { span: 24 },
+  xl: { span: 12 },
+  xxl: { span: 8 },
 };
 
 export function JobDetailCards({ bodyshop, setPrintCenterContext }) {
@@ -137,12 +137,6 @@ export function JobDetailCards({ bodyshop, setPrintCenterContext }) {
                 data={data ? data.jobs_by_pk : null}
               />
             </Col>
-            <Col {...span}>
-              <JobDetailCardsPartsComponent
-                loading={loading}
-                data={data ? data.jobs_by_pk : null}
-              />
-            </Col>
             <Col {...span}>
               <JobDetailCardsNotesComponent
                 loading={loading}
@@ -163,6 +157,12 @@ export function JobDetailCards({ bodyshop, setPrintCenterContext }) {
                 data={data ? data.jobs_by_pk : null}
               />
             </Col>
+            <Col span={24}>
+              <JobDetailCardsPartsComponent
+                loading={loading}
+                data={data ? data.jobs_by_pk : null}
+              />
+            </Col>
           </Row>
         </Card>
       ) : null}

client/src/components/job-detail-cards/job-detail-cards.parts.component.jsx

@@ -1,16 +1,119 @@
+import { Table } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
+import JobLineNotePopup from "../job-line-note-popup/job-line-note-popup.component";
 import PartsStatusPie from "../parts-status-pie/parts-status-pie.component";
 import CardTemplate from "./job-detail-cards.template.component";
 
-export default function JobDetailCardsPartsComponent({ loading, data }) {
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { selectJobReadOnly } from "../../redux/application/application.selectors";
+import { onlyUnique } from "../../utils/arrayHelper";
+import { alphaSort } from "../../utils/sorters";
+import JobLineLocationPopup from "../job-line-location-popup/job-line-location-popup.component";
+import JobLineStatusPopup from "../job-line-status-popup/job-line-status-popup.component";
+const mapStateToProps = createStructuredSelector({
+  //currentUser: selectCurrentUser
+  jobRO: selectJobReadOnly,
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(JobDetailCardsPartsComponent);
+
+export function JobDetailCardsPartsComponent({ loading, data, jobRO }) {
   const { t } = useTranslation();
   const { joblines_status } = data;
 
+  const columns = [
+    {
+      title: t("joblines.fields.line_desc"),
+      dataIndex: "line_desc",
+      fixed: "left",
+      key: "line_desc",
+      sorter: (a, b) => alphaSort(a.line_desc, b.line_desc),
+      onCell: (record) => ({
+        className: record.manual_line && "job-line-manual",
+        style: {
+          ...(record.critical ? { boxShadow: " -.5em 0 0 #FFC107" } : {}),
+        },
+      }),
+      width: "30%",
+      ellipsis: true,
+    },
+    {
+      title: t("joblines.fields.part_type"),
+      dataIndex: "part_type",
+      key: "part_type",
+      width: "15%",
+      sorter: (a, b) =>
+        alphaSort(
+          t(`joblines.fields.part_types.${a.part_type}`),
+          t(`joblines.fields.part_types.${b.part_type}`)
+        ),
+      render: (text, record) =>
+        record.part_type
+          ? t(`joblines.fields.part_types.${record.part_type}`)
+          : null,
+    },
+    {
+      title: t("joblines.fields.part_qty"),
+      dataIndex: "part_qty",
+      key: "part_qty",
+      width: "10%",
+    },
+    {
+      title: t("joblines.fields.notes"),
+      dataIndex: "notes",
+      key: "notes",
+      render: (text, record) => (
+        <JobLineNotePopup disabled={jobRO} jobline={record} />
+      ),
+    },
+    {
+      title: t("joblines.fields.location"),
+      dataIndex: "location",
+      key: "location",
+      sorter: (a, b) => alphaSort(a.location, b.location),
+      render: (text, record) => (
+        <JobLineLocationPopup jobline={record} disabled={jobRO} />
+      ),
+    },
+    {
+      title: t("joblines.fields.status"),
+      dataIndex: "status",
+      key: "status",
+      sorter: (a, b) => alphaSort(a.status, b.status),
+      filters:
+        (data &&
+          data.joblines
+            ?.map((l) => l.status)
+            .filter(onlyUnique)
+            .map((s) => {
+              return {
+                text: s || "No Status*",
+                value: [s],
+              };
+            })) ||
+        [],
+      onFilter: (value, record) => value.includes(record.status),
+      render: (text, record) => (
+        <JobLineStatusPopup jobline={record} disabled={jobRO} />
+      ),
+    },
+  ];
   return (
     <div>
       <CardTemplate loading={loading} title={t("jobs.labels.cards.parts")}>
         <PartsStatusPie joblines_status={joblines_status} />
+        <Table
+          key="id"
+          columns={columns}
+          dataSource={data ? data.joblines : []}
+        />
       </CardTemplate>
     </div>
   );

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

@@ -8,7 +8,18 @@ import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { DateFormatter } from "../../utils/DateFormatter";
 import AlertComponent from "../alert/alert.component";
 
-export default function JobLinesExpander({ jobline, jobid }) {
+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)(JobLinesExpander);
+
+export function JobLinesExpander({ jobline, jobid, bodyshop }) {
   const { t } = useTranslation();
   const { loading, error, data } = useQuery(GET_JOB_LINE_ORDERS, {
     fetchPolicy: "network-only",
@@ -23,7 +34,7 @@ export default function JobLinesExpander({ jobline, jobid }) {
 
   return (
     <Row>
-      <Col md={24} lg={12}>
+      <Col md={24} lg={8}>
         <Typography.Title level={4}>
           {t("parts_orders.labels.parts_orders")}
         </Typography.Title>
@@ -49,7 +60,7 @@ export default function JobLinesExpander({ jobline, jobid }) {
           )}
         </Timeline>
       </Col>
-      <Col md={24} lg={12}>
+      <Col md={24} lg={8}>
         <Typography.Title level={4}>{t("bills.labels.bills")}</Typography.Title>
         <Timeline>
           {data.billlines.length > 0 ? (
@@ -71,7 +82,7 @@ export default function JobLinesExpander({ jobline, jobid }) {
                   </Col>
                   <Col span={4}>
                     <span>
-                    {`${t("billlines.fields.actual_cost")}: `}
+                      {`${t("billlines.fields.actual_cost")}: `}
                       <CurrencyFormatter>{line.actual_cost}</CurrencyFormatter>
                     </span>
                   </Col>
@@ -89,6 +100,37 @@ export default function JobLinesExpander({ jobline, jobid }) {
           )}
         </Timeline>
       </Col>
+      <Col md={24} lg={8}>
+        <Typography.Title level={4}>
+          {t("parts_dispatch.labels.parts_dispatch")}
+        </Typography.Title>
+        <Timeline>
+          {data.parts_dispatch_lines.length > 0 ? (
+            data.parts_dispatch_lines.map((line) => (
+              <Timeline.Item key={line.id}>
+                <Space split={<Divider type="vertical" />} wrap>
+                  <Link to={`/manage/jobs/${jobid}?partsorderid=${line.id}`}>
+                    {line.parts_dispatch.number}
+                  </Link>
+                  {
+                    bodyshop.employees.find(
+                      (e) => e.id === line.parts_dispatch.employeeid
+                    )?.first_name
+                  }
+                  <Space>
+                    {t("parts_dispatch_lines.fields.accepted_at")}
+                    <DateFormatter>{line.accepted_at}</DateFormatter>
+                  </Space>
+                </Space>
+              </Timeline.Item>
+            ))
+          ) : (
+            <Timeline.Item>
+              {t("parts_orders.labels.notyetordered")}
+            </Timeline.Item>
+          )}
+        </Timeline>
+      </Col>
     </Row>
   );
 }

client/src/components/job-detail-lines/job-lines-part-price-change.component.jsx

@@ -0,0 +1,97 @@
+import { useMutation } from "@apollo/client";
+import { Button, Form, notification, Popover, Tooltip } from "antd";
+import { t } from "i18next";
+import React, { useState } from "react";
+import { UPDATE_LINE_PPC } from "../../graphql/jobs-lines.queries";
+import CurrencyFormatter from "../../utils/CurrencyFormatter";
+import CurrencyFormItemComponent from "../form-items-formatted/currency-form-item.component";
+import JobLineConvertToLabor from "../job-line-convert-to-labor/job-line-convert-to-labor.component";
+import axios from "axios";
+export default function JobLinesPartPriceChange({ job, line, refetch }) {
+  const [loading, setLoading] = useState(false);
+  const [updatePartPrice] = useMutation(UPDATE_LINE_PPC);
+
+  const handleFinish = async (values) => {
+    try {
+      setLoading(true);
+      const result = await updatePartPrice({
+        variables: {
+          id: line.id,
+          jobline: {
+            act_price_before_ppc: line.act_price_before_ppc
+              ? line.act_price_before_ppc
+              : line.act_price,
+            act_price: values.act_price,
+          },
+        },
+      });
+      await axios.post("/job/totalsssu", {
+        id: job.id,
+      });
+      if (result.errors) {
+        notification.open({
+          type: "error",
+          message: t("joblines.errors.saving", {
+            error: JSON.stringify(result.errors),
+          }),
+        });
+        if (refetch) refetch();
+      } else {
+        notification.open({
+          type: "success",
+          message: t("joblines.successes.saved"),
+        });
+      }
+    } catch (error) {
+      notification.open({
+        type: "error",
+        message: t("joblines.errors.saving", { error: JSON.stringify(error) }),
+      });
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const popcontent = (
+    <Form layout="vertical" onFinish={handleFinish} initialValues={{ act_price: line.act_price }}>
+      <Form.Item
+        name="act_price"
+        label={t("jobs.labels.act_price_ppc")}
+        rules={[{ required: true }]}
+      >
+        <CurrencyFormItemComponent />
+      </Form.Item>
+      <Button loading={loading} htmlType="primary">
+        {t("general.actions.save")}
+      </Button>
+    </Form>
+  );
+
+  return (
+    <JobLineConvertToLabor jobline={line} job={job}>
+      <Popover trigger="click" disabled={line.manual_line} content={popcontent}>
+        <CurrencyFormatter>
+          {line.db_ref === "900510" || line.db_ref === "900511"
+            ? line.prt_dsmk_m
+            : line.act_price}
+        </CurrencyFormatter>
+        {line.prt_dsmk_p && line.prt_dsmk_p !== 0 ? (
+          <span style={{ marginLeft: ".2rem" }}>{`(${line.prt_dsmk_p}%)`}</span>
+        ) : (
+          <></>
+        )}
+        {line.act_price_before_ppc && line.act_price_before_ppc !== 0 ? (
+          <Tooltip title={t("jobs.labels.ppc")}>
+            <span style={{ marginLeft: ".2rem", color: "tomato" }}>
+              (
+              <CurrencyFormatter>{line.act_price_before_ppc}</CurrencyFormatter>
+              )
+            </span>
+          </Tooltip>
+        ) : (
+          <></>
+        )}
+      </Popover>
+    </JobLineConvertToLabor>
+  );
+}

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

@@ -1,12 +1,12 @@
 import {
   DeleteFilled,
+  EditFilled,
   FilterFilled,
+  HomeOutlined,
+  MinusCircleTwoTone,
+  PlusCircleTwoTone,
   SyncOutlined,
   WarningFilled,
-  EditFilled,
-  PlusCircleTwoTone,
-  MinusCircleTwoTone,
-  HomeOutlined,
 } from "@ant-design/icons";
 import { useMutation } from "@apollo/client";
 import {
@@ -29,7 +29,6 @@ import { selectJobReadOnly } from "../../redux/application/application.selectors
 import { setModalContext } from "../../redux/modals/modals.actions";
 import { selectTechnician } from "../../redux/tech/tech.selectors";
 import { onlyUnique } from "../../utils/arrayHelper";
-import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { alphaSort } from "../../utils/sorters";
 import JobLineLocationPopup from "../job-line-location-popup/job-line-location-popup.component";
 import JobLineNotePopup from "../job-line-note-popup/job-line-note-popup.component";
@@ -38,13 +37,18 @@ import JobLinesBillRefernece from "../job-lines-bill-reference/job-lines-bill-re
 // import AllocationsAssignmentContainer from "../allocations-assignment/allocations-assignment.container";
 // import AllocationsBulkAssignmentContainer from "../allocations-bulk-assignment/allocations-bulk-assignment.container";
 // import AllocationsEmployeeLabelContainer from "../allocations-employee-label/allocations-employee-label.container";
-import PartsOrderModalContainer from "../parts-order-modal/parts-order-modal.container";
 import _ from "lodash";
-import JobCreateIOU from "../job-create-iou/job-create-iou.component";
-import JobLinesExpander from "./job-lines-expander.component";
-import { selectBodyshop } from "../../redux/user/user.selectors";
 import moment from "moment";
-import JobLineConvertToLabor from "../job-line-convert-to-labor/job-line-convert-to-labor.component";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import JobCreateIOU from "../job-create-iou/job-create-iou.component";
+import JobSendPartPriceChangeComponent from "../job-send-parts-price-change/job-send-parts-price-change.component";
+import PartsOrderModalContainer from "../parts-order-modal/parts-order-modal.container";
+import JobLinesExpander from "./job-lines-expander.component";
+import JobLinesPartPriceChange from "./job-lines-part-price-change.component";
+import JoblineTeamAssignment from "../job-line-team-assignment/job-line-team-assignmnent.component";
+import JobLineDispatchButton from "../job-line-dispatch-button/job-line-dispatch-button.component";
+import JobLineBulkAssignComponent from "../job-line-bulk-assign/job-line-bulk-assign.component";
+import { useTreatments } from "@splitsoftware/splitio-react";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -76,8 +80,16 @@ export function JobLinesComponent({
   setBillEnterContext,
 }) {
   const [deleteJobLine] = useMutation(DELETE_JOB_LINE_BY_PK);
-
+  const { Enhanced_Payroll } = useTreatments(
+    ["Enhanced_Payroll"],
+    {},
+    bodyshop.imexshopid
+  );
   const [selectedLines, setSelectedLines] = useState([]);
+  console.log(
+    "🚀 ~ file: job-lines.component.jsx:89 ~ selectedLines:",
+    selectedLines
+  );
   const [state, setState] = useState({
     sortedInfo: {},
     filteredInfo: {},
@@ -103,6 +115,12 @@ export function JobLinesComponent({
       fixed: "left",
       key: "line_desc",
       sorter: (a, b) => alphaSort(a.line_desc, b.line_desc),
+      onCell: (record) => ({
+        className: record.manual_line && "job-line-manual",
+        style: {
+          ...(record.critical ? { boxShadow: " -.5em 0 0 #FFC107" } : {}),
+        },
+      }),
       sortOrder:
         state.sortedInfo.columnKey === "line_desc" && state.sortedInfo.order,
       ellipsis: true,
@@ -115,10 +133,21 @@ export function JobLinesComponent({
       sortOrder:
         state.sortedInfo.columnKey === "oem_partno" && state.sortedInfo.order,
       ellipsis: true,
-      render: (text, record) =>
-        `${record.oem_partno || ""} ${
-          record.alt_partno ? `(${record.alt_partno})` : ""
-        }`.trim(),
+      onCell: (record) => ({
+        className: record.manual_line && "job-line-manual",
+        style: {
+          ...(record.parts_dispatch_lines[0]?.accepted_at
+            ? { boxShadow: " -.5em 0 0 #FFC107" }
+            : {}),
+        },
+      }),
+      render: (text, record) => (
+        <span class="ant-table-cell-content">
+          {`${record.oem_partno || ""} ${
+            record.alt_partno ? `(${record.alt_partno})` : ""
+          }`.trim()}
+        </span>
+      ),
     },
     {
       title: t("joblines.fields.op_code_desc"),
@@ -214,20 +243,7 @@ export function JobLinesComponent({
         state.sortedInfo.columnKey === "act_price" && state.sortedInfo.order,
       ellipsis: true,
       render: (text, record) => (
-        <JobLineConvertToLabor jobline={record} job={job}>
-          <CurrencyFormatter>
-            {record.db_ref === "900510" || record.db_ref === "900511"
-              ? record.prt_dsmk_m
-              : record.act_price}
-          </CurrencyFormatter>
-          {record.prt_dsmk_p && record.prt_dsmk_p !== 0 ? (
-            <span
-              style={{ marginLeft: ".2rem" }}
-            >{`(${record.prt_dsmk_p}%)`}</span>
-          ) : (
-            <></>
-          )}
-        </JobLineConvertToLabor>
+        <JobLinesPartPriceChange line={record} job={job} refetch={refetch} />
       ),
     },
     {
@@ -280,6 +296,23 @@ export function JobLinesComponent({
         state.sortedInfo.columnKey === "line_ind" && state.sortedInfo.order,
       responsive: ["md"],
     },
+    ...(Enhanced_Payroll.treatment === "on"
+      ? [
+          {
+            title: t("joblines.fields.assigned_team"),
+            dataIndex: "assigned_team",
+            key: "assigned_team",
+            render: (text, record) => (
+              <JoblineTeamAssignment
+                disabled={jobRO}
+                jobline={record}
+                jobId={job.id}
+              />
+            ),
+          },
+        ]
+      : []),
+
     {
       title: t("joblines.fields.notes"),
       dataIndex: "notes",
@@ -342,7 +375,7 @@ export function JobLinesComponent({
                 onClick={() => {
                   setJobLineEditContext({
                     actions: { refetch: refetch, submit: form && form.submit },
-                    context: record,
+                    context: { ...record, jobid: job.id },
                   });
                 }}
               >
@@ -395,10 +428,14 @@ export function JobLinesComponent({
       const markedTypes = [e.key];
       if (e.key === "PAN") markedTypes.push("PAP");
       if (e.key === "PAS") markedTypes.push("PASL");
-      setSelectedLines(
+      setSelectedLines((selectedLines) =>
         _.uniq([
           ...selectedLines,
-          ...jobLines.filter((item) => markedTypes.includes(item.part_type)),
+          ...jobLines.filter(
+            (item) =>
+              markedTypes.includes(item.part_type) ||
+              markedTypes.includes(item.mod_lbr_ty)
+          ),
         ])
       );
     }
@@ -411,6 +448,21 @@ export function JobLinesComponent({
       <Menu.Item key="PAL">{t("joblines.fields.part_types.PAL")}</Menu.Item>
       <Menu.Item key="PAS">{t("joblines.fields.part_types.PAS")}</Menu.Item>
       <Menu.Divider />
+      <Menu.Item key="LAA">{t("joblines.fields.lbr_types.LAA")}</Menu.Item>
+      <Menu.Item key="LAB">{t("joblines.fields.lbr_types.LAB")}</Menu.Item>
+      <Menu.Item key="LAD">{t("joblines.fields.lbr_types.LAD")}</Menu.Item>
+      <Menu.Item key="LAE">{t("joblines.fields.lbr_types.LAE")}</Menu.Item>
+      <Menu.Item key="LAF">{t("joblines.fields.lbr_types.LAF")}</Menu.Item>
+      <Menu.Item key="LAG">{t("joblines.fields.lbr_types.LAG")}</Menu.Item>
+      <Menu.Item key="LAM">{t("joblines.fields.lbr_types.LAM")}</Menu.Item>
+      <Menu.Item key="LAR">{t("joblines.fields.lbr_types.LAR")}</Menu.Item>
+      <Menu.Item key="LAS">{t("joblines.fields.lbr_types.LAS")}</Menu.Item>
+      <Menu.Item key="LAU">{t("joblines.fields.lbr_types.LAU")}</Menu.Item>
+      <Menu.Item key="LA1">{t("joblines.fields.lbr_types.LA1")}</Menu.Item>
+      <Menu.Item key="LA2">{t("joblines.fields.lbr_types.LA2")}</Menu.Item>
+      <Menu.Item key="LA3">{t("joblines.fields.lbr_types.LA3")}</Menu.Item>
+      <Menu.Item key="LA4">{t("joblines.fields.lbr_types.LA2")}</Menu.Item>
+      <Menu.Divider />
       <Menu.Item key="clear">{t("general.labels.clear")}</Menu.Item>
     </Menu>
   );
@@ -434,6 +486,18 @@ export function JobLinesComponent({
                 </Space>
               </Tag>
             )}
+            <JobLineDispatchButton
+              selectedLines={selectedLines}
+              setSelectedLines={setSelectedLines}
+              job={job}
+            />
+            {Enhanced_Payroll.treatment === "on" && (
+              <JobLineBulkAssignComponent
+                selectedLines={selectedLines}
+                setSelectedLines={setSelectedLines}
+                job={job}
+              />
+            )}
             <Button
               disabled={
                 (job && !job.converted) ||
@@ -442,15 +506,6 @@ export function JobLinesComponent({
                 technician
               }
               onClick={() => {
-                // setPartsOrderContext({
-                //   actions: { refetch: refetch },
-                //   context: {
-                //     jobId: job.id,
-                //     job: job,
-                //     linesToOrder: selectedLines,
-                //   },
-                // });
-
                 setBillEnterContext({
                   actions: { refetch: refetch },
                   context: {
@@ -557,6 +612,9 @@ export function JobLinesComponent({
             >
               {t("joblines.actions.new")}
             </Button>
+            {bodyshop.region_config.toLowerCase().startsWith("us") && (
+              <JobSendPartPriceChangeComponent job={job} />
+            )}
             <JobCreateIOU job={job} selectedJobLines={selectedLines} />
             <Input.Search
               placeholder={t("general.labels.search")}
@@ -608,8 +666,17 @@ export function JobLinesComponent({
           onSelectAll: (selected, selectedRows, changeRows) => {
             setSelectedLines(selectedRows);
           },
-          onSelect: (record, selected, selectedRows, nativeEvent) =>
-            setSelectedLines(selectedRows),
+          onSelect: (record, selected, selectedRows, nativeEvent) => {
+            if (selected) {
+              setSelectedLines((selectedLines) =>
+                _.uniqBy([...selectedLines, record], "id")
+              );
+            } else {
+              setSelectedLines((selectedLines) =>
+                selectedLines.filter((l) => l.id !== record.id)
+              );
+            }
+          },
         }}
       />
     </div>

client/src/components/job-line-bulk-assign/job-line-bulk-assign.component.jsx

@@ -0,0 +1,149 @@
+import React, { useState } from "react";
+
+import { useMutation } from "@apollo/client";
+import { Button, Form, Popover, Select, Space, notification } from "antd";
+import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { UPDATE_LINE_BULK_ASSIGN } from "../../graphql/jobs-lines.queries";
+import { selectJobReadOnly } from "../../redux/application/application.selectors";
+import {
+  selectBodyshop,
+  selectCurrentUser,
+} from "../../redux/user/user.selectors";
+import { insertAuditTrail } from "../../redux/application/application.actions";
+import AuditTrailMapping from "../../utils/AuditTrailMappings";
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop,
+  jobRO: selectJobReadOnly,
+  currentUser: selectCurrentUser,
+});
+const mapDispatchToProps = (dispatch) => ({
+  insertAuditTrail: ({ jobid, operation }) =>
+    dispatch(insertAuditTrail({ jobid, operation })),
+});
+export default connect(mapStateToProps, mapDispatchToProps)(JoblineBulkAssign);
+
+export function JoblineBulkAssign({
+  setSelectedLines,
+  selectedLines,
+  insertAuditTrail,
+  bodyshop,
+  jobRO,
+  job,
+  currentUser,
+}) {
+  const [visible, setVisible] = useState(false);
+  const [loading, setLoading] = useState(false);
+  const [form] = Form.useForm();
+
+  const { t } = useTranslation();
+  const [assignLines] = useMutation(UPDATE_LINE_BULK_ASSIGN);
+
+  const handleConvert = async (values) => {
+    try {
+      setLoading(true);
+      const result = await assignLines({
+        variables: {
+          jobline: {
+            assigned_team: values.assigned_team,
+          },
+          ids: selectedLines.map((l) => l.id),
+        },
+      });
+      if (result.errors) {
+        notification.open({
+          type: "error",
+          message: t("parts_dispatch.errors.creating", {
+            error: JSON.stringify(result.errors),
+          }),
+        });
+      } else {
+        //Insert the audit trail here.
+
+        const teamName = bodyshop.employee_teams.find(
+          (et) => et.id === values.assigned_team
+        )?.name;
+
+        const hours = selectedLines.reduce(
+          (acc, val) => (acc += val.mod_lb_hrs),
+          0
+        );
+
+        insertAuditTrail({
+          jobid: job.id,
+          operation: AuditTrailMapping.assignedlinehours(
+            teamName,
+            hours.toFixed(1)
+          ),
+        });
+        setSelectedLines([]);
+        setVisible(false);
+      }
+    } catch (error) {
+      notification.open({
+        type: "error",
+        message: t("parts_dispatch.errors.creating", {
+          error: error,
+        }),
+      });
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const popMenu = (
+    <div>
+      <Form layout="vertical" form={form} onFinish={handleConvert}>
+        <Form.Item
+          name={"assigned_team"}
+          label={t("joblines.fields.assigned_team")}
+          rules={[
+            {
+              required: true,
+              //message: t("general.validation.required"),
+            },
+          ]}
+        >
+          <Select
+            showSearch
+            style={{ width: 200 }}
+            optionFilterProp="children"
+            filterOption={(input, option) =>
+              option.props.children
+                .toLowerCase()
+                .indexOf(input.toLowerCase()) >= 0
+            }
+          >
+            {bodyshop.employee_teams.map((team) => (
+              <Select.Option value={team.id} key={team.id} name={team.name}>
+                {team.name}
+              </Select.Option>
+            ))}
+          </Select>
+        </Form.Item>
+
+        <Space wrap>
+          <Button type="danger" onClick={() => form.submit()} loading={loading}>
+            {t("general.actions.save")}
+          </Button>
+          <Button onClick={() => setVisible(false)}>
+            {t("general.actions.cancel")}
+          </Button>
+        </Space>
+      </Form>
+    </div>
+  );
+
+  return (
+    <Popover open={visible} content={popMenu}>
+      <Button
+        disabled={selectedLines.length === 0 || jobRO}
+        loading={loading}
+        onClick={() => setVisible(true)}
+      >
+        {t("joblines.actions.assign_team", { count: selectedLines.length })}
+      </Button>
+    </Popover>
+  );
+}

client/src/components/job-line-dispatch-button/job-line-dispatch-button.component.jsx

@@ -0,0 +1,167 @@
+import React, { useState } from "react";
+
+import { useMutation } from "@apollo/client";
+import { Button, Form, Popover, Select, Space, notification } from "antd";
+import moment from "moment";
+import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { INSERT_PARTS_DISPATCH } from "../../graphql/parts-dispatch.queries";
+import { selectJobReadOnly } from "../../redux/application/application.selectors";
+import {
+  selectBodyshop,
+  selectCurrentUser,
+} from "../../redux/user/user.selectors";
+import { GenerateDocument } from "../../utils/RenderTemplate";
+import { TemplateList } from "../../utils/TemplateConstants";
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop,
+  jobRO: selectJobReadOnly,
+  currentUser: selectCurrentUser,
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(JobLineDispatchButton);
+
+export function JobLineDispatchButton({
+  setSelectedLines,
+  selectedLines,
+
+  bodyshop,
+  jobRO,
+  job,
+  currentUser,
+}) {
+  const [visible, setVisible] = useState(false);
+  const [loading, setLoading] = useState(false);
+  const [form] = Form.useForm();
+  const Templates = TemplateList("job_special", {
+    ro_number: job.ro_number,
+  });
+  const { t } = useTranslation();
+  const [dispatchLines] = useMutation(INSERT_PARTS_DISPATCH);
+
+  const handleConvert = async (values) => {
+    try {
+      setLoading(true);
+      //THIS HAS NOT YET BEEN TESTED. START BY FINISHING THIS FUNCTION.
+      const result = await dispatchLines({
+        variables: {
+          partsDispatch: {
+            dispatched_at: moment(),
+            employeeid: values.employeeid,
+            jobid: job.id,
+            dispatched_by: currentUser.email,
+            parts_dispatch_lines: {
+              data: selectedLines.map((l) => ({
+                joblineid: l.id,
+                quantity: l.part_qty,
+              })),
+            },
+          },
+          //joblineids: selectedLines.map((l) => l.id),
+        },
+      });
+      if (result.errors) {
+        notification.open({
+          type: "error",
+          message: t("parts_dispatch.errors.creating", {
+            error: result.errors,
+          }),
+        });
+      } else {
+        setSelectedLines([]);
+        await GenerateDocument(
+          {
+            name: Templates.parts_dispatch.key,
+            variables: {
+              id: result.data.insert_parts_dispatch_one.id,
+            },
+          },
+          {},
+          "p"
+        );
+      }
+      setVisible(false);
+    } catch (error) {
+      notification.open({
+        type: "error",
+        message: t("parts_dispatch.errors.creating", {
+          error: error,
+        }),
+      });
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const popMenu = (
+    <div>
+      <Form layout="vertical" form={form} onFinish={handleConvert}>
+        <Form.Item
+          name={"employeeid"}
+          label={t("timetickets.fields.employee")}
+          rules={[
+            {
+              required: true,
+              //message: t("general.validation.required"),
+            },
+          ]}
+        >
+          <Select
+            showSearch
+            style={{ width: 200 }}
+            optionFilterProp="children"
+            filterOption={(input, option) =>
+              option.props.children
+                .toLowerCase()
+                .indexOf(input.toLowerCase()) >= 0
+            }
+          >
+            {bodyshop.employees
+              .filter((emp) => emp.active)
+              .map((emp) => (
+                <Select.Option
+                  value={emp.id}
+                  key={emp.id}
+                  name={`${emp.first_name} ${emp.last_name}`}
+                >
+                  {`${emp.first_name} ${emp.last_name}`}
+                </Select.Option>
+              ))}
+          </Select>
+        </Form.Item>
+
+        <Space wrap>
+          <Button
+            type="danger"
+            onClick={() => form.submit()}
+            loading={loading}
+            disabled={selectedLines.length === 0}
+          >
+            {t("general.actions.save")}
+          </Button>
+          <Button onClick={() => setVisible(false)}>
+            {t("general.actions.cancel")}
+          </Button>
+        </Space>
+      </Form>
+    </div>
+  );
+
+  return (
+    <Popover open={visible} content={popMenu}>
+      <Button
+        disabled={selectedLines.length === 0 || jobRO}
+        loading={loading}
+        onClick={() => setVisible(true)}
+      >
+        {t("joblines.actions.dispatchparts", { count: selectedLines.length })}
+      </Button>
+    </Popover>
+  );
+}

client/src/components/job-line-location-popup/job-line-location-popup.component.jsx

@@ -1,4 +1,4 @@
-import { notification, Select } from "antd";
+import { notification, Select, Space } from "antd";
 import React, { useEffect, useState } from "react";
 import { useMutation } from "@apollo/client";
 import { useTranslation } from "react-i18next";
@@ -75,7 +75,10 @@ export function JobLineLocationPopup({ bodyshop, jobline, disabled }) {
       style={{ width: "100%", minHeight: "2rem", cursor: "pointer" }}
       onClick={() => !disabled && setEditing(true)}
     >
-      {jobline.location}
+      <Space wrap>
+        {jobline.location}
+        {jobline.parts_dispatch_lines?.length > 0 && "-Disp"}
+      </Space>
     </div>
   );
 }

client/src/components/job-line-team-assignment/job-line-team-assignmnent.component.jsx

@@ -0,0 +1,115 @@
+import { notification, Select } from "antd";
+import React, { useEffect, useState } from "react";
+import { useMutation } from "@apollo/client";
+import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { UPDATE_JOB_LINE } from "../../graphql/jobs-lines.queries";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import LoadingSpinner from "../loading-spinner/loading-spinner.component";
+import { insertAuditTrail } from "../../redux/application/application.actions";
+import AuditTrailMapping from "../../utils/AuditTrailMappings";
+
+const mapStateToProps = createStructuredSelector({
+  //currentUser: selectCurrentUser
+  bodyshop: selectBodyshop,
+});
+const mapDispatchToProps = (dispatch) => ({
+  insertAuditTrail: ({ jobid, operation }) =>
+    dispatch(insertAuditTrail({ jobid, operation })),
+});
+
+export function JoblineTeamAssignment({
+  bodyshop,
+  jobline,
+  disabled,
+  jobId,
+  insertAuditTrail,
+}) {
+  const [editing, setEditing] = useState(false);
+  const [loading, setLoading] = useState(false);
+  const [assignedTeam, setAssignedTeam] = useState(jobline.assigned_team);
+  const [updateJob] = useMutation(UPDATE_JOB_LINE);
+  const { t } = useTranslation();
+
+  useEffect(() => {
+    if (editing) setAssignedTeam(jobline.assigned_team);
+  }, [editing, jobline.assigned_team]);
+
+  const handleChange = (e) => {
+    setAssignedTeam(e);
+  };
+
+  const handleSave = async (e) => {
+    setLoading(true);
+    const result = await updateJob({
+      variables: {
+        lineId: jobline.id,
+        line: { assigned_team: assignedTeam },
+      },
+    });
+
+    if (!!!result.errors) {
+      notification["success"]({ message: t("joblines.successes.saved") });
+      //insert the audit trail here.
+      const teamName = bodyshop.employee_teams.find(
+        (et) => et.id === assignedTeam
+      )?.name;
+      insertAuditTrail({
+        jobid: jobId,
+        operation: AuditTrailMapping.assignedlinehours(
+          teamName,
+          jobline.mod_lb_hrs
+        ),
+      });
+    } else {
+      notification["error"]({
+        message: t("joblines.errors.saving", {
+          error: JSON.stringify(result.errors),
+        }),
+      });
+    }
+    setLoading(false);
+    setEditing(false);
+  };
+
+  if (editing)
+    return (
+      <div>
+        <LoadingSpinner loading={loading}>
+          <Select
+            autoFocus
+            allowClear
+            dropdownMatchSelectWidth={100}
+            value={assignedTeam}
+            onSelect={handleChange}
+            onBlur={handleSave}
+            onClear={() => handleChange(null)}
+          >
+            {Object.values(bodyshop.employee_teams).map((s, idx) => (
+              <Select.Option key={idx} value={s.id}>
+                {s.name}
+              </Select.Option>
+            ))}
+          </Select>
+        </LoadingSpinner>
+      </div>
+    );
+
+  const team = bodyshop.employee_teams.find(
+    (tm) => tm.id === jobline.assigned_team
+  );
+
+  return (
+    <div
+      style={{ width: "100%", minHeight: "1rem", cursor: "pointer" }}
+      onClick={() => !disabled && setEditing(true)}
+    >
+      {team?.name}
+    </div>
+  );
+}
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(JoblineTeamAssignment);

client/src/components/job-lines-bill-reference/job-lines-bill-reference.component.jsx

@@ -8,7 +8,7 @@ export default function JobLinesBillRefernece({ jobline }) {
   return (
     <div style={{ color: subletRequired && "tomato" }}>
       {subletRequired && <WarningFilled />}
-      {`${(billLine.actual_price * billLine.quantity).toFixed(2)} (${
+      {`${billLine.actual_price.toFixed(2)} x ${billLine.quantity} (${
         billLine.bill.vendor.name
       } #${billLine.bill.invoice_number})`}
     </div>

client/src/components/job-lines-preset-button/job-lines-preset-button.component.jsx

@@ -22,9 +22,20 @@ export function JoblinePresetButton({ bodyshop, form }) {
   };
 
   const menu = (
-    <Menu>
+    <Menu
+      style={{
+        columnCount: Math.max(
+          Math.floor(bodyshop.md_jobline_presets.length / 15),
+          1
+        ),
+      }}
+    >
       {bodyshop.md_jobline_presets.map((i, idx) => (
-        <Menu.Item onClick={() => handleSelect(i)}  key={idx}>
+        <Menu.Item
+          onClick={() => handleSelect(i)}
+          key={idx}
+          style={{ breakInside: "avoid" }}
+        >
           {i.label}
         </Menu.Item>
       ))}

client/src/components/job-lines-upsert-modal/job-lines-upsert-modal.component.jsx

@@ -40,6 +40,11 @@ export function JobLinesUpsertModalComponent({
     {},
     bodyshop.imexshopid
   );
+  const { Autohouse_Detail_line } = useTreatments(
+    ["Autohouse_Detail_line"],
+    {},
+    bodyshop.imexshopid
+  );
 
   return (
     <Modal
@@ -155,6 +160,40 @@ export function JobLinesUpsertModalComponent({
           >
             <InputNumber precision={1} />
           </Form.Item>
+          {Autohouse_Detail_line.treatment === "on" && (
+            <Form.Item
+              label={t("joblines.fields.ah_detail_line")}
+              name="ah_detail_line"
+              valuePropName="checked"
+              dependencies={["mod_lbr_ty"]}
+              initialValue={false}
+              rules={[
+                ({ getFieldValue }) => ({
+                  validator(rule, value) {
+                    if (
+                      value === false ||
+                      value === undefined ||
+                      value === null
+                    )
+                      return Promise.resolve();
+                    if (
+                      value === true &&
+                      ["LA1", "LA2", "LA3", "LA4", "LAU"].includes(
+                        getFieldValue("mod_lbr_ty")
+                      )
+                    ) {
+                      return Promise.resolve();
+                    }
+                    return Promise.reject(
+                      t("joblines.validations.ahdetailonlyonuserdefinedtypes")
+                    );
+                  },
+                }),
+              ]}
+            >
+              <Switch />
+            </Form.Item>
+          )}
         </LayoutFormRow>
         <LayoutFormRow>
           <Form.Item label={t("joblines.fields.part_type")} name="part_type">
@@ -218,7 +257,6 @@ export function JobLinesUpsertModalComponent({
             rules={[
               ({ getFieldValue }) => ({
                 validator(rule, value) {
-                  console.log(value);
                   if (!value || getFieldValue("part_type") !== "PAE") {
                     return Promise.resolve();
                   }
@@ -229,7 +267,6 @@ export function JobLinesUpsertModalComponent({
               }),
               ({ getFieldValue }) => ({
                 validator(rule, value) {
-                  console.log(value, !!value);
                   if (
                     !!getFieldValue("part_type") === (!!value || value === 0)
                   ) {
@@ -252,7 +289,7 @@ export function JobLinesUpsertModalComponent({
             name="prt_dsmk_p"
             initialValue={0}
           >
-            <InputNumber precision={0} min={0} max={100} />
+            <InputNumber precision={0} min={-100} max={100} />
           </Form.Item>
           <Form.Item
             label={t("joblines.fields.tax_part")}

client/src/components/job-lines-upsert-modal/job-lines-upsert-modal.container.jsx

@@ -13,8 +13,13 @@ import { selectJobLineEditModal } from "../../redux/modals/modals.selectors";
 import UndefinedToNull from "../../utils/undefinedtonull";
 import JobLinesUpdsertModal from "./job-lines-upsert-modal.component";
 import Axios from "axios";
+import Dinero from "dinero.js";
+import CriticalPartsScan from "../../utils/criticalPartsScan";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import { useTreatments } from "@splitsoftware/splitio-react";
 const mapStateToProps = createStructuredSelector({
   jobLineEditModal: selectJobLineEditModal,
+  bodyshop: selectBodyshop,
 });
 const mapDispatchToProps = (dispatch) => ({
   toggleModalVisible: () => dispatch(toggleModalVisible("jobLineEdit")),
@@ -23,7 +28,13 @@ const mapDispatchToProps = (dispatch) => ({
 function JobLinesUpsertModalContainer({
   jobLineEditModal,
   toggleModalVisible,
+  bodyshop,
 }) {
+  const { CriticalPartsScanning } = useTreatments(
+    ["CriticalPartsScanning"],
+    {},
+    bodyshop.imexshopid
+  );
   const { t } = useTranslation();
   const [insertJobLine] = useMutation(INSERT_NEW_JOB_LINE);
   const [updateJobLine] = useMutation(UPDATE_JOB_LINE);
@@ -40,7 +51,15 @@ function JobLinesUpsertModalContainer({
               manual_line: !(
                 jobLineEditModal.context && jobLineEditModal.context.id
               ),
-              ...UndefinedToNull(values),
+              ...UndefinedToNull({
+                ...values,
+                prt_dsmk_m: Dinero({
+                  amount: Math.round((values.act_price || 0) * 100),
+                })
+                  .percentage(Math.abs(values.prt_dsmk_p || 0))
+                  .multiply(values.prt_dsmk_p >= 0 ? 1 : -1)
+                  .toFormat(0.0),
+              }),
             },
           ],
         },
@@ -68,7 +87,15 @@ function JobLinesUpsertModalContainer({
       const r = await updateJobLine({
         variables: {
           lineId: jobLineEditModal.context.id,
-          line: values,
+          line: {
+            ...values,
+            prt_dsmk_m: Dinero({
+              amount: Math.round(values.act_price * 100),
+            })
+              .percentage(Math.abs(values.prt_dsmk_p || 0))
+              .multiply(values.prt_dsmk_p >= 0 ? 1 : -1)
+              .toFormat(0.0),
+          },
         },
         refetchQueries: ["GET_LINE_TICKET_BY_PK"],
       });
@@ -92,6 +119,9 @@ function JobLinesUpsertModalContainer({
       }
       toggleModalVisible();
     }
+    if (CriticalPartsScanning.treatment === "on") {
+      CriticalPartsScan(jobLineEditModal.context.jobid);
+    }
     setLoading(false);
   };
 

client/src/components/job-payments/job-payments.component.jsx

@@ -1,19 +1,26 @@
-import { Button, Card, Space, Table } from "antd";
 import { EditFilled } from "@ant-design/icons";
+import { Button, Card, Space, Table } from "antd";
 import Dinero from "dinero.js";
 import React, { useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectJobReadOnly } from "../../redux/application/application.selectors";
+import {
+  openChatByPhone,
+  setMessage,
+} from "../../redux/messaging/messaging.actions";
 import { setModalContext } from "../../redux/modals/modals.actions";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { DateFormatter } from "../../utils/DateFormatter";
-import { alphaSort, dateSort } from "../../utils/sorters";
 import { TemplateList } from "../../utils/TemplateConstants";
+import { alphaSort, dateSort } from "../../utils/sorters";
 import DataLabel from "../data-label/data-label.component";
+import PaymentExpandedRowComponent from "../payment-expanded-row/payment-expanded-row.component";
+import PaymentsGenerateLink from "../payments-generate-link/payments-generate-link.component";
 import PrintWrapperComponent from "../print-wrapper/print-wrapper.component";
+import { useTreatments } from "@splitsoftware/splitio-react";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -23,22 +30,34 @@ const mapStateToProps = createStructuredSelector({
 const mapDispatchToProps = (dispatch) => ({
   setPaymentContext: (context) =>
     dispatch(setModalContext({ context: context, modal: "payment" })),
+  setCardPaymentContext: (context) =>
+    dispatch(setModalContext({ context: context, modal: "cardPayment" })),
+  openChatByPhone: (phone) => dispatch(openChatByPhone(phone)),
+  setMessage: (text) => dispatch(setMessage(text)),
 });
 
-const stripeTestEnv = process.env.REACT_APP_STRIPE_PUBLIC_KEY; //.includes("test");
-
 export function JobPayments({
   job,
   jobRO,
   bodyshop,
+  setMessage,
+  openChatByPhone,
   setPaymentContext,
+  setCardPaymentContext,
   refetch,
 }) {
+  const { ImEXPay } = useTreatments(
+    ["ImEXPay"],
+    {},
+    bodyshop && bodyshop.imexshopid
+  );
+
   const { t } = useTranslation();
   const [state, setState] = useState({
     sortedInfo: {},
     filteredInfo: {},
   });
+
   const columns = [
     {
       title: t("payments.fields.date"),
@@ -94,23 +113,6 @@ export function JobPayments({
         state.sortedInfo.columnKey === "transactionid" &&
         state.sortedInfo.order,
     },
-    {
-      title: t("payments.fields.stripeid"),
-      dataIndex: "stripeid",
-      key: "stripeid",
-      render: (text, record) =>
-        record.stripeid ? (
-          <a
-            href={
-              stripeTestEnv
-                ? `https://dashboard.stripe.com/${bodyshop.stripe_acct_id}/test/payments/${record.stripeid}`
-                : `https://dashboard.stripe.com/${bodyshop.stripe_acct_id}/payments/${record.stripeid}`
-            }
-          >
-            {record.stripeid}
-          </a>
-        ) : null,
-    },
     {
       title: t("general.labels.actions"),
       dataIndex: "actions",
@@ -118,7 +120,7 @@ export function JobPayments({
       render: (text, record) => (
         <Space wrap>
           <Button
-            disabled={record.exportedat}
+            // disabled={record.exportedat}
             onClick={() => {
               setPaymentContext({
                 actions: { refetch: refetch },
@@ -168,6 +170,21 @@ export function JobPayments({
       title={t("payments.labels.title")}
       extra={
         <Space wrap>
+          {ImEXPay.treatment === "on" && (
+            <>
+              <Button
+                onClick={() =>
+                  setCardPaymentContext({
+                    actions: { refetch },
+                    context: { jobid: job.id, balance },
+                  })
+                }
+              >
+                {t("menus.header.entercardpayment")}
+              </Button>
+              <PaymentsGenerateLink job={job} />
+            </>
+          )}
           <Button
             disabled={!job.converted}
             onClick={() =>
@@ -179,6 +196,7 @@ export function JobPayments({
           >
             {t("menus.header.enterpayment")}
           </Button>
+
           <DataLabel
             valueStyle={{ color: balance.getAmount() !== 0 ? "red" : "green" }}
             label={t("payments.labels.balance")}
@@ -197,6 +215,11 @@ export function JobPayments({
         scroll={{
           x: true,
         }}
+        expandable={{
+          expandedRowRender: (record) => (
+            <PaymentExpandedRowComponent record={record} bodyshop={bodyshop} />
+          ),
+        }}
         summary={() => (
           <>
             <Table.Summary.Row>

client/src/components/job-profile-data-warning/job-profile-data-warning.component.jsx

@@ -0,0 +1,18 @@
+import { Alert } from "antd";
+import React from "react";
+import { useTranslation } from "react-i18next";
+
+export default function JobProfileDataWarning({ job }) {
+  const { t } = useTranslation();
+
+  let missingProfileInfo =
+    Object.keys(job.cieca_pft).length === 0 ||
+    Object.keys(job.cieca_pfl).length === 0 ||
+    Object.keys(job.materials).length === 0;
+
+  if (missingProfileInfo)
+    return (
+      <Alert type="error" message={t("jobs.labels.missingprofileinfo")}></Alert>
+    );
+  return null;
+}

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

@@ -166,6 +166,16 @@ export default function ScoreboardAddButton({
         painthrs: 0,
       }
     );
+
+    //Add Labor Adjustments
+    v.painthrs = v.painthrs + (job.lbr_adjustments.LAR || 0);
+    v.bodyhrs =
+      v.bodyhrs +
+      Object.keys(job.lbr_adjustments)
+        .filter((key) => key !== "LAR")
+        .reduce((acc, val) => {
+          return acc + job.lbr_adjustments[val];
+        }, 0);
     form.setFieldsValue({
       date: new moment(),
       bodyhrs: Math.round(v.bodyhrs * 10) / 10,

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

@@ -33,7 +33,9 @@ const JobSearchSelect = (
     useLazyQuery(SEARCH_JOBS_BY_ID_FOR_AUTOCOMPLETE);
 
   const executeSearch = (v) => {
-    if (v && v !== "") callSearch(v);
+    console.log(v);
+    if (v && v.variables?.search !== "" && v.variables.search.length >= 2)
+      callSearch(v);
   };
   const debouncedExecuteSearch = _.debounce(executeSearch, 500);
 

client/src/components/job-send-parts-price-change/job-send-parts-price-change.component.jsx

@@ -0,0 +1,31 @@
+import { Button, notification } from "antd";
+import axios from "axios";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+
+export default function JobSendPartPriceChangeComponent({ job }) {
+  const { t } = useTranslation();
+  const [loading, setLoading] = useState(false);
+  const handleClick = async () => {
+    setLoading(true);
+    try {
+      const ppcData = await axios.post("/job/ppc", { jobid: job.id });
+      await axios.post("http://localhost:1337/ppc/", ppcData.data);
+    } catch (error) {
+      notification.open({
+        type: "error",
+        message: t("jobs.errors.partspricechange", {
+          error: JSON.stringify(error),
+        }),
+      });
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <Button onClick={handleClick} loading={loading}>
+      {t("jobs.actions.sendpartspricechange")}
+    </Button>
+  );
+}

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

@@ -67,7 +67,8 @@ export function JobsTotalsTableComponent({ jobRO, currentUser, job }) {
                 <JobTotalsTableTotals job={job} />
               </Card>
             </Col>
-            {currentUser.email.includes("@imex.") && (
+            {(currentUser.email.includes("@imex.") ||
+              currentUser.email.includes("@rome.")) && (
               <Col span={24}>
                 <Card title="DEVELOPMENT USE ONLY">
                   <JobCalculateTotals job={job} disabled={jobRO} />

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

@@ -123,11 +123,10 @@ export default function JobTotalsTableLabor({ job }) {
               <Space>
                 {t("jobs.labels.mapa")}
                 {job.materials &&
-                  job.materials.mapa &&
-                  job.materials.mapa.cal_maxdlr &&
-                  job.materials.mapa.cal_maxdlr > 0 &&
+                  job.materials.MAPA &&
+                  job.materials.MAPA.cal_maxdlr !== undefined &&
                   t("jobs.labels.threshhold", {
-                    amount: job.materials.mapa.cal_maxdlr,
+                    amount: job.materials.MAPA.cal_maxdlr,
                   })}
               </Space>
             </Table.Summary.Cell>
@@ -148,11 +147,10 @@ export default function JobTotalsTableLabor({ job }) {
               <Space wrap>
                 {t("jobs.labels.mash")}
                 {job.materials &&
-                  job.materials.mash &&
-                  job.materials.mash.cal_maxdlr &&
-                  job.materials.mash.cal_maxdlr > 0 &&
+                  job.materials.MASH &&
+                  job.materials.MASH.cal_maxdlr !== undefined &&
                   t("jobs.labels.threshhold", {
-                    amount: job.materials.mash.cal_maxdlr,
+                    amount: job.materials.MASH.cal_maxdlr,
                   })}
               </Space>
             </Table.Summary.Cell>

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

@@ -11,6 +11,22 @@ export default function JobTotalsTableParts({ job }) {
     filteredInfo: {},
   });
 
+  const insuranceAdjustments = useMemo(() => {
+    if (!job.job_totals) return [];
+    if (!job.job_totals?.parts?.adjustments) return [];
+    const adjs = [];
+    Object.keys(job.job_totals?.parts?.adjustments).forEach((key) => {
+      if (Dinero(job.job_totals?.parts?.adjustments[key]).getAmount() !== 0) {
+        adjs.push({
+          id: key,
+          amount: Dinero(job.job_totals.parts.adjustments[key]),
+        });
+      }
+    });
+
+    return adjs;
+  }, [job.job_totals]);
+
   const data = useMemo(() => {
     return Object.keys(job.job_totals.parts.parts.list)
       .filter(
@@ -74,11 +90,11 @@ export default function JobTotalsTableParts({ job }) {
             <Table.Summary.Cell>
               {t("jobs.labels.prt_dsmk_total")}
             </Table.Summary.Cell>
-
             <Table.Summary.Cell align="right">
               {Dinero(job.job_totals.parts.parts.prt_dsmk_total).toFormat()}
             </Table.Summary.Cell>
           </Table.Summary.Row>
+
           <Table.Summary.Row>
             <Table.Summary.Cell>
               <strong>{t("jobs.labels.partstotal")}</strong>
@@ -90,6 +106,24 @@ export default function JobTotalsTableParts({ job }) {
               </strong>
             </Table.Summary.Cell>
           </Table.Summary.Row>
+          {insuranceAdjustments.length > 0 && (
+            <Table.Summary.Row>
+              <Table.Summary.Cell colSpan={24}>
+                {t("jobs.labels.profileadjustments")}
+              </Table.Summary.Cell>
+            </Table.Summary.Row>
+          )}
+          {insuranceAdjustments.map((adj, idx) => (
+            <Table.Summary.Row key={idx}>
+              <Table.Summary.Cell>
+                {t(`jobs.fields.${adj.id.toLowerCase()}`)}
+              </Table.Summary.Cell>
+
+              <Table.Summary.Cell align="right">
+                {adj.amount.toFormat()}
+              </Table.Summary.Cell>
+            </Table.Summary.Row>
+          ))}
         </>
       )}
     />

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

@@ -28,26 +28,46 @@ export function JobTotalsTableTotals({ bodyshop, job }) {
         total: job.job_totals.totals.subtotal,
         bold: true,
       },
-      {
-        key: t("jobs.labels.local_tax_amt"),
-        total: job.job_totals.totals.local_tax,
-      },
-      {
-        key: t("jobs.labels.state_tax_amt"),
-        total: job.job_totals.totals.state_tax,
-      },
-      ...(bodyshop.region_config === "CA_BC"
+
+      ...(job.job_totals.totals.us_sales_tax_breakdown
         ? [
             {
-              key: t("jobs.fields.ca_bc_pvrt"),
-              total: job.job_totals.additional.pvrt,
+              key:
+                bodyshop.md_responsibility_centers.taxes.tax_ty1?.tax_type1 ||
+                "T1",
+              total: job.job_totals.totals.us_sales_tax_breakdown.ty1Tax,
+            },
+            {
+              key:
+                bodyshop.md_responsibility_centers.taxes.tax_ty2?.tax_type2 ||
+                "T2",
+              total: job.job_totals.totals.us_sales_tax_breakdown.ty2Tax,
+            },
+            {
+              key:
+                bodyshop.md_responsibility_centers.taxes.tax_ty3?.tax_type3 ||
+                "T3",
+              total: job.job_totals.totals.us_sales_tax_breakdown.ty3Tax,
+            },
+            {
+              key:
+                bodyshop.md_responsibility_centers.taxes.tax_ty4?.tax_type4 ||
+                "T4",
+              total: job.job_totals.totals.us_sales_tax_breakdown.ty4Tax,
+            },
+            {
+              key:
+                bodyshop.md_responsibility_centers.taxes.tax_ty5?.tax_type5 ||
+                "T5",
+              total: job.job_totals.totals.us_sales_tax_breakdown.ty5Tax,
             },
           ]
-        : []),
-      {
-        key: t("jobs.labels.federal_tax_amt"),
-        total: job.job_totals.totals.federal_tax,
-      },
+        : [
+            {
+              key: t("jobs.labels.state_tax_amt"),
+              total: job.job_totals.totals.state_tax,
+            },
+          ]),
       {
         key: t("jobs.labels.total_repairs"),
         total: job.job_totals.totals.total_repairs,
@@ -57,10 +77,10 @@ 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,
-      },
+      // {
+      //   key: t("jobs.fields.federal_tax_payable"),
+      //   total: job.job_totals.totals.custPayable.federal_tax,
+      // },
       {
         key: t("jobs.fields.other_amount_payable"),
         total: job.job_totals.totals.custPayable.other_customer_amount,
@@ -81,7 +101,7 @@ export function JobTotalsTableTotals({ bodyshop, job }) {
         bold: true,
       },
     ];
-  }, [job.job_totals, t, bodyshop.region_config]);
+  }, [job.job_totals, t, bodyshop.md_responsibility_centers]);
 
   const columns = [
     {

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

@@ -1,14 +1,14 @@
-import FormFieldsChanged from "../form-fields-changed-alert/form-fields-changed-alert.component";
 import { useMutation } from "@apollo/client";
 import { Button, Form, notification } from "antd";
+import moment from "moment";
 import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { UPDATE_JOB } from "../../graphql/jobs.queries";
-import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component";
-import LayoutFormRow from "../layout-form-row/layout-form-row.component";
-import moment from "moment";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
 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";
 
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -38,8 +38,8 @@ export function JobsAdminDatesChange({ insertAuditTrail, job }) {
     setLoading(true);
     const result = await updateJob({
       variables: { jobId: job.id, job: values },
-      refetchQueries: ['GET_JOB_BY_PK'],
-      awaitRefetchQueries:true
+      refetchQueries: ["GET_JOB_BY_PK"],
+      awaitRefetchQueries: true,
     });
 
     const changedAuditFields = form.getFieldsValue(
@@ -126,7 +126,10 @@ export function JobsAdminDatesChange({ insertAuditTrail, job }) {
           <Form.Item label={t("jobs.fields.actual_in")} name="actual_in">
             <DateTimePicker />
           </Form.Item>
-          <Form.Item label={t("jobs.fields.date_repairstarted")} name="date_repairstarted">
+          <Form.Item
+            label={t("jobs.fields.date_repairstarted")}
+            name="date_repairstarted"
+          >
             <DateTimePicker />
           </Form.Item>
           <Form.Item
@@ -173,6 +176,9 @@ export function JobsAdminDatesChange({ insertAuditTrail, job }) {
           >
             <DateTimePicker />
           </Form.Item>
+          <Form.Item label={t("jobs.fields.date_void")} name="date_void">
+            <DateTimePicker />
+          </Form.Item>
         </LayoutFormRow>
       </Form>
 

client/src/components/jobs-admin-mark-reexport/jobs-admin-mark-reexport.component.jsx

@@ -1,19 +1,18 @@
-import { useMutation } from "@apollo/client";
+import { gql, useMutation } from "@apollo/client";
 import { Button, notification } from "antd";
-import { gql } from "@apollo/client";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 
+import moment from "moment";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
+import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
+import { insertAuditTrail } from "../../redux/application/application.actions";
 import {
   selectBodyshop,
   selectCurrentUser,
 } from "../../redux/user/user.selectors";
-import moment from "moment";
 import AuditTrailMapping from "../../utils/AuditTrailMappings";
-import { insertAuditTrail } from "../../redux/application/application.actions";
-import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
   currentUser: selectCurrentUser,
@@ -150,6 +149,10 @@ export function JobAdminMarkReexport({
 
     if (!result.errors) {
       notification["success"]({ message: t("jobs.successes.save") });
+      insertAuditTrail({
+        jobid: job.id,
+        operation: AuditTrailMapping.admin_jobuninvoice(),
+      });
     } else {
       notification["error"]({
         message: t("jobs.errors.saving", {

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

@@ -33,8 +33,9 @@ export function JobsAdminUnvoid({
 mutation UNVOID_JOB($jobId: uuid!) {
   update_jobs_by_pk(pk_columns: {id: $jobId}, _set: {voided: false, status: "${
     bodyshop.md_ro_statuses.default_imported
-  }"}) {
+  }", date_void: null}) {
     id
+    date_void
     voided
     status
   }

client/src/components/jobs-available-table/jobs-available-supplement.estlines.util.js

@@ -25,7 +25,7 @@ export const GetSupplementDelta = async (client, jobId, newLines) => {
       //Found a relevant matching line. Add it to lines to update.
       linesToUpdate.push({
         id: existingLines[matchingIndex].id,
-        newData: { ...newLine, removed: false },
+        newData: { ...newLine, removed: false, act_price_before_ppc: null },
       });
 
       //Splice out item we found for performance.
@@ -50,7 +50,6 @@ export const GetSupplementDelta = async (client, jobId, newLines) => {
     .reduce((acc, value, idx) => {
       return acc + generateRemoveQuery(value, idx);
     }, "");
-  console.log(insertQueries, updateQueries, removeQueries);
 
   if ((insertQueries + updateQueries + removeQueries).trim() === "") {
     return new Promise((resolve, reject) => {

client/src/components/jobs-available-table/jobs-available-table.container.jsx

@@ -5,9 +5,10 @@ import {
   useMutation,
   useQuery,
 } from "@apollo/client";
-import { Col, notification, Row } from "antd";
+import { useTreatments } from "@splitsoftware/splitio-react";
+import { Button, Col, Row, notification } from "antd";
 import Axios from "axios";
-import Dinero from "dinero.js";
+import _ from "lodash";
 import moment from "moment";
 import queryString from "query-string";
 import React, { useCallback, useEffect, useState } from "react";
@@ -29,8 +30,8 @@ import {
   selectBodyshop,
   selectCurrentUser,
 } from "../../redux/user/user.selectors";
-import confirmDialog from "../../utils/asyncConfirm";
 import AuditTrailMapping from "../../utils/AuditTrailMappings";
+import CriticalPartsScan from "../../utils/criticalPartsScan";
 import AlertComponent from "../alert/alert.component";
 import JobsAvailableScan from "../jobs-available-scan/jobs-available-scan.component";
 import JobsFindModalContainer from "../jobs-find-modal/jobs-find-modal.container";
@@ -53,6 +54,11 @@ export function JobsAvailableContainer({
   currentUser,
   insertAuditTrail,
 }) {
+  const { CriticalPartsScanning } = useTreatments(
+    ["CriticalPartsScanning"],
+    {},
+    bodyshop.imexshopid
+  );
   const { loading, error, data, refetch } = useQuery(QUERY_AVAILABLE_JOBS, {
     fetchPolicy: "network-only",
     nextFetchPolicy: "network-only",
@@ -83,13 +89,14 @@ export function JobsAvailableContainer({
   const modalSearchState = useState("");
 
   //Import Scenario
-  const onOwnerFindModalOk = async () => {
+  const onOwnerFindModalOk = async (lazyData) => {
     logImEXEvent("job_import_new");
 
     setOwnerModalVisible(false);
     setInsertLoading(true);
-
-    const estData = replaceEmpty(estDataRaw.data.available_jobs_by_pk);
+    const estData = replaceEmpty(
+      lazyData?.available_jobs_by_pk || estDataRaw.data.available_jobs_by_pk
+    );
 
     if (!(estData && estData.est_data)) {
       //We don't have the right data. Error!
@@ -99,17 +106,21 @@ export function JobsAvailableContainer({
       });
       return;
     }
+    // if (process.env.REACT_APP_COUNTRY === "USA") {
+    //Massage the CCC file set to remove duplicate UNQ_SEQ.
+    await ResolveCCCLineIssues(estData.est_data, bodyshop);
+    //   } else {
     //IO-539 Check for Parts Rate on PAL for SGI use case.
     await CheckTaxRates(estData.est_data, bodyshop);
-
-    const newTotals = (
-      await Axios.post("/job/totals", {
-        job: {
-          ...estData.est_data,
-          joblines: estData.est_data.joblines.data,
-        },
-      })
-    ).data;
+    //  }
+    // const newTotals = (
+    //   await Axios.post("/job/totals", {
+    //     job: {
+    //       ...estData.est_data,
+    //       joblines: estData.est_data.joblines.data,
+    //     },
+    //   })
+    // ).data;
 
     let existingVehicles;
     if (estData.est_data.v_vin) {
@@ -124,10 +135,11 @@ export function JobsAvailableContainer({
 
     const newJob = {
       ...estData.est_data,
-      clm_total: Dinero(newTotals.totals.total_repairs).toFormat("0.00"),
-      owner_owing: Dinero(newTotals.totals.custPayable.total).toFormat("0.00"),
-      job_totals: newTotals,
+      // clm_total: Dinero(newTotals.totals.total_repairs).toFormat("0.00"),
+      // owner_owing: Dinero(newTotals.totals.custPayable.total).toFormat("0.00"),
+      // job_totals: newTotals,
       date_open: moment(),
+      status: bodyshop.md_ro_statuses.default_imported,
       notes: {
         data: {
           created_by: currentUser.email,
@@ -149,40 +161,50 @@ export function JobsAvailableContainer({
       delete newJob.vehicle;
     }
 
-    insertNewJob({
-      variables: {
-        job: newJob,
-      },
-    })
-      .then((r) => {
-        notification["success"]({
-          message: t("jobs.successes.created"),
-          onClick: () => {
-            history.push(`/manage/jobs/${r.data.insert_jobs.returning[0].id}`);
-          },
-        });
-        //Job has been inserted. Clean up the available jobs record.
+    if (typeof newJob.kmin === "string") {
+      newJob.kmin = null;
+    }
 
-        insertAuditTrail({
-          jobid: r.data.insert_jobs.returning[0].id,
-          operation: AuditTrailMapping.jobimported(),
-        });
+    try {
+      const r = await insertNewJob({
+        variables: {
+          job: newJob,
+        },
+      });
+      await Axios.post("/job/totalsssu", {
+        id: r.data.insert_jobs.returning[0].id,
+      });
 
-        deleteJob({
-          variables: { id: estData.id },
-        }).then((r) => {
-          refetch();
-          setInsertLoading(false);
-        });
-      })
-      .catch((r) => {
-        //error while inserting
-        notification["error"]({
-          message: t("jobs.errors.creating", { error: r.message }),
-        });
+      if (CriticalPartsScanning.treatment === "on") {
+        CriticalPartsScan(r.data.insert_jobs.returning[0].id);
+      }
+      notification["success"]({
+        message: t("jobs.successes.created"),
+        onClick: () => {
+          history.push(`/manage/jobs/${r.data.insert_jobs.returning[0].id}`);
+        },
+      });
+      //Job has been inserted. Clean up the available jobs record.
+
+      insertAuditTrail({
+        jobid: r.data.insert_jobs.returning[0].id,
+        operation: AuditTrailMapping.jobimported(),
+      });
+
+      await deleteJob({
+        variables: { id: estData.id },
+      }).then((r) => {
         refetch();
         setInsertLoading(false);
       });
+    } catch (r) {
+      //error while inserting
+      notification["error"]({
+        message: t("jobs.errors.creating", { error: r.message }),
+      });
+      refetch();
+      setInsertLoading(false);
+    }
   };
 
   //Suplement scenario
@@ -205,6 +227,7 @@ export function JobsAvailableContainer({
       let supp = replaceEmpty({ ...estData.est_data });
       //IO-539 Check for Parts Rate on PAL for SGI use case.
       await CheckTaxRates(supp, bodyshop);
+      await ResolveCCCLineIssues(supp, bodyshop);
 
       delete supp.owner;
       delete supp.vehicle;
@@ -241,7 +264,9 @@ export function JobsAvailableContainer({
           },
         },
       });
-
+      if (CriticalPartsScanning.treatment === "on") {
+        CriticalPartsScan(updateResult.data.update_jobs.returning[0].id);
+      }
       if (updateResult.errors) {
         //error while inserting
         notification["error"]({
@@ -366,6 +391,25 @@ export function JobsAvailableContainer({
         onCancel={onJobModalCancel}
         modalSearchState={modalSearchState}
       />
+      {currentUser.email.includes("@rome.") ||
+      currentUser.email.includes("@imex.") ? (
+        <Button
+          onClick={async () => {
+            for (const record of data.available_jobs) {
+              //Query the data
+              console.log("Start Job", record.id);
+              const { data } = await loadEstData({
+                variables: { id: record.id },
+              });
+              console.log("Query has been awaited and is complete");
+              await onOwnerFindModalOk(data);
+            }
+          }}
+        >
+          Add all jobs as new.
+        </Button>
+      ) : null}
+
       <Row gutter={[16, 16]}>
         <Col span={24}>
           <JobsAvailableTableComponent
@@ -397,115 +441,158 @@ function replaceEmpty(someObj, replaceValue = null) {
 }
 
 async function CheckTaxRates(estData, bodyshop) {
-  //LKQ Check
-  if (
-    !estData.parts_tax_rates?.PAL ||
-    estData.parts_tax_rates?.PAL?.prt_tax_rt === null ||
-    estData.parts_tax_rates?.PAL?.prt_tax_rt === 0
-  ) {
-    const res = await confirmDialog(
-      `ImEX Online has detected that there is a missing tax rate for LKQ parts. Pressing OK will set the tax rate to ${bodyshop.bill_tax_rates.state_tax_rate}% and enable the rate. Pressing cancel will keep the tax rate as is.`
-    );
-    if (res) {
-      if (!estData.parts_tax_rates.PAL) {
-        estData.parts_tax_rates.PAL = {
-          prt_discp: 0,
-          prt_mktyp: true,
-          prt_mkupp: 0,
-          prt_type: "PAL",
-        };
-      }
-      estData.parts_tax_rates.PAL.prt_tax_rt =
-        bodyshop.bill_tax_rates.state_tax_rate / 100;
-      estData.parts_tax_rates.PAL.prt_tax_in = true;
-    }
-  }
-  //PAC Check
-  if (
-    !estData.parts_tax_rates?.PAC ||
-    estData.parts_tax_rates?.PAC?.prt_tax_rt === null ||
-    estData.parts_tax_rates?.PAC?.prt_tax_rt === 0
-  ) {
-    const res = await confirmDialog(
-      `ImEX Online has detected that there is a missing tax rate for rechromed parts. Pressing OK will set the tax rate to ${bodyshop.bill_tax_rates.state_tax_rate}% and enable the rate. Pressing cancel will keep the tax rate as is.`
-    );
-    if (res) {
-      if (!estData.parts_tax_rates.PAC) {
-        estData.parts_tax_rates.PAC = {
-          prt_discp: 0,
-          prt_mktyp: true,
-          prt_mkupp: 0,
-          prt_type: "PAC",
-        };
-      }
-      estData.parts_tax_rates.PAC.prt_tax_rt =
-        bodyshop.bill_tax_rates.state_tax_rate / 100;
-      estData.parts_tax_rates.PAC.prt_tax_in = true;
-    }
-  }
+  // //LKQ Check
+  // if (
+  //   !estData.parts_tax_rates?.PAL ||
+  //   estData.parts_tax_rates?.PAL?.prt_tax_rt === null ||
+  //   estData.parts_tax_rates?.PAL?.prt_tax_rt === 0
+  // ) {
+  //   const res = await confirmDialog(
+  //     `Rome Online has detected that there is a missing tax rate for LKQ parts. Pressing OK will set the tax rate to ${bodyshop.bill_tax_rates.state_tax_rate}% and enable the rate. Pressing cancel will keep the tax rate as is.`
+  //   );
+  //   if (res) {
+  //     if (!estData.parts_tax_rates.PAL) {
+  //       estData.parts_tax_rates.PAL = {
+  //         prt_discp: 0,
+  //         prt_mktyp: true,
+  //         prt_mkupp: 0,
+  //         prt_type: "PAL",
+  //       };
+  //     }
+  //     estData.parts_tax_rates.PAL.prt_tax_rt =
+  //       bodyshop.bill_tax_rates.state_tax_rate / 100;
+  //     estData.parts_tax_rates.PAL.prt_tax_in = true;
+  //   }
+  // }
+  // //PAC Check
+  // if (
+  //   !estData.parts_tax_rates?.PAC ||
+  //   estData.parts_tax_rates?.PAC?.prt_tax_rt === null ||
+  //   estData.parts_tax_rates?.PAC?.prt_tax_rt === 0
+  // ) {
+  //   const res = await confirmDialog(
+  //     `Rome Online has detected that there is a missing tax rate for rechromed parts. Pressing OK will set the tax rate to ${bodyshop.bill_tax_rates.state_tax_rate}% and enable the rate. Pressing cancel will keep the tax rate as is.`
+  //   );
+  //   if (res) {
+  //     if (!estData.parts_tax_rates.PAC) {
+  //       estData.parts_tax_rates.PAC = {
+  //         prt_discp: 0,
+  //         prt_mktyp: true,
+  //         prt_mkupp: 0,
+  //         prt_type: "PAC",
+  //       };
+  //     }
+  //     estData.parts_tax_rates.PAC.prt_tax_rt =
+  //       bodyshop.bill_tax_rates.state_tax_rate / 100;
+  //     estData.parts_tax_rates.PAC.prt_tax_in = true;
+  //   }
+  // }
+
   //PAM Check
-  if (
-    !estData.parts_tax_rates?.PAM ||
-    estData.parts_tax_rates?.PAM?.prt_tax_rt === null ||
-    estData.parts_tax_rates?.PAM?.prt_tax_rt === 0
-  ) {
-    const res = await confirmDialog(
-      `ImEX Online has detected that there is a missing tax rate for remanufactured parts. Pressing OK will set the tax rate to ${bodyshop.bill_tax_rates.state_tax_rate}% and enable the rate. Pressing cancel will keep the tax rate as is.`
-    );
-    if (res) {
-      if (!estData.parts_tax_rates.PAM) {
-        estData.parts_tax_rates.PAM = {
-          prt_discp: 0,
-          prt_mktyp: true,
-          prt_mkupp: 0,
-          prt_type: "PAM",
-        };
-      }
-      estData.parts_tax_rates.PAM.prt_tax_rt =
-        bodyshop.bill_tax_rates.state_tax_rate / 100;
-      estData.parts_tax_rates.PAM.prt_tax_in = true;
-    }
+  if (!estData.parts_tax_rates?.PAM) {
+    estData.parts_tax_rates.PAM = estData.parts_tax_rates.PAC;
   }
 
-  if (
-    !estData.parts_tax_rates?.PAR ||
-    estData.parts_tax_rates?.PAR?.prt_tax_rt === null ||
-    estData.parts_tax_rates?.PAR?.prt_tax_rt === 0
-  ) {
-    const res = await confirmDialog(
-      `ImEX Online has detected that there is a missing tax rate for recored parts. Pressing OK will set the tax rate to ${bodyshop.bill_tax_rates.state_tax_rate}% and enable the rate. Pressing cancel will keep the tax rate as is.`
-    );
-    if (res) {
-      if (!estData.parts_tax_rates.PAR) {
-        estData.parts_tax_rates.PAR = {
-          prt_discp: 0,
-          prt_mktyp: true,
-          prt_mkupp: 0,
-          prt_type: "PAR",
-        };
-      }
-      estData.parts_tax_rates.PAR.prt_tax_rt =
-        bodyshop.bill_tax_rates.state_tax_rate / 100;
-      estData.parts_tax_rates.PAR.prt_tax_in = true;
-    }
-  }
+  // //PAM Check
+  // if (
+  //   !estData.parts_tax_rates?.PAM ||
+  //   estData.parts_tax_rates?.PAM?.prt_tax_rt === null ||
+  //   estData.parts_tax_rates?.PAM?.prt_tax_rt === 0
+  // ) {
+  //   const res = await confirmDialog(
+  //     `Rome Online has detected that there is a missing tax rate for remanufactured parts. Pressing OK will set the tax rate to ${bodyshop.bill_tax_rates.state_tax_rate}% and enable the rate. Pressing cancel will keep the tax rate as is.`
+  //   );
+  //   if (res) {
+  //     if (!estData.parts_tax_rates.PAM) {
+  //       estData.parts_tax_rates.PAM = {
+  //         prt_discp: 0,
+  //         prt_mktyp: true,
+  //         prt_mkupp: 0,
+  //         prt_type: "PAM",
+  //       };
+  //     }
+  //     estData.parts_tax_rates.PAM.prt_tax_rt =
+  //       bodyshop.bill_tax_rates.state_tax_rate / 100;
+  //     estData.parts_tax_rates.PAM.prt_tax_in = true;
+  //   }
+  // }
+
+  // if (
+  //   !estData.parts_tax_rates?.PAR ||
+  //   estData.parts_tax_rates?.PAR?.prt_tax_rt === null ||
+  //   estData.parts_tax_rates?.PAR?.prt_tax_rt === 0
+  // ) {
+  //   const res = await confirmDialog(
+  //     `Rome Online has detected that there is a missing tax rate for recored parts. Pressing OK will set the tax rate to ${bodyshop.bill_tax_rates.state_tax_rate}% and enable the rate. Pressing cancel will keep the tax rate as is.`
+  //   );
+  //   if (res) {
+  //     if (!estData.parts_tax_rates.PAR) {
+  //       estData.parts_tax_rates.PAR = {
+  //         prt_discp: 0,
+  //         prt_mktyp: true,
+  //         prt_mkupp: 0,
+  //         prt_type: "PAR",
+  //       };
+  //     }
+  //     estData.parts_tax_rates.PAR.prt_tax_rt =
+  //       bodyshop.bill_tax_rates.state_tax_rate / 100;
+  //     estData.parts_tax_rates.PAR.prt_tax_in = true;
+  //   }
+  // }
 
   //IO-1387 If a sublet line is NOT R&R, use the labor tax. If it is, use the sublet tax rate.
   //Currently limited to SK shops only.
-  //if (bodyshop.region_config === "CA_SK") {
-  estData.joblines.data.forEach((jl, index) => {
-    if (
-      (jl.part_type === "PASL" || jl.part_type === "PAS") &&
-      jl.lbr_op !== "OP11"
-    ) {
-      estData.joblines.data[index].tax_part = jl.lbr_tax;
-    }
+  if (bodyshop.region_config === "CA_SK") {
+    estData.joblines.data.forEach((jl, index) => {
+      if (
+        (jl.part_type === "PASL" || jl.part_type === "PAS") &&
+        jl.lbr_op !== "OP11"
+      ) {
+        estData.joblines.data[index].tax_part = jl.lbr_tax;
+      }
 
-    //Set markup lines and tax lines as taxable.
-    //900510 is a mark up. 900510 is a discount.
-    if (jl.db_ref === "900510") {
-      estData.joblines.data[index].tax_part = true;
+      //Set markup lines and tax lines as taxable.
+      //900510 is a mark up. 900510 is a discount.
+      if (jl.db_ref === "900510") {
+        estData.joblines.data[index].tax_part = true;
+      }
+    });
+  }
+}
+
+async function ResolveCCCLineIssues(estData, bodyshop) {
+  //Find all misc amounts, populate them to the act price.
+  //TODO Ensure that this doesnt get violated
+  //This needs to be done before cleansing unq_seq since some misc prices could move over.
+  estData.joblines.data.forEach((line) => {
+    if (line.misc_amt && line.misc_amt !== 0) {
+      line.act_price = line.act_price + line.misc_amt;
+      line.tax_part = !!line.misc_tax;
     }
   });
-  //}
+
+  //Generate the list of duplicated UNQ_SEQ that will feed into the next section to scrub the lines.
+  const unqSeqHash = _.groupBy(estData.joblines.data, "unq_seq");
+  const duplicatedUnqSeq = Object.keys(unqSeqHash).filter(
+    (key) => unqSeqHash[key].length > 1
+  );
+
+  duplicatedUnqSeq.forEach((unq_seq) => {
+    //Keys are strings, convert to int.
+    const int_unq_seq = parseInt(unq_seq);
+
+    //When line splitting, the first line is always the non-refinish line. We will keep it as is.
+    //We will cleanse the second line, which is always the next line.
+    const nonRefLineIndex = estData.joblines.data.findIndex(
+      (line) => line.unq_seq === int_unq_seq
+    );
+    estData.joblines.data[nonRefLineIndex + 1] = {
+      ...estData.joblines.data[nonRefLineIndex + 1],
+      part_type: null,
+      act_price: 0,
+      db_price: 0,
+      prt_dsmk_p: 0,
+      prt_dsmk_m: 0,
+    };
+  });
 }

client/src/components/jobs-close-auto-allocate/jobs-close-auto-allocate.component.jsx

@@ -36,6 +36,8 @@ export function JobsCloseAutoAllocate({ bodyshop, joblines, form, disabled }) {
             ret.profitcenter_part = defaults.profits["MAPA"];
           } else if (lineDesc.includes("ats amount")) {
             ret.profitcenter_part = defaults.profits["ATS"];
+          } else if (jl.act_price > 0) {
+            ret.profitcenter_part = defaults.profits["PAO"];
           } else {
             ret.profitcenter_part = null;
           }

client/src/components/jobs-close-export-button/jobs-close-export-button.component.jsx

@@ -4,22 +4,35 @@ import axios from "axios";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
+import { useHistory } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
-import { auth } from "../../firebase/firebase.utils";
+import { auth, logImEXEvent } from "../../firebase/firebase.utils";
+import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
 import { UPDATE_JOB } from "../../graphql/jobs.queries";
 import {
   selectBodyshop,
   selectCurrentUser,
 } from "../../redux/user/user.selectors";
-import { logImEXEvent } from "../../firebase/firebase.utils";
-import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
-import { useHistory } from "react-router-dom";
+import client from "../../utils/GraphQLClient";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
   currentUser: selectCurrentUser,
 });
 
+function updateJobCache(items) {
+  client.cache.modify({
+    id: "ROOT_QUERY",
+    fields: {
+      jobs(existingJobs = []) {
+        return existingJobs.filter(
+          (jobRef) => jobRef.__ref.includes(items) === false
+        );
+      },
+    },
+  });
+}
+
 export function JobsCloseExportButton({
   bodyshop,
   currentUser,
@@ -101,6 +114,9 @@ export function JobsCloseExportButton({
 
     //Check to see if any of them failed. If they didn't don't execute the update.
     const failedTransactions = PartnerResponse.data.filter((r) => !r.success);
+    const successfulTransactions = PartnerResponse.data.filter(
+      (r) => r.success
+    );
     if (failedTransactions.length > 0) {
       //Uh oh. At least one was no good.
       failedTransactions.forEach((ft) => {
@@ -159,12 +175,15 @@ export function JobsCloseExportButton({
           },
         });
 
-        if (!jobUpdateResponse.errors) {
+        if (!!!jobUpdateResponse.errors) {
           notification.open({
             type: "success",
             key: "jobsuccessexport",
             message: t("jobs.successes.exported"),
           });
+          updateJobCache(
+            jobUpdateResponse.data.update_jobs.returning.map((job) => job.id)
+          );
         } else {
           notification["error"]({
             message: t("jobs.errors.exporting", {
@@ -173,13 +192,31 @@ export function JobsCloseExportButton({
           });
         }
       }
+      if (bodyshop.accountingconfig && bodyshop.accountingconfig.qbo && successfulTransactions.length > 0) {
+        notification.open({
+          type: "success",
+          key: "jobsuccessexport",
+          message: t("jobs.successes.exported"),
+        });
+        updateJobCache([
+          ...new Set(
+            successfulTransactions.map(
+              (st) =>
+                st[
+                  bodyshop.accountingconfig && bodyshop.accountingconfig.qbo
+                    ? "jobid"
+                    : "id"
+                ]
+            )
+          ),
+        ]);
+      }
       if (setSelectedJobs) {
         setSelectedJobs((selectedJobs) => {
           return selectedJobs.filter((i) => i !== jobId);
         });
       }
     }
-    if (bodyshop.accountingconfig && bodyshop.accountingconfig.qbo) refetch();
     setLoading(false);
   };
 

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

@@ -9,6 +9,7 @@ import {
   Space,
   Switch,
 } from "antd";
+import axios from "axios";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -18,7 +19,6 @@ import { insertAuditTrail } from "../../redux/application/application.actions";
 import { selectJobReadOnly } from "../../redux/application/application.selectors";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import AuditTrailMapping from "../../utils/AuditTrailMappings";
-import axios from "axios";
 const mapStateToProps = createStructuredSelector({
   //currentUser: selectCurrentUser
   bodyshop: selectBodyshop,
@@ -43,14 +43,22 @@ export function JobsConvertButton({
   const { t } = useTranslation();
   const [form] = Form.useForm();
 
-  const handleConvert = async (values) => {
+  const handleConvert = async ({ employee_csr, category, ...values }) => {
     if (parentFormIsFieldsTouched()) {
       alert(t("jobs.labels.savebeforeconversion"));
       return;
     }
     setLoading(true);
     const res = await mutationConvertJob({
-      variables: { jobId: job.id, ...values },
+      variables: {
+        jobId: job.id,
+        job: {
+          converted: true,
+          ...(bodyshop.enforce_conversion_csr ? { employee_csr } : {}),
+          ...(bodyshop.enforce_conversion_category ? { category } : {}),
+          ...values,
+        },
+      },
     });
 
     if (values.ca_gst_registrant) {
@@ -83,7 +91,12 @@ export function JobsConvertButton({
         layout="vertical"
         form={form}
         onFinish={handleConvert}
-        initialValues={{ driveable: true, towin: false }}
+        initialValues={{
+          driveable: true,
+          towin: false,
+          employee_csr: job.employee_csr,
+          category: job.category,
+        }}
       >
         <Form.Item
           name={["ins_co_nm"]}
@@ -95,9 +108,9 @@ export function JobsConvertButton({
             },
           ]}
         >
-          <Select>
-            {bodyshop.md_ins_cos.map((s) => (
-              <Select.Option key={s.name} value={s.name}>
+          <Select showSearch>
+            {bodyshop.md_ins_cos.map((s, i) => (
+              <Select.Option key={i} value={s.name}>
                 {s.name}
               </Select.Option>
             ))}
@@ -151,13 +164,70 @@ export function JobsConvertButton({
             </Form.Item>
           </>
         )}
-        <Form.Item
-          label={t("jobs.fields.ca_gst_registrant")}
-          name="ca_gst_registrant"
-          valuePropName="checked"
-        >
-          <Switch />
-        </Form.Item>
+        {bodyshop.enforce_conversion_csr && (
+          <Form.Item
+            name={"employee_csr"}
+            label={t("jobs.fields.employee_csr")}
+            rules={[
+              {
+                required: bodyshop.enforce_conversion_csr,
+                //message: t("general.validation.required"),
+              },
+            ]}
+          >
+            <Select
+              showSearch
+              style={{ width: 200 }}
+              optionFilterProp="children"
+              filterOption={(input, option) =>
+                option.props.children
+                  .toLowerCase()
+                  .indexOf(input.toLowerCase()) >= 0
+              }
+            >
+              {bodyshop.employees
+                .filter((emp) => emp.active)
+                .map((emp) => (
+                  <Select.Option
+                    value={emp.id}
+                    key={emp.id}
+                    name={`${emp.first_name} ${emp.last_name}`}
+                  >
+                    {`${emp.first_name} ${emp.last_name}`}
+                  </Select.Option>
+                ))}
+            </Select>
+          </Form.Item>
+        )}
+        {bodyshop.enforce_conversion_category && (
+          <Form.Item
+            name={"category"}
+            label={t("jobs.fields.category")}
+            rules={[
+              {
+                required: bodyshop.enforce_conversion_category,
+                //message: t("general.validation.required"),
+              },
+            ]}
+          >
+            <Select allowClear>
+              {bodyshop.md_categories.map((s) => (
+                <Select.Option key={s} value={s}>
+                  {s}
+                </Select.Option>
+              ))}
+            </Select>
+          </Form.Item>
+        )}
+        {bodyshop.region_config.toLowerCase().startsWith("ca") && (
+          <Form.Item
+            label={t("jobs.fields.ca_gst_registrant")}
+            name="ca_gst_registrant"
+            valuePropName="checked"
+          >
+            <Switch />
+          </Form.Item>
+        )}
         <Form.Item
           label={t("jobs.fields.driveable")}
           name="driveable"
@@ -194,7 +264,14 @@ export function JobsConvertButton({
         // style={{ display: job.converted ? "none" : "" }}
         disabled={job.converted || jobRO}
         loading={loading}
-        onClick={() => setVisible(true)}
+        onClick={() => {
+          setVisible(true);
+          form.setFieldsValue({
+            driveable: true,
+            towin: false,
+            employee_csr: job.employee_csr,
+          });
+        }}
       >
         {t("jobs.actions.convert")}
       </Button>

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

@@ -1,4 +1,4 @@
-import { Collapse, Form, Input, InputNumber, Select, Switch } from "antd";
+import { Collapse, Form, Input, Select, Switch } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -12,6 +12,12 @@ import FormItemPhone, {
 } from "../form-items-formatted/phone-form-item.component";
 import JobsDetailRatesChangeButton from "../jobs-detail-rates-change-button/jobs-detail-rates-change-button.component";
 import JobsDetailRatesParts from "../jobs-detail-rates/jobs-detail-rates.parts.component";
+
+import JobsDetailRatesLabor from "../jobs-detail-rates/jobs-detail-rates.labor.component";
+import JobsDetailRatesMaterials from "../jobs-detail-rates/jobs-detail-rates.materials.component";
+import JobsDetailRatesOther from "../jobs-detail-rates/jobs-detail-rates.other.component";
+import JobsDetailRatesTaxes from "../jobs-detail-rates/jobs-detail-rates.taxes.component";
+
 import JobsMarkPstExempt from "../jobs-mark-pst-exempt/jobs-mark-pst-exempt.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
 const mapStateToProps = createStructuredSelector({
@@ -224,13 +230,15 @@ export function JobsCreateJobsInfo({ bodyshop, form, selected }) {
             >
               <CurrencyInput />
             </Form.Item>
-            <Form.Item
-              label={t("jobs.fields.ca_gst_registrant")}
-              name="ca_gst_registrant"
-              valuePropName="checked"
-            >
-              <Switch />
-            </Form.Item>
+            {bodyshop.region_config.toLowerCase().startsWith("ca") && (
+              <Form.Item
+                label={t("jobs.fields.ca_gst_registrant")}
+                name="ca_gst_registrant"
+                valuePropName="checked"
+              >
+                <Switch />
+              </Form.Item>
+            )}
             <Form.Item
               label={t("jobs.fields.other_amount_payable")}
               name="other_amount_payable"
@@ -256,26 +264,28 @@ export function JobsCreateJobsInfo({ bodyshop, form, selected }) {
               <CurrencyInput />
             </Form.Item>
           </LayoutFormRow>
-          <LayoutFormRow>
-            <Form.Item
-              label={t("jobs.fields.federal_tax_rate")}
-              name="federal_tax_rate"
-            >
-              <InputNumber min={0} max={1} precision={2} />
-            </Form.Item>
-            <Form.Item
-              label={t("jobs.fields.state_tax_rate")}
-              name="state_tax_rate"
-            >
-              <InputNumber min={0} max={1} precision={2} />
-            </Form.Item>
-            <Form.Item
-              label={t("jobs.fields.local_tax_rate")}
-              name="local_tax_rate"
-            >
-              <InputNumber min={0} max={1} precision={2} />
-            </Form.Item>
-          </LayoutFormRow>
+          {
+            // <LayoutFormRow>
+            //   <Form.Item
+            //     label={t("jobs.fields.federal_tax_rate")}
+            //     name="federal_tax_rate"
+            //   >
+            //     <InputNumber min={0} max={1} precision={2} />
+            //   </Form.Item>
+            //   <Form.Item
+            //     label={t("jobs.fields.state_tax_rate")}
+            //     name="state_tax_rate"
+            //   >
+            //     <InputNumber min={0} max={1} precision={2} />
+            //   </Form.Item>
+            //   <Form.Item
+            //     label={t("jobs.fields.local_tax_rate")}
+            //     name="local_tax_rate"
+            //   >
+            //     <InputNumber min={0} max={1} precision={2} />
+            //   </Form.Item>
+            // </LayoutFormRow>
+          }
           <LayoutFormRow>
             <Form.Item label={t("jobs.fields.rate_lab")} name="rate_lab">
               <CurrencyInput />
@@ -354,6 +364,10 @@ export function JobsCreateJobsInfo({ bodyshop, form, selected }) {
         required={selected && true}
         form={form}
       />
+      <JobsDetailRatesLabor form={form} />
+      <JobsDetailRatesMaterials form={form} />
+      <JobsDetailRatesOther form={form} />
+      <JobsDetailRatesTaxes form={form} />
     </div>
   );
 }

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

@@ -9,7 +9,11 @@ const colSpan = {
   lg: { span: 12 },
 };
 
-export default function JobsCreateVehicleInfoComponent({ loading, vehicles }) {
+export default function JobsCreateVehicleInfoComponent({
+  loading,
+  vehicles,
+  form,
+}) {
   const [state, setState] = useContext(JobCreateContext);
   const { t } = useTranslation();
   return (
@@ -58,7 +62,7 @@ export default function JobsCreateVehicleInfoComponent({ loading, vehicles }) {
           />
         </Col>
         <Col {...colSpan}>
-          <JobsCreateVehicleInfoNewComponent />
+          <JobsCreateVehicleInfoNewComponent form={form}/>
         </Col>
       </Row>
     </div>

client/src/components/jobs-create-vehicle-info/jobs-create-vehicle-info.container.jsx

@@ -20,6 +20,7 @@ export default function JobsCreateVehicleInfoContainer({ form }) {
     <JobsCreateVehicleInfoComponent
       loading={loading}
       vehicles={data ? data.search_vehicles : null}
+      form={form}
     />
   );
 }

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

@@ -4,8 +4,9 @@ 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";
 
-export default function JobsCreateVehicleInfoNewComponent() {
+export default function JobsCreateVehicleInfoNewComponent({ form }) {
   const [state] = useContext(JobCreateContext);
 
   const { t } = useTranslation();
@@ -25,7 +26,7 @@ export default function JobsCreateVehicleInfoNewComponent() {
           <Input disabled={!state.vehicle.new} />
         </Form.Item>
       </LayoutFormRow>
-      <LayoutFormRow grow>
+      <LayoutFormRow grow noDivider>
         <Form.Item
           label={t("vehicles.fields.v_color")}
           name={["vehicle", "data", "v_color"]}
@@ -52,8 +53,9 @@ export default function JobsCreateVehicleInfoNewComponent() {
         </Form.Item>
       </LayoutFormRow>
 
-      <LayoutFormRow grow>
+      <LayoutFormRow grow noDivider>
         <Form.Item
+          span={10}
           label={t("vehicles.fields.v_make_desc")}
           name={["vehicle", "data", "v_make_desc"]}
           rules={[
@@ -66,6 +68,7 @@ export default function JobsCreateVehicleInfoNewComponent() {
           <Input disabled={!state.vehicle.new} />
         </Form.Item>
         <Form.Item
+          span={11}
           label={t("vehicles.fields.v_model_desc")}
           name={["vehicle", "data", "v_model_desc"]}
           rules={[
@@ -77,6 +80,11 @@ export default function JobsCreateVehicleInfoNewComponent() {
         >
           <Input disabled={!state.vehicle.new} />
         </Form.Item>
+        <JobsCreateVehicleInfoPredefined
+          disabled={!state.vehicle.new}
+          form={form}
+          span={1}
+        />
       </LayoutFormRow>
 
       <LayoutFormRow header={t("vehicles.forms.registration")} grow>

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

@@ -0,0 +1,81 @@
+import { PlusOutlined, SearchOutlined } from "@ant-design/icons";
+import { Button, Input, Popover, Table } from "antd";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import PredefinedVehicles from "./predefined-vehicles.js";
+
+export default function JobsCreateVehicleInfoPredefined({ disabled, form }) {
+  const [open, setOpen] = useState(false);
+  const [search, setSearch] = useState("");
+  const { t } = useTranslation();
+  const handleOpenChange = (newOpen) => {
+    setOpen(newOpen);
+    setSearch("");
+  };
+  const filteredPredefinedVehicles =
+    search === ""
+      ? PredefinedVehicles
+      : PredefinedVehicles.filter(
+          (v) =>
+            v.make.toLowerCase().includes(search.toLowerCase()) ||
+            v.model.toLowerCase().includes(search.toLowerCase())
+        );
+
+  const popContent = () => (
+    <div>
+      <Table
+        size="small"
+        title={() => <Input.Search onSearch={(value) => setSearch(value)} />}
+        dataSource={filteredPredefinedVehicles}
+        columns={[
+          {
+            dataIndex: "make",
+            key: "make",
+            title: t("vehicles.fields.v_make_desc"),
+          },
+          {
+            dataIndex: "model",
+            key: "model",
+            title: t("vehicles.fields.v_model_desc"),
+          },
+          {
+            dataIndex: "select",
+            key: "select",
+            title: t("general.labels.actions"),
+            render: (value, record) => (
+              <Button
+                disabled={disabled}
+                onClick={() => {
+                  form.setFieldsValue({
+                    vehicle: {
+                      data: {
+                        v_make_desc: record.make,
+                        v_model_desc: record.model,
+                      },
+                    },
+                  });
+                  setOpen(false);
+                  setSearch("");
+                }}
+              >
+                <PlusOutlined />
+              </Button>
+            ),
+          },
+        ]}
+      />
+    </div>
+  );
+  return (
+    <Popover
+      content={popContent}
+      trigger="click"
+      open={open}
+      placement="left"
+      onOpenChange={handleOpenChange}
+      destroyTooltipOnHide
+    >
+      <SearchOutlined style={{ cursor: "pointer" }} />
+    </Popover>
+  );
+}

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

@@ -141,6 +141,10 @@ export function JobsDetailDatesComponent({ jobRO, job, bodyshop }) {
         <Form.Item label={t("jobs.fields.date_exported")} name="date_exported">
           <DateTimePicker disabled={true || jobRO} />
         </Form.Item>
+
+        <Form.Item label={t("jobs.fields.date_void")} name="date_void">
+          <DateTimePicker disabled={true || jobRO} />
+        </Form.Item>
       </FormRow>
     </div>
   );