feature/IO-3357-Reynolds-and-Reynolds-DMS-API-Integration -Full Flow verified

Add indexes for media analytics.

Fortellis Notes.md

@@ -0,0 +1,346 @@
+Fortellis Notes
+
+Subscription ID
+
+- Appears to give us a list of all dealerships we have access to, and `apiDmsInfo` contains the integrations that are enabled for that dealership.
+- Will likely need to filter based on the DMS ID or something?
+- Should store the whole subscription object. Contains department information needed in subsequent calls.
+
+Department ID
+
+- May have multiple departments. Appears that financial stuff goes to Accounting, History will go to Service.
+- TODO: How do we handle the multiple departments that may come up.
+
+###Internal Questions
+
+* Overview of the redis storing mechanism to cache this data. 
+* 
+
+# GL Wip Posting
+
+## Org Helper Return Data
+
+```json
+[
+  {
+    "acctgLgnID": "DEVWB-A",
+    "applCode": "V",
+    "coID": "77",
+    "companyName": "TEST SYS C187092 DEVWB",
+    "lgnDesc": "DEV WRITE BACK VMS",
+    "logon": "DEVWB-V"
+  },
+  {
+    "acctgLgnID": "DEVWB-A",
+    "applCode": "F",
+    "coID": "77",
+    "companyName": "TEST SYS C187092 DEVWB",
+    "lgnDesc": "DEV WRITE BACK F&I SALES",
+    "logon": "DEVWB-FI"
+  },
+  {
+    "acctgLgnID": "DEVWB-A",
+    "applCode": "CS",
+    "coID": "77",
+    "companyName": "TEST SYS C187092 DEVWB",
+    "lgnDesc": "DEV WRITE BACK SERVICE",
+    "logon": "DEVWB-S"
+  },
+  {
+    "acctgLgnID": "DEVWB-A",
+    "applCode": "A",
+    "coID": "77",
+    "companyName": "TEST SYS C187092 DEVWB",
+    "lgnDesc": "DEV WRITE BACK ACCTG",
+    "logon": "DEVWB-A"
+  },
+  {
+    "acctgLgnID": "DEVWB-A",
+    "applCode": "SL",
+    "coID": "77",
+    "companyName": "TEST SYS C187092 DEVWB",
+    "lgnDesc": "DEV WRTIE BACK SLS MGMT",
+    "logon": "DEVWB-SL"
+  },
+  {
+    "acctgLgnID": "DEVWB-A",
+    "applCode": "O",
+    "coID": "77",
+    "companyName": "TEST SYS C187092 DEVWB",
+    "lgnDesc": "DEV WRITE BACK PARTS",
+    "logon": "DEVWB-I"
+  }
+]
+```
+
+## Journal Helper Return Data
+
+```json
+[
+  {
+    "companyNo": "77",
+    "jrnlID": "32",
+    "jrnlName": "PARTS SALES",
+    "jrnlType": "S",
+    "intercoFlag": "0",
+    "defaultDocType": "4",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "92",
+    "jrnlName": "YTD ADJUSTMENTS",
+    "jrnlType": "Y",
+    "intercoFlag": "0",
+    "defaultDocType": "3",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "12",
+    "jrnlName": "FLEET SALES",
+    "jrnlType": "S",
+    "intercoFlag": "0",
+    "defaultDocType": "9",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "57",
+    "jrnlName": "CASH RECEIPTS (OPEN-ITEM)",
+    "jrnlType": "R",
+    "intercoFlag": "0",
+    "defaultDocType": "1",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "93",
+    "jrnlName": "SET UP HISTORY",
+    "jrnlType": "H",
+    "intercoFlag": "0",
+    "defaultDocType": "10",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "88",
+    "jrnlName": "F/S STATISCAL DATA",
+    "jrnlType": "F",
+    "intercoFlag": "0",
+    "defaultDocType": "10",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "58",
+    "jrnlName": "WARRANTY CREDITS",
+    "jrnlType": "G",
+    "intercoFlag": "0",
+    "defaultDocType": "3",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "FC",
+    "jrnlName": "FINANCE CHARGE",
+    "jrnlType": "A",
+    "intercoFlag": "0",
+    "defaultDocType": "12",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "94",
+    "jrnlName": "SET UP SCHEDULES",
+    "jrnlType": "C",
+    "intercoFlag": "0",
+    "defaultDocType": "3",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "95",
+    "jrnlName": "SET UP GENERAL LEDGER",
+    "jrnlType": "B",
+    "intercoFlag": "0",
+    "defaultDocType": "3",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "20",
+    "jrnlName": "USED VEHICLE SALES",
+    "jrnlType": "S",
+    "intercoFlag": "0",
+    "defaultDocType": "9",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "60",
+    "jrnlName": "CASH DISBURSEMENTS",
+    "jrnlType": "G",
+    "intercoFlag": "0",
+    "defaultDocType": "2",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "30",
+    "jrnlName": "SERVICE SALES",
+    "jrnlType": "S",
+    "intercoFlag": "0",
+    "defaultDocType": "7",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "40",
+    "jrnlName": "PAYROLL",
+    "jrnlType": "G",
+    "intercoFlag": "0",
+    "defaultDocType": "11",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "15",
+    "jrnlName": "DEALER TRADES",
+    "jrnlType": "S",
+    "intercoFlag": "0",
+    "defaultDocType": "9",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "70",
+    "jrnlName": "NEW VEHICLE PURCHASES",
+    "jrnlType": "G",
+    "intercoFlag": "0",
+    "defaultDocType": "8",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "25",
+    "jrnlName": "USED WHOLESALE",
+    "jrnlType": "S",
+    "intercoFlag": "0",
+    "defaultDocType": "9",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "75",
+    "jrnlName": "GENERAL PURCHASES",
+    "jrnlType": "G",
+    "intercoFlag": "0",
+    "defaultDocType": "5",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "10",
+    "jrnlName": "NEW VEHICLE SALES",
+    "jrnlType": "S",
+    "intercoFlag": "0",
+    "defaultDocType": "9",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "80",
+    "jrnlName": "GENERAL JOURNAL",
+    "jrnlType": "G",
+    "intercoFlag": "0",
+    "defaultDocType": "3",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "11",
+    "jrnlName": "WORK IN PROGRESS",
+    "jrnlType": "G",
+    "intercoFlag": "0",
+    "defaultDocType": "10",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "56",
+    "jrnlName": "CASH RECEIPTS (BALANCE FWD)",
+    "jrnlType": "G",
+    "intercoFlag": "0",
+    "defaultDocType": "1",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "81",
+    "jrnlName": "STANDARD ENTRIES",
+    "jrnlType": "G",
+    "intercoFlag": "0",
+    "defaultDocType": "6",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "51",
+    "jrnlName": "CASH RECEIPTS JOURNAL - EFT",
+    "jrnlType": "G",
+    "intercoFlag": "0",
+    "defaultDocType": "10",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "61",
+    "jrnlName": "CASH DISBURSMENTS -EFT",
+    "jrnlType": "G",
+    "intercoFlag": "0",
+    "defaultDocType": "10",
+    "errCode": "",
+    "errMsg": ""
+  },
+  {
+    "companyNo": "77",
+    "jrnlID": "71",
+    "jrnlName": "USED VEHICLE PURCHASES",
+    "jrnlType": "G",
+    "intercoFlag": "0",
+    "defaultDocType": "8",
+    "errCode": "",
+    "errMsg": ""
+  }
+]
+```
+
+# Feedback
+
+- Receiving bad request errors, with no details. API errors page doesn't indicate what's wrong for certain types of error codes.
+- API Error page works on a several minute delay.

_reference/localEmailViewer/index.js

@@ -1,116 +1,96 @@
 // index.js
 
-import express from 'express';
-import fetch from 'node-fetch';
-import {simpleParser} from 'mailparser';
+import express from "express";
+import fetch from "node-fetch";
+import { simpleParser } from "mailparser";
 
 const app = express();
 const PORT = 3334;
 
-app.get('/', async (req, res) => {
-    try {
-        const response = await fetch('http://localhost:4566/_aws/ses');
-        if (!response.ok) {
-            throw new Error('Network response was not ok');
-        }
-        const data = await response.json();
-        const messagesHtml = await parseMessages(data.messages);
-        res.send(renderHtml(messagesHtml));
-    } catch (error) {
-        console.error('Error fetching messages:', error);
-        res.status(500).send('Error fetching messages');
+app.get("/", async (req, res) => {
+  try {
+    const response = await fetch("http://localhost:4566/_aws/ses");
+    if (!response.ok) {
+      throw new Error("Network response was not ok");
     }
+    const data = await response.json();
+    const messagesHtml = await parseMessages(data.messages);
+    res.send(renderHtml(messagesHtml));
+  } catch (error) {
+    console.error("Error fetching messages:", error);
+    res.status(500).send("Error fetching messages");
+  }
 });
 
 async function parseMessages(messages) {
-    const parsedMessages = await Promise.all(
-        messages.map(async (message, index) => {
-            try {
-                const parsed = await simpleParser(message.RawData);
-                return `
-                    <div class="shadow-md rounded-lg p-4 mb-6" style="background-color: lightgray">
-                     <div class="shadow-md rounded-lg p-4 mb-6" style="background-color: white">
-                        <div class="mb-2">
-                            <span class="font-bold text-lg">Message ${index + 1}</span>
-                        </div>
-                        <div class="mb-2">
-                            <span class="font-semibold">From:</span> ${message.Source}
-                        </div>
-                        <div class="mb-2">
-                            <span class="font-semibold">Region:</span> ${message.Region}
-                        </div>
-                        <div class="mb-2">
-                            <span class="font-semibold">Timestamp:</span> ${message.Timestamp}
-                        </div>
-                     </div>
-                        <div class="prose">
-                            ${parsed.html || parsed.textAsHtml || 'No HTML content available'}
-                        </div>
-                    </div>
-                `;
-            } catch (error) {
-                console.error('Error parsing email:', error);
-                return `
-                    <div class="bg-white shadow-md rounded-lg p-4 mb-6">
-                        <div class="mb-2">
-                            <span class="font-bold text-lg">Message ${index + 1}</span>
-                        </div>
-                        <div class="mb-2">
-                            <span class="font-semibold">From:</span> ${message.Source}
-                        </div>
-                        <div class="mb-2">
-                            <span class="font-semibold">Region:</span> ${message.Region}
-                        </div>
-                        <div class="mb-2">
-                            <span class="font-semibold">Timestamp:</span> ${message.Timestamp}
-                        </div>
-                        <div class="text-red-500">
-                            Error parsing email content
-                        </div>
-                    </div>
-                `;
-            }
-        })
-    );
-    return parsedMessages.join('');
+  const parsedMessages = await Promise.all(
+    messages.map(async (message, index) => {
+      try {
+        const parsed = await simpleParser(message.RawData);
+        return `
+          <div class="shadow-md rounded-lg p-4 mb-6" style="background-color: lightgray">
+            <div class="shadow-md rounded-lg p-4 mb-6" style="background-color: white">
+              <div class="mb-2"><span class="font-bold text-lg">Message ${index + 1}</span></div>
+              <div class="mb-2"><span class="font-semibold">From:</span> ${message.Source}</div>
+              <div class="mb-2"><span class="font-semibold">To:</span> ${parsed.to.text || "No To Address"}</div>
+              <div class="mb-2"><span class="font-semibold">Subject:</span> ${parsed.subject || "No Subject"}</div>
+              <div class="mb-2"><span class="font-semibold">Region:</span> ${message.Region}</div>
+              <div class="mb-2"><span class="font-semibold">Timestamp:</span> ${message.Timestamp}</div>
+            </div>
+            <div class="prose">${parsed.html || parsed.textAsHtml || "No HTML content available"}</div>
+          </div>
+        `;
+      } catch (error) {
+        console.error("Error parsing email:", error);
+        return `
+          <div class="bg-white shadow-md rounded-lg p-4 mb-6">
+            <div class="mb-2"><span class="font-bold text-lg">Message ${index + 1}</span></div>
+            <div class="mb-2"><span class="font-semibold">From:</span> ${message.Source}</div>
+            <div class="mb-2"><span class="font-semibold">Region:</span> ${message.Region}</div>
+            <div class="mb-2"><span class="font-semibold">Timestamp:</span> ${message.Timestamp}</div>
+            <div class="text-red-500">Error parsing email content</div>
+          </div>
+        `;
+      }
+    })
+  );
+  return parsedMessages.join("");
 }
 
 function renderHtml(messagesHtml) {
-    return `
-        <!DOCTYPE html>
-        <html lang="en">
-        <head>
-            <meta charset="UTF-8">
-            <meta name="viewport" content="width=device-width, initial-scale=1.0">
-            <title>Email Messages Viewer</title>
-            <script src="https://cdn.tailwindcss.com"></script>
-            <style>
-                body {
-                    background-color: #f3f4f6;
-                    font-family: Arial, sans-serif;
-                }
-                .container {
-                    max-width: 800px;
-                    margin: 50px auto;
-                    padding: 20px;
-                }
-                .prose {
-                    line-height: 1.6;
-                }
-            </style>
-        </head>
-        <body>
-            <div class="container bg-white shadow-lg rounded-lg p-6">
-                <h1 class="text-2xl font-bold text-center mb-6">Email Messages Viewer</h1>
-                <div id="messages-container">
-                    ${messagesHtml}
-                </div>
-            </div>
-        </body>
-        </html>
-    `;
+  return `
+    <!DOCTYPE html>
+    <html lang="en">
+      <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Email Messages Viewer</title>
+        <script src="https://cdn.tailwindcss.com"></script>
+        <style>
+          body {
+            background-color: #f3f4f6;
+            font-family: Arial, sans-serif;
+          }
+          .container {
+            max-width: 800px;
+            margin: 50px auto;
+            padding: 20px;
+          }
+          .prose {
+            line-height: 1.6;
+          }
+        </style>
+      </head>
+      <body>
+        <div class="container bg-white shadow-lg rounded-lg p-6">
+          <h1 class="text-2xl font-bold text-center mb-6">Email Messages Viewer</h1>
+          <div id="messages-container">${messagesHtml}</div>
+        </div>
+      </body>
+    </html>
+  `;
 }
 
 app.listen(PORT, () => {
-    console.log(`Server is running on http://localhost:${PORT}`);
-});
+  console.log(`Server is running on http://localhost:${PORT}`);
+});

_reference/localEmailViewer/package-lock.json

@@ -10,7 +10,7 @@
       "license": "ISC",
       "dependencies": {
         "express": "^5.1.0",
-        "mailparser": "^3.7.2",
+        "mailparser": "^3.7.4",
         "node-fetch": "^3.3.2"
       }
     },
@@ -634,9 +634,9 @@
       "license": "MIT"
     },
     "node_modules/libmime": {
-      "version": "5.3.6",
-      "resolved": "https://registry.npmjs.org/libmime/-/libmime-5.3.6.tgz",
-      "integrity": "sha512-j9mBC7eiqi6fgBPAGvKCXJKJSIASanYF4EeA4iBzSG0HxQxmXnR3KbyWqTn4CwsKSebqCv2f5XZfAO6sKzgvwA==",
+      "version": "5.3.7",
+      "resolved": "https://registry.npmjs.org/libmime/-/libmime-5.3.7.tgz",
+      "integrity": "sha512-FlDb3Wtha8P01kTL3P9M+ZDNDWPKPmKHWaU/cG/lg5pfuAwdflVpZE+wm9m7pKmC5ww6s+zTxBKS1p6yl3KpSw==",
       "license": "MIT",
       "dependencies": {
         "encoding-japanese": "2.2.0",
@@ -661,31 +661,31 @@
       }
     },
     "node_modules/mailparser": {
-      "version": "3.7.2",
-      "resolved": "https://registry.npmjs.org/mailparser/-/mailparser-3.7.2.tgz",
-      "integrity": "sha512-iI0p2TCcIodR1qGiRoDBBwboSSff50vQAWytM5JRggLfABa4hHYCf3YVujtuzV454xrOP352VsAPIzviqMTo4Q==",
+      "version": "3.7.4",
+      "resolved": "https://registry.npmjs.org/mailparser/-/mailparser-3.7.4.tgz",
+      "integrity": "sha512-Beh4yyR4jLq3CZZ32asajByrXnW8dLyKCAQD3WvtTiBnMtFWhxO+wa93F6sJNjDmfjxXs4NRNjw3XAGLqZR3Vg==",
       "license": "MIT",
       "dependencies": {
         "encoding-japanese": "2.2.0",
         "he": "1.2.0",
         "html-to-text": "9.0.5",
         "iconv-lite": "0.6.3",
-        "libmime": "5.3.6",
+        "libmime": "5.3.7",
         "linkify-it": "5.0.0",
-        "mailsplit": "5.4.2",
-        "nodemailer": "6.9.16",
+        "mailsplit": "5.4.5",
+        "nodemailer": "7.0.4",
         "punycode.js": "2.3.1",
-        "tlds": "1.255.0"
+        "tlds": "1.259.0"
       }
     },
     "node_modules/mailsplit": {
-      "version": "5.4.2",
-      "resolved": "https://registry.npmjs.org/mailsplit/-/mailsplit-5.4.2.tgz",
-      "integrity": "sha512-4cczG/3Iu3pyl8JgQ76dKkisurZTmxMrA4dj/e8d2jKYcFTZ7MxOzg1gTioTDMPuFXwTrVuN/gxhkrO7wLg7qA==",
+      "version": "5.4.5",
+      "resolved": "https://registry.npmjs.org/mailsplit/-/mailsplit-5.4.5.tgz",
+      "integrity": "sha512-oMfhmvclR689IIaQmIcR5nODnZRRVwAKtqFT407TIvmhX2OLUBnshUTcxzQBt3+96sZVDud9NfSe1NxAkUNXEQ==",
       "license": "(MIT OR EUPL-1.1+)",
       "dependencies": {
         "libbase64": "1.3.0",
-        "libmime": "5.3.6",
+        "libmime": "5.3.7",
         "libqp": "2.1.1"
       }
     },
@@ -793,9 +793,9 @@
       }
     },
     "node_modules/nodemailer": {
-      "version": "6.9.16",
-      "resolved": "https://registry.npmjs.org/nodemailer/-/nodemailer-6.9.16.tgz",
-      "integrity": "sha512-psAuZdTIRN08HKVd/E8ObdV6NO7NTBY3KsC30F7M4H1OnmLCUNaS56FpYxyb26zWLSyYF9Ozch9KYHhHegsiOQ==",
+      "version": "7.0.4",
+      "resolved": "https://registry.npmjs.org/nodemailer/-/nodemailer-7.0.4.tgz",
+      "integrity": "sha512-9O00Vh89/Ld2EcVCqJ/etd7u20UhME0f/NToPfArwPEe1Don1zy4mAIz6ariRr7mJ2RDxtaDzN0WJVdVXPtZaw==",
       "license": "MIT-0",
       "engines": {
         "node": ">=6.0.0"
@@ -1114,9 +1114,9 @@
       }
     },
     "node_modules/tlds": {
-      "version": "1.255.0",
-      "resolved": "https://registry.npmjs.org/tlds/-/tlds-1.255.0.tgz",
-      "integrity": "sha512-tcwMRIioTcF/FcxLev8MJWxCp+GUALRhFEqbDoZrnowmKSGqPrl5pqS+Sut2m8BgJ6S4FExCSSpGffZ0Tks6Aw==",
+      "version": "1.259.0",
+      "resolved": "https://registry.npmjs.org/tlds/-/tlds-1.259.0.tgz",
+      "integrity": "sha512-AldGGlDP0PNgwppe2quAvuBl18UcjuNtOnDuUkqhd6ipPqrYYBt3aTxK1QTsBVknk97lS2JcafWMghjGWFtunw==",
       "license": "MIT",
       "bin": {
         "tlds": "bin.js"

_reference/localEmailViewer/package.json

@@ -12,7 +12,7 @@
   "description": "",
   "dependencies": {
     "express": "^5.1.0",
-    "mailparser": "^3.7.2",
+    "mailparser": "^3.7.4",
     "node-fetch": "^3.3.2"
   }
 }

_reference/partsManagement/PATCH_parts-management-job-status.md

@@ -0,0 +1,61 @@
+# PATCH /integrations/parts-management/job/:id/status
+
+Update (patch) the status of a job created under parts management. This endpoint is only available
+for jobs whose parent bodyshop has an `external_shop_id` (i.e., is provisioned for parts
+management).
+
+## Endpoint
+
+```
+PATCH /integrations/parts-management/job/:id/status
+```
+
+- `:id` is the UUID of the job to update.
+
+## Request Headers
+
+- `Authorization`: (if required by your integration middleware)
+- `Content-Type: application/json`
+
+## Request Body
+
+Send a JSON object with the following field:
+
+- `status` (string, required): The new status for the job.
+
+Example:
+
+```
+PATCH /integrations/parts-management/job/123e4567-e89b-12d3-a456-426614174000/status
+Content-Type: application/json
+
+{
+  "status": "IN_PROGRESS"
+}
+```
+
+## Success Response
+
+- **200 OK**
+- Returns the updated job object with the new status.
+
+```
+{
+  "id": "123e4567-e89b-12d3-a456-426614174000",
+  "status": "IN_PROGRESS",
+  ...
+}
+```
+
+## Error Responses
+
+- **400 Bad Request**: Missing status field, or parent bodyshop does not have an `external_shop_id`.
+- **404 Not Found**: No job found with the given ID.
+- **500 Internal Server Error**: Unexpected error.
+
+## Notes
+
+- Only jobs whose parent bodyshop has an `external_shop_id` can be patched via this route.
+- Fields other than `status` will be ignored if included in the request body.
+- The route is protected by the same middleware as other parts management endpoints.
+

_reference/partsManagement/PATCH_parts-management-provision.md

@@ -0,0 +1,86 @@
+# PATCH /integrations/parts-management/provision/:id
+
+Update (patch) select fields for a parts management bodyshop. Only available for shops that have an
+`external_shop_id` (i.e., are provisioned for parts management).
+
+## Endpoint
+
+```
+PATCH /integrations/parts-management/provision/:id
+```
+
+- `:id` is the UUID of the bodyshop to update.
+
+## Request Headers
+
+- `Authorization`: (if required by your integration middleware)
+- `Content-Type: application/json`
+
+## Request Body
+
+Send a JSON object with one or more of the following fields to update:
+
+- `shopname` (string)
+- `address1` (string)
+- `address2` (string, optional)
+- `city` (string)
+- `state` (string)
+- `zip_post` (string)
+- `country` (string)
+- `email` (string, shop's email, not user email)
+- `timezone` (string)
+- `phone` (string)
+- `logo_img_path` (object, e.g. `{ src, width, height, headerMargin }`)
+
+Any fields not included in the request body will remain unchanged.
+
+## Example Request
+
+```
+PATCH /integrations/parts-management/provision/123e4567-e89b-12d3-a456-426614174000
+Content-Type: application/json
+
+{
+  "shopname": "New Shop Name",
+  "address1": "123 Main St",
+  "city": "Springfield",
+  "state": "IL",
+  "zip_post": "62704",
+  "country": "USA",
+  "email": "shop@example.com",
+  "timezone": "America/Chicago",
+  "phone": "555-123-4567",
+  "logo_img_path": {
+    "src": "https://example.com/logo.png",
+    "width": "200",
+    "height": "100",
+    "headerMargin": 10
+  }
+}
+```
+
+## Success Response
+
+- **200 OK**
+- Returns the updated shop object with the patched fields.
+
+```
+{
+  "id": "123e4567-e89b-12d3-a456-426614174000",
+  "shopname": "New Shop Name",
+  ...
+}
+```
+
+## Error Responses
+
+- **400 Bad Request**: No valid fields provided, or shop does not have an `external_shop_id`.
+- **404 Not Found**: No shop found with the given ID.
+- **500 Internal Server Error**: Unexpected error.
+
+## Notes
+
+- Only shops with an `external_shop_id` can be patched via this route.
+- Fields not listed above will be ignored if included in the request body.
+- The route is protected by the same middleware as other parts management endpoints.
+

bodyshop_translations.babel

@@ -5305,6 +5305,27 @@
                                                     </translation>
                                                 </translations>
                                             </concept_node>
+                                            <concept_node>
+                                                <name>ro_posting</name>
+                                                <definition_loaded>false</definition_loaded>
+                                                <description></description>
+                                                <comment></comment>
+                                                <default_text></default_text>
+                                                <translations>
+                                                    <translation>
+                                                        <language>en-US</language>
+                                                        <approved>false</approved>
+                                                    </translation>
+                                                    <translation>
+                                                        <language>es-MX</language>
+                                                        <approved>false</approved>
+                                                    </translation>
+                                                    <translation>
+                                                        <language>fr-CA</language>
+                                                        <approved>false</approved>
+                                                    </translation>
+                                                </translations>
+                                            </concept_node>
                                             <concept_node>
                                                 <name>sendmaterialscosting</name>
                                                 <definition_loaded>false</definition_loaded>

client/.env.development.imex

@@ -15,4 +15,6 @@ VITE_APP_INSTANCE=IMEX
 TEST_USERNAME="test@imex.dev"
 TEST_PASSWORD="test123"
 VITE_PUBLIC_POSTHOG_KEY=phc_xtLmBIu0rjWwExY73Oj5DTH1bGbwq1G1Y8jnlTceien
-VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
+VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
+VITE_APP_AMP_URL=https://vp8k908qy2.execute-api.ca-central-1.amazonaws.com
+VITE_APP_AMP_KEY=6228a598e57cd66875cfd41604f1f891

client/.env.development.rome

@@ -17,4 +17,6 @@ VITE_APP_INSTANCE=ROME
 TEST_USERNAME="test@imex.dev"
 TEST_PASSWORD="test123"
 VITE_PUBLIC_POSTHOG_KEY=phc_xtLmBIu0rjWwExY73Oj5DTH1bGbwq1G1Y8jnlTceien
-VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
+VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
+VITE_APP_AMP_URL=https://vp8k908qy2.execute-api.ca-central-1.amazonaws.com
+VITE_APP_AMP_KEY=46b1193a867d4e3131ae4c3a64a3fc78

client/.env.production.imex

@@ -14,4 +14,6 @@ VITE_APP_REPORTS_SERVER_URL=https://reports.imex.online
 VITE_APP_SPLIT_API=et9pjkik6bn67he5evpmpr1agoo7gactphgk
 VITE_APP_INSTANCE=IMEX
 VITE_PUBLIC_POSTHOG_KEY=phc_xtLmBIu0rjWwExY73Oj5DTH1bGbwq1G1Y8jnlTceien
-VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
+VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
+VITE_APP_AMP_URL=https://vp8k908qy2.execute-api.ca-central-1.amazonaws.com
+VITE_APP_AMP_KEY=6228a598e57cd66875cfd41604f1f891

client/.env.production.rome

@@ -14,4 +14,6 @@ VITE_APP_REPORTS_SERVER_URL=https://reports.romeonline.io
 VITE_APP_SPLIT_API=et9pjkik6bn67he5evpmpr1agoo7gactphgk
 VITE_APP_INSTANCE=ROME
 VITE_PUBLIC_POSTHOG_KEY=phc_xtLmBIu0rjWwExY73Oj5DTH1bGbwq1G1Y8jnlTceien
-VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
+VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
+VITE_APP_AMP_URL=https://vp8k908qy2.execute-api.ca-central-1.amazonaws.com
+VITE_APP_AMP_KEY=46b1193a867d4e3131ae4c3a64a3fc78

client/.env.test.imex

@@ -14,4 +14,6 @@ VITE_APP_IS_TEST=true
 VITE_APP_SPLIT_API=ts615lqgnmk84thn72uk18uu5pgce6e0l4rc
 VITE_APP_INSTANCE=IMEX
 VITE_PUBLIC_POSTHOG_KEY=phc_xtLmBIu0rjWwExY73Oj5DTH1bGbwq1G1Y8jnlTceien
-VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
+VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
+VITE_APP_AMP_URL=https://vp8k908qy2.execute-api.ca-central-1.amazonaws.com
+VITE_APP_AMP_KEY=6228a598e57cd66875cfd41604f1f891

client/.env.test.rome

@@ -14,4 +14,6 @@ VITE_APP_IS_TEST=true
 VITE_APP_SPLIT_API=ts615lqgnmk84thn72uk18uu5pgce6e0l4rc
 VITE_APP_INSTANCE=ROME
 VITE_PUBLIC_POSTHOG_KEY=phc_xtLmBIu0rjWwExY73Oj5DTH1bGbwq1G1Y8jnlTceien
-VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
+VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
+VITE_APP_AMP_URL=https://vp8k908qy2.execute-api.ca-central-1.amazonaws.com
+VITE_APP_AMP_KEY=46b1193a867d4e3131ae4c3a64a3fc78

client/package.json

@@ -8,50 +8,51 @@
   "private": true,
   "proxy": "http://localhost:4000",
   "dependencies": {
-    "@amplitude/analytics-browser": "^2.23.1",
+    "@amplitude/analytics-browser": "^2.30.1",
     "@ant-design/pro-layout": "^7.22.6",
     "@apollo/client": "^3.13.9",
-    "@emotion/is-prop-valid": "^1.3.1",
+    "@emotion/is-prop-valid": "^1.4.0",
     "@fingerprintjs/fingerprintjs": "^4.6.1",
-    "@firebase/analytics": "^0.10.17",
-    "@firebase/app": "^0.14.1",
-    "@firebase/auth": "^1.10.8",
-    "@firebase/firestore": "^4.8.0",
+    "@firebase/analytics": "^0.10.19",
+    "@firebase/app": "^0.14.6",
+    "@firebase/auth": "^1.11.1",
+    "@firebase/firestore": "^4.9.2",
     "@firebase/messaging": "^0.12.22",
     "@jsreport/browser-client": "^3.1.0",
-    "@reduxjs/toolkit": "^2.8.2",
-    "@sentry/cli": "^2.52.0",
+    "@reduxjs/toolkit": "^2.10.1",
+    "@sentry/cli": "^2.58.2",
     "@sentry/react": "^9.43.0",
-    "@sentry/vite-plugin": "^4.1.1",
-    "@splitsoftware/splitio-react": "^2.3.1",
-    "@tanem/react-nprogress": "^5.0.53",
-    "antd": "^5.27.1",
+    "@sentry/vite-plugin": "^4.6.0",
+    "@splitsoftware/splitio-react": "^2.6.0",
+    "@tanem/react-nprogress": "^5.0.56",
+    "antd": "^5.28.1",
     "apollo-link-logger": "^2.0.1",
     "apollo-link-sentry": "^4.4.0",
     "autosize": "^6.0.1",
-    "axios": "^1.11.0",
+    "axios": "^1.13.2",
     "classnames": "^2.5.1",
     "css-box-model": "^1.2.1",
-    "dayjs": "^1.11.13",
-    "dayjs-business-days2": "^1.3.0",
+    "dayjs": "^1.11.19",
+    "dayjs-business-days2": "^1.3.1",
     "dinero.js": "^1.9.1",
-    "dotenv": "^17.2.1",
+    "dotenv": "^17.2.3",
     "env-cmd": "^10.1.0",
     "exifr": "^7.1.3",
-    "graphql": "^16.11.0",
-    "i18next": "^25.4.0",
+    "graphql": "^16.12.0",
+    "i18next": "^25.6.2",
     "i18next-browser-languagedetector": "^8.2.0",
     "immutability-helper": "^3.1.1",
-    "libphonenumber-js": "^1.12.13",
+    "libphonenumber-js": "^1.12.26",
+    "lightningcss": "^1.30.2",
     "logrocket": "^9.0.2",
-    "markerjs2": "^2.32.6",
+    "markerjs2": "^2.32.7",
     "memoize-one": "^6.0.0",
-    "normalize-url": "^8.0.2",
+    "normalize-url": "^8.1.0",
     "object-hash": "^3.0.0",
     "phone": "^3.1.67",
-    "posthog-js": "^1.260.2",
+    "posthog-js": "^1.294.0",
     "prop-types": "^15.8.1",
-    "query-string": "^9.2.2",
+    "query-string": "^9.3.1",
     "raf-schd": "^4.0.3",
     "react": "^18.3.1",
     "react-big-calendar": "^1.19.4",
@@ -61,26 +62,26 @@
     "react-drag-listview": "^2.0.0",
     "react-grid-gallery": "^1.0.1",
     "react-grid-layout": "1.3.4",
-    "react-i18next": "^15.7.1",
+    "react-i18next": "^15.7.3",
     "react-icons": "^5.5.0",
     "react-image-lightbox": "^5.1.4",
     "react-markdown": "^10.1.0",
     "react-number-format": "^5.4.3",
     "react-popopo": "^2.1.9",
-    "react-product-fruits": "^2.2.61",
+    "react-product-fruits": "^2.2.62",
     "react-redux": "^9.2.0",
     "react-resizable": "^3.0.5",
     "react-router-dom": "^6.30.0",
     "react-sticky": "^6.0.3",
-    "react-virtuoso": "^4.14.0",
+    "react-virtuoso": "^4.14.1",
     "recharts": "^2.15.2",
     "redux": "^5.0.1",
     "redux-actions": "^3.0.3",
     "redux-persist": "^6.0.0",
-    "redux-saga": "^1.3.0",
+    "redux-saga": "^1.4.2",
     "redux-state-sync": "^3.1.4",
     "reselect": "^5.1.1",
-    "sass": "^1.90.0",
+    "sass": "^1.94.0",
     "socket.io-client": "^4.8.1",
     "styled-components": "^6.1.19",
     "subscriptions-transport-ws": "^0.11.0",
@@ -132,38 +133,37 @@
     "@rollup/rollup-linux-x64-gnu": "4.6.1"
   },
   "devDependencies": {
-    "@ant-design/icons": "^6.0.0",
+    "@ant-design/icons": "^6.1.0",
     "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
-    "@babel/preset-react": "^7.27.1",
-    "@dotenvx/dotenvx": "^1.49.0",
+    "@babel/preset-react": "^7.28.5",
+    "@dotenvx/dotenvx": "^1.51.1",
     "@emotion/babel-plugin": "^11.13.5",
     "@emotion/react": "^11.14.0",
-    "@eslint/js": "^9.33.0",
-    "@playwright/test": "^1.55.0",
-    "@sentry/webpack-plugin": "^4.1.1",
+    "@eslint/js": "^9.39.1",
+    "@playwright/test": "^1.56.1",
+    "@sentry/webpack-plugin": "^4.6.0",
     "@testing-library/dom": "^10.4.1",
-    "@testing-library/jest-dom": "^6.8.0",
+    "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.0",
     "@vitejs/plugin-react": "^4.6.0",
-    "browserslist": "^4.25.3",
+    "browserslist": "^4.28.0",
     "browserslist-to-esbuild": "^2.1.1",
-    "chalk": "^5.6.0",
-    "eslint": "^9.33.0",
+    "chalk": "^5.6.2",
+    "eslint": "^9.39.1",
     "eslint-plugin-react": "^7.37.5",
     "globals": "^15.15.0",
     "jsdom": "^26.0.0",
-    "lightningcss": "^1.30.1",
-    "memfs": "^4.36.3",
+    "memfs": "^4.51.0",
     "os-browserify": "^0.3.0",
-    "playwright": "^1.55.0",
+    "playwright": "^1.56.1",
     "react-error-overlay": "^6.1.0",
     "redux-logger": "^3.0.6",
     "source-map-explorer": "^2.5.3",
-    "vite": "^7.1.3",
+    "vite": "^7.2.2",
     "vite-plugin-babel": "^1.3.2",
     "vite-plugin-eslint": "^1.8.1",
     "vite-plugin-node-polyfills": "^0.24.0",
-    "vite-plugin-pwa": "^1.0.3",
+    "vite-plugin-pwa": "^1.1.0",
     "vite-plugin-style-import": "^2.0.0",
     "vitest": "^3.2.4",
     "workbox-window": "^7.3.0"

client/src/App/App.container.jsx

@@ -12,6 +12,7 @@ import GlobalLoadingBar from "../components/global-loading-bar/global-loading-ba
 import { setDarkMode } from "../redux/application/application.actions";
 import { selectDarkMode } from "../redux/application/application.selectors";
 import { selectCurrentUser } from "../redux/user/user.selectors.js";
+import { signOutStart } from "../redux/user/user.actions";
 import client from "../utils/GraphQLClient";
 import App from "./App";
 import getTheme from "./themeProvider";
@@ -20,14 +21,13 @@ import getTheme from "./themeProvider";
 const config = {
   core: {
     authorizationKey: import.meta.env.VITE_APP_SPLIT_API,
-    key: "anon" // Default key, overridden dynamically by SplitClientProvider
+    key: "anon"
   }
 };
 
-// Custom provider to manage the Split client key based on imexshopid from Redux
 function SplitClientProvider({ children }) {
-  const imexshopid = useSelector((state) => state.user.imexshopid); // Access imexshopid from Redux store
-  const splitClient = useSplitClient({ key: imexshopid || "anon" }); // Use imexshopid or fallback to "anon"
+  const imexshopid = useSelector((state) => state.user.imexshopid);
+  const splitClient = useSplitClient({ key: imexshopid || "anon" });
   useEffect(() => {
     if (splitClient && imexshopid) {
       console.log(`Split client initialized with key: ${imexshopid}, isReady: ${splitClient.isReady}`);
@@ -36,40 +36,66 @@ function SplitClientProvider({ children }) {
   return children;
 }
 
-const mapDispatchToProps = (dispatch) => ({
-  setDarkMode: (isDarkMode) => dispatch(setDarkMode(isDarkMode))
-});
-
 const mapStateToProps = createStructuredSelector({
   currentUser: selectCurrentUser
 });
 
-function AppContainer({ currentUser, setDarkMode }) {
+const mapDispatchToProps = (dispatch) => ({
+  setDarkMode: (isDarkMode) => dispatch(setDarkMode(isDarkMode)),
+  signOutStart: () => dispatch(signOutStart())
+});
+
+function AppContainer({ currentUser, setDarkMode, signOutStart }) {
   const { t } = useTranslation();
   const isDarkMode = useSelector(selectDarkMode);
   const theme = useMemo(() => getTheme(isDarkMode), [isDarkMode]);
 
-  // Update data-theme attribute when dark mode changes
+  // Global seamless logout listener with redirect to /signin
+  useEffect(() => {
+    const handleSeamlessLogout = (event) => {
+      if (event.data?.type !== "seamlessLogoutRequest") return;
+
+      const requestOrigin = event.origin;
+
+      if (currentUser?.authorized !== true) {
+        window.parent.postMessage(
+          { type: "seamlessLogoutResponse", status: "already_logged_out" },
+          requestOrigin || "*"
+        );
+        return;
+      }
+
+      signOutStart();
+      window.parent.postMessage({ type: "seamlessLogoutResponse", status: "logged_out" }, requestOrigin || "*");
+    };
+
+    window.addEventListener("message", handleSeamlessLogout);
+    return () => {
+      window.removeEventListener("message", handleSeamlessLogout);
+    };
+  }, [signOutStart, currentUser]);
+
+  // Update data-theme attribute
   useEffect(() => {
     document.documentElement.setAttribute("data-theme", isDarkMode ? "dark" : "light");
     return () => document.documentElement.removeAttribute("data-theme");
   }, [isDarkMode]);
 
-  // Sync Redux darkMode with localStorage on user change
+  // Sync darkMode with localStorage
   useEffect(() => {
     if (currentUser?.uid) {
       const savedMode = localStorage.getItem(`dark-mode-${currentUser.uid}`);
       if (savedMode !== null) {
         setDarkMode(JSON.parse(savedMode));
       } else {
-        setDarkMode(false); // default to light mode
+        setDarkMode(false);
       }
     } else {
       setDarkMode(false);
     }
-  }, [currentUser?.uid]);
+  }, [currentUser?.uid, setDarkMode]);
 
-  // Persist darkMode to localStorage when it or user changes
+  // Persist darkMode
   useEffect(() => {
     if (currentUser?.uid) {
       localStorage.setItem(`dark-mode-${currentUser.uid}`, JSON.stringify(isDarkMode));

client/src/App/App.jsx

@@ -24,6 +24,7 @@ import InstanceRenderMgr from "../utils/instanceRenderMgr";
 import ProductFruitsWrapper from "./ProductFruitsWrapper.jsx";
 import { NotificationProvider } from "../contexts/Notifications/notificationContext.jsx";
 import SocketProvider from "../contexts/SocketIO/socketProvider.jsx";
+import SoundWrapper from "./SoundWrapper.jsx";
 
 const ResetPassword = lazy(() => import("../pages/reset-password/reset-password.component"));
 const ManagePage = lazy(() => import("../pages/manage/manage.page.container"));
@@ -72,9 +73,6 @@ export function App({
     setIsPartsEntry(isParts);
   }, [setIsPartsEntry]);
 
-  //const b = Grid.useBreakpoint();
-  // console.log("Breakpoints:", b);
-
   // Associate event listeners, memoize to prevent multiple listeners being added
   useEffect(() => {
     const offlineListener = () => {
@@ -164,87 +162,87 @@ export function App({
       />
 
       <NotificationProvider>
-        <Routes>
-          <Route
-            path="*"
-            element={
-              <ErrorBoundary>
-                <LandingPage />
-              </ErrorBoundary>
-            }
-          />
-          <Route
-            path="/signin"
-            element={
-              <ErrorBoundary>
-                <SignInPage />
-              </ErrorBoundary>
-            }
-          />
-          <Route
-            path="/resetpassword"
-            element={
-              <ErrorBoundary>
-                <ResetPassword />
-              </ErrorBoundary>
-            }
-          />
-          <Route
-            path="/csi/:surveyId"
-            element={
-              <ErrorBoundary>
-                <CsiPage />
-              </ErrorBoundary>
-            }
-          />
-          <Route
-            path="/disclaimer"
-            element={
-              <ErrorBoundary>
-                <DisclaimerPage />
-              </ErrorBoundary>
-            }
-          />
-          <Route
-            path="/manage/*"
-            element={
-              <ErrorBoundary>
-                <SocketProvider bodyshop={bodyshop} navigate={navigate} currentUser={currentUser}>
+        <SoundWrapper bodyshop={bodyshop}>
+          <Routes>
+            <Route
+              path="*"
+              element={
+                <ErrorBoundary>
+                  <LandingPage />
+                </ErrorBoundary>
+              }
+            />
+            <Route
+              path="/signin"
+              element={
+                <ErrorBoundary>
+                  <SignInPage />
+                </ErrorBoundary>
+              }
+            />
+            <Route
+              path="/resetpassword"
+              element={
+                <ErrorBoundary>
+                  <ResetPassword />
+                </ErrorBoundary>
+              }
+            />
+            <Route
+              path="/csi/:surveyId"
+              element={
+                <ErrorBoundary>
+                  <CsiPage />
+                </ErrorBoundary>
+              }
+            />
+            <Route
+              path="/disclaimer"
+              element={
+                <ErrorBoundary>
+                  <DisclaimerPage />
+                </ErrorBoundary>
+              }
+            />
+            <Route
+              path="/manage/*"
+              element={
+                <ErrorBoundary>
+                  <SocketProvider bodyshop={bodyshop} navigate={navigate} currentUser={currentUser}>
+                    <PrivateRoute isAuthorized={currentUser.authorized} />
+                  </SocketProvider>
+                </ErrorBoundary>
+              }
+            >
+              <Route path="*" element={<ManagePage />} />
+            </Route>
+            <Route
+              path="/tech/*"
+              element={
+                <ErrorBoundary>
+                  <SocketProvider bodyshop={bodyshop} navigate={navigate} currentUser={currentUser}>
+                    <PrivateRoute isAuthorized={currentUser.authorized} />
+                  </SocketProvider>
+                </ErrorBoundary>
+              }
+            >
+              <Route path="*" element={<TechPageContainer />} />
+            </Route>
+            <Route
+              path="/parts/*"
+              element={
+                <ErrorBoundary>
                   <PrivateRoute isAuthorized={currentUser.authorized} />
-                </SocketProvider>
-              </ErrorBoundary>
-            }
-          >
-            <Route path="*" element={<ManagePage />} />
-          </Route>
-          <Route
-            path="/tech/*"
-            element={
-              <ErrorBoundary>
-                <SocketProvider bodyshop={bodyshop} navigate={navigate} currentUser={currentUser}>
-                  <PrivateRoute isAuthorized={currentUser.authorized} />
-                </SocketProvider>
-              </ErrorBoundary>
-            }
-          >
-            <Route path="*" element={<TechPageContainer />} />
-          </Route>
-          <Route
-            path="/parts/*"
-            element={
-              <ErrorBoundary>
-                <SocketProvider bodyshop={bodyshop} navigate={navigate} currentUser={currentUser}>
-                  <PrivateRoute isAuthorized={currentUser.authorized} />
-                </SocketProvider>
-              </ErrorBoundary>
-            }
-          >
-            <Route path="*" element={<SimplifiedPartsPageContainer />} />
-          </Route>
-          <Route path="/edit/*" element={<PrivateRoute isAuthorized={currentUser.authorized} />}>
-            <Route path="*" element={<DocumentEditorContainer />} />
-          </Route>
-        </Routes>
+                </ErrorBoundary>
+              }
+            >
+              <Route path="*" element={<SimplifiedPartsPageContainer />} />
+            </Route>
+            <Route path="/edit/*" element={<PrivateRoute isAuthorized={currentUser.authorized} />}>
+              <Route path="*" element={<DocumentEditorContainer />} />
+            </Route>
+          </Routes>
+        </SoundWrapper>
       </NotificationProvider>
     </Suspense>
   );

client/src/App/App.styles.scss

@@ -1,3 +1,5 @@
+@use "react-big-calendar/lib/sass/styles" as rbc;
+
 :root {
   --table-stripe-bg: #f4f4f4; /* Light mode table stripe */
   --menu-divider-color: #74695c; /* Light mode menu divider */
@@ -211,9 +213,6 @@
   --svg-background: #FFF; /* Dark mode SVG background */
 }
 
-// Global Styles
-@import "react-big-calendar/lib/sass/styles";
-
 .ant-menu-item-divider {
   border-bottom: 1px solid var(--menu-divider-color) !important;
 }
@@ -272,23 +271,23 @@
 }
 
 // Scrollbar styles (uncomment if needed, updated for dark mode)
-::-webkit-scrollbar-track {
-  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
-  border-radius: 0.2rem;
-  background-color: var(--table-stripe-bg);
-}
+// ::-webkit-scrollbar-track {
+//   -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
+//   border-radius: 0.2rem;
+//   background-color: var(--table-stripe-bg);
+// }
 
-::-webkit-scrollbar {
-  width: 0.25rem;
-  max-height: 0.25rem;
-  background-color: var(--table-stripe-bg);
-}
+// ::-webkit-scrollbar {
+//   width: 0.25rem;
+//   max-height: 0.25rem;
+//   background-color: var(--table-stripe-bg);
+// }
 
-::-webkit-scrollbar-thumb {
-  border-radius: 0.2rem;
-  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
-  background-color: var(--alert-color);
-}
+// ::-webkit-scrollbar-thumb {
+//   border-radius: 0.2rem;
+//   -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
+//   background-color: var(--alert-color);
+// }
 
 .ant-input-number-input,
 .ant-input-number,
@@ -428,4 +427,4 @@
 
 //.rbc-time-header-gutter {
 //  padding: 0;
-//} 
+//}

client/src/App/SoundWrapper.jsx

@@ -0,0 +1,43 @@
+import { useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import { useNotification } from "../contexts/Notifications/notificationContext.jsx";
+import { initNewMessageSound, unlockAudio } from "./../utils/soundManager";
+import { initSingleTabAudioLeader } from "../utils/singleTabAudioLeader";
+
+export default function SoundWrapper({ children, bodyshop }) {
+  const { t } = useTranslation();
+  const notification = useNotification();
+
+  useEffect(() => {
+    if (!bodyshop?.id) return;
+
+    // 1) Init single-tab leader election (only one tab should play sounds), scoped by bodyshopId
+    const cleanupLeader = initSingleTabAudioLeader(bodyshop.id);
+
+    // 2) Initialize base audio
+    initNewMessageSound("https://images.imex.online/app/messageTone.wav", 0.7);
+
+    // 3) Show a one-time prompt when autoplay blocks first play
+    const onNeedsUnlock = () => {
+      notification.info({
+        description: t("audio.manager.description"),
+        duration: 3
+      });
+    };
+    window.addEventListener("sound-needs-unlock", onNeedsUnlock);
+
+    // 4) Proactively unlock on first gesture (once per session)
+    const gesture = () => unlockAudio(bodyshop.id);
+    window.addEventListener("click", gesture, { once: true, passive: true });
+    window.addEventListener("touchstart", gesture, { once: true, passive: true });
+    window.addEventListener("keydown", gesture, { once: true });
+
+    return () => {
+      cleanupLeader();
+      window.removeEventListener("sound-needs-unlock", onNeedsUnlock);
+      // gesture listeners were added with {once:true}
+    };
+  }, [notification, t, bodyshop?.id]); // include bodyshop.id so this runs when org changes
+
+  return <>{children}</>;
+}

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

@@ -142,7 +142,16 @@ export function AccountingReceivablesTableComponent({ bodyshop, loading, jobs, r
             refetch={refetch}
           />
           <Link to={`/manage/jobs/${record.id}/close`}>
-            <Button>{t("jobs.labels.viewallocations")}</Button>
+            <Button
+              style={{
+                overflow: "hidden",
+                textOverflow: "ellipsis",
+                whiteSpace: "nowrap",
+                verticalAlign: "middle"
+              }}
+            >
+              {t("jobs.labels.viewallocations")}
+            </Button>
           </Link>
         </Space>
       )
@@ -171,7 +180,7 @@ export function AccountingReceivablesTableComponent({ bodyshop, loading, jobs, r
     <Card
       extra={
         <Space wrap>
-          {!bodyshop.cdk_dealerid && !bodyshop.pbs_serialnumber && (
+          {!bodyshop.cdk_dealerid && !bodyshop.pbs_serialnumber && !bodyshop.rr_dealerid && (
             <>
               <JobMarkSelectedExported
                 jobIds={selectedJobs}
@@ -189,7 +198,7 @@ export function AccountingReceivablesTableComponent({ bodyshop, loading, jobs, r
               />
             </>
           )}
-          {bodyshop.accountingconfig && bodyshop.accountingconfig.qbo && <QboAuthorizeComponent />}
+          {bodyshop.accountingconfig?.qbo && <QboAuthorizeComponent />}
           <Input.Search
             value={state.search}
             onChange={handleSearch}

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

@@ -7,6 +7,7 @@ import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
 import CiecaSelect from "../../utils/Ciecaselect";
+import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -44,7 +45,7 @@ export function BillFormItemsExtendedFormItem({
                 quantity: record.part_qty || 1,
                 actual_price: record.act_price,
                 cost_center: record.part_type
-                  ? bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid
+                  ? bodyshopHasDmsKey(bodyshop)
                     ? record.part_type
                     : responsibilityCenters.defaults && (responsibilityCenters.defaults.costs[record.part_type] || null)
                   : null
@@ -100,7 +101,7 @@ export function BillFormItemsExtendedFormItem({
       </Form.Item>
       <Form.Item label={t("billlines.fields.cost_center")} name={["billlineskeys", record.id, "cost_center"]}>
         <Select showSearch style={{ minWidth: "3rem" }} disabled={disabled}>
-          {bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber
+          {bodyshopHasDmsKey(bodyshop)
             ? CiecaSelect(true, false)
             : responsibilityCenters.costs.map((item) => <Select.Option key={item.name}>{item.name}</Select.Option>)}
         </Select>

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

@@ -22,6 +22,7 @@ import VendorSearchSelect from "../vendor-search-select/vendor-search-select.com
 import BillFormLines from "./bill-form.lines.component";
 import { CalculateBillTotal } from "./bill-form.totals.utility";
 import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
+import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -354,7 +355,7 @@ export function BillFormComponent({
               <Form.Item span={3} label={t("bills.fields.local_tax_rate")} name="local_tax_rate">
                 <CurrencyInput min={0} />
               </Form.Item>
-              {bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid ? (
+              {bodyshopHasDmsKey(bodyshop) ? (
                 <Form.Item span={2} label={t("bills.labels.federal_tax_exempt")} name="federal_tax_exempt">
                   <Switch onChange={handleFederalTaxExemptSwitchToggle} />
                 </Form.Item>

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

@@ -10,6 +10,7 @@ import InstanceRenderManager from "../../utils/instanceRenderMgr";
 import BillLineSearchSelect from "../bill-line-search-select/bill-line-search-select.component";
 import BilllineAddInventory from "../billline-add-inventory/billline-add-inventory.component";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
+import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
 
 const mapStateToProps = createStructuredSelector({
   //currentUser: selectCurrentUser
@@ -45,7 +46,7 @@ export function BillEnterModalLinesComponent({
         title: t("billlines.fields.jobline"),
         dataIndex: "joblineid",
         editable: true,
-        width: "20rem",
+        minWidth: "10rem",
         formItemProps: (field) => {
           return {
             key: `${field.index}joblinename`,
@@ -71,9 +72,9 @@ export function BillEnterModalLinesComponent({
             disabled={disabled}
             options={lineData}
             style={{
-              width: "20rem",
-              maxWidth: "20rem",
-              minWidth: "10rem",
+              //width: "10rem",
+              // maxWidth: "20rem",
+              minWidth: "20rem",
               whiteSpace: "normal",
               height: "auto",
               minHeight: "32px" // default height of Ant Design inputs
@@ -90,7 +91,7 @@ export function BillEnterModalLinesComponent({
                       actual_price: opt.cost,
                       original_actual_price: opt.cost,
                       cost_center: opt.part_type
-                        ? bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid
+                        ? bodyshopHasDmsKey(bodyshop)
                           ? opt.part_type !== "PAE"
                             ? opt.part_type
                             : null
@@ -110,7 +111,7 @@ export function BillEnterModalLinesComponent({
         title: t("billlines.fields.line_desc"),
         dataIndex: "line_desc",
         editable: true,
-        width: "20rem",
+        minWidth: "10rem",
         formItemProps: (field) => {
           return {
             key: `${field.index}line_desc`,
@@ -232,7 +233,7 @@ export function BillEnterModalLinesComponent({
         title: t("billlines.fields.actual_cost"),
         dataIndex: "actual_cost",
         editable: true,
-        width: "8rem",
+        width: "10rem",
 
         formItemProps: (field) => {
           return {
@@ -322,7 +323,7 @@ export function BillEnterModalLinesComponent({
         },
         formInput: () => (
           <Select showSearch style={{ minWidth: "3rem" }} disabled={disabled}>
-            {bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber
+            {bodyshopHasDmsKey(bodyshop)
               ? CiecaSelect(true, false)
               : responsibilityCenters.costs.map((item) => <Select.Option key={item.name}>{item.name}</Select.Option>)}
           </Select>
@@ -357,6 +358,7 @@ export function BillEnterModalLinesComponent({
         title: t("billlines.labels.deductedfromlbr"),
         dataIndex: "deductedfromlbr",
         editable: true,
+        width: "40px",
         formItemProps: (field) => {
           return {
             valuePropName: "checked",
@@ -464,7 +466,7 @@ export function BillEnterModalLinesComponent({
             title: t("billlines.fields.federal_tax_applicable"),
             dataIndex: "applicable_taxes.federal",
             editable: true,
-
+            width: "40px",
             formItemProps: (field) => {
               return {
                 key: `${field.index}fedtax`,
@@ -485,7 +487,7 @@ export function BillEnterModalLinesComponent({
         title: t("billlines.fields.state_tax_applicable"),
         dataIndex: "applicable_taxes.state",
         editable: true,
-
+        width: "40px",
         formItemProps: (field) => {
           return {
             key: `${field.index}statetax`,
@@ -503,7 +505,7 @@ export function BillEnterModalLinesComponent({
             title: t("billlines.fields.local_tax_applicable"),
             dataIndex: "applicable_taxes.local",
             editable: true,
-
+            width: "40px",
             formItemProps: (field) => {
               return {
                 key: `${field.index}localtax`,

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

@@ -39,30 +39,32 @@ const BillLineSearchSelect = ({ options, disabled, allowRemoved, ...restProps },
           style: {
             ...(item.removed ? { textDecoration: "line-through" } : {})
           },
-          name: `${item.removed ? `(REMOVED) ` : ""}${item.line_desc}${
-            item.oem_partno ? ` - ${item.oem_partno}` : ""
-          }${item.alt_partno ? ` (${item.alt_partno})` : ""}`.trim(),
-          label: (
-            <div style={{ whiteSpace: "normal", wordBreak: "break-word" }}>
-              <span>
-                {`${item.removed ? `(REMOVED) ` : ""}${item.line_desc}${
-                  item.oem_partno ? ` - ${item.oem_partno}` : ""
-                }${item.alt_partno ? ` (${item.alt_partno})` : ""}`.trim()}
-              </span>
-              {InstanceRenderMgr({
-                rome: 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)}` : ``}
-              </span>
-            </div>
-          )
+          name: generateLineName(item),
+          label: generateLineName(item)
         }))
       ]}
       {...restProps}
     ></Select>
   );
 };
+
+function generateLineName(item) {
+  return (
+    <div style={{ whiteSpace: "normal", wordBreak: "break-word" }}>
+      <span>
+        {`${item.removed ? `(REMOVED) ` : ""}${item.line_desc}${
+          item.oem_partno ? ` - ${item.oem_partno}` : ""
+        }${item.alt_partno ? ` (${item.alt_partno})` : ""}`.trim()}
+      </span>
+      {InstanceRenderMgr({
+        rome: 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)}` : ``}
+      </span>
+    </div>
+  );
+}
 export default forwardRef(BillLineSearchSelect);

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

@@ -5,6 +5,7 @@ import { useTranslation } from "react-i18next";
 import { FaTasks } from "react-icons/fa";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 import { selectJobReadOnly } from "../../redux/application/application.selectors";
 import { setModalContext } from "../../redux/modals/modals.actions";
 import { selectBodyshop } from "../../redux/user/user.selectors";
@@ -75,6 +76,7 @@ export function BillsListTableComponent({
       <Button
         title={t("tasks.buttons.create")}
         onClick={() => {
+          logImEXEvent("bills_create_task", {});
           setTaskUpsertContext({
             context: {
               jobid: job.id,
@@ -109,6 +111,13 @@ export function BillsListTableComponent({
       key: "vendorname",
       sorter: (a, b) => alphaSort(a.vendor.name, b.vendor.name),
       sortOrder: state.sortedInfo.columnKey === "vendorname" && state.sortedInfo.order,
+      filters: bills
+        ? [...new Set(bills.map((bill) => bill.vendor.name))].map((name) => ({
+            text: name,
+            value: name
+          }))
+        : [],
+      onFilter: (value, record) => record.vendor.name === value,
       render: (text, record) => <span>{record.vendor.name}</span>
     },
     {
@@ -160,6 +169,7 @@ export function BillsListTableComponent({
 
   const handleTableChange = (pagination, filters, sorter) => {
     setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
+    logImEXEvent("bills_list_sort_filter", { pagination, filters, sorter });
   };
 
   const filteredBills = bills
@@ -201,6 +211,7 @@ export function BillsListTableComponent({
               <Button
                 disabled={!hasBillsAccess}
                 onClick={() => {
+                  logImEXEvent("bills_reconcile", {});
                   setReconciliationContext({
                     actions: { refetch: billsQuery.refetch },
                     context: {

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

@@ -14,7 +14,7 @@ import { selectBodyshop } from "../../redux/user/user.selectors";
 import AuditTrailMapping from "../../utils/AuditTrailMappings";
 import CurrencyFormItemComponent from "../form-items-formatted/currency-form-item.component";
 import JobSearchSelectComponent from "../job-search-select/job-search-select.component";
-import { getCurrentUser } from "../../firebase/firebase.utils";
+import { getCurrentUser, logImEXEvent } from "../../firebase/firebase.utils";
 import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
 
 const mapStateToProps = createStructuredSelector({
@@ -124,6 +124,7 @@ const CardPaymentModalComponent = ({
     const { payments } = form.getFieldsValue();
 
     try {
+      logImEXEvent("payment_cc_lightbox");
       const response = await axios.post("/intellipay/lightbox_credentials", {
         bodyshop,
         refresh: !!window.intellipay,
@@ -171,6 +172,7 @@ const CardPaymentModalComponent = ({
 
     try {
       const { payments } = form.getFieldsValue();
+      logImEXEvent("payment_cc_shortlink");
       const response = await axios.post("/intellipay/generate_payment_url", {
         bodyshop,
         amount: payments.reduce((acc, val) => acc + (val?.amount || 0), 0),

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

@@ -9,13 +9,13 @@ import "./chat-affix.styles.scss";
 import { registerMessagingHandlers, unregisterMessagingHandlers } from "./registerMessagingSocketHandlers";
 import { useSocket } from "../../contexts/SocketIO/useSocket.js";
 
-export function ChatAffixContainer({ bodyshop, chatVisible }) {
+export function ChatAffixContainer({ bodyshop, chatVisible, currentUser }) {
   const { t } = useTranslation();
   const client = useApolloClient();
   const { socket } = useSocket();
 
   useEffect(() => {
-    if (!bodyshop || !bodyshop.messagingservicesid) return;
+    if (!bodyshop?.messagingservicesid) return;
 
     async function SubscribeToTopicForFCMNotification() {
       try {
@@ -35,8 +35,8 @@ export function ChatAffixContainer({ bodyshop, chatVisible }) {
     SubscribeToTopicForFCMNotification();
 
     // Register WebSocket handlers
-    if (socket && socket.connected) {
-      registerMessagingHandlers({ socket, client });
+    if (socket?.connected) {
+      registerMessagingHandlers({ socket, client, currentUser, bodyshop, t });
 
       return () => {
         unregisterMessagingHandlers({ socket });
@@ -44,11 +44,11 @@ export function ChatAffixContainer({ bodyshop, chatVisible }) {
     }
   }, [bodyshop, socket, t, client]);
 
-  if (!bodyshop || !bodyshop.messagingservicesid) return <></>;
+  if (!bodyshop?.messagingservicesid) return <></>;
 
   return (
     <div className={`chat-affix ${chatVisible ? "chat-affix-open" : ""}`}>
-      {bodyshop && bodyshop.messagingservicesid ? <ChatPopupComponent /> : null}
+      {bodyshop?.messagingservicesid ? <ChatPopupComponent /> : null}
     </div>
   );
 }

client/src/components/chat-affix/registerMessagingSocketHandlers.js

@@ -1,6 +1,11 @@
-import { CONVERSATION_LIST_QUERY, GET_CONVERSATION_DETAILS } from "../../graphql/conversations.queries";
 import { gql } from "@apollo/client";
 
+import { playNewMessageSound } from "../../utils/soundManager.js";
+import { isLeaderTab } from "../../utils/singleTabAudioLeader";
+
+import { CONVERSATION_LIST_QUERY, GET_CONVERSATION_DETAILS } from "../../graphql/conversations.queries";
+import { QUERY_ACTIVE_ASSOCIATION_SOUND } from "../../graphql/user.queries";
+
 const logLocal = (message, ...args) => {
   if (import.meta.env.VITE_APP_IS_TEST || !import.meta.env.PROD) {
     console.log(`==================== ${message} ====================`);
@@ -26,16 +31,48 @@ const enrichConversation = (conversation, isOutbound) => ({
   __typename: "conversations"
 });
 
-export const registerMessagingHandlers = ({ socket, client }) => {
+// Can be uncommonted to test the playback of the notification sound
+// window.testTone = () => {
+//   const notificationSound = new Audio(newMessageSound);
+//   notificationSound.play().catch((error) => {
+//     console.error("Error playing notification sound:", error);
+//   });
+// };
+
+export const registerMessagingHandlers = ({ socket, client, currentUser, bodyshop }) => {
   if (!(socket && client)) return;
 
   const handleNewMessageSummary = async (message) => {
     const { conversationId, newConversation, existingConversation, isoutbound } = message;
 
+    // True only when DB value is strictly true; falls back to true on cache miss
+    const isNewMessageSoundEnabled = (client) => {
+      try {
+        const email = currentUser?.email;
+        if (!email) return true; // default allow if we can't resolve user
+        const res = client.readQuery({
+          query: QUERY_ACTIVE_ASSOCIATION_SOUND,
+          variables: { email }
+        });
+        const flag = res?.associations?.[0]?.new_message_sound;
+        return flag === true; // strictly true => enabled
+      } catch {
+        // If the query hasn't been seeded in cache yet, default ON
+        return true;
+      }
+    };
+
     logLocal("handleNewMessageSummary - Start", { message, isNew: !existingConversation });
 
     const queryVariables = { offset: 0 };
 
+    if (!isoutbound) {
+      // Play notification sound for new inbound message (scoped to bodyshop)
+      if (isLeaderTab(bodyshop.id) && isNewMessageSoundEnabled(client)) {
+        playNewMessageSound(bodyshop.id);
+      }
+    }
+
     if (!existingConversation && conversationId) {
       // Attempt to read from the cache to determine if this is actually a new conversation
       try {
@@ -291,8 +328,6 @@ export const registerMessagingHandlers = ({ socket, client }) => {
 
         case "conversation-unarchived":
         case "conversation-archived":
-          // Would like to someday figure out how to get this working without refetch queries,
-          // But I have but a solid 4 hours into it, and there are just too many weird occurrences
           try {
             const listQueryVariables = { offset: 0 };
             const detailsQueryVariables = { conversationId };
@@ -328,7 +363,8 @@ export const registerMessagingHandlers = ({ socket, client }) => {
           }
           break;
 
-        case "tag-added": { // Ensure `job_conversations` is properly formatted
+        case "tag-added": {
+          // Ensure `job_conversations` is properly formatted
           const formattedJobConversations = job_conversations.map((jc) => ({
             __typename: "job_conversations",
             jobid: jc.jobid || jc.job?.id,

client/src/components/chat-media-selector/chat-media-selector.component.jsx

@@ -40,7 +40,11 @@ export function ChatMediaSelector({ bodyshop, selectedMedia, setSelectedMedia, c
     variables: {
       jobId: conversation.job_conversations[0]?.jobid
     },
-    skip: !open || !conversation.job_conversations || conversation.job_conversations.length === 0
+    skip:
+      !open ||
+      !conversation.job_conversations ||
+      conversation.job_conversations.length === 0 ||
+      bodyshop.uselocalmediaserver
   });
 
   const handleVisibleChange = (change) => {
@@ -48,7 +52,8 @@ export function ChatMediaSelector({ bodyshop, selectedMedia, setSelectedMedia, c
   };
 
   useEffect(() => {
-    setSelectedMedia([]);
+    // Instead of wiping the array (which holds media objects), just clear selection flags
+    setSelectedMedia((prev) => prev.map((m) => ({ ...m, isSelected: false })));
   }, [setSelectedMedia, conversation]);
 
   //Knowingly taking on the technical debt of poor implementation below. Done this way to avoid an edge case where no component may be displayed.
@@ -75,6 +80,7 @@ export function ChatMediaSelector({ bodyshop, selectedMedia, setSelectedMedia, c
             <JobDocumentsLocalGalleryExternal
               externalMediaState={[selectedMedia, setSelectedMedia]}
               jobId={conversation.job_conversations[0]?.jobid}
+              context="chat"
             />
           )}
         </>
@@ -90,6 +96,7 @@ export function ChatMediaSelector({ bodyshop, selectedMedia, setSelectedMedia, c
             <JobDocumentsLocalGalleryExternal
               externalMediaState={[selectedMedia, setSelectedMedia]}
               jobId={conversation.job_conversations[0]?.jobid}
+              context="chat"
             />
           )}
         </>
@@ -110,6 +117,7 @@ export function ChatMediaSelector({ bodyshop, selectedMedia, setSelectedMedia, c
       trigger="click"
       open={open}
       onOpenChange={handleVisibleChange}
+      destroyOnHidden
       classNames={{ root: "media-selector-popover" }}
     >
       <Badge count={selectedMedia.filter((s) => s.isSelected).length}>

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

@@ -34,7 +34,6 @@ export function ContractsFindModalContainer({ contractFinderModal, toggleModalVi
     logImEXEvent("contract_finder_search");
 
     //Execute contract find
-
     callSearch({
       variables: {
         plate: (values.plate && values.plate !== "" && values.plate) || undefined,

client/src/components/dashboard-grid/createDashboardQuery.js

@@ -2,11 +2,13 @@ import { gql } from "@apollo/client";
 import dayjs from "../../utils/day.js";
 import componentList from "./componentList.js";
 
-const createDashboardQuery = (state) => {
+const createDashboardQuery = (items) => {
   const componentBasedAdditions =
-    state &&
-    Array.isArray(state.layout) &&
-    state.layout.map((item) => componentList[item.i].gqlFragment || "").join("");
+    Array.isArray(items) &&
+    items
+      .map((item) => (componentList[item.i] && componentList[item.i].gqlFragment) || "")
+      .filter(Boolean)
+      .join("");
   return gql`
     query QUERY_DASHBOARD_DETAILS { ${componentBasedAdditions || ""}
       monthly_sales: jobs(where: {_and: [

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

@@ -1,17 +1,17 @@
 import Icon, { SyncOutlined } from "@ant-design/icons";
-import { cloneDeep, isEmpty } from "lodash";
 import { useMutation, useQuery } from "@apollo/client";
 import { Button, Dropdown, Space } from "antd";
 import { PageHeader } from "@ant-design/pro-layout";
-import { useMemo, useState } from "react";
+import { useMemo, useState, useEffect } from "react";
 import { Responsive, WidthProvider } from "react-grid-layout";
 import { useTranslation } from "react-i18next";
 import { MdClose } from "react-icons/md";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { logImEXEvent } from "../../firebase/firebase.utils";
-import { UPDATE_DASHBOARD_LAYOUT } from "../../graphql/user.queries";
-import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
+import { UPDATE_DASHBOARD_LAYOUT, QUERY_USER_DASHBOARD_LAYOUT } from "../../graphql/user.queries";
+import { QUERY_DASHBOARD_BODYSHOP } from "../../graphql/bodyshop.queries";
+import { selectCurrentUser } from "../../redux/user/user.selectors";
 import AlertComponent from "../alert/alert.component";
 import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
 import { GenerateDashboardData } from "./dashboard-grid.utils";
@@ -24,93 +24,173 @@ import "./dashboard-grid.styles.scss";
 const ResponsiveReactGridLayout = WidthProvider(Responsive);
 
 const mapStateToProps = createStructuredSelector({
-  currentUser: selectCurrentUser,
-  bodyshop: selectBodyshop
+  currentUser: selectCurrentUser
 });
 
 const mapDispatchToProps = () => ({
   //setUserLanguage: language => dispatch(setUserLanguage(language))
 });
 
-export function DashboardGridComponent({ currentUser, bodyshop }) {
+export function DashboardGridComponent({ currentUser }) {
   const { t } = useTranslation();
-  const [state, setState] = useState({
-    ...(bodyshop.associations[0].user.dashboardlayout
-      ? bodyshop.associations[0].user.dashboardlayout
-      : { items: [], layout: {}, layouts: [] })
-  });
   const notification = useNotification();
 
-  const { loading, error, data, refetch } = useQuery(createDashboardQuery(state), {
+  // Constants for layout defaults
+  const DEFAULT_COLS = 12;
+  const DEFAULT_Y_POSITION = 1000;
+  const GRID_BREAKPOINTS = { lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0 };
+  const GRID_COLS = { lg: 12, md: 10, sm: 6, xs: 4, xxs: 2 };
+
+  // Fetch dashboard layout data
+  const { data: layoutData } = useQuery(QUERY_USER_DASHBOARD_LAYOUT, {
+    variables: { email: currentUser.email },
+    fetchPolicy: "network-only",
+    nextFetchPolicy: "network-only",
+    skip: !currentUser?.email
+  });
+
+  // Fetch minimal bodyshop data for components
+  const {
+    loading,
+    error,
+    data: bodyshopData
+  } = useQuery(QUERY_DASHBOARD_BODYSHOP, {
     fetchPolicy: "network-only",
     nextFetchPolicy: "network-only"
   });
 
   const [updateLayout] = useMutation(UPDATE_DASHBOARD_LAYOUT);
 
-  const handleLayoutChange = async (layout, layouts) => {
-    logImEXEvent("dashboard_change_layout");
+  // Memoize layout state initialization
+  const initialState = useMemo(() => {
+    const persisted = layoutData?.users?.[0]?.dashboardlayout;
+    if (persisted) {
+      const { items = [], layout = [], layouts = {}, cols = DEFAULT_COLS } = persisted;
+      return {
+        items: Array.isArray(items) ? items : [],
+        layout: Array.isArray(layout) ? layout : [],
+        layouts: typeof layouts === "object" && !Array.isArray(layouts) ? layouts : {},
+        cols
+      };
+    }
+    return { items: [], layout: [], layouts: {}, cols: DEFAULT_COLS };
+  }, [layoutData]);
 
-    setState({ ...state, layout, layouts });
+  const [state, setState] = useState(initialState);
 
-    const result = await updateLayout({
-      variables: {
-        email: currentUser.email,
-        layout: { ...state, layout, layouts }
+  // Update state when layout data changes
+  useEffect(() => {
+    if (layoutData?.users?.[0]?.dashboardlayout) {
+      const { items = [], layout = [], layouts = {}, cols = DEFAULT_COLS } = layoutData.users[0].dashboardlayout;
+      setState({
+        items: Array.isArray(items) ? items : [],
+        layout: Array.isArray(layout) ? layout : [],
+        layouts: typeof layouts === "object" && !Array.isArray(layouts) ? layouts : {},
+        cols
+      });
+    }
+  }, [layoutData]);
+
+  // Get bodyshop data for components
+  const bodyshop = bodyshopData?.dashboard_bodyshops?.[0];
+
+  // DRY helper function to update layout in database and cache
+  const updateLayoutAndCache = async (updatedLayout, errorContext = "updating layout") => {
+    try {
+      const { data: result } = await updateLayout({
+        variables: { email: currentUser.email, layout: updatedLayout }
+      });
+
+      const { errors = [] } = result?.update_users?.returning?.[0] || {};
+
+      if (errors.length) {
+        const errorMessages = errors.map(({ message }) => message || String(error));
+        notification.error({
+          message: t("dashboard.errors.updatinglayout", {
+            message: errorMessages.join("; ")
+          })
+        });
+        return false;
       }
-    });
 
-    if (!isEmpty(result?.errors)) {
+      return true;
+    } catch (err) {
+      console.error(`Dashboard ${errorContext} failed`, err);
       notification.error({
         message: t("dashboard.errors.updatinglayout", {
-          message: JSON.stringify(result.errors)
+          message: err?.message || String(err)
         })
       });
+      return false;
     }
   };
 
-  const handleRemoveComponent = (key) => {
+  // Memoize the query document so Apollo doesn't treat each render as a brand-new query causing continuous re-fetches
+  const dashboardQueryDoc = useMemo(() => createDashboardQuery(state.items), [state.items]);
+
+  const {
+    loading: dashboardLoading,
+    error: dashboardError,
+    data: dashboardQueryData,
+    refetch
+  } = useQuery(dashboardQueryDoc, {
+    fetchPolicy: "network-only",
+    nextFetchPolicy: "network-only"
+  });
+
+  const dashboardData = useMemo(() => GenerateDashboardData(dashboardQueryData), [dashboardQueryData]);
+
+  // Memoize existing layout keys to prevent unnecessary recalculations
+  const existingLayoutKeys = useMemo(() => state.items.map(({ i }) => i), [state.items]);
+
+  // Memoize menu items to prevent unnecessary recalculations
+  const menuItems = useMemo(
+    () =>
+      Object.entries(componentList).map(([key, { label }]) => ({
+        key,
+        label,
+        value: key,
+        disabled: existingLayoutKeys.includes(key)
+      })),
+    [existingLayoutKeys]
+  );
+
+  if (loading || dashboardLoading) return <LoadingSkeleton message={t("general.labels.loading")} />;
+  if (error || dashboardError) return <AlertComponent message={(error || dashboardError).message} type="error" />;
+
+  const handleLayoutChange = async (layout, layouts) => {
+    logImEXEvent("dashboard_change_layout");
+    setState((prev) => ({ ...prev, layout, layouts }));
+    await updateLayoutAndCache({ ...state, layout, layouts }, "layout change");
+  };
+
+  const handleRemoveComponent = async (key) => {
     logImEXEvent("dashboard_remove_component", { name: key });
-    const idxToRemove = state.items.findIndex((i) => i.i === key);
-
-    const items = cloneDeep(state.items);
-
-    items.splice(idxToRemove, 1);
-    setState({ ...state, items });
+    const updatedState = { ...state, items: state.items.filter((item) => item.i !== key) };
+    setState(updatedState);
+    await updateLayoutAndCache(updatedState, "component removal");
   };
 
-  const handleAddComponent = (e) => {
-    logImEXEvent("dashboard_add_component", { name: e });
-    setState({
-      ...state,
-      items: [
-        ...state.items,
-        {
-          i: e.key,
-          x: (state.items.length * 2) % (state.cols || 12),
-          y: 99, // puts it at the bottom
-          w: componentList[e.key].w || 2,
-          h: componentList[e.key].h || 2
-        }
-      ]
-    });
+  const handleAddComponent = async ({ key }) => {
+    logImEXEvent("dashboard_add_component", { key });
+    const { minW = 1, minH = 1, w: baseW = 2, h: baseH = 2 } = componentList[key] || {};
+    const nextItems = [
+      ...state.items,
+      {
+        i: key,
+        x: (state.items.length * 2) % (state.cols || DEFAULT_COLS),
+        y: DEFAULT_Y_POSITION,
+        w: Math.max(baseW, minW),
+        h: Math.max(baseH, minH)
+      }
+    ];
+    const updatedState = { ...state, items: nextItems };
+    setState(updatedState);
+    await updateLayoutAndCache(updatedState, "component addition");
   };
 
-  const dashboardData = useMemo(() => GenerateDashboardData(data), [data]);
-
-  const existingLayoutKeys = state.items.map((i) => i.i);
-
-  const menuItems = Object.keys(componentList).map((key) => ({
-    key: key,
-    label: componentList[key].label,
-    value: key,
-    disabled: existingLayoutKeys.includes(key)
-  }));
-
   const menu = { items: menuItems, onClick: handleAddComponent };
 
-  if (error) return <AlertComponent message={error.message} type="error" />;
-
   return (
     <div>
       <PageHeader
@@ -128,27 +208,32 @@ export function DashboardGridComponent({ currentUser, bodyshop }) {
 
       <ResponsiveReactGridLayout
         className="layout"
-        breakpoints={{ lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0 }}
-        cols={{ lg: 12, md: 10, sm: 6, xs: 4, xxs: 2 }}
-        width="100%"
+        breakpoints={GRID_BREAKPOINTS}
+        cols={GRID_COLS}
         layouts={state.layouts}
         onLayoutChange={handleLayoutChange}
       >
         {state.items.map((item) => {
-          const TheComponent = componentList[item.i].component;
+          const { component: TheComponent, minW = 1, minH = 1, w: specW, h: specH } = componentList[item.i] || {};
+          const safeItem = {
+            ...item,
+            w: Math.max(item.w || specW || minW, minW),
+            h: Math.max(item.h || specH || minH, minH)
+          };
+
           return (
             <div
-              key={item.i}
+              key={safeItem.i}
               data-grid={{
-                ...item,
-                minH: componentList[item.i].minH || 1,
-                minW: componentList[item.i].minW || 1
+                ...safeItem,
+                minH,
+                minW
               }}
             >
               <LoadingSkeleton loading={loading}>
                 <Icon
                   component={MdClose}
-                  key={item.i}
+                  key={safeItem.i}
                   style={{
                     position: "absolute",
                     zIndex: "2",
@@ -156,9 +241,9 @@ export function DashboardGridComponent({ currentUser, bodyshop }) {
                     top: ".25rem",
                     cursor: "pointer"
                   }}
-                  onClick={() => handleRemoveComponent(item.i)}
+                  onClick={() => handleRemoveComponent(safeItem.i)}
                 />
-                <TheComponent className="dashboard-card" bodyshop={bodyshop} data={dashboardData} />
+                {TheComponent && <TheComponent className="dashboard-card" bodyshop={bodyshop} data={dashboardData} />}
               </LoadingSkeleton>
             </div>
           );

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

@@ -55,7 +55,7 @@ export function DmsAllocationsSummaryAp({ socket, bodyshop, billids, title }) {
       });
     }
   }, [socket, socket.connected, billids]);
-  console.log(allocationsSummary);
+
   const columns = [
     {
       title: t("general.labels.status"),
@@ -122,7 +122,7 @@ export function DmsAllocationsSummaryAp({ socket, bodyshop, billids, title }) {
         <Form.Item
           name="journal"
           label={t("jobs.fields.dms.journal")}
-          initialValue={bodyshop.cdk_configuration && bodyshop.cdk_configuration.default_journal}
+          initialValue={bodyshop.cdk_configuration?.default_journal}
           rules={[
             {
               required: true

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

@@ -1,72 +1,97 @@
 import { Alert, Button, Card, Table, Typography } from "antd";
-import { useEffect, useState } from "react";
+import { SyncOutlined } from "@ant-design/icons";
+import { useCallback, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
-import { selectBodyshop } from "../../redux/user/user.selectors";
 import Dinero from "dinero.js";
-import { SyncOutlined } from "@ant-design/icons";
+import { DMS_MAP } from "../../utils/dmsUtils";
+
+import { selectBodyshop } from "../../redux/user/user.selectors";
 import { pageLimit } from "../../utils/config";
 
 const mapStateToProps = createStructuredSelector({
-  //currentUser: selectCurrentUser
   bodyshop: selectBodyshop
 });
-
-const mapDispatchToProps = () => ({
-  //setUserLanguage: language => dispatch(setUserLanguage(language))
-});
+const mapDispatchToProps = () => ({});
 
 export default connect(mapStateToProps, mapDispatchToProps)(DmsAllocationsSummary);
 
-export function DmsAllocationsSummary({ socket, bodyshop, jobId, title }) {
+/**
+ * DMS Allocations Summary component
+ * @param mode
+ * @param socket
+ * @param bodyshop
+ * @param jobId
+ * @param title
+ * @returns {JSX.Element}
+ * @constructor
+ */
+export function DmsAllocationsSummary({ mode, socket, bodyshop, jobId, title }) {
   const { t } = useTranslation();
   const [allocationsSummary, setAllocationsSummary] = useState([]);
 
-  useEffect(() => {
-    if (socket.connected) {
-      socket.emit("cdk-calculate-allocations", jobId, (ack) => {
-        setAllocationsSummary(ack);
-        socket.allocationsSummary = ack;
+  // Resolve event name by mode (PBS reuses the CDK event per existing behavior)
+  const allocationsEvent =
+    mode === DMS_MAP.reynolds
+      ? "rr-calculate-allocations"
+      : mode === DMS_MAP.fortellis
+        ? "fortellis-calculate-allocations"
+        : /* "cdk" | "pbs" (legacy) */ "cdk-calculate-allocations";
+
+  const fetchAllocations = useCallback(() => {
+    if (!socket || !jobId || !mode) return;
+
+    try {
+      socket.emit(allocationsEvent, jobId, (ack) => {
+        const list = Array.isArray(ack) ? ack : [];
+        setAllocationsSummary(list);
+        // Preserve side-channel used by the post form for discrepancy checks
+        socket.allocationsSummary = list;
       });
+    } catch {
+      // Best-effort; leave table empty on error
+      setAllocationsSummary([]);
+      socket && (socket.allocationsSummary = []);
     }
-  }, [socket, socket.connected, jobId]);
+  }, [socket, jobId, mode, allocationsEvent]);
+
+  // Initial + whenever mode/socket/jobId changes
+  useEffect(() => {
+    fetchAllocations();
+  }, [fetchAllocations]);
 
   const columns = [
-    {
-      title: t("jobs.fields.dms.center"),
-      dataIndex: "center",
-      key: "center"
-    },
+    { title: t("jobs.fields.dms.center"), dataIndex: "center", key: "center" },
     {
       title: t("jobs.fields.dms.sale"),
       dataIndex: "sale",
       key: "sale",
-      render: (text, record) => Dinero(record.sale).toFormat()
+      render: (_text, record) => Dinero(record.sale).toFormat()
     },
     {
       title: t("jobs.fields.dms.cost"),
       dataIndex: "cost",
       key: "cost",
-      render: (text, record) => Dinero(record.cost).toFormat()
+      render: (_text, record) => Dinero(record.cost).toFormat()
     },
     {
       title: t("jobs.fields.dms.sale_dms_acctnumber"),
       dataIndex: "sale_dms_acctnumber",
       key: "sale_dms_acctnumber",
-      render: (text, record) => record.profitCenter?.dms_acctnumber
+      render: (_text, record) => record.profitCenter?.dms_acctnumber
     },
     {
       title: t("jobs.fields.dms.cost_dms_acctnumber"),
       dataIndex: "cost_dms_acctnumber",
       key: "cost_dms_acctnumber",
-      render: (text, record) => record.costCenter?.dms_acctnumber
+      render: (_text, record) => record.costCenter?.dms_acctnumber
     },
     {
       title: t("jobs.fields.dms.dms_wip_acctnumber"),
       dataIndex: "dms_wip_acctnumber",
       key: "dms_wip_acctnumber",
-      render: (text, record) => record.costCenter?.dms_wip_acctnumber
+      render: (_text, record) => record.costCenter?.dms_wip_acctnumber
     }
   ];
 
@@ -74,11 +99,7 @@ export function DmsAllocationsSummary({ socket, bodyshop, jobId, title }) {
     <Card
       title={title}
       extra={
-        <Button
-          onClick={() => {
-            socket.emit("cdk-calculate-allocations", jobId, (ack) => setAllocationsSummary(ack));
-          }}
-        >
+        <Button onClick={fetchAllocations} aria-label={t("general.actions.refresh")}>
           <SyncOutlined />
         </Button>
       }
@@ -86,41 +107,32 @@ export function DmsAllocationsSummary({ socket, bodyshop, jobId, title }) {
       {bodyshop.pbs_configuration?.disablebillwip && (
         <Alert type="warning" message={t("jobs.labels.dms.disablebillwip")} />
       )}
+
       <Table
         pagination={{ position: "top", defaultPageSize: pageLimit }}
         columns={columns}
         rowKey="center"
         dataSource={allocationsSummary}
         locale={{ emptyText: t("dms.labels.refreshallocations") }}
+        scroll={{ x: true }}
         summary={() => {
-          const totals =
-            allocationsSummary &&
-            allocationsSummary.reduce(
-              (acc, val) => {
-                return {
-                  totalSale: acc.totalSale.add(Dinero(val.sale)),
-                  totalCost: acc.totalCost.add(Dinero(val.cost))
-                };
-              },
-              {
-                totalSale: Dinero(),
-                totalCost: Dinero()
-              }
-            );
+          const totals = allocationsSummary?.reduce(
+            (acc, val) => ({
+              totalSale: acc.totalSale.add(Dinero(val.sale)),
+              totalCost: acc.totalCost.add(Dinero(val.cost))
+            }),
+            { totalSale: Dinero(), totalCost: Dinero() }
+          ) || { totalSale: Dinero(), totalCost: Dinero() };
 
           return (
             <Table.Summary.Row>
               <Table.Summary.Cell>
                 <Typography.Title level={4}>{t("general.labels.totals")}</Typography.Title>
               </Table.Summary.Cell>
-              <Table.Summary.Cell>{totals && totals.totalSale.toFormat()}</Table.Summary.Cell>
-              <Table.Summary.Cell>
-                {
-                  //  totals.totalCost.toFormat()
-                }
-              </Table.Summary.Cell>
-              <Table.Summary.Cell></Table.Summary.Cell>
-              <Table.Summary.Cell></Table.Summary.Cell>
+              <Table.Summary.Cell>{totals.totalSale.toFormat()}</Table.Summary.Cell>
+              <Table.Summary.Cell />
+              <Table.Summary.Cell />
+              <Table.Summary.Cell />
             </Table.Summary.Row>
           );
         }}

client/src/components/dms-cdk-makes/dms-cdk-makes.refetch.component.jsx

@@ -5,6 +5,7 @@ import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
+import { useSplitTreatments } from "@splitsoftware/splitio-react";
 
 const mapStateToProps = createStructuredSelector({
   currentUser: selectCurrentUser,
@@ -18,15 +19,26 @@ export default connect(mapStateToProps, mapDispatchToProps)(DmsCdkMakesRefetch);
 export function DmsCdkMakesRefetch({ currentUser, bodyshop }) {
   const [loading, setLoading] = useState(false);
   const { t } = useTranslation();
+  const {
+    treatments: { Fortellis }
+  } = useSplitTreatments({
+    attributes: {},
+    names: ["Fortellis"],
+    splitKey: bodyshop.imexshopid
+  });
 
   if (!currentUser.email.includes("@imex.")) return null;
 
   const handleRefetch = async () => {
-    setLoading(true);
-    await axios.post("/cdk/getvehicles", {
-      cdk_dealerid: bodyshop.cdk_dealerid,
-      bodyshopid: bodyshop.id
-    });
+    try {
+      setLoading(true);
+      await axios.post(`cdk${Fortellis.treatment === "on" ? "/fortellis" : ""}/getvehicles`, {
+        cdk_dealerid: bodyshop.cdk_dealerid,
+        bodyshopid: bodyshop.id
+      });
+    } catch (error) {
+      console.error(error);
+    }
 
     setLoading(false);
   };

client/src/components/dms-customer-selector/cdk-customer-selector.jsx

@@ -0,0 +1,102 @@
+import { Button, Checkbox, Col, Table } from "antd";
+import { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { alphaSort } from "../../utils/sorters";
+
+export default function CDKCustomerSelector({ bodyshop, socket }) {
+  const { t } = useTranslation();
+  const [open, setOpen] = useState(false);
+  const [customerList, setCustomerList] = useState([]);
+  const [selectedCustomer, setSelectedCustomer] = useState(null);
+
+  useEffect(() => {
+    if (!socket) return;
+    const handleCdkSelectCustomer = (list) => {
+      setOpen(true);
+      setCustomerList(Array.isArray(list) ? list : []);
+      setSelectedCustomer(null);
+    };
+    socket.on("cdk-select-customer", handleCdkSelectCustomer);
+    return () => {
+      socket.off("cdk-select-customer", handleCdkSelectCustomer);
+    };
+  }, [socket]);
+
+  const onUseSelected = () => {
+    if (!selectedCustomer) return;
+    setOpen(false);
+    socket.emit("cdk-selected-customer", selectedCustomer);
+    setSelectedCustomer(null);
+  };
+
+  const onUseGeneric = () => {
+    const generic = bodyshop.cdk_configuration?.generic_customer_number || null;
+    setOpen(false);
+    socket.emit("cdk-selected-customer", generic);
+    setSelectedCustomer(null);
+  };
+
+  const onCreateNew = () => {
+    setOpen(false);
+    socket.emit("cdk-selected-customer", null);
+    setSelectedCustomer(null);
+  };
+
+  if (!open) return null;
+
+  const columns = [
+    { title: t("jobs.fields.dms.id"), dataIndex: ["id", "value"], key: "id" },
+    {
+      title: t("jobs.fields.dms.vinowner"),
+      dataIndex: "vinOwner",
+      key: "vinOwner",
+      render: (_t, r) => <Checkbox disabled checked={r.vinOwner} />
+    },
+    {
+      title: t("jobs.fields.dms.name1"),
+      dataIndex: ["name1", "fullName"],
+      key: "name1",
+      sorter: (a, b) => alphaSort(a.name1?.fullName, b.name1?.fullName)
+    },
+    {
+      title: t("jobs.fields.dms.address"),
+      key: "address",
+      render: (record) =>
+        `${record.address?.addressLine && record.address.addressLine[0]}, ${record.address?.city} ${
+          record.address?.stateOrProvince
+        } ${record.address?.postalCode}`
+    }
+  ];
+
+  const rowKey = (r) => r.id?.value || r.customerId;
+
+  return (
+    <Col span={24}>
+      <Table
+        title={() => (
+          <div style={{ display: "flex", gap: 8, flexWrap: "wrap" }}>
+            <Button onClick={onUseSelected} disabled={!selectedCustomer}>
+              {t("jobs.actions.dms.useselected")}
+            </Button>
+            <Button onClick={onUseGeneric} disabled={!bodyshop.cdk_configuration?.generic_customer_number}>
+              {t("jobs.actions.dms.usegeneric")}
+            </Button>
+            <Button onClick={onCreateNew}>{t("jobs.actions.dms.createnewcustomer")}</Button>
+          </div>
+        )}
+        pagination={{ position: "top" }}
+        columns={columns}
+        rowKey={rowKey}
+        dataSource={customerList}
+        rowSelection={{
+          onSelect: (r) => {
+            const key = r.id?.value || r.customerId;
+            setSelectedCustomer(key ? String(key) : null);
+          },
+          type: "radio",
+          selectedRowKeys: selectedCustomer ? [selectedCustomer] : []
+        }}
+      />
+    </Col>
+  );
+}

client/src/components/dms-customer-selector/dms-customer-selector.component.jsx

@@ -1,134 +1,54 @@
-import { Button, Checkbox, Col, Table } from "antd";
-import { useState } from "react";
-import { useTranslation } from "react-i18next";
+import { useMemo } from "react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
-import { socket } from "../../pages/dms/dms.container";
+
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import { alphaSort } from "../../utils/sorters";
+
+import RRCustomerSelector from "./rr-customer-selector";
+import FortellisCustomerSelector from "./fortellis-customer-selector";
+import CDKCustomerSelector from "./cdk-customer-selector";
+import PBSCustomerSelector from "./pbs-customer-selector";
+import { DMS_MAP } from "../../utils/dmsUtils";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
 });
-const mapDispatchToProps = () => ({
-  //setUserLanguage: language => dispatch(setUserLanguage(language))
-});
+const mapDispatchToProps = () => ({});
 export default connect(mapStateToProps, mapDispatchToProps)(DmsCustomerSelector);
 
-export function DmsCustomerSelector({ bodyshop }) {
-  const { t } = useTranslation();
-  const [customerList, setcustomerList] = useState([]);
-  const [open, setOpen] = useState(false);
-  const [selectedCustomer, setSelectedCustomer] = useState(null);
-  const [dmsType, setDmsType] = useState("cdk");
+/**
+ * DMS Customer Selector component that renders the appropriate customer selector
+ * @param props
+ * @returns {JSX.Element|null}
+ * @constructor
+ */
+export function DmsCustomerSelector(props) {
+  const { bodyshop, jobid, socket, rrOptions = {} } = props;
 
-  socket.on("cdk-select-customer", (customerList) => {
-    setOpen(true);
-    setDmsType("cdk");
-    setcustomerList(customerList);
-  });
-  socket.on("pbs-select-customer", (customerList) => {
-    setOpen(true);
-    setDmsType("pbs");
-    setcustomerList(customerList);
-  });
+  // Centralized "mode" (provider + transport)
+  const mode = props.mode;
 
-  const onUseSelected = () => {
-    setOpen(false);
-    socket.emit(`${dmsType}-selected-customer`, selectedCustomer);
-    setSelectedCustomer(null);
-  };
+  // Stable base props for children
+  const base = useMemo(() => ({ bodyshop, jobid, socket }), [bodyshop, jobid, socket]);
 
-  const onUseGeneric = () => {
-    setOpen(false);
-    socket.emit(`${dmsType}-selected-customer`, bodyshop.cdk_configuration.generic_customer_number);
-    setSelectedCustomer(null);
-  };
-
-  const onCreateNew = () => {
-    setOpen(false);
-    socket.emit(`${dmsType}-selected-customer`, null);
-    setSelectedCustomer(null);
-  };
-
-  const cdkColumns = [
-    {
-      title: t("jobs.fields.dms.id"),
-      dataIndex: ["id", "value"],
-      key: "id"
-    },
-    {
-      title: t("jobs.fields.dms.vinowner"),
-      dataIndex: "vinOwner",
-      key: "vinOwner",
-      render: (text, record) => <Checkbox disabled checked={record.vinOwner} />
-    },
-    {
-      title: t("jobs.fields.dms.name1"),
-      dataIndex: ["name1", "fullName"],
-      key: "name1",
-      sorter: (a, b) => alphaSort(a.name1?.fullName, b.name1?.fullName)
-    },
-
-    {
-      title: t("jobs.fields.dms.address"),
-      //dataIndex: ["name2", "fullName"],
-      key: "address",
-      render: (record) =>
-        `${record.address?.addressLine && record.address.addressLine[0]}, ${record.address?.city} ${
-          record.address?.stateOrProvince
-        } ${record.address?.postalCode}`
+  switch (mode) {
+    case DMS_MAP.reynolds: {
+      // Map rrOptions to current RR prop shape (you can also just pass rrOptions through and unpack in RR)
+      const rrProps = {
+        rrOpenRoLimit: rrOptions.openRoLimit,
+        onRrOpenRoFinished: rrOptions.onOpenRoFinished,
+        rrValidationPending: rrOptions.validationPending,
+        onValidationFinished: rrOptions.onValidationFinished
+      };
+      return <RRCustomerSelector {...base} {...rrProps} />;
     }
-  ];
-
-  const pbsColumns = [
-    {
-      title: t("jobs.fields.dms.id"),
-      dataIndex: "ContactId",
-      key: "ContactId"
-    },
-    {
-      title: t("jobs.fields.dms.name1"),
-      key: "name1",
-      sorter: (a, b) => alphaSort(a.LastName, b.LastName),
-      render: (text, record) => `${record.FirstName || ""} ${record.LastName || ""}`
-    },
-
-    {
-      title: t("jobs.fields.dms.address"),
-      key: "address",
-      render: (record) => `${record.Address}, ${record.City} ${record.State} ${record.ZipCode}`
-    }
-  ];
-
-  if (!open) return null;
-  return (
-    <Col span={24}>
-      <Table
-        title={() => (
-          <div>
-            <Button onClick={onUseSelected} disabled={!selectedCustomer}>
-              {t("jobs.actions.dms.useselected")}
-            </Button>
-            <Button onClick={onUseGeneric} disabled={!bodyshop.cdk_configuration?.generic_customer_number}>
-              {t("jobs.actions.dms.usegeneric")}
-            </Button>
-            <Button onClick={onCreateNew}>{t("jobs.actions.dms.createnewcustomer")}</Button>
-          </div>
-        )}
-        pagination={{ position: "top" }}
-        columns={dmsType === "cdk" ? cdkColumns : pbsColumns}
-        rowKey={(record) => (dmsType === "cdk" ? record.id.value : record.ContactId)}
-        dataSource={customerList}
-        //onChange={handleTableChange}
-        rowSelection={{
-          onSelect: (record) => {
-            setSelectedCustomer(dmsType === "cdk" ? record.id.value : record.ContactId);
-          },
-          type: "radio",
-          selectedRowKeys: [selectedCustomer]
-        }}
-      />
-    </Col>
-  );
+    case DMS_MAP.fortellis:
+      return <FortellisCustomerSelector {...base} />;
+    case DMS_MAP.cdk:
+      return <CDKCustomerSelector {...base} />;
+    case DMS_MAP.pbs:
+      return <PBSCustomerSelector {...base} />;
+    default:
+      return null;
+  }
 }

client/src/components/dms-customer-selector/fortellis-customer-selector.jsx

@@ -0,0 +1,105 @@
+import { Button, Checkbox, Col, Table } from "antd";
+import { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { alphaSort } from "../../utils/sorters";
+
+export default function FortellisCustomerSelector({ bodyshop, jobid, socket }) {
+  const { t } = useTranslation();
+  const [open, setOpen] = useState(false);
+  const [customerList, setCustomerList] = useState([]);
+  const [selectedCustomer, setSelectedCustomer] = useState(null);
+
+  useEffect(() => {
+    if (!socket) return;
+    const handleFortellisSelectCustomer = (list) => {
+      setOpen(true);
+      setCustomerList(Array.isArray(list) ? list : []);
+      setSelectedCustomer(null);
+    };
+    socket.on("fortellis-select-customer", handleFortellisSelectCustomer);
+    return () => {
+      socket.off("fortellis-select-customer", handleFortellisSelectCustomer);
+    };
+  }, [socket]);
+
+  const onUseSelected = () => {
+    if (!selectedCustomer) return;
+    setOpen(false);
+    socket.emit("fortellis-selected-customer", { selectedCustomerId: selectedCustomer, jobid });
+    setSelectedCustomer(null);
+  };
+
+  const onUseGeneric = () => {
+    const generic = bodyshop.cdk_configuration?.generic_customer_number || null;
+    setOpen(false);
+    socket.emit("fortellis-selected-customer", { selectedCustomerId: generic, jobid });
+    setSelectedCustomer(null);
+  };
+
+  const onCreateNew = () => {
+    setOpen(false);
+    socket.emit("fortellis-selected-customer", { selectedCustomerId: null, jobid });
+    setSelectedCustomer(null);
+  };
+
+  if (!open) return null;
+
+  const columns = [
+    { title: t("jobs.fields.dms.id"), dataIndex: "customerId", key: "id" },
+    {
+      title: t("jobs.fields.dms.vinowner"),
+      dataIndex: "vinOwner",
+      key: "vinOwner",
+      render: (_t, r) => <Checkbox disabled checked={r.vinOwner} />
+    },
+    {
+      title: t("jobs.fields.dms.name1"),
+      dataIndex: ["customerName", "firstName"],
+      key: "firstName",
+      sorter: (a, b) => alphaSort(a.customerName?.firstName, b.customerName?.firstName)
+    },
+    {
+      title: t("jobs.fields.dms.name1"),
+      dataIndex: ["customerName", "lastName"],
+      key: "lastName",
+      sorter: (a, b) => alphaSort(a.customerName?.lastName, b.customerName?.lastName)
+    },
+    {
+      title: t("jobs.fields.dms.address"),
+      key: "address",
+      render: (record) =>
+        `${record.postalAddress?.addressLine1 || ""}${
+          record.postalAddress?.addressLine2 ? `, ${record.postalAddress.addressLine2}` : ""
+        }, ${record.postalAddress?.city || ""} ${record.postalAddress?.state || ""} ${
+          record.postalAddress?.postalCode || ""
+        } ${record.postalAddress?.country || ""}`
+    }
+  ];
+
+  return (
+    <Col span={24}>
+      <Table
+        title={() => (
+          <div style={{ display: "flex", gap: 8, flexWrap: "wrap" }}>
+            <Button onClick={onUseSelected} disabled={!selectedCustomer}>
+              {t("jobs.actions.dms.useselected")}
+            </Button>
+            <Button onClick={onUseGeneric} disabled={!bodyshop.cdk_configuration?.generic_customer_number}>
+              {t("jobs.actions.dms.usegeneric")}
+            </Button>
+            <Button onClick={onCreateNew}>{t("jobs.actions.dms.createnewcustomer")}</Button>
+          </div>
+        )}
+        pagination={{ position: "top" }}
+        columns={columns}
+        rowKey={(r) => r.customerId}
+        dataSource={customerList}
+        rowSelection={{
+          onSelect: (r) => setSelectedCustomer(r?.customerId ? String(r.customerId) : null),
+          type: "radio",
+          selectedRowKeys: selectedCustomer ? [selectedCustomer] : []
+        }}
+      />
+    </Col>
+  );
+}

client/src/components/dms-customer-selector/pbs-customer-selector.jsx

@@ -0,0 +1,93 @@
+import { Button, Col, Table } from "antd";
+import { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { alphaSort } from "../../utils/sorters";
+
+export default function PBSCustomerSelector({ bodyshop, socket }) {
+  const { t } = useTranslation();
+  const [open, setOpen] = useState(false);
+  const [customerList, setCustomerList] = useState([]);
+  const [selectedCustomer, setSelectedCustomer] = useState(null);
+
+  useEffect(() => {
+    if (!socket) return;
+    const handlePbsSelectCustomer = (list) => {
+      setOpen(true);
+      setCustomerList(Array.isArray(list) ? list : []);
+      setSelectedCustomer(null);
+    };
+    socket.on("pbs-select-customer", handlePbsSelectCustomer);
+    return () => {
+      socket.off("pbs-select-customer", handlePbsSelectCustomer);
+    };
+  }, [socket]);
+
+  const onUseSelected = () => {
+    if (!selectedCustomer) return;
+    setOpen(false);
+    socket.emit("pbs-selected-customer", selectedCustomer);
+    setSelectedCustomer(null);
+  };
+
+  // Restores old behavior: reuse the CDK-named generic number for PBS too,
+  // matching the previous single-component implementation.
+  const onUseGeneric = () => {
+    const generic = bodyshop?.cdk_configuration?.generic_customer_number || null;
+    if (!generic) return;
+    setOpen(false);
+    socket.emit("pbs-selected-customer", generic);
+    setSelectedCustomer(null);
+  };
+
+  const onCreateNew = () => {
+    setOpen(false);
+    socket.emit("pbs-selected-customer", null);
+    setSelectedCustomer(null);
+  };
+
+  if (!open) return null;
+
+  const columns = [
+    { title: t("jobs.fields.dms.id"), dataIndex: "ContactId", key: "ContactId" },
+    {
+      title: t("jobs.fields.dms.name1"),
+      key: "name1",
+      sorter: (a, b) => alphaSort(a.LastName, b.LastName),
+      render: (_t, r) => `${r.FirstName || ""} ${r.LastName || ""}`
+    },
+    {
+      title: t("jobs.fields.dms.address"),
+      key: "address",
+      render: (r) => `${r.Address}, ${r.City} ${r.State} ${r.ZipCode}`
+    }
+  ];
+
+  const hasGeneric = !!bodyshop?.cdk_configuration?.generic_customer_number;
+
+  return (
+    <Col span={24}>
+      <Table
+        title={() => (
+          <div style={{ display: "flex", gap: 8, flexWrap: "wrap" }}>
+            <Button onClick={onUseSelected} disabled={!selectedCustomer}>
+              {t("jobs.actions.dms.useselected")}
+            </Button>
+            <Button onClick={onUseGeneric} disabled={!hasGeneric}>
+              {t("jobs.actions.dms.usegeneric")}
+            </Button>
+            <Button onClick={onCreateNew}>{t("jobs.actions.dms.createnewcustomer")}</Button>
+          </div>
+        )}
+        pagination={{ position: "top" }}
+        columns={columns}
+        rowKey={(r) => r.ContactId}
+        dataSource={customerList}
+        rowSelection={{
+          onSelect: (r) => setSelectedCustomer(r?.ContactId ? String(r.ContactId) : null),
+          type: "radio",
+          selectedRowKeys: selectedCustomer ? [selectedCustomer] : []
+        }}
+      />
+    </Col>
+  );
+}

client/src/components/dms-customer-selector/rr-customer-selector.jsx

@@ -0,0 +1,267 @@
+import { Alert, Button, Checkbox, Col, message, Space, Table } from "antd";
+import { useEffect, useMemo, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { alphaSort } from "../../utils/sorters";
+
+const normalizeRrList = (list) => {
+  if (!Array.isArray(list)) return [];
+  return list
+    .map((row) => {
+      const custNo = row.custNo || row.CustomerId || row.customerId || null;
+      const name =
+        row.name ||
+        [row.CustomerName?.FirstName, row.CustomerName?.LastName].filter(Boolean).join(" ").trim() ||
+        (custNo ? String(custNo) : "");
+      if (!custNo) return null;
+      const vinOwner = !!(row.vinOwner ?? row.isVehicleOwner);
+
+      const address =
+        row.address && typeof row.address === "object"
+          ? {
+              line1: row.address.line1 ?? row.address.addr1 ?? row.address.Address1 ?? undefined,
+              line2: row.address.line2 ?? row.address.addr2 ?? row.address.Address2 ?? undefined,
+              city: row.address.city ?? undefined,
+              state: row.address.state ?? row.address.stateOrProvince ?? undefined,
+              postalCode: row.address.postalCode ?? row.address.zip ?? undefined,
+              country: row.address.country ?? row.address.countryCode ?? undefined
+            }
+          : undefined;
+
+      return { custNo: String(custNo), name, vinOwner, address };
+    })
+    .filter(Boolean);
+};
+
+const rrAddressToString = (addr) => {
+  if (!addr) return "";
+  const parts = [
+    addr.line1,
+    addr.line2,
+    [addr.city, addr.state].filter(Boolean).join(" "),
+    addr.postalCode,
+    addr.country
+  ].filter(Boolean);
+  return parts.join(", ");
+};
+
+export default function RRCustomerSelector({
+  jobid,
+  socket,
+  rrOpenRoLimit = false,
+  onRrOpenRoFinished,
+  rrValidationPending = false,
+  onValidationFinished
+}) {
+  const { t } = useTranslation();
+  const [open, setOpen] = useState(false);
+  const [customerList, setCustomerList] = useState([]);
+  const [selectedCustomer, setSelectedCustomer] = useState(null);
+  const [refreshing, setRefreshing] = useState(false);
+
+  // Show dialog automatically when validation is pending
+  useEffect(() => {
+    if (rrValidationPending) setOpen(true);
+  }, [rrValidationPending]);
+
+  // Listen for RR customer selection list
+  useEffect(() => {
+    if (!socket) return;
+    const handleRrSelectCustomer = (list) => {
+      const normalized = normalizeRrList(list);
+      setOpen(true);
+      setCustomerList(normalized);
+      const firstOwner = normalized.find((r) => r.vinOwner)?.custNo;
+      setSelectedCustomer(firstOwner ? String(firstOwner) : null);
+      setRefreshing(false);
+    };
+    socket.on("rr-select-customer", handleRrSelectCustomer);
+    return () => {
+      socket.off("rr-select-customer", handleRrSelectCustomer);
+    };
+  }, [socket]);
+
+  // VIN owner set
+  const rrOwnerSet = useMemo(() => {
+    return new Set(customerList.filter((c) => c?.vinOwner || c?.isVehicleOwner).map((c) => String(c.custNo)));
+  }, [customerList]);
+  const rrHasVinOwner = rrOwnerSet.size > 0;
+
+  // Enforce VIN owner stays selected if present
+  useEffect(() => {
+    if (!rrHasVinOwner) return;
+    const firstOwner = (customerList.find((c) => c.vinOwner) || {}).custNo;
+    if (firstOwner && String(selectedCustomer) !== String(firstOwner)) {
+      setSelectedCustomer(String(firstOwner));
+    }
+  }, [rrHasVinOwner, customerList, selectedCustomer]);
+
+  const onUseSelected = () => {
+    if (!selectedCustomer) {
+      message.warning(t("general.actions.select"));
+      return;
+    }
+    if (rrHasVinOwner && !rrOwnerSet.has(String(selectedCustomer))) {
+      message.warning(
+        "This VIN is already assigned in Reynolds. Only the VIN owner can be selected. To choose a different customer, change ownership in Reynolds first."
+      );
+      return;
+    }
+    socket.emit("rr-selected-customer", { jobId: jobid, custNo: String(selectedCustomer) }, (ack) => {
+      if (ack?.ok) {
+        message.success(t("dms.messages.customerSelected"));
+      } else if (ack?.error) {
+        message.error(ack.error);
+      }
+    });
+  };
+
+  const onCreateNew = () => {
+    if (rrHasVinOwner) return;
+    socket.emit("rr-selected-customer", { jobId: jobid, create: true }, (ack) => {
+      if (ack?.ok) {
+        if (ack.custNo) setSelectedCustomer(String(ack.custNo));
+        message.success(t("dms.messages.customerCreated"));
+      } else if (ack?.error) {
+        message.error(ack.error);
+      }
+    });
+  };
+
+  const refreshRrSearch = () => {
+    setRefreshing(true);
+    const to = setTimeout(() => setRefreshing(false), 12000);
+    const stop = () => {
+      clearTimeout(to);
+      setRefreshing(false);
+      socket.off("export-failed", stop);
+      socket.off("rr-select-customer", stop);
+    };
+    socket.once("rr-select-customer", stop);
+    socket.once("export-failed", stop);
+    socket.emit("rr-export-job", { jobId: jobid });
+  };
+
+  if (!open) return null;
+
+  const columns = [
+    { title: t("jobs.fields.dms.id"), dataIndex: "custNo", key: "custNo" },
+    {
+      title: t("jobs.fields.dms.vinowner"),
+      dataIndex: "vinOwner",
+      key: "vinOwner",
+      render: (_t, r) => <Checkbox disabled checked={!!(r.vinOwner ?? r.isVehicleOwner)} />
+    },
+    {
+      title: t("jobs.fields.dms.name1"),
+      dataIndex: "name",
+      key: "name",
+      sorter: (a, b) => alphaSort(a?.name, b?.name)
+    },
+    {
+      title: t("jobs.fields.dms.address"),
+      key: "address",
+      render: (record) => rrAddressToString(record.address)
+    }
+  ];
+
+  const rrDisableRow = (record) => {
+    if (!rrHasVinOwner) return false;
+    return !rrOwnerSet.has(String(record.custNo));
+  };
+
+  return (
+    <Col span={24}>
+      <Table
+        title={() => (
+          <div style={{ display: "flex", flexDirection: "column", gap: 8 }}>
+            {/* Open RO limit banner */}
+            {rrOpenRoLimit && (
+              <Alert
+                type="error"
+                showIcon
+                message="Open RO limit reached in Reynolds"
+                description={
+                  <div style={{ display: "flex", flexDirection: "column", gap: 8 }}>
+                    <div>
+                      Reynolds has reached the maximum number of open Repair Orders for this Customer. Close or finalize
+                      an RO in Reynolds, then click <strong>Finished</strong> to continue.
+                    </div>
+                    <div>
+                      <Button type="primary" danger onClick={onRrOpenRoFinished}>
+                        Finished
+                      </Button>
+                    </div>
+                  </div>
+                }
+              />
+            )}
+
+            {/* Validation step banner */}
+            {rrValidationPending && (
+              <Alert
+                type="info"
+                showIcon
+                message="Complete Validation in Reynolds"
+                description={
+                  <div style={{ display: "flex", flexDirection: "column", gap: 8 }}>
+                    <div>
+                      We created the Repair Order. Please validate the totals and taxes in the DMS system. When done,
+                      click <strong>Finished</strong> to finalize and mark this export as complete.
+                    </div>
+                    <div>
+                      <Space>
+                        <Button type="primary" onClick={onValidationFinished}>
+                          Finished
+                        </Button>
+                      </Space>
+                    </div>
+                  </div>
+                }
+              />
+            )}
+
+            <div style={{ display: "flex", gap: 8, flexWrap: "wrap" }}>
+              <Button onClick={onUseSelected} disabled={!selectedCustomer || rrOpenRoLimit}>
+                {t("jobs.actions.dms.useselected")}
+              </Button>
+              {/* No generic in RR */}
+              <Button onClick={onCreateNew} disabled={rrHasVinOwner}>
+                {t("jobs.actions.dms.createnewcustomer")}
+              </Button>
+            </div>
+
+            {rrHasVinOwner && (
+              <Alert
+                type="warning"
+                showIcon
+                message="VIN ownership enforced"
+                description={
+                  <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", gap: 12 }}>
+                    <div>
+                      This VIN is already assigned in Reynolds. Only the VIN owner is selectable here. To use a
+                      different customer, please change the vehicle ownership in Reynolds first, then return to complete
+                      the export.
+                    </div>
+                    <Button onClick={refreshRrSearch} loading={refreshing}>
+                      Refresh
+                    </Button>
+                  </div>
+                }
+              />
+            )}
+          </div>
+        )}
+        pagination={{ position: "top" }}
+        columns={columns}
+        rowKey={(r) => r.custNo}
+        dataSource={customerList}
+        rowSelection={{
+          onSelect: (record) => setSelectedCustomer(record?.custNo ? String(record.custNo) : null),
+          type: "radio",
+          selectedRowKeys: selectedCustomer ? [selectedCustomer] : [],
+          getCheckboxProps: (record) => ({ disabled: rrDisableRow(record) })
+        }}
+      />
+    </Col>
+  );
+}

client/src/components/dms-log-events/dms-log-events.component.jsx

@@ -1,50 +1,225 @@
 import { Divider, Space, Tag, Timeline } from "antd";
+import { useEffect, useMemo, useState } from "react";
 import dayjs from "../../utils/day";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
-import { setBreadcrumbs, setSelectedHeader } from "../../redux/application/application.actions";
+import { selectDarkMode } from "../../redux/application/application.selectors.js";
 
-const mapStateToProps = createStructuredSelector({});
-
-const mapDispatchToProps = (dispatch) => ({
-  setBreadcrumbs: (breadcrumbs) => dispatch(setBreadcrumbs(breadcrumbs)),
-  setSelectedHeader: (key) => dispatch(setSelectedHeader(key))
+const mapStateToProps = createStructuredSelector({
+  isDarkMode: selectDarkMode
 });
 
+const mapDispatchToProps = () => ({});
+
 export default connect(mapStateToProps, mapDispatchToProps)(DmsLogEvents);
 
-export function DmsLogEvents({ logs }) {
-  return (
-    <Timeline
-      pending
-      reverse={true}
-      items={logs.map((log, idx) => ({
-        key: idx,
-        color: LogLevelHierarchy(log.level),
-        children: (
-          <Space wrap align="start" style={{}}>
-            <Tag color={LogLevelHierarchy(log.level)}>{log.level}</Tag>
-            <span>{dayjs(log.timestamp).format("MM/DD/YYYY HH:mm:ss")}</span>
-            <Divider type="vertical" />
-            <span>{log.message}</span>
-          </Space>
-        )
-      }))}
-    />
+export function DmsLogEvents({ logs, detailsOpen, detailsNonce, isDarkMode, colorizeJson = false }) {
+  const [openSet, setOpenSet] = useState(() => new Set());
+
+  // Inject JSON highlight styles once (only when colorize is enabled)
+  useEffect(() => {
+    if (!colorizeJson) return;
+    if (typeof document === "undefined") return;
+    if (document.getElementById("json-highlight-styles")) return;
+    const style = document.createElement("style");
+    style.id = "json-highlight-styles";
+    style.textContent = `
+      .json-key { color: #fa8c16; }
+      .json-string { color: #52c41a; }
+      .json-number { color: #722ed1; }
+      .json-boolean { color: #1890ff; }
+      .json-null { color: #faad14; }
+    `;
+    document.head.appendChild(style);
+  }, [colorizeJson]);
+
+  // Trim openSet if logs shrink
+  useEffect(() => {
+    const len = (logs || []).length;
+    setOpenSet((prev) => {
+      const next = new Set();
+      for (let i = 0; i < len; i++) if (prev.has(i)) next.add(i);
+      return next;
+    });
+  }, [logs?.length]);
+
+  // Respond to global toggle button
+  useEffect(() => {
+    if (detailsNonce == null) return;
+    const len = (logs || []).length;
+    setOpenSet(detailsOpen ? new Set(Array.from({ length: len }, (_, i) => i)) : new Set());
+  }, [detailsNonce, detailsOpen, logs?.length]);
+
+  const items = useMemo(
+    () =>
+      (logs || []).map((raw, idx) => {
+        const { level, message, timestamp, meta } = normalizeLog(raw);
+        const hasMeta = !isEmpty(meta);
+        const isOpen = openSet.has(idx);
+
+        return {
+          key: idx,
+          color: logLevelColor(level),
+          children: (
+            <Space direction="vertical" size={4} style={{ display: "flex" }}>
+              {/* Row 1: summary + inline "Details" toggle */}
+              <Space wrap align="start">
+                <Tag color={logLevelColor(level)}>{level}</Tag>
+                <Divider type="vertical" />
+                <span>{dayjs(timestamp).format("MM/DD/YYYY HH:mm:ss")}</span>
+                <Divider type="vertical" />
+                <span>{message}</span>
+                {hasMeta && (
+                  <>
+                    <Divider type="vertical" />
+                    <a
+                      role="button"
+                      aria-expanded={isOpen}
+                      onClick={() =>
+                        setOpenSet((prev) => {
+                          const next = new Set(prev);
+                          if (isOpen) next.delete(idx);
+                          else next.add(idx);
+                          return next;
+                        })
+                      }
+                      style={{ cursor: "pointer", userSelect: "none" }}
+                    >
+                      {isOpen ? "Hide details" : "Details"}
+                    </a>
+                  </>
+                )}
+              </Space>
+
+              {/* Row 2: details body (only when open) */}
+              {hasMeta && isOpen && (
+                <div style={{ marginLeft: 6 }}>
+                  <JsonBlock isDarkMode={isDarkMode} data={meta} colorize={colorizeJson} />
+                </div>
+              )}
+            </Space>
+          )
+        };
+      }),
+    [logs, openSet, colorizeJson]
   );
+
+  return <Timeline pending reverse items={items} />;
 }
 
-function LogLevelHierarchy(level) {
-  switch (level) {
+/**
+ * Normalize various log input formats into a standard structure.
+ * @param input
+ * @returns {{level: string, message: *|string, timestamp: Date, meta: *}}
+ */
+const normalizeLog = (input) => {
+  const n = input?.normalized || input || {};
+  const level = (n.level || input?.level || "INFO").toString().toUpperCase();
+  const message = n.message ?? input?.message ?? "";
+  const meta = input?.meta != null ? input.meta : n.meta != null ? n.meta : undefined;
+  const tsRaw = input?.timestamp ?? n.timestamp ?? input?.ts ?? Date.now();
+  const timestamp = typeof tsRaw === "number" ? new Date(tsRaw) : new Date(tsRaw);
+  return { level, message, timestamp, meta };
+};
+
+/**
+ * Map log level to tag color.
+ * @param level
+ * @returns {string}
+ */
+const logLevelColor = (level) => {
+  switch ((level || "").toUpperCase()) {
+    case "SILLY":
+      return "purple";
     case "DEBUG":
       return "orange";
     case "INFO":
       return "blue";
     case "WARN":
+    case "WARNING":
       return "yellow";
     case "ERROR":
       return "red";
     default:
-      return 0;
+      return "default";
   }
-}
+};
+
+/**
+ * Check if a value is "empty" (null/undefined, empty array, or empty object).
+ * @param v
+ */
+const isEmpty = (v) => {
+  if (v == null) return true;
+  if (Array.isArray(v)) return v.length === 0;
+  if (typeof v === "object") return Object.keys(v).length === 0;
+  return false;
+};
+
+/**
+ * Safely stringify an object to JSON, falling back to String() on failure.
+ * @param obj
+ * @param spaces
+ * @returns {string}
+ */
+const safeStringify = (obj, spaces = 2) => {
+  try {
+    return JSON.stringify(obj, null, spaces);
+  } catch {
+    return String(obj);
+  }
+};
+
+/**
+ * JSON display block with optional syntax highlighting.
+ * @param data
+ * @param colorize
+ * @param isDarkMode
+ * @returns {JSX.Element}
+ * @constructor
+ */
+const JsonBlock = ({ data, colorize, isDarkMode }) => {
+  const jsonText = safeStringify(data, 2);
+  const preStyle = {
+    margin: "6px 0 0",
+    maxWidth: 720,
+    overflowX: "auto",
+    fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace',
+    fontSize: 12,
+    lineHeight: 1.45,
+    padding: 8,
+    borderRadius: 6,
+    background: isDarkMode ? "rgba(255,255,255,0.1)" : "rgba(0,0,0,0.04)",
+    border: isDarkMode ? "1px solid rgba(255,255,255,0.12)" : "1px solid rgba(0,0,0,0.08)",
+    color: isDarkMode ? "var(--card-text-fallback)" : "#141414"
+  };
+
+  if (colorize) {
+    const html = syntaxHighlight(jsonText);
+    return <pre style={preStyle} dangerouslySetInnerHTML={{ __html: html }} />;
+  }
+  return <pre style={preStyle}>{jsonText}</pre>;
+};
+
+/**
+ * Syntax highlight JSON text for HTML display.
+ * @param jsonText
+ * @returns {*}
+ */
+const syntaxHighlight = (jsonText) => {
+  const esc = jsonText.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+  return esc.replace(
+    /("(?:\\u[\da-fA-F]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(?:true|false|null)\b|-?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?)/g,
+    (match) => {
+      let cls = "json-number";
+      if (match.startsWith('"')) {
+        cls = match.endsWith(":") ? "json-key" : "json-string";
+      } else if (match === "true" || match === "false") {
+        cls = "json-boolean";
+      } else if (match === "null") {
+        cls = "json-null";
+      }
+      return `<span class="${cls}">${match}</span>`;
+    }
+  );
+};

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

@@ -0,0 +1,403 @@
+import { DeleteFilled, DownOutlined } from "@ant-design/icons";
+import {
+  Button,
+  Card,
+  Col,
+  Divider,
+  Dropdown,
+  Form,
+  Input,
+  InputNumber,
+  Row,
+  Select,
+  Space,
+  Statistic,
+  Switch,
+  Tooltip,
+  Typography
+} from "antd";
+import Dinero from "dinero.js";
+import { useTranslation } from "react-i18next";
+import { useMemo, useState } from "react";
+import i18n from "../../translations/i18n";
+import dayjs from "../../utils/day";
+import DmsCdkMakes from "../dms-cdk-makes/dms-cdk-makes.component";
+import DmsCdkMakesRefetch from "../dms-cdk-makes/dms-cdk-makes.refetch.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
+import CurrencyInput from "../form-items-formatted/currency-form-item.component";
+import { DMS_MAP } from "../../utils/dmsUtils";
+
+/**
+ * CDK-like DMS post form:
+ *  - CDK / Fortellis / PBS
+ *  - CDK vehicle details + make/model selection
+ *  - Payer list with discrepancy gating
+ *  - Submit: "{mode}-export-job"
+ * @param bodyshop
+ * @param socket
+ * @param job
+ * @param logsRef
+ * @param mode
+ * @returns {JSX.Element}
+ * @constructor
+ */
+export default function CdkLikePostForm({ bodyshop, socket, job, logsRef, mode }) {
+  const [form] = Form.useForm();
+  const { t } = useTranslation();
+  const [, /*unused*/ setTick] = useState(0); // handy if you need a forceUpdate later
+
+  const initialValues = useMemo(
+    () => ({
+      story: `${t("jobs.labels.dms.defaultstory", {
+        ro_number: job.ro_number,
+        ownr_nm: `${job.ownr_fn || ""} ${job.ownr_ln || ""} ${job.ownr_co_nm || ""}`.trim(),
+        ins_co_nm: job.ins_co_nm || "N/A",
+        clm_po: `${job.clm_no ? `${job.clm_no} ` : ""}${job.po_number || ""}`
+      }).trim()}.${
+        job.area_of_damage?.impact1
+          ? " " +
+            t("jobs.labels.dms.damageto", {
+              area_of_damage: (job.area_of_damage && job.area_of_damage.impact1.padStart(2, "0")) || "UNKNOWN"
+            })
+          : ""
+      }`.slice(0, 239),
+      inservicedate: dayjs(
+        `${
+          (job.v_model_yr &&
+            (job.v_model_yr < 100
+              ? job.v_model_yr >= (dayjs().year() + 1) % 100
+                ? 1900 + parseInt(job.v_model_yr, 10)
+                : 2000 + parseInt(job.v_model_yr, 10)
+              : job.v_model_yr)) ||
+          2019
+        }-01-01`
+      ),
+      journal: bodyshop.cdk_configuration?.default_journal
+    }),
+    [job, bodyshop, t]
+  );
+
+  // Payers helpers
+  const handlePayerSelect = (value, index) => {
+    form.setFieldsValue({
+      payers: (form.getFieldValue("payers") || []).map((payer, mapIndex) => {
+        if (index !== mapIndex) return payer;
+        const cdkPayer =
+          bodyshop.cdk_configuration.payers && bodyshop.cdk_configuration.payers.find((i) => i.name === value);
+        if (!cdkPayer) return payer;
+        return {
+          ...cdkPayer,
+          dms_acctnumber: cdkPayer.dms_acctnumber,
+          controlnumber: job?.[cdkPayer.control_type]
+        };
+      })
+    });
+    setTick((n) => n + 1);
+  };
+
+  const handleFinish = (values) => {
+    if (!socket) return;
+
+    if (mode === DMS_MAP.fortellis) {
+      socket.emit("fortellis-export-job", {
+        jobid: job.id,
+        txEnvelope: { ...values, SubscriptionID: bodyshop.cdk_dealerid }
+      });
+    } else {
+      socket.emit(`${mode}-export-job`, { jobid: job.id, txEnvelope: values });
+    }
+
+    logsRef?.current?.scrollIntoView({ behavior: "smooth" });
+  };
+
+  // Totals & discrepancy
+  const totals = socket?.allocationsSummary
+    ? socket.allocationsSummary.reduce(
+        (acc, val) => ({
+          totalSale: acc.totalSale.add(Dinero(val.sale)),
+          totalCost: acc.totalCost.add(Dinero(val.cost))
+        }),
+        { totalSale: Dinero(), totalCost: Dinero() }
+      )
+    : { totalSale: Dinero(), totalCost: Dinero() };
+
+  return (
+    <Card title={t("jobs.labels.dms.postingform")}>
+      <Form
+        form={form}
+        layout="vertical"
+        onFinish={handleFinish}
+        style={{ width: "100%" }}
+        initialValues={initialValues}
+      >
+        {/* TOP ROW */}
+        <Row gutter={[16, 12]} align="bottom">
+          <Col xs={24} sm={12} md={8} lg={6}>
+            <Form.Item name="journal" label={t("jobs.fields.dms.journal")} rules={[{ required: true }]}>
+              <Input />
+            </Form.Item>
+          </Col>
+
+          <Col xs={12} sm={8} md={6} lg={4}>
+            <Form.Item name="kmin" label={t("jobs.fields.kmin")} initialValue={job?.kmin} rules={[{ required: true }]}>
+              <InputNumber style={{ width: "100%" }} disabled />
+            </Form.Item>
+          </Col>
+
+          <Col xs={12} sm={8} md={6} lg={4}>
+            <Form.Item
+              name="kmout"
+              label={t("jobs.fields.kmout")}
+              initialValue={job?.kmout}
+              rules={[{ required: true }]}
+            >
+              <InputNumber style={{ width: "100%" }} disabled />
+            </Form.Item>
+          </Col>
+        </Row>
+
+        {/* CDK vehicle details (kept for CDK/Fortellis paths when dealer id exists) */}
+        {bodyshop.cdk_dealerid && (
+          <>
+            <Row gutter={[16, 12]}>
+              <Col xs={24} sm={12} md={8}>
+                <Form.Item name="dms_make" label={t("jobs.fields.dms.dms_make")} rules={[{ required: true }]}>
+                  <Input disabled />
+                </Form.Item>
+              </Col>
+              <Col xs={24} sm={12} md={8}>
+                <Form.Item name="dms_model" label={t("jobs.fields.dms.dms_model")} rules={[{ required: true }]}>
+                  <Input disabled />
+                </Form.Item>
+              </Col>
+              <Col xs={24} sm={12} md={8}>
+                <Form.Item name="inservicedate" label={t("jobs.fields.dms.inservicedate")}>
+                  <DateTimePicker isDateOnly />
+                </Form.Item>
+              </Col>
+            </Row>
+
+            <Row gutter={[16, 12]} align="middle">
+              <Col>
+                <DmsCdkMakes form={form} job={job} />
+              </Col>
+              <Col>
+                <DmsCdkMakesRefetch />
+              </Col>
+              <Col>
+                <Form.Item name="dms_unsold" label={t("jobs.fields.dms.dms_unsold")} initialValue={false}>
+                  <Switch />
+                </Form.Item>
+              </Col>
+              <Col>
+                <Form.Item
+                  name="dms_model_override"
+                  label={t("jobs.fields.dms.dms_model_override")}
+                  initialValue={false}
+                >
+                  <Switch />
+                </Form.Item>
+              </Col>
+            </Row>
+          </>
+        )}
+
+        <Row gutter={[16, 12]}>
+          <Col span={24}>
+            <Form.Item name="story" label={t("jobs.fields.dms.story")} rules={[{ required: true }]}>
+              <Input.TextArea maxLength={240} />
+            </Form.Item>
+          </Col>
+        </Row>
+
+        <Divider />
+
+        {/* Totals */}
+        <Space size="large" wrap align="center" style={{ marginBottom: 16 }}>
+          <Statistic
+            title={t("jobs.fields.ded_amt")}
+            value={Dinero(job.job_totals.totals.custPayable.deductible).toFormat()}
+          />
+          <Statistic
+            title={t("jobs.labels.total_cust_payable")}
+            value={Dinero(job.job_totals.totals.custPayable.total).toFormat()}
+          />
+          <Statistic
+            title={t("jobs.labels.net_repairs")}
+            value={Dinero(job.job_totals.totals.net_repairs).toFormat()}
+          />
+        </Space>
+
+        {/* Payers list */}
+        <Divider />
+        <Form.List name={["payers"]}>
+          {(fields, { add, remove }) => (
+            <div>
+              {fields.map((field, index) => (
+                <Card
+                  key={field.key}
+                  size="small"
+                  style={{ marginBottom: 12 }}
+                  title={`${t("jobs.fields.dms.payer.payer_type")} #${index + 1}`}
+                  extra={
+                    <Tooltip title={t("general.actions.remove", "Remove")}>
+                      <Button
+                        type="text"
+                        danger
+                        icon={<DeleteFilled />}
+                        aria-label={t("general.actions.remove", "Remove")}
+                        onClick={() => remove(field.name)}
+                      />
+                    </Tooltip>
+                  }
+                >
+                  <Row gutter={[16, 8]} align="middle">
+                    <Col xs={24} sm={12} md={8} lg={6}>
+                      <Form.Item
+                        label={t("jobs.fields.dms.payer.name")}
+                        name={[field.name, "name"]}
+                        rules={[{ required: true }]}
+                      >
+                        <Select style={{ minWidth: "15rem" }} onSelect={(value) => handlePayerSelect(value, index)}>
+                          {bodyshop.cdk_configuration?.payers?.map((payer) => (
+                            <Select.Option key={payer.name}>{payer.name}</Select.Option>
+                          ))}
+                        </Select>
+                      </Form.Item>
+                    </Col>
+
+                    <Col xs={24} sm={12} md={8} lg={6}>
+                      <Form.Item
+                        label={t("jobs.fields.dms.payer.dms_acctnumber")}
+                        name={[field.name, "dms_acctnumber"]}
+                        rules={[{ required: true }]}
+                      >
+                        <Input disabled />
+                      </Form.Item>
+                    </Col>
+
+                    <Col xs={24} sm={12} md={8} lg={5}>
+                      <Form.Item
+                        label={t("jobs.fields.dms.payer.amount")}
+                        name={[field.name, "amount"]}
+                        rules={[{ required: true }]}
+                      >
+                        <CurrencyInput min={0} />
+                      </Form.Item>
+                    </Col>
+
+                    <Col xs={24} sm={12} md={10} lg={7}>
+                      <Form.Item
+                        label={
+                          <div>
+                            {t("jobs.fields.dms.payer.controlnumber")}{" "}
+                            <Dropdown
+                              trigger={["click"]}
+                              menu={{
+                                items:
+                                  bodyshop.cdk_configuration.controllist?.map((key, idx) => ({
+                                    key: idx,
+                                    label: key.name,
+                                    onClick: () => {
+                                      form.setFieldsValue({
+                                        payers: (form.getFieldValue("payers") || []).map((row, mapIndex) => {
+                                          if (index !== mapIndex) return row;
+                                          return { ...row, controlnumber: key.controlnumber };
+                                        })
+                                      });
+                                    }
+                                  })) ?? []
+                              }}
+                            >
+                              <a href="#" onClick={(e) => e.preventDefault()}>
+                                <DownOutlined />
+                              </a>
+                            </Dropdown>
+                          </div>
+                        }
+                        name={[field.name, "controlnumber"]}
+                        rules={[{ required: true }]}
+                      >
+                        <Input />
+                      </Form.Item>
+                    </Col>
+
+                    <Col xs={24}>
+                      <Form.Item shouldUpdate noStyle>
+                        {() => {
+                          const payers = form.getFieldValue("payers");
+                          const row = payers?.[index];
+                          const cdkPayer =
+                            bodyshop.cdk_configuration.payers &&
+                            bodyshop.cdk_configuration.payers.find((i) => i && row && i.name === row.name);
+                          if (i18n.exists(`jobs.fields.${cdkPayer?.control_type}`))
+                            return <div>{cdkPayer && t(`jobs.fields.${cdkPayer?.control_type}`)}</div>;
+                          else if (i18n.exists(`jobs.fields.dms.control_type.${cdkPayer?.control_type}`)) {
+                            return <div>{cdkPayer && t(`jobs.fields.dms.control_type.${cdkPayer?.control_type}`)}</div>;
+                          } else {
+                            return null;
+                          }
+                        }}
+                      </Form.Item>
+                    </Col>
+                  </Row>
+                </Card>
+              ))}
+              <Form.Item>
+                <Button
+                  disabled={!(fields.length < 3)}
+                  onClick={() => {
+                    if (fields.length < 3) add();
+                  }}
+                  style={{ width: "100%" }}
+                >
+                  {t("jobs.actions.dms.addpayer")}
+                </Button>
+              </Form.Item>
+            </div>
+          )}
+        </Form.List>
+
+        {/* Validation gates & summary */}
+        <Form.Item shouldUpdate>
+          {() => {
+            let totalAllocated = Dinero();
+            const payers = form.getFieldValue("payers") || [];
+            payers.forEach((payer) => {
+              totalAllocated = totalAllocated.add(Dinero({ amount: Math.round((payer?.amount || 0) * 100) }));
+            });
+
+            const discrep = totals ? totals.totalSale.subtract(totalAllocated) : Dinero();
+
+            // gate: must have payers filled + zero discrepancy when we have a summary
+            const payersOk =
+              payers.length > 0 &&
+              payers.every((p) => p?.name && p.dms_acctnumber && (p.amount ?? "") !== "" && p.controlnumber);
+            const nonRrDiscrepancyGate = socket?.allocationsSummary ? discrep.getAmount() !== 0 : true;
+            const disablePost = !payersOk || nonRrDiscrepancyGate;
+
+            return (
+              <Space size="large" wrap align="center">
+                <Statistic
+                  title={t("jobs.labels.subtotal")}
+                  value={(totals ? totals.totalSale : Dinero()).toFormat()}
+                />
+                <Typography.Title>-</Typography.Title>
+                <Statistic title={t("jobs.labels.dms.totalallocated")} value={totalAllocated.toFormat()} />
+                <Typography.Title>=</Typography.Title>
+                <Statistic
+                  title={t("jobs.labels.dms.notallocated")}
+                  valueStyle={{ color: discrep.getAmount() === 0 ? "green" : "red" }}
+                  value={discrep.toFormat()}
+                />
+                <Button disabled={disablePost} htmlType="submit">
+                  {t("jobs.actions.dms.post")}
+                </Button>
+              </Space>
+            );
+          }}
+        </Form.Item>
+      </Form>
+    </Card>
+  );
+}

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

@@ -1,396 +1,40 @@
-import { DeleteFilled, DownOutlined } from "@ant-design/icons";
-import {
-  Button,
-  Card,
-  Divider,
-  Dropdown,
-  Form,
-  Input,
-  InputNumber,
-  Select,
-  Space,
-  Statistic,
-  Switch,
-  Typography
-} from "antd";
-import Dinero from "dinero.js";
-import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
-import { determineDmsType } from "../../pages/dms/dms.container";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import i18n from "../../translations/i18n";
-import dayjs from "../../utils/day";
-import DmsCdkMakes from "../dms-cdk-makes/dms-cdk-makes.component";
-import DmsCdkMakesRefetch from "../dms-cdk-makes/dms-cdk-makes.refetch.component";
-import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
-import CurrencyInput from "../form-items-formatted/currency-form-item.component";
-import LayoutFormRow from "../layout-form-row/layout-form-row.component";
+import { DMS_MAP } from "../../utils/dmsUtils";
+import RRPostForm from "./rr-dms-post-form";
+import CdkLikePostForm from "./cdklike-dms-post-form";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
 });
-const mapDispatchToProps = () => ({
-  //setUserLanguage: language => dispatch(setUserLanguage(language))
-});
+const mapDispatchToProps = () => ({});
+
 export default connect(mapStateToProps, mapDispatchToProps)(DmsPostForm);
 
-export function DmsPostForm({ bodyshop, socket, job, logsRef }) {
-  const [form] = Form.useForm();
-  const { t } = useTranslation();
+/**
+ * DMS Post Form component that renders the appropriate post form
+ * @param mode
+ * @param bodyshop
+ * @param socket
+ * @param job
+ * @param logsRef
+ * @returns {JSX.Element|null}
+ * @constructor
+ */
+export function DmsPostForm({ mode, bodyshop, socket, job, logsRef }) {
+  switch (mode) {
+    case DMS_MAP.reynolds:
+      return <RRPostForm bodyshop={bodyshop} socket={socket} job={job} logsRef={logsRef} />;
 
-  const handlePayerSelect = (value, index) => {
-    form.setFieldsValue({
-      payers: form.getFieldValue("payers").map((payer, mapIndex) => {
-        if (index !== mapIndex) return payer;
-        const cdkPayer =
-          bodyshop.cdk_configuration.payers && bodyshop.cdk_configuration.payers.find((i) => i.name === value);
+    // CDK (legacy /ws), Fortellis (CDK-over-WSS), and PBS share the same UI;
+    // we pass mode down so the child can choose the correct event name.
+    case DMS_MAP.fortellis:
+    case DMS_MAP.cdk:
+    case DMS_MAP.pbs:
+      return <CdkLikePostForm mode={mode} bodyshop={bodyshop} socket={socket} job={job} logsRef={logsRef} />;
 
-        if (!cdkPayer) return payer;
-
-        return {
-          ...cdkPayer,
-          dms_acctnumber: cdkPayer.dms_acctnumber,
-          controlnumber: job && job[cdkPayer.control_type]
-        };
-      })
-    });
-  };
-
-  const handleFinish = (values) => {
-    socket.emit(`${determineDmsType(bodyshop)}-export-job`, {
-      jobid: job.id,
-      txEnvelope: values
-    });
-    console.log(logsRef);
-    if (logsRef) {
-      console.log("executing", logsRef);
-      logsRef.curent &&
-        logsRef.current.scrollIntoView({
-          behavior: "smooth"
-        });
-    }
-  };
-
-  return (
-    <Card title={t("jobs.labels.dms.postingform")}>
-      <Form
-        form={form}
-        layout="vertical"
-        onFinish={handleFinish}
-        initialValues={{
-          story: `${t("jobs.labels.dms.defaultstory", {
-            ro_number: job.ro_number,
-            ownr_nm: `${job.ownr_fn || ""} ${job.ownr_ln || ""} ${job.ownr_co_nm || ""}`.trim(),
-            ins_co_nm: job.ins_co_nm || "N/A",
-            clm_po: `${job.clm_no ? `${job.clm_no} ` : ""}${job.po_number || ""}`
-          }).trim()}.${
-            job.area_of_damage && job.area_of_damage.impact1
-              ? " " +
-                t("jobs.labels.dms.damageto", {
-                  area_of_damage: (job.area_of_damage && job.area_of_damage.impact1.padStart(2, "0")) || "UNKNOWN"
-                })
-              : ""
-          }`.slice(0, 239),
-          inservicedate: dayjs(
-            `${(job.v_model_yr && (job.v_model_yr < 100 ? (job.v_model_yr >= (dayjs().year() + 1) % 100 ? 1900 + parseInt(job.v_model_yr) : 2000 + parseInt(job.v_model_yr)) : job.v_model_yr)) || 2019}-01-01`
-          )
-        }}
-      >
-        <LayoutFormRow grow>
-          <Form.Item
-            name="journal"
-            label={t("jobs.fields.dms.journal")}
-            initialValue={bodyshop.cdk_configuration && bodyshop.cdk_configuration.default_journal}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-          >
-            <Input />
-          </Form.Item>
-          <Form.Item
-            name="kmin"
-            label={t("jobs.fields.kmin")}
-            initialValue={job && job.kmin}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-          >
-            <InputNumber disabled />
-          </Form.Item>
-          <Form.Item
-            name="kmout"
-            label={t("jobs.fields.kmout")}
-            initialValue={job && job.kmout}
-            rules={[
-              {
-                required: true
-                //message: t("general.validation.required"),
-              }
-            ]}
-          >
-            <InputNumber disabled />
-          </Form.Item>
-        </LayoutFormRow>
-
-        {bodyshop.cdk_dealerid && (
-          <div>
-            <LayoutFormRow style={{ justifyContent: "center" }} grow>
-              <Form.Item
-                name="dms_make"
-                label={t("jobs.fields.dms.dms_make")}
-                rules={[
-                  {
-                    required: true
-                  }
-                ]}
-              >
-                <Input disabled />
-              </Form.Item>
-              <Form.Item
-                name="dms_model"
-                label={t("jobs.fields.dms.dms_model")}
-                rules={[
-                  {
-                    required: true
-                  }
-                ]}
-              >
-                <Input disabled />
-              </Form.Item>
-              <Form.Item name="inservicedate" label={t("jobs.fields.dms.inservicedate")}>
-                <DateTimePicker isDateOnly />
-              </Form.Item>
-            </LayoutFormRow>
-            <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>
-        )}
-        <Form.Item
-          name="story"
-          label={t("jobs.fields.dms.story")}
-          rules={[
-            {
-              required: true
-            }
-          ]}
-        >
-          <Input.TextArea maxLength={240} />
-        </Form.Item>
-
-        <Divider />
-        <Space size="large" wrap align="center">
-          <Statistic
-            title={t("jobs.fields.ded_amt")}
-            value={Dinero(job.job_totals.totals.custPayable.deductible).toFormat()}
-          />
-          <Statistic
-            title={t("jobs.labels.total_cust_payable")}
-            value={Dinero(job.job_totals.totals.custPayable.total).toFormat()}
-          />
-          <Statistic
-            title={t("jobs.labels.net_repairs")}
-            value={Dinero(job.job_totals.totals.net_repairs).toFormat()}
-          />
-        </Space>
-        <Form.List name={["payers"]}>
-          {(fields, { add, remove }) => {
-            return (
-              <div>
-                {fields.map((field, index) => (
-                  <Form.Item key={field.key}>
-                    <Space wrap>
-                      <Form.Item
-                        label={t("jobs.fields.dms.payer.name")}
-                        key={`${index}name`}
-                        name={[field.name, "name"]}
-                        rules={[
-                          {
-                            required: true
-                          }
-                        ]}
-                      >
-                        <Select style={{ minWidth: "15rem" }} onSelect={(value) => handlePayerSelect(value, index)}>
-                          {bodyshop.cdk_configuration &&
-                            bodyshop.cdk_configuration.payers &&
-                            bodyshop.cdk_configuration.payers.map((payer) => (
-                              <Select.Option key={payer.name}>{payer.name}</Select.Option>
-                            ))}
-                        </Select>
-                      </Form.Item>
-
-                      <Form.Item
-                        label={t("jobs.fields.dms.payer.dms_acctnumber")}
-                        key={`${index}dms_acctnumber`}
-                        name={[field.name, "dms_acctnumber"]}
-                        rules={[
-                          {
-                            required: true
-                          }
-                        ]}
-                      >
-                        <Input disabled />
-                      </Form.Item>
-
-                      <Form.Item
-                        label={t("jobs.fields.dms.payer.amount")}
-                        key={`${index}amount`}
-                        name={[field.name, "amount"]}
-                        rules={[
-                          {
-                            required: true
-                          }
-                        ]}
-                      >
-                        <CurrencyInput min={0} />
-                      </Form.Item>
-
-                      <Form.Item
-                        label={
-                          <div>
-                            {t("jobs.fields.dms.payer.controlnumber")}{" "}
-                            <Dropdown
-                              menu={{
-                                items: bodyshop.cdk_configuration.controllist?.map((key, idx) => ({
-                                  key: idx,
-                                  label: key.name,
-                                  onClick: () => {
-                                    form.setFieldsValue({
-                                      payers: form.getFieldValue("payers").map((row, mapIndex) => {
-                                        if (index !== mapIndex) return row;
-                                        return {
-                                          ...row,
-                                          controlnumber: key.controlnumber
-                                        };
-                                      })
-                                    });
-                                  }
-                                }))
-                              }}
-                            >
-                              <a href=" #" onClick={(e) => e.preventDefault()}>
-                                <DownOutlined />
-                              </a>
-                            </Dropdown>
-                          </div>
-                        }
-                        key={`${index}controlnumber`}
-                        name={[field.name, "controlnumber"]}
-                        rules={[
-                          {
-                            required: true
-                          }
-                        ]}
-                      >
-                        <Input />
-                      </Form.Item>
-
-                      <Form.Item shouldUpdate>
-                        {() => {
-                          const payers = form.getFieldValue("payers");
-
-                          const row = payers && payers[index];
-
-                          const cdkPayer =
-                            bodyshop.cdk_configuration.payers &&
-                            bodyshop.cdk_configuration.payers.find((i) => i && row && i.name === row.name);
-                          if (i18n.exists(`jobs.fields.${cdkPayer?.control_type}`))
-                            return <div>{cdkPayer && t(`jobs.fields.${cdkPayer?.control_type}`)}</div>;
-                          else if (i18n.exists(`jobs.fields.dms.control_type.${cdkPayer?.control_type}`)) {
-                            return <div>{cdkPayer && t(`jobs.fields.dms.control_type.${cdkPayer?.control_type}`)}</div>;
-                          } else {
-                            return null;
-                          }
-                        }}
-                      </Form.Item>
-
-                      <DeleteFilled
-                        onClick={() => {
-                          remove(field.name);
-                        }}
-                      />
-                    </Space>
-                  </Form.Item>
-                ))}
-                <Form.Item>
-                  <Button
-                    disabled={!(fields.length < 3)}
-                    onClick={() => {
-                      if (fields.length < 3) add();
-                    }}
-                    style={{ width: "100%" }}
-                  >
-                    {t("jobs.actions.dms.addpayer")}
-                  </Button>
-                </Form.Item>
-              </div>
-            );
-          }}
-        </Form.List>
-        <Form.Item shouldUpdate>
-          {() => {
-            //Perform Calculation to determine discrepancy.
-            let totalAllocated = Dinero();
-
-            const payers = form.getFieldValue("payers");
-            payers &&
-              payers.forEach((payer) => {
-                totalAllocated = totalAllocated.add(Dinero({ amount: Math.round((payer?.amount || 0) * 100) }));
-              });
-
-            const totals =
-              socket.allocationsSummary &&
-              socket.allocationsSummary.reduce(
-                (acc, val) => {
-                  return {
-                    totalSale: acc.totalSale.add(Dinero(val.sale)),
-                    totalCost: acc.totalCost.add(Dinero(val.cost))
-                  };
-                },
-                {
-                  totalSale: Dinero(),
-                  totalCost: Dinero()
-                }
-              );
-            const discrep = totals ? totals.totalSale.subtract(totalAllocated) : Dinero();
-            return (
-              <Space size="large" wrap align="center">
-                <Statistic
-                  title={t("jobs.labels.subtotal")}
-                  value={(totals ? totals.totalSale : Dinero()).toFormat()}
-                />
-                <Typography.Title>-</Typography.Title>
-                <Statistic title={t("jobs.labels.dms.totalallocated")} value={totalAllocated.toFormat()} />
-                <Typography.Title>=</Typography.Title>
-                <Statistic
-                  title={t("jobs.labels.dms.notallocated")}
-                  valueStyle={{
-                    color: discrep.getAmount() === 0 ? "green" : "red"
-                  }}
-                  value={discrep.toFormat()}
-                />
-                <Button disabled={!socket.allocationsSummary || discrep.getAmount() !== 0} htmlType="submit">
-                  {t("jobs.actions.dms.post")}
-                </Button>
-              </Space>
-            );
-          }}
-        </Form.Item>
-      </Form>
-    </Card>
-  );
+    default:
+      return null;
+  }
 }

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

@@ -0,0 +1,242 @@
+import { ReloadOutlined } from "@ant-design/icons";
+import {
+  Button,
+  Card,
+  Col,
+  Divider,
+  Form,
+  Input,
+  InputNumber,
+  Row,
+  Select,
+  Space,
+  Statistic,
+  Tooltip,
+  Typography
+} from "antd";
+import Dinero from "dinero.js";
+import { useTranslation } from "react-i18next";
+import { useEffect, useMemo, useState } from "react";
+import dayjs from "../../utils/day";
+
+/**
+ * RR DMS Post Form component
+ * Submit: "rr-export-job"
+ * @param bodyshop
+ * @param socket
+ * @param job
+ * @param logsRef
+ * @returns {JSX.Element}
+ * @constructor
+ */
+export default function RRPostForm({ bodyshop, socket, job, logsRef }) {
+  const [form] = Form.useForm();
+  const { t } = useTranslation();
+
+  // Advisors
+  const [advisors, setAdvisors] = useState([]);
+  const [advLoading, setAdvLoading] = useState(false);
+
+  const getAdvisorNumber = (a) => a?.advisorId;
+
+  const getAdvisorLabel = (a) => `${a?.firstName || ""} ${a?.lastName || ""}`.trim();
+
+  const fetchRrAdvisors = (refresh = false) => {
+    if (!socket) return;
+    setAdvLoading(true);
+
+    const onResult = (payload) => {
+      try {
+        const list = payload?.result ?? payload ?? [];
+        setAdvisors(Array.isArray(list) ? list : []);
+      } finally {
+        setAdvLoading(false);
+        socket.off("rr-get-advisors:result", onResult);
+      }
+    };
+
+    socket.once("rr-get-advisors:result", onResult);
+    socket.emit("rr-get-advisors", { departmentType: "B", refresh }, (ack) => {
+      if (ack?.ok) {
+        const list = ack.result ?? [];
+        setAdvisors(Array.isArray(list) ? list : []);
+      } else if (ack) {
+        console.error("Something went wrong fetching DMS Advisors");
+      }
+      setAdvLoading(false);
+      socket.off("rr-get-advisors:result", onResult);
+    });
+  };
+
+  useEffect(() => {
+    fetchRrAdvisors(false);
+  }, [bodyshop?.id, socket]);
+
+  const initialValues = useMemo(
+    () => ({
+      story: `${t("jobs.labels.dms.defaultstory", {
+        ro_number: job.ro_number,
+        ownr_nm: `${job.ownr_fn || ""} ${job.ownr_ln || ""} ${job.ownr_co_nm || ""}`.trim(),
+        ins_co_nm: job.ins_co_nm || "N/A",
+        clm_po: `${job.clm_no ? `${job.clm_no} ` : ""}${job.po_number || ""}`
+      }).trim()}.${
+        job.area_of_damage?.impact1
+          ? " " +
+            t("jobs.labels.dms.damageto", {
+              area_of_damage: (job.area_of_damage && job.area_of_damage.impact1.padStart(2, "0")) || "UNKNOWN"
+            })
+          : ""
+      }`.slice(0, 239),
+      inservicedate: dayjs(
+        `${
+          (job.v_model_yr &&
+            (job.v_model_yr < 100
+              ? job.v_model_yr >= (dayjs().year() + 1) % 100
+                ? 1900 + parseInt(job.v_model_yr, 10)
+                : 2000 + parseInt(job.v_model_yr, 10)
+              : job.v_model_yr)) ||
+          2019
+        }-01-01`
+      )
+    }),
+    [job, t]
+  );
+
+  const handleFinish = (values) => {
+    if (!socket) return;
+    socket.emit("rr-export-job", {
+      bodyshopId: bodyshop?.id,
+      jobId: job.id,
+      job,
+      txEnvelope: values
+    });
+    logsRef?.current?.scrollIntoView({ behavior: "smooth" });
+  };
+
+  // Discrepancy is ignored for RR; we still show totals for operator context
+  const totals = socket?.allocationsSummary
+    ? socket.allocationsSummary.reduce(
+        (acc, val) => ({
+          totalSale: acc.totalSale.add(Dinero(val.sale)),
+          totalCost: acc.totalCost.add(Dinero(val.cost))
+        }),
+        { totalSale: Dinero(), totalCost: Dinero() }
+      )
+    : { totalSale: Dinero(), totalCost: Dinero() };
+
+  return (
+    <Card title={t("jobs.labels.dms.postingform")}>
+      <Form
+        form={form}
+        layout="vertical"
+        onFinish={handleFinish}
+        style={{ width: "100%" }}
+        initialValues={initialValues}
+      >
+        <Row gutter={[16, 12]} align="bottom">
+          {/* Advisor + inline Refresh */}
+          <Col xs={24} sm={24} md={12} lg={8}>
+            <Form.Item label={t("jobs.fields.dms.advisor")} required>
+              <Space.Compact block>
+                <Form.Item
+                  name="advisorNo"
+                  noStyle
+                  rules={[{ required: true, message: t("general.validation.required") }]}
+                >
+                  <Select
+                    style={{ flex: 1 }}
+                    loading={advLoading}
+                    allowClear
+                    placeholder={t("general.actions.select", "Select...")}
+                    popupMatchSelectWidth
+                    options={advisors
+                      .map((a) => {
+                        const value = getAdvisorNumber(a);
+                        if (value == null) return null;
+                        return { value: String(value), label: getAdvisorLabel(a) || String(value) };
+                      })
+                      .filter(Boolean)}
+                    notFoundContent={advLoading ? t("general.labels.loading") : t("general.labels.none")}
+                  />
+                </Form.Item>
+                <Tooltip title={t("general.actions.refresh")}>
+                  <Button
+                    aria-label={t("general.actions.refresh")}
+                    icon={<ReloadOutlined />}
+                    onClick={() => fetchRrAdvisors(true)}
+                    loading={advLoading}
+                  />
+                </Tooltip>
+              </Space.Compact>
+            </Form.Item>
+          </Col>
+
+          {/* Make Override */}
+          <Col xs={24} sm={12} md={12} lg={8}>
+            <Form.Item name="makeOverride" label={t("jobs.fields.dms.make_override")}>
+              <Input allowClear placeholder={t("general.actions.optional")} />
+            </Form.Item>
+          </Col>
+
+          <Col xs={12} sm={8} md={6} lg={4}>
+            <Form.Item name="kmin" label={t("jobs.fields.kmin")} initialValue={job?.kmin} rules={[{ required: true }]}>
+              <InputNumber style={{ width: "100%" }} disabled />
+            </Form.Item>
+          </Col>
+
+          <Col xs={12} sm={8} md={6} lg={4}>
+            <Form.Item
+              name="kmout"
+              label={t("jobs.fields.kmout")}
+              initialValue={job?.kmout}
+              rules={[{ required: true }]}
+            >
+              <InputNumber style={{ width: "100%" }} disabled />
+            </Form.Item>
+          </Col>
+        </Row>
+
+        <Row gutter={[16, 12]}>
+          <Col span={24}>
+            <Form.Item name="story" label={t("jobs.fields.dms.story")} rules={[{ required: true }]}>
+              <Input.TextArea maxLength={240} />
+            </Form.Item>
+          </Col>
+        </Row>
+
+        <Divider />
+
+        <Space size="large" wrap align="center" style={{ marginBottom: 16 }}>
+          <Statistic
+            title={t("jobs.fields.ded_amt")}
+            value={Dinero(job.job_totals.totals.custPayable.deductible).toFormat()}
+          />
+          <Statistic
+            title={t("jobs.labels.total_cust_payable")}
+            value={Dinero(job.job_totals.totals.custPayable.total).toFormat()}
+          />
+          <Statistic
+            title={t("jobs.labels.net_repairs")}
+            value={Dinero(job.job_totals.totals.net_repairs).toFormat()}
+          />
+        </Space>
+
+        {/* Validation  */}
+        <Form.Item shouldUpdate>
+          {() => {
+            const advisorOk = !!form.getFieldValue("advisorNo");
+            return (
+              <Space size="large" wrap align="center">
+                <Statistic title={t("jobs.labels.subtotal")} value={totals.totalSale.toFormat()} />
+                <Typography.Title>=</Typography.Title>
+                <Button disabled={!advisorOk} htmlType="submit">
+                  {t("jobs.actions.dms.post")}
+                </Button>
+              </Space>
+            );
+          }}
+        </Form.Item>
+      </Form>
+    </Card>
+  );
+}

client/src/components/documents-upload-imgproxy/documents-upload-imgproxy.utility.js

@@ -67,11 +67,14 @@ export const uploadToS3 = async (
   }
 
   //Key should be same as we provided to maintain backwards compatibility.
-  const { presignedUrl: preSignedUploadUrlToS3, key: s3Key } = signedURLResponse.data.signedUrls[0];
+  const { presignedUrl: preSignedUploadUrlToS3, key: s3Key, contentType } = signedURLResponse.data.signedUrls[0];
 
   const options = {
     onUploadProgress: (e) => {
       if (onProgress) onProgress({ percent: (e.loaded / e.total) * 100 });
+    },
+    headers: {
+      ...contentType ? { "Content-Type": fileType } : {}
     }
   };
 

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

@@ -67,6 +67,7 @@ export function EmailDocumentsComponent({ emailConfig, form, selectedMediaState,
             <JobsDocumentsLocalGalleryExternalComponent
               externalMediaState={[selectedMedia, setSelectedMedia]}
               jobId={emailConfig.jobid}
+              context="email"
             />
           )}
         </>
@@ -82,6 +83,7 @@ export function EmailDocumentsComponent({ emailConfig, form, selectedMediaState,
             <JobsDocumentsLocalGalleryExternalComponent
               externalMediaState={[selectedMedia, setSelectedMedia]}
               jobId={emailConfig.jobid}
+              context="email"
             />
           )}
         </>

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

@@ -16,7 +16,7 @@ const mapStateToProps = createStructuredSelector({
 
 export function GlobalFooter({ isPartsEntry }) {
   const { t } = useTranslation();
-  
+
   if (isPartsEntry) {
     return (
       <Footer>
@@ -35,7 +35,6 @@ export function GlobalFooter({ isPartsEntry }) {
               rome: t("titles.romeonline")
             })} - ${import.meta.env.VITE_APP_GIT_SHA_DATE}`}
           </div>
-          <WssStatusDisplayComponent />
           <Link to="/disclaimer" target="_blank" style={{ color: "#ccc" }}>
             Disclaimer & Notices
           </Link>

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

@@ -7,6 +7,7 @@ import { Link, useNavigate } 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";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 
 export default function GlobalSearchOs() {
   const { t } = useTranslation();
@@ -19,6 +20,8 @@ export default function GlobalSearchOs() {
     if (v && v && v !== "" && v.length >= 3) {
       try {
         setLoading(true);
+        logImEXEvent("global_search", { search: v });
+
         const searchData = await axios.post("/search", {
           search: v
         });

client/src/components/header/buildAccountingChildren.jsx

@@ -141,7 +141,7 @@ const buildAccountingChildren = ({
           </Link>
         )
       },
-      ...(!((bodyshop && bodyshop.cdk_dealerid) || (bodyshop && bodyshop.pbs_serialnumber)) || DmsAp.treatment === "on"
+      ...(!(bodyshop?.cdk_dealerid || bodyshop?.pbs_serialnumber || bodyshop?.rr_dealerid) || DmsAp.treatment === "on"
         ? [
             {
               key: "payables",
@@ -156,7 +156,7 @@ const buildAccountingChildren = ({
             }
           ]
         : []),
-      ...(!((bodyshop && bodyshop.cdk_dealerid) || (bodyshop && bodyshop.pbs_serialnumber))
+      ...(!(bodyshop?.cdk_dealerid || bodyshop?.pbs_serialnumber || bodyshop?.rr_dealerid) || DmsAp.treatment === "on"
         ? [
             {
               key: "payments",

client/src/components/job-audit-trail/job-audit-trail.component.jsx

@@ -4,6 +4,7 @@ import { Button, Card, Col, Row, Table, Tag } from "antd";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 import { QUERY_AUDIT_TRAIL } from "../../graphql/audit_trail.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import { DateTimeFormatter } from "../../utils/DateFormatter";
@@ -125,6 +126,7 @@ export function JobAuditTrail({ bodyshop, jobId }) {
       render: (text, record) => (
         <Button
           onClick={() => {
+            logImEXEvent("jobs_audit_view_email", {});
             var win = window.open(
               "",
               "Title",

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

@@ -90,7 +90,7 @@ export function JobDetailCardsPartsComponent({ loading, data, jobRO }) {
             .filter(onlyUnique)
             .map((s) => {
               return {
-                text: s || "No Status*",
+                text: s || t("dashboard.errors.status"),
                 value: [s]
               };
             })) ||
@@ -103,7 +103,7 @@ export function JobDetailCardsPartsComponent({ loading, data, jobRO }) {
     <div>
       <CardTemplate loading={loading} title={t("jobs.labels.cards.parts")}>
         <PartsStatusPie joblines_status={joblines_status} />
-        <Table key="id" columns={columns} dataSource={filteredJobLines ? filteredJobLines : []} />
+        <Table key="id" columns={columns} dataSource={filteredJobLines || []} />
       </CardTemplate>
     </div>
   );

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

@@ -12,13 +12,15 @@ import InstanceRenderManager from "../../utils/instanceRenderMgr";
 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 { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
+import { selectIsPartsEntry } from "../../redux/application/application.selectors.js";
 
 const mapStateToProps = createStructuredSelector({
-  technician: selectTechnician
+  technician: selectTechnician,
+  isPartsEntry: selectIsPartsEntry
 });
 const mapDispatchToProps = () => ({});
 
-export function JobLinesPartPriceChange({ job, line, refetch, technician }) {
+export function JobLinesPartPriceChange({ job, line, refetch, technician, isPartsEntry }) {
   const [loading, setLoading] = useState(false);
   const [updatePartPrice] = useMutation(UPDATE_LINE_PPC);
   const notification = useNotification();
@@ -64,6 +66,7 @@ export function JobLinesPartPriceChange({ job, line, refetch, technician }) {
 
   const popcontent =
     !technician &&
+    !isPartsEntry &&
     InstanceRenderManager({
       imex: null,
       rome: (

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

@@ -46,6 +46,7 @@ import PartsOrderModalContainer from "../parts-order-modal/parts-order-modal.con
 import JobLinesExpander from "./job-lines-expander.component";
 import JobLinesPartPriceChange from "./job-lines-part-price-change.component";
 import JobLinesExpanderSimple from "./jobs-lines-expander-simple.component";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -96,7 +97,7 @@ export function JobLinesComponent({
     filteredInfo: {
       ...(isPartsEntry
         ? {
-            part_type: ["PAN", "PAC", "PAR", "PAL", "PAA", "PAM", "PAP", "PAS", "PASL", "PAG", "PAO"]
+            part_type: ["PAN", "PAC", "PAR", "PAL", "PAA", "PAM", "PAP", "PAS", "PASL", "PAG"] //"PAO" Removed by request
           }
         : {})
     }
@@ -317,7 +318,7 @@ export function JobLinesComponent({
             .filter(onlyUnique)
             .map((s) => {
               return {
-                text: s || "No Status*",
+                text: s || t("dashboard.errors.status"),
                 value: [s]
               };
             })) ||
@@ -397,6 +398,7 @@ export function JobLinesComponent({
       filteredInfo: filters,
       sortedInfo: sorter
     }));
+    logImEXEvent("joblines_table_change", { pagination, filters, sorter });
   };
 
   const handleMark = (e) => {
@@ -413,6 +415,7 @@ export function JobLinesComponent({
         ])
       );
     }
+    logImEXEvent("joblines_mark_lines", {});
   };
 
   const markMenu = {
@@ -481,48 +484,50 @@ export function JobLinesComponent({
             {Enhanced_Payroll.treatment === "on" && (
               <JobLineBulkAssignComponent selectedLines={selectedLines} setSelectedLines={setSelectedLines} job={job} />
             )}
-            <Button
-              disabled={(job && !job.converted) || (selectedLines.length > 0 ? false : true) || jobRO || technician}
-              onClick={() => {
-                setBillEnterContext({
-                  actions: { refetch: refetch },
-                  context: {
-                    disableInvNumber: true,
-                    job: { id: job.id },
-                    bill: {
-                      vendorid: bodyshop.inhousevendorid,
-                      invoice_number: "ih",
-                      isinhouse: true,
-                      date: dayjs(),
-                      total: 0,
-                      billlines: selectedLines.map((p) => {
-                        return {
-                          joblineid: p.id,
-                          actual_price: p.act_price,
-                          actual_cost: 0, //p.act_price,
-                          line_desc: p.line_desc,
-                          line_remarks: p.line_remarks,
-                          part_type: p.part_type,
-                          quantity: p.quantity || 1,
-                          applicable_taxes: {
-                            local: false,
-                            state: false,
-                            federal: false
-                          }
-                        };
-                      })
+            {!isPartsEntry && (
+              <Button
+                disabled={(job && !job.converted) || (selectedLines.length > 0 ? false : true) || jobRO || technician}
+                onClick={() => {
+                  setBillEnterContext({
+                    actions: { refetch: refetch },
+                    context: {
+                      disableInvNumber: true,
+                      job: { id: job.id },
+                      bill: {
+                        vendorid: bodyshop.inhousevendorid,
+                        invoice_number: "ih",
+                        isinhouse: true,
+                        date: dayjs(),
+                        total: 0,
+                        billlines: selectedLines.map((p) => {
+                          return {
+                            joblineid: p.id,
+                            actual_price: p.act_price,
+                            actual_cost: 0, //p.act_price,
+                            line_desc: p.line_desc,
+                            line_remarks: p.line_remarks,
+                            part_type: p.part_type,
+                            quantity: p.quantity || 1,
+                            applicable_taxes: {
+                              local: false,
+                              state: false,
+                              federal: false
+                            }
+                          };
+                        })
+                      }
                     }
-                  }
-                });
+                  });
 
-                //Clear out the selected lines. IO-785
-                setSelectedLines([]);
-              }}
-            >
-              <HomeOutlined />
-              {t("parts.actions.orderinhouse")}
-              {selectedLines.length > 0 && ` (${selectedLines.length})`}
-            </Button>
+                  //Clear out the selected lines. IO-785
+                  setSelectedLines([]);
+                }}
+              >
+                <HomeOutlined />
+                {t("parts.actions.orderinhouse")}
+                {selectedLines.length > 0 && ` (${selectedLines.length})`}
+              </Button>
+            )}
             <Button
               id="job-lines-order-parts-button"
               disabled={(job && !job.converted) || (selectedLines.length > 0 ? false : true) || jobRO || technician}
@@ -578,7 +583,8 @@ export function JobLinesComponent({
                 {t("joblines.actions.new")}
               </Button>
             )}
-            {InstanceRenderManager({ rome: <JobSendPartPriceChangeComponent job={job} disabled={technician} /> })}
+            {!isPartsEntry &&
+              InstanceRenderManager({ rome: <JobSendPartPriceChangeComponent job={job} disabled={technician} /> })}
             <JobCreateIOU job={job} selectedJobLines={selectedLines} />
             <Input.Search
               placeholder={t("general.labels.search")}
@@ -613,12 +619,18 @@ export function JobLinesComponent({
             expanded ? (
               <MinusCircleTwoTone onClick={(e) => onExpand(record, e)} />
             ) : (
-              <PlusCircleTwoTone onClick={(e) => onExpand(record, e)} />
+              <PlusCircleTwoTone
+                onClick={(e) => {
+                  onExpand(record, e);
+                  logImEXEvent("joblines_expander", {});
+                }}
+              />
             )
         }}
         onRow={(record) => {
           return {
             onDoubleClick: () => {
+              logImEXEvent("joblines_double_click_select", {});
               const notMatchingLines = selectedLines.filter((i) => i.id !== record.id);
               notMatchingLines.length !== selectedLines.length
                 ? setSelectedLines(notMatchingLines)

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

@@ -1,18 +1,19 @@
-import { useCallback, useEffect, useState } from "react";
-import dayjs from "../../utils/day";
-import axios from "axios";
-import { Badge, Card, Space, Table, Tag } from "antd";
 import { gql, useQuery } from "@apollo/client";
-import { DateTimeFormatterFunction } from "../../utils/DateFormatter";
+import { Badge, Card, Space, Table, Tag } from "antd";
+import axios from "axios";
 import { isEmpty } from "lodash";
+import { useCallback, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
-import "./job-lifecycle.styles.scss";
-import BlurWrapperComponent from "../feature-wrapper/blur-wrapper.component";
-import UpsellComponent, { upsellEnum } from "../upsell/upsell.component";
-import { HasFeatureAccess } from "../feature-wrapper/feature-wrapper.component";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import { DateTimeFormatterFunction } from "../../utils/DateFormatter";
+import dayjs from "../../utils/day";
+import BlurWrapperComponent from "../feature-wrapper/blur-wrapper.component";
+import { HasFeatureAccess } from "../feature-wrapper/feature-wrapper.component";
+import UpsellComponent, { upsellEnum } from "../upsell/upsell.component";
+import "./job-lifecycle.styles.scss";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -57,6 +58,7 @@ export function JobLifecycleComponent({ bodyshop, job, statuses }) {
           jobids: job.id,
           statuses: statuses.statuses
         });
+        logImEXEvent("jobs_lifecycle_data", {});
         const data = response.data.transition[job.id];
         setLifecycleData(data);
       } catch (err) {

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

@@ -10,6 +10,7 @@ import { selectBodyshop } from "../../redux/user/user.selectors";
 import { insertAuditTrail } from "../../redux/application/application.actions";
 import AuditTrailMapping from "../../utils/AuditTrailMappings";
 import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
+import { logImEXEvent } from "../../firebase/firebase.utils.js";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -32,6 +33,7 @@ export function JoblineBulkAssign({ setSelectedLines, selectedLines, insertAudit
   const handleConvert = async (values) => {
     try {
       setLoading(true);
+      logImEXEvent("joblines_bulk_assign", {});
       const result = await assignLines({
         variables: {
           jobline: {

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

@@ -12,6 +12,7 @@ import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selecto
 import { GenerateDocument } from "../../utils/RenderTemplate";
 import { TemplateList } from "../../utils/TemplateConstants";
 import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
+import { logImEXEvent } from "../../firebase/firebase.utils.js";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -46,6 +47,7 @@ export function JobLineDispatchButton({
     try {
       setLoading(true);
       //THIS HAS NOT YET BEEN TESTED. START BY FINISHING THIS FUNCTION.
+      logImEXEvent("joblines_dispatch", {});
       const result = await dispatchLines({
         variables: {
           partsDispatch: {

client/src/components/job-parts-queue-count/job-parts-queue-count.component.jsx

@@ -1,8 +1,9 @@
 import { useMemo } from "react";
-import { Col, Row, Tag, Tooltip } from "antd";
+import { Tag, Tooltip } from "antd";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import { useTranslation } from "react-i18next";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -10,64 +11,68 @@ const mapStateToProps = createStructuredSelector({
 const mapDispatchToProps = () => ({
   //setUserLanguage: language => dispatch(setUserLanguage(language))
 });
+
 export default connect(mapStateToProps, mapDispatchToProps)(JobPartsQueueCount);
 
-export function JobPartsQueueCount({ bodyshop, parts, style }) {
+export function JobPartsQueueCount({ bodyshop, parts }) {
+  const { t } = useTranslation();
   const partsStatus = useMemo(() => {
     if (!parts) return null;
+    const statusKeys = ["default_bo", "default_ordered", "default_received", "default_returned"];
     return parts.reduce(
       (acc, val) => {
         if (val.part_type === "PAS" || val.part_type === "PASL") return acc;
         acc.total = acc.total + val.count;
         acc[val.status] = acc[val.status] + val.count;
-
         return acc;
       },
       {
         total: 0,
         null: 0,
-        [bodyshop.md_order_statuses.default_bo]: 0,
-        [bodyshop.md_order_statuses.default_ordered]: 0,
-        [bodyshop.md_order_statuses.default_received]: 0,
-        [bodyshop.md_order_statuses.default_returned]: 0
+        ...Object.fromEntries(statusKeys.map((key) => [bodyshop.md_order_statuses[key], 0]))
       }
     );
   }, [bodyshop, parts]);
 
   if (!parts) return null;
-
   return (
-    <Row style={style}>
-      <Col span={4}>
-        <Tooltip title="Total">
-          <Tag>{partsStatus.total}</Tag>
-        </Tooltip>
-      </Col>
-      <Col span={4}>
-        <Tooltip title="No Status">
-          <Tag color="gold">{partsStatus["null"]}</Tag>
-        </Tooltip>
-      </Col>
-      <Col span={4}>
-        <Tooltip title={bodyshop.md_order_statuses.default_ordered}>
-          <Tag color="blue">{partsStatus[bodyshop.md_order_statuses.default_ordered]}</Tag>
-        </Tooltip>
-      </Col>
-      <Col span={4}>
-        <Tooltip title={bodyshop.md_order_statuses.default_received}>
-          <Tag color="green">{partsStatus[bodyshop.md_order_statuses.default_received]}</Tag>
-        </Tooltip>
-      </Col>
-      <Col span={4}>
-        <Tooltip title={bodyshop.md_order_statuses.default_returned}>
-          <Tag color="orange">{partsStatus[bodyshop.md_order_statuses.default_returned]}</Tag>
-        </Tooltip>
-      </Col>
-      <Col span={4}>
-        <Tooltip title={bodyshop.md_order_statuses.default_bo}>
-          <Tag color="red">{partsStatus[bodyshop.md_order_statuses.default_bo]}</Tag>
-        </Tooltip>
-      </Col>
-    </Row>
+    <div
+      style={{
+        display: "grid",
+        gridTemplateColumns: "repeat(auto-fit, minmax(40px, 1fr))",
+        gap: "8px",
+        width: "100%",
+        justifyItems: "start"
+      }}
+    >
+      <Tooltip title="Total">
+        <Tag style={{ minWidth: "40px", textAlign: "center" }}>{partsStatus.total}</Tag>
+      </Tooltip>
+      <Tooltip title={t("dashboard.errors.status_normal")}>
+        <Tag color="gold" style={{ minWidth: "40px", textAlign: "center" }}>
+          {partsStatus["null"]}
+        </Tag>
+      </Tooltip>
+      <Tooltip title={bodyshop.md_order_statuses.default_bo}>
+        <Tag color="red" style={{ minWidth: "40px", textAlign: "center" }}>
+          {partsStatus[bodyshop.md_order_statuses.default_bo]}
+        </Tag>
+      </Tooltip>
+      <Tooltip title={bodyshop.md_order_statuses.default_ordered}>
+        <Tag color="blue" style={{ minWidth: "40px", textAlign: "center" }}>
+          {partsStatus[bodyshop.md_order_statuses.default_ordered]}
+        </Tag>
+      </Tooltip>
+      <Tooltip title={bodyshop.md_order_statuses.default_received}>
+        <Tag color="green" style={{ minWidth: "40px", textAlign: "center" }}>
+          {partsStatus[bodyshop.md_order_statuses.default_received]}
+        </Tag>
+      </Tooltip>
+      <Tooltip title={bodyshop.md_order_statuses.default_returned}>
+        <Tag color="orange" style={{ minWidth: "40px", textAlign: "center" }}>
+          {partsStatus[bodyshop.md_order_statuses.default_returned]}
+        </Tag>
+      </Tooltip>
+    </div>
   );
 }

client/src/components/job-remove-from-parst-queue/job-remove-from-parts-queue.component.jsx

@@ -4,6 +4,7 @@ import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { UPDATE_JOB } from "../../graphql/jobs.queries";
 import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
+import { logImEXEvent } from "../../firebase/firebase.utils.js";
 
 export default function JobRemoveFromPartsQueue({ checked, jobId }) {
   const [updateJob] = useMutation(UPDATE_JOB);
@@ -13,6 +14,8 @@ export default function JobRemoveFromPartsQueue({ checked, jobId }) {
 
   const handleChange = async (e) => {
     setLoading(true);
+    logImEXEvent("parts_queue_toggle", { estimators: e });
+
     const result = await updateJob({
       variables: { jobId: jobId, job: { queued_for_parts: e.target.checked } }
     });

client/src/components/job-totals-table/jobs-totals.cash-discount-display.component.jsx

@@ -20,35 +20,27 @@ export function JobTotalsCashDiscount({ bodyshop, amountDinero }) {
   const notification = useNotification();
 
   const fetchData = useCallback(async () => {
-    if (amountDinero && bodyshop) {
-      setLoading(true);
-      let response;
-      try {
-        response = await axios.post("/intellipay/checkfee", {
-          bodyshop: { id: bodyshop.id, imexshopid: bodyshop.imexshopid, state: bodyshop.state },
-          amount: Dinero(amountDinero).toFormat("0.00")
-        });
+    if (!amountDinero || !bodyshop) return;
 
-        if (response?.data?.error) {
-          notification.open({
-            type: "error",
-            message:
-              response.data?.error ||
-              "Error encountered when contacting IntelliPay service to determine cash discounted price."
-          });
-        } else {
-          setFee(response.data?.fee || 0);
-        }
-      } catch (error) {
-        notification.open({
-          type: "error",
-          message:
-            error.response?.data?.error ||
-            "Error encountered when contacting IntelliPay service to determine cash discounted price."
-        });
-      } finally {
-        setLoading(false);
+    setLoading(true);
+    const errorMessage = "Error encountered when contacting IntelliPay service to determine cash discounted price.";
+
+    try {
+      const { id, imexshopid, state } = bodyshop;
+      const { data } = await axios.post("/intellipay/checkfee", {
+        bodyshop: { id, imexshopid, state },
+        amount: Dinero(amountDinero).toUnit()
+      });
+
+      if (data?.error) {
+        notification.open({ type: "error", message: data.error || errorMessage });
+      } else {
+        setFee(data?.fee ?? 0);
       }
+    } catch (error) {
+      notification.open({ type: "error", message: error.response?.data?.error || errorMessage });
+    } finally {
+      setLoading(false);
     }
   }, [amountDinero, bodyshop, notification]);
 

client/src/components/jobs-available-scan/jobs-available-scan.component.jsx

@@ -8,6 +8,7 @@ import { createStructuredSelector } from "reselect";
 import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
 import { selectPartnerVersion } from "../../redux/application/application.selectors";
 import { alphaSort } from "../../utils/sorters";
+import { logImEXEvent } from "../../firebase/firebase.utils.js";
 
 const mapStateToProps = createStructuredSelector({
   //currentUser: selectCurrentUser
@@ -30,11 +31,15 @@ export function JobsAvailableScan({ partnerVersion, refetch }) {
   const notification = useNotification();
 
   const handleTableChange = (pagination, filters, sorter) => {
+    logImEXEvent("available_jobs_scan_sort_filter", { pagination, filters, sorter });
+
     setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
   };
 
   const handleImport = async (filepath) => {
     setLoading(true);
+    logImEXEvent("available_jobs_scan", {});
+
     const response = await axios.post("http://localhost:1337/import/", {
       filepath
     });

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

@@ -12,6 +12,7 @@ import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { TimeAgoFormatter } from "../../utils/DateFormatter";
 import { alphaSort } from "../../utils/sorters";
 import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
+import { logImEXEvent } from "../../firebase/firebase.utils.js";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -34,6 +35,7 @@ export function JobsAvailableComponent({ bodyshop, loading, data, refetch, addJo
 
   const handleTableChange = (pagination, filters, sorter) => {
     setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
+    logImEXEvent("available_jobs_sort_filter", { pagination, filters, sorter });
   };
 
   const columns = [

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

@@ -6,6 +6,7 @@ import { createStructuredSelector } from "reselect";
 import { logImEXEvent } from "../../firebase/firebase.utils";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import InstanceRenderManager from "../../utils/instanceRenderMgr";
+import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -14,6 +15,8 @@ const mapStateToProps = createStructuredSelector({
 export function JobsCloseAutoAllocate({ bodyshop, joblines, form, disabled }) {
   const { t } = useTranslation();
 
+  const hasDmsKey = bodyshopHasDmsKey(bodyshop);
+
   const handleAllocate = (defaults) => {
     form.setFieldsValue({
       joblines: joblines.map((jl) => {
@@ -64,21 +67,20 @@ export function JobsCloseAutoAllocate({ bodyshop, joblines, form, disabled }) {
     handleAllocate(bodyshop.md_responsibility_centers.dms_defaults.find((x) => x.name === key));
   };
 
-  const menu =
-    bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber
-      ? {
-          items: bodyshop.md_responsibility_centers.dms_defaults.map((mapping) => ({
-            key: mapping.name,
-            label: mapping.name,
-            disabled: disabled
-          })),
-          onClick: handleMenuClick
-        }
-      : {
-          items: []
-        };
+  const menu = hasDmsKey
+    ? {
+        items: bodyshop.md_responsibility_centers.dms_defaults.map((mapping) => ({
+          key: mapping.name,
+          label: mapping.name,
+          disabled: disabled
+        })),
+        onClick: handleMenuClick
+      }
+    : {
+        items: []
+      };
 
-  return bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber ? (
+  return hasDmsKey ? (
     <Dropdown menu={menu}>
       <Button disabled={disabled}>{t("jobs.actions.dmsautoallocate")}</Button>
     </Dropdown>

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

@@ -10,6 +10,7 @@ import { auth, logImEXEvent } from "../../firebase/firebase.utils";
 import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
 import { UPDATE_JOB } from "../../graphql/jobs.queries";
 import { insertAuditTrail } from "../../redux/application/application.actions";
+import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
 import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
 import AuditTrailMapping from "../../utils/AuditTrailMappings";
 import client from "../../utils/GraphQLClient";
@@ -45,7 +46,7 @@ export function JobsCloseExportButton({ bodyshop, currentUser, jobId, disabled,
 
   const handleQbxml = async () => {
     //Check if it's a CDK setup.
-    if (bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber) {
+    if (bodyshopHasDmsKey(bodyshop)) {
       history(`/manage/dms?jobId=${jobId}`);
       return;
     }

client/src/components/jobs-detail-header-actions/jobs-detail-header-actions.toggle-production.jsx

@@ -14,6 +14,7 @@ import AuditTrailMapping from "../../utils/AuditTrailMappings";
 import { DateTimeFormatterFunction } from "../../utils/DateFormatter";
 import FormDateTimePickerComponent from "../form-date-time-picker/form-date-time-picker.component";
 import LoadingSpinner from "../loading-spinner/loading-spinner.component.jsx";
+import { logImEXEvent } from "../../firebase/firebase.utils.js";
 
 const mapStateToProps = createStructuredSelector({
   //currentUser: selectCurrentUser,
@@ -108,6 +109,9 @@ export function JobsDetailHeaderActionsToggleProduction({
                 DateTimeFormatterFunction(values.actual_completion)
               )
       });
+
+      logImEXEvent(scenario === "pre" ? "job_intake_quick" : "job-deliver-quick", {});
+
       setPopOverVisible(false);
       closeParentMenu();
       refetch();

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

@@ -29,6 +29,7 @@ import ProductionListColumnProductionNote from "../production-list-columns/produ
 import VehicleVinDisplay from "../vehicle-vin-display/vehicle-vin-display.component";
 import "./jobs-detail-header.styles.scss";
 import getPartsBasePath from "../../utils/getPartsBasePath.js";
+import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
 
 const mapStateToProps = createStructuredSelector({
   jobRO: selectJobReadOnly,
@@ -77,6 +78,8 @@ export function JobsDetailHeader({ job, bodyshop, disabled, insertAuditTrail, is
     .reduce((acc, val) => acc + val.mod_lb_hrs, 0);
   const ownerTitle = OwnerNameDisplayFunction(job).trim();
 
+  const employeeData = bodyshop.associations.find((a) => a.useremail === job.admin_clerk)?.user?.employee ?? null;
+
   // Handle checkbox changes
   const handleCheckboxChange = async (field, checked) => {
     const value = checked ? dayjs().toISOString() : null;
@@ -139,17 +142,18 @@ export function JobsDetailHeader({ job, bodyshop, disabled, insertAuditTrail, is
               <DataLabel label={t("jobs.fields.comment")} valueStyle={{ overflow: "hidden", textOverflow: "ellipsis" }}>
                 <ProductionListColumnComment record={job} />
               </DataLabel>
-              <DataLabel label={t("jobs.fields.ins_co_nm_short")}>{job.ins_co_nm}</DataLabel>
+              {!isPartsEntry && <DataLabel label={t("jobs.fields.ins_co_nm_short")}>{job.ins_co_nm}</DataLabel>}
               <DataLabel label={t("jobs.fields.clm_no")}>{job.clm_no}</DataLabel>
               <DataLabel label={t("jobs.fields.ponumber")} hideIfNull>
                 {job.po_number}
               </DataLabel>
-              <DataLabel label={t("jobs.fields.repairtotal")}>
-                <CurrencyFormatter>{job.clm_total}</CurrencyFormatter>
-                <span style={{ margin: "0rem .5rem" }}>/</span>
-                <CurrencyFormatter>{job.owner_owing}</CurrencyFormatter>
-              </DataLabel>
-
+              {!isPartsEntry && (
+                <DataLabel label={t("jobs.fields.repairtotal")}>
+                  <CurrencyFormatter>{job.clm_total}</CurrencyFormatter>
+                  <span style={{ margin: "0rem .5rem" }}>/</span>
+                  <CurrencyFormatter>{job.owner_owing}</CurrencyFormatter>
+                </DataLabel>
+              )}
               {!isPartsEntry && (
                 <>
                   <DataLabel label={t("jobs.fields.alt_transport")}>
@@ -161,7 +165,7 @@ export function JobsDetailHeader({ job, bodyshop, disabled, insertAuditTrail, is
                       {job.cccontracts.map((c, index) => (
                         <Space key={c.id} wrap>
                           <Link to={`/manage/courtesycars/contracts/${c.id}`}>
-                            {`${c.agreementnumber} - ${c.courtesycar.fleetnumber} ${c.courtesycar.year} ${c.courtesycar.make} ${c.courtesycar.model}`}
+                            {`${c.agreementnumber} - ${c.courtesycar.fleetnumber} ${c.courtesycar.year} ${c.courtesycar.make} ${c.courtesycar.model} ${c.courtesycar.plate} - ${t(c.status)}`}
                             {index !== job.cccontracts.length - 1 ? "," : null}
                           </Link>
                         </Space>
@@ -176,7 +180,7 @@ export function JobsDetailHeader({ job, bodyshop, disabled, insertAuditTrail, is
                       <Checkbox
                         checked={!!job.estimate_sent_approval}
                         onChange={(e) => handleCheckboxChange("estimate_sent_approval", e.target.checked)}
-                        disabled={disabled}
+                        disabled={disabled || isPartsEntry}
                       >
                         {job.estimate_sent_approval && (
                           <span style={{ color: "#888" }}>
@@ -191,7 +195,7 @@ export function JobsDetailHeader({ job, bodyshop, disabled, insertAuditTrail, is
                       <Checkbox
                         checked={!!job.estimate_approved}
                         onChange={(e) => handleCheckboxChange("estimate_approved", e.target.checked)}
-                        disabled={disabled}
+                        disabled={disabled || isPartsEntry}
                       >
                         {job.estimate_approved && (
                           <span style={{ color: "#888" }}>
@@ -236,7 +240,7 @@ export function JobsDetailHeader({ job, bodyshop, disabled, insertAuditTrail, is
           <Card
             style={{ height: "100%" }}
             title={
-              disabled ? (
+              disabled || isPartsEntry ? (
                 <>{ownerTitle.length > 0 ? ownerTitle : t("owner.labels.noownerinfo")}</>
               ) : (
                 <Link to={`/manage/owners/${job.owner.id}`}>
@@ -247,14 +251,14 @@ export function JobsDetailHeader({ job, bodyshop, disabled, insertAuditTrail, is
           >
             <div>
               <DataLabel key="2" label={t("jobs.fields.ownr_ph1")}>
-                {disabled ? (
+                {disabled || isPartsEntry ? (
                   <PhoneNumberFormatter>{job.ownr_ph1}</PhoneNumberFormatter>
                 ) : (
                   <ChatOpenButton phone={job.ownr_ph1} jobid={job.id} />
                 )}
               </DataLabel>
               <DataLabel key="22" label={t("jobs.fields.ownr_ph2")}>
-                {disabled ? (
+                {disabled || isPartsEntry ? (
                   <PhoneNumberFormatter>{job.ownr_ph2}</PhoneNumberFormatter>
                 ) : (
                   <ChatOpenButton phone={job.ownr_ph2} jobid={job.id} />
@@ -266,7 +270,7 @@ export function JobsDetailHeader({ job, bodyshop, disabled, insertAuditTrail, is
                 } ${job.ownr_st || ""} ${job.ownr_zip || ""}`}
               </DataLabel>
               <DataLabel key="4" label={t("owners.fields.ownr_ea")}>
-                {disabled ? (
+                {disabled || isPartsEntry ? (
                   <>{job.ownr_ea || ""}</>
                 ) : job.ownr_ea ? (
                   <a href={`mailto:${job.ownr_ea}`}>{job.ownr_ea}</a>
@@ -306,7 +310,7 @@ export function JobsDetailHeader({ job, bodyshop, disabled, insertAuditTrail, is
               </DataLabel>
               <DataLabel key="4" label={t("vehicles.fields.v_vin")}>
                 <VehicleVinDisplay>{`${job.v_vin || t("general.labels.na")}`}</VehicleVinDisplay>
-                {bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid ? (
+                {bodyshopHasDmsKey(bodyshop) ? (
                   job.v_vin?.length !== 17 ? (
                     <WarningFilled style={{ color: "tomato", marginLeft: ".3rem" }} />
                   ) : null
@@ -316,7 +320,7 @@ export function JobsDetailHeader({ job, bodyshop, disabled, insertAuditTrail, is
               <DataLabel label={t("jobs.labels.relatedros")}>
                 <JobsRelatedRos jobid={job.id} job={job} disabled={disabled} />
               </DataLabel>
-              {job.vehicle && job.vehicle.notes && (
+              {job.vehicle?.notes && (
                 <DataLabel
                   label={t("vehicles.fields.notes")}
                   valueStyle={{ whiteSpace: "pre-wrap" }}
@@ -326,7 +330,7 @@ export function JobsDetailHeader({ job, bodyshop, disabled, insertAuditTrail, is
                   {job.vehicle.notes}
                 </DataLabel>
               )}
-              {job.vehicle && job.vehicle.v_paint_codes && (
+              {job.vehicle?.v_paint_codes && (
                 <DataLabel label={t("vehicles.fields.v_paint_codes", { number: "" })}>
                   <span style={{ whiteSpace: "pre" }}>
                     {Object.keys(job.vehicle.v_paint_codes)
@@ -354,6 +358,14 @@ export function JobsDetailHeader({ job, bodyshop, disabled, insertAuditTrail, is
             >
               <div>
                 <JobEmployeeAssignments job={job} />
+                {job.admin_clerk && (
+                  <>
+                    <Divider style={{ margin: ".5rem" }} />
+                    <DataLabel label={t("jobs.fields.admin_clerk")}>
+                      {employeeData?.displayName ?? job.admin_clerk}
+                    </DataLabel>
+                  </>
+                )}
                 <Divider style={{ margin: ".5rem" }} />
                 <DataLabel label={t("jobs.labels.labor_hrs")}>
                   {bodyHrs.toFixed(1)} / {refinishHrs.toFixed(1)} / {(bodyHrs + refinishHrs).toFixed(1)}

client/src/components/jobs-documents-local-gallery/jobs-documents-local-gallery.external.component.jsx

@@ -1,11 +1,12 @@
-import { useEffect } from "react";
-import { Gallery } from "react-grid-gallery";
+import { useEffect, useMemo, useState, useCallback } from "react";
+import LocalMediaGrid from "./local-media-grid.component";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { getJobMedia } from "../../redux/media/media.actions";
 import { selectAllMedia } from "../../redux/media/media.selectors";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import LoadingSpinner from "../loading-spinner/loading-spinner.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -18,41 +19,127 @@ const mapDispatchToProps = (dispatch) => ({
 
 export default connect(mapStateToProps, mapDispatchToProps)(JobDocumentsLocalGalleryExternal);
 
-function JobDocumentsLocalGalleryExternal({ jobId, externalMediaState, getJobMedia, allMedia }) {
+/**
+ * JobDocumentsLocalGalleryExternal
+ * Fetches and displays job-related image media using the custom LocalMediaGrid.
+ *
+ * Props:
+ *  - jobId: string | number (required to fetch media)
+ *  - externalMediaState: [imagesArray, setImagesFn] (state lifted to parent for shared selection)
+ *  - getJobMedia: dispatching function to retrieve media for a job
+ *  - allMedia: redux slice keyed by jobId containing raw media records
+ *  - context: "chat" | "email" | other string used to drive grid behavior
+ *
+ * Notes:
+ *  - The previous third-party gallery required a remount key (openVersion); custom grid no longer does.
+ *  - Selection flags are preserved when media refreshes.
+ *  - Loading state ends after transformation regardless of whether any images were found.
+ */
+function JobDocumentsLocalGalleryExternal({ jobId, externalMediaState, getJobMedia, allMedia, context = "chat" }) {
   const [galleryImages, setgalleryImages] = externalMediaState;
-  const { t } = useTranslation();
+  const [isLoading, setIsLoading] = useState(false);
+  const { t } = useTranslation(); // i18n hook retained if future translations are added
+  const DEBUG_LOCAL_GALLERY = false; // flip to true for verbose console logging
 
+  // Transform raw media record into a normalized image object consumed by the grid.
+  const transformMediaToImages = useCallback((raw) => {
+    return raw
+      .filter((m) => m.type?.mime?.startsWith("image"))
+      .map((m) => ({
+        ...m,
+        src: m.thumbnail,
+        thumbnail: m.thumbnail,
+        fullsize: m.src,
+        width: 225,
+        height: 225,
+        thumbnailWidth: 225,
+        thumbnailHeight: 225,
+        caption: m.filename || m.key
+      }));
+  }, []);
+
+  // Fetch media when jobId changes (network request triggers Redux update -> documents memo recalculates).
   useEffect(() => {
-    if (jobId) {
-      getJobMedia(jobId);
-    }
+    if (!jobId) return;
+    setIsLoading(true);
+    getJobMedia(jobId);
   }, [jobId, getJobMedia]);
 
-  useEffect(() => {
-    let documents = allMedia?.[jobId]
-      ? allMedia[jobId].reduce((acc, val) => {
-          if (val.type?.mime && val.type.mime.startsWith("image")) {
-            acc.push({ ...val, src: val.thumbnail, fullsize: val.src });
-          }
-          return acc;
-        }, [])
-      : [];
-    console.log(
-      "🚀 ~ file: jobs-documents-local-gallery.external.component.jsx:48 ~ useEffect ~ documents:",
-      documents
-    );
+  // Memo: transform raw redux media into gallery documents.
+  const documents = useMemo(
+    () => transformMediaToImages(allMedia?.[jobId] || []),
+    [allMedia, jobId, transformMediaToImages]
+  );
 
-    setgalleryImages(documents);
-  }, [allMedia, jobId, setgalleryImages, t]);
+  // Sync transformed documents into external state while preserving selection flags.
+  useEffect(() => {
+    const prevSelection = new Map(galleryImages.map((p) => [p.filename, p.isSelected]));
+    const nextImages = documents.map((d) => ({ ...d, isSelected: prevSelection.get(d.filename) || false }));
+    // Micro-optimization: if array length and each filename + selection flag match, skip creating a new array.
+    if (galleryImages.length === nextImages.length) {
+      let identical = true;
+      for (let i = 0; i < nextImages.length; i++) {
+        if (
+          galleryImages[i].filename !== nextImages[i].filename ||
+          galleryImages[i].isSelected !== nextImages[i].isSelected
+        ) {
+          identical = false;
+          break;
+        }
+      }
+      if (identical) {
+        setIsLoading(false); // ensure loading stops even on no-change
+        if (DEBUG_LOCAL_GALLERY) {
+          console.log("[LocalGallery] documents unchanged", { jobId, count: documents.length });
+        }
+        return;
+      }
+    }
+    setgalleryImages(nextImages);
+    setIsLoading(false); // stop loading after transform regardless of emptiness
+    if (DEBUG_LOCAL_GALLERY) {
+      console.log("[LocalGallery] documents transformed", { jobId, count: documents.length });
+    }
+  }, [documents, setgalleryImages, galleryImages, jobId, DEBUG_LOCAL_GALLERY]);
+
+  // Toggle handler (stable reference)
+  const handleToggle = useCallback(
+    (idx) => {
+      setgalleryImages((imgs) => imgs.map((g, gIdx) => (gIdx === idx ? { ...g, isSelected: !g.isSelected } : g)));
+    },
+    [setgalleryImages]
+  );
+
+  const messageStyle = { textAlign: "center", padding: "1rem" }; // retained for potential future states
+
+  if (!jobId) {
+    return (
+      <div aria-label="media gallery unavailable" style={{ position: "relative", minHeight: 80 }}>
+        <div style={messageStyle}>No job selected.</div>
+      </div>
+    );
+  }
 
   return (
-    <div className="clearfix">
-      <Gallery
-        images={galleryImages}
-        onSelect={(index) => {
-          setgalleryImages(galleryImages.map((g, idx) => (index === idx ? { ...g, isSelected: !g.isSelected } : g)));
-        }}
-      />
+    <div
+      className="clearfix"
+      style={{ position: "relative", minHeight: 80 }}
+      data-jobid={jobId}
+      aria-label={`media gallery for job ${jobId}`}
+    >
+      {isLoading && galleryImages.length === 0 && (
+        <div className="local-gallery-loading" style={messageStyle} role="status" aria-live="polite">
+          <LoadingSpinner />
+        </div>
+      )}
+      {galleryImages.length > 0 && (
+        <LocalMediaGrid images={galleryImages} minColumns={4} context={context} onToggle={handleToggle} />
+      )}
+      {galleryImages.length > 0 && (
+        <div style={{ fontSize: 10, color: "#888", marginTop: 4 }} aria-live="off">
+          {`${t("general.labels.media")}: ${galleryImages.length}`}
+        </div>
+      )}
     </div>
   );
 }

client/src/components/jobs-documents-local-gallery/local-media-grid.component.jsx

@@ -0,0 +1,207 @@
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+
+/**
+ * LocalMediaGrid
+ * Lightweight replacement for react-grid-gallery inside the chat popover.
+ * Props:
+ *  - images: Array<{ src, fullsize, filename?, isSelected? }>
+ *  - onToggle(index)
+ */
+export function LocalMediaGrid({
+  images,
+  onToggle,
+  thumbSize = 100,
+  gap = 8,
+  minColumns = 3,
+  maxColumns = 12,
+  context = "default"
+}) {
+  const containerRef = useRef(null);
+  const [cols, setCols] = useState(() => {
+    // Pre-calc initial columns to stabilize layout before images render
+    const count = images.length;
+    if (count === 0) return minColumns; // reserve minimal structure
+    if (count === 1 && context === "chat") return 1;
+    return Math.min(maxColumns, Math.max(minColumns, count));
+  });
+  const [justifyMode, setJustifyMode] = useState("start");
+  const [distributeExtra, setDistributeExtra] = useState(false);
+  const [loadedMap, setLoadedMap] = useState(() => new Map()); // filename -> boolean loaded
+
+  const handleImageLoad = useCallback((key) => {
+    setLoadedMap((prev) => {
+      if (prev.get(key)) return prev; // already loaded
+      const next = new Map(prev);
+      next.set(key, true);
+      return next;
+    });
+  }, []);
+
+  // Dynamically compute columns for all contexts to avoid auto-fit stretching gaps in email overlay
+  useEffect(() => {
+    const el = containerRef.current;
+    if (!el) return;
+    const compute = () => {
+      // For non-chat (email / default) we rely on CSS auto-fill; only chat needs explicit column calc & distribution logic.
+      if (context !== "chat") {
+        setCols(images.length || 0); // retain count for ARIA semantics; not used for template when non-chat.
+        setDistributeExtra(false);
+        return;
+      }
+      const width = el.clientWidth;
+      if (!width) return;
+      const perCol = thumbSize + gap; // track + gap space
+      const fitCols = Math.max(1, Math.floor((width + gap) / perCol));
+      // base desired columns: up to how many images we have and how many fit
+      let finalCols = Math.min(images.length || 1, fitCols, maxColumns);
+      // enforce minimum columns to reserve layout skeleton (except when fewer images)
+      if (finalCols < minColumns && images.length >= minColumns) {
+        finalCols = Math.min(fitCols, minColumns);
+      }
+      // chat-specific clamp
+      if (context === "chat") {
+        finalCols = Math.min(finalCols, 4);
+      }
+      if (finalCols < 1) finalCols = 1;
+      setCols(finalCols);
+      setJustifyMode("start");
+
+      // Determine if there is leftover horizontal space that can't fit another column.
+      // Only distribute when we're at the maximum allowed columns for the context and images exceed or meet that count.
+      const contextMax = context === "chat" ? 4 : maxColumns;
+      const baseWidthNeeded = finalCols * thumbSize + (finalCols - 1) * gap;
+      const leftover = width - baseWidthNeeded;
+      const atMaxColumns = finalCols === contextMax && images.length >= finalCols;
+      // leftover must be positive but less than space needed for an additional column (perCol)
+      if (atMaxColumns && leftover > 0 && leftover < perCol) {
+        setDistributeExtra(true);
+      } else {
+        setDistributeExtra(false);
+      }
+    };
+    compute();
+    const ro = new ResizeObserver(() => compute());
+    ro.observe(el);
+    return () => ro.disconnect();
+  }, [images.length, thumbSize, gap, minColumns, maxColumns, context]);
+
+  const gridTemplateColumns = useMemo(() => {
+    if (context === "chat") {
+      if (distributeExtra) {
+        return `repeat(${cols}, minmax(${thumbSize}px, 1fr))`;
+      }
+      return `repeat(${cols}, ${thumbSize}px)`;
+    }
+    // Non-chat contexts: allow browser to auto-fill columns; fixed min (thumbSize) ensures squares; tracks expand to distribute remaining space.
+    return `repeat(auto-fill, minmax(${thumbSize}px, 1fr))`;
+  }, [cols, thumbSize, distributeExtra, context]);
+  const stableWidth = undefined; // no fixed width
+
+  const handleKeyDown = useCallback(
+    (e, idx) => {
+      if (e.key === "Enter" || e.key === " ") {
+        e.preventDefault();
+        onToggle(idx);
+      }
+    },
+    [onToggle]
+  );
+
+  return (
+    <div
+      className="local-media-grid"
+      style={{
+        display: "grid",
+        gridTemplateColumns,
+        gap,
+        maxHeight: 420,
+        overflowY: "auto",
+        overflowX: "hidden",
+        padding: 4,
+        justifyContent: justifyMode,
+        width: stableWidth
+      }}
+      ref={containerRef}
+      role="list"
+      aria-label="media thumbnails"
+    >
+      {images.map((img, idx) => (
+        <div
+          key={img.filename || idx}
+          role="listitem"
+          tabIndex={0}
+          aria-label={img.filename || `image ${idx + 1}`}
+          onClick={() => onToggle(idx)}
+          onKeyDown={(e) => handleKeyDown(e, idx)}
+          style={{
+            position: "relative",
+            border: img.isSelected ? "2px solid #1890ff" : "1px solid #ccc",
+            outline: "none",
+            borderRadius: 4,
+            cursor: "pointer",
+            background: "#fafafa",
+            width: thumbSize,
+            height: thumbSize,
+            overflow: "hidden",
+            boxSizing: "border-box"
+          }}
+        >
+          {(() => {
+            const key = img.filename || idx;
+            const loaded = loadedMap.get(key) === true;
+            return (
+              <>
+                {!loaded && (
+                  <div
+                    aria-hidden="true"
+                    style={{
+                      position: "absolute",
+                      inset: 0,
+                      background: "#f0f0f0",
+                      display: "flex",
+                      alignItems: "center",
+                      justifyContent: "center",
+                      fontSize: 10,
+                      color: "#bbb"
+                    }}
+                  >
+                    {/* simple skeleton; no shimmer to reduce cost */}…
+                  </div>
+                )}
+                <img
+                  src={img.src}
+                  alt={img.filename || img.caption || "thumbnail"}
+                  loading="lazy"
+                  onLoad={() => handleImageLoad(key)}
+                  style={{
+                    width: thumbSize,
+                    height: thumbSize,
+                    objectFit: "cover",
+                    display: "block",
+                    borderRadius: 4,
+                    opacity: loaded ? 1 : 0,
+                    transition: "opacity .25s ease"
+                  }}
+                />
+              </>
+            );
+          })()}
+          {img.isSelected && (
+            <div
+              aria-hidden="true"
+              style={{
+                position: "absolute",
+                inset: 0,
+                background: "rgba(24,144,255,0.45)",
+                borderRadius: 4
+              }}
+            />
+          )}
+        </div>
+      ))}
+      {/* No placeholders needed; layout uses auto-fit for non-chat or fixed columns for chat */}
+    </div>
+  );
+}
+
+export default LocalMediaGrid;

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

@@ -15,6 +15,7 @@ import { alphaSort, statusSort } from "../../utils/sorters";
 import useLocalStorage from "../../utils/useLocalStorage";
 import StartChatButton from "../chat-open-button/chat-open-button.component";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 
 const mapStateToProps = createStructuredSelector({
   //currentUser: selectCurrentUser
@@ -177,6 +178,7 @@ export function JobsList({ bodyshop, refetch, loading, jobs, total }) {
     }
     setFilter(filters);
     history({ search: queryString.stringify(search) });
+    logImEXEvent("jobs_all_list_sort_filter", { pagination, filters, sorter });
   };
 
   useEffect(() => {

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

@@ -17,6 +17,7 @@ import AlertComponent from "../alert/alert.component";
 import ChatOpenButton from "../chat-open-button/chat-open-button.component";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
 import { OwnerNameDisplayFunction } from "./../owner-name-display/owner-name-display.component";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -67,6 +68,7 @@ export function JobsList({ bodyshop }) {
     : [];
 
   const handleTableChange = (pagination, filters, sorter) => {
+    logImEXEvent("jobs_list_sort_filter", { pagination, filters, sorter });
     setState({ ...state, sortedInfo: sorter });
     setFilter(filters);
   };
@@ -164,7 +166,7 @@ export function JobsList({ bodyshop }) {
             .filter(onlyUnique)
             .map((s) => {
               return {
-                text: s || "No Status*",
+                text: s || t("dashboard.errors.status"),
                 value: [s]
               };
             })

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

@@ -165,7 +165,7 @@ export function JobsReadyList({ bodyshop }) {
             .filter(onlyUnique)
             .map((s) => {
               return {
-                text: s || "No Status*",
+                text: s || t("dashboard.errors.status"),
                 value: [s]
               };
             })

client/src/components/jobs-related-ros/jobs-related-ros.component.jsx

@@ -1,8 +1,18 @@
 import { Space, Tag } from "antd";
 import { Link } from "react-router-dom";
+import { createStructuredSelector } from "reselect";
+import { selectIsPartsEntry } from "../../redux/application/application.selectors.js";
+import { connect } from "react-redux";
+import getPartsBasePath from "../../utils/getPartsBasePath.js";
 
-export default function JobsRelatedRos({ job, disabled }) {
+const mapStateToProps = createStructuredSelector({
+  isPartsEntry: selectIsPartsEntry
+});
+
+function JobsRelatedRos({ job, disabled, isPartsEntry }) {
   if (!(job?.vehicle && job.vehicle.jobs)) return null;
+  const basePath = getPartsBasePath(isPartsEntry);
+
   return (
     <Space wrap>
       {job.vehicle.jobs
@@ -12,7 +22,7 @@ export default function JobsRelatedRos({ job, disabled }) {
             {disabled ? (
               <>{`${j.ro_number || "N/A"}${j.clm_no ? ` | ${j.clm_no}` : ""}${j.status ? ` | ${j.status}` : ""}`}</>
             ) : (
-              <Link to={`/manage/jobs/${j?.id}`}>{`${j.ro_number || "N/A"}${
+              <Link to={`${basePath}/jobs/${j?.id}`}>{`${j.ro_number || "N/A"}${
                 j.clm_no ? ` | ${j.clm_no}` : ""
               }${j.status ? ` | ${j.status}` : ""}`}</Link>
             )}
@@ -21,3 +31,4 @@ export default function JobsRelatedRos({ job, disabled }) {
     </Space>
   );
 }
+export default connect(mapStateToProps)(JobsRelatedRos);

client/src/components/labor-allocations-table/labor-allocations-table.utility.js

@@ -1,4 +1,5 @@
 import i18next from "i18next";
+import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
 
 export const CalculateAllocationsTotals = (bodyshop, joblines, timetickets, adjustments = []) => {
   const responsibilitycenters = bodyshop.md_responsibility_centers;
@@ -14,10 +15,9 @@ export const CalculateAllocationsTotals = (bodyshop, joblines, timetickets, adju
   const r = allCodes.reduce((acc, value) => {
     const r = {
       opcode: value,
-      cost_center:
-        bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber
-          ? i18next.t(`joblines.fields.lbr_types.${value && value.toUpperCase()}`)
-          : responsibilitycenters.defaults.costs[value],
+      cost_center: bodyshopHasDmsKey(bodyshop)
+        ? i18next.t(`joblines.fields.lbr_types.${value && value.toUpperCase()}`)
+        : responsibilitycenters.defaults.costs[value],
       mod_lbr_ty: value,
       total: joblines.reduce((acc2, val2) => {
         return val2.mod_lbr_ty === value ? acc2 + val2.mod_lb_hrs : acc2;

client/src/components/notification-center/notification-center.container.jsx

@@ -39,11 +39,15 @@ const NotificationCenterContainer = ({ visible, onClose, bodyshop, unreadCount,
     return showUnreadOnly ? { ...baseWhereClause, read: { _is_null: true } } : baseWhereClause;
   }, [baseWhereClause, showUnreadOnly]);
 
+  // before you call useQuery, compute skip once so you can reuse it
+  const skipQuery = !userAssociationId || !isEmployee;
+
   const {
     data,
     fetchMore,
     loading: queryLoading,
-    refetch
+    refetch,
+    error
   } = useQuery(GET_NOTIFICATIONS, {
     variables: {
       limit: INITIAL_NOTIFICATIONS,
@@ -52,14 +56,26 @@ const NotificationCenterContainer = ({ visible, onClose, bodyshop, unreadCount,
     },
     fetchPolicy: "cache-and-network",
     notifyOnNetworkStatusChange: true,
+    errorPolicy: "all",
     pollInterval: isConnected ? 0 : day.duration(NOTIFICATION_POLL_INTERVAL_SECONDS, "seconds").asMilliseconds(),
-    skip: !userAssociationId || !isEmployee,
-    onError: (err) => {
-      console.error(`Error polling Notifications: ${err?.message || ""}`);
-      setTimeout(() => refetch(), day.duration(2, "seconds").asMilliseconds());
-    }
+    skip: skipQuery
   });
 
+  // Replace onError with a side-effect that reacts to the hook’s `error`
+  useEffect(() => {
+    if (!error || skipQuery) return;
+
+    console.error(`Error polling Notifications: ${error?.message || ""}`);
+
+    const t = setTimeout(() => {
+      // Guard: if component unmounted or query now skipped, do nothing
+      if (!skipQuery) {
+        refetch().catch((e) => console.error("Refetch failed:", e?.message || e));
+      }
+    }, day.duration(2, "seconds").asMilliseconds());
+
+    return () => clearTimeout(t);
+  }, [error, refetch, skipQuery]);
   useEffect(() => {
     const handleClickOutside = (event) => {
       // Prevent open + close behavior from the header

client/src/components/owner-detail-form/owner-detail-form.container.jsx

@@ -1,17 +1,18 @@
-import { Button, Form, Popconfirm } from "antd";
 import { PageHeader } from "@ant-design/pro-layout";
-import { useEffect, useState } from "react";
-import { useNavigate } from "react-router-dom";
 import { useApolloClient, useMutation } from "@apollo/client";
+import { Button, Form, Popconfirm } from "antd";
+import { phone } from "phone"; // Import phone utility for formatting
+import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
+import { useNavigate } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
+import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
+import { logImEXEvent } from "../../firebase/firebase.utils.js";
 import { DELETE_OWNER, UPDATE_OWNER } from "../../graphql/owners.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors"; // Adjust path
 import { phoneNumberOptOutService } from "../../utils/phoneOptOutService.js"; // Adjust path
 import OwnerDetailFormComponent from "./owner-detail-form.component";
-import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
-import { phone } from "phone"; // Import phone utility for formatting
 
 // Connect to Redux to access bodyshop
 const mapStateToProps = createStructuredSelector({
@@ -55,6 +56,7 @@ function OwnerDetailFormContainer({ owner, refetch, bodyshop }) {
 
   const handleDelete = async () => {
     setLoading(true);
+    logImEXEvent("owner_delete", {});
     try {
       const result = await deleteOwner({
         variables: { id: owner.id }
@@ -84,6 +86,7 @@ function OwnerDetailFormContainer({ owner, refetch, bodyshop }) {
 
   const handleFinish = async (values) => {
     setLoading(true);
+    logImEXEvent("owner_update", {});
     try {
       const result = await updateOwner({
         variables: { ownerId: owner.id, owner: values }

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

@@ -44,6 +44,7 @@ export async function checkPartnerStatus(bodyshop) {
     //     bodyshop &&
     //     (bodyshop.cdk_dealerid ||
     //       bodyshop.pbs_serialnumber ||
+    //       bodyshop.rr_dealerid ||
     //       bodyshop.accountingconfig.qbo)
     //   )
     // ) {

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

@@ -28,6 +28,7 @@ import PartsOrderDeleteLine from "../parts-order-delete-line/parts-order-delete-
 import PartsOrderLineBackorderButton from "../parts-order-line-backorder-button/parts-order-line-backorder-button.component";
 import PartsReceiveModalContainer from "../parts-receive-modal/parts-receive-modal.container";
 import PrintWrapper from "../print-wrapper/print-wrapper.component";
+import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
 
 const mapStateToProps = createStructuredSelector({
   jobRO: selectJobReadOnly,
@@ -196,7 +197,7 @@ export function PartsOrderListTableDrawerComponent({
                     quantity: pol.quantity,
                     actual_price: pol.act_price,
                     cost_center: pol.jobline?.part_type
-                      ? bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid
+                      ? bodyshopHasDmsKey(bodyshop)
                         ? pol.jobline.part_type !== "PAE"
                           ? pol.jobline.part_type
                           : null

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

@@ -20,6 +20,7 @@ import PartsReceiveModalContainer from "../parts-receive-modal/parts-receive-mod
 import PrintWrapper from "../print-wrapper/print-wrapper.component";
 import PartsOrderDrawer from "./parts-order-list-table-drawer.component";
 import ShareToTeamsButton from "../share-to-teams/share-to-teams.component.jsx";
+import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
 
 const mapStateToProps = createStructuredSelector({
   jobRO: selectJobReadOnly,
@@ -69,6 +70,7 @@ export function PartsOrderListTableComponent({
 
   const parts_orders = billsQuery.data ? billsQuery.data.parts_orders : [];
   const { refetch } = billsQuery;
+
   const recordActions = (record, showView = false) => (
     <Space direction="horizontal" wrap>
       <ShareToTeamsButton
@@ -172,7 +174,7 @@ export function PartsOrderListTableComponent({
                       actual_price: pol.act_price,
 
                       cost_center: pol.jobline?.part_type
-                        ? bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid
+                        ? bodyshopHasDmsKey(bodyshop)
                           ? pol.jobline.part_type !== "PAE"
                             ? pol.jobline.part_type
                             : null
@@ -227,15 +229,21 @@ export function PartsOrderListTableComponent({
       sorter: (a, b) => a.order_date - b.order_date,
       sortOrder: state.sortedInfo.columnKey === "order_date" && state.sortedInfo.order,
       render: (text, record) => <DateFormatter>{record.order_date}</DateFormatter>
-    },
-    {
+    }
+  ];
+
+  if (!isPartsEntry) {
+    columns.push({
       title: t("parts_orders.fields.return"),
       dataIndex: "return",
       key: "return",
       sorter: (a, b) => a.return - b.return,
       sortOrder: state.sortedInfo.columnKey === "return" && state.sortedInfo.order,
       render: (text, record) => <Checkbox checked={record.return} />
-    },
+    });
+  }
+
+  columns.push(
     {
       title: t("parts_orders.fields.deliver_by"),
       dataIndex: "deliver_by",
@@ -256,7 +264,7 @@ export function PartsOrderListTableComponent({
       render: (text, record) => recordActions(record, true),
       id: "parts-order-list-table-actions"
     }
-  ];
+  );
 
   const handleTableChange = (pagination, filters, sorter) => {
     setState({ ...state, filteredInfo: filters, sortedInfo: sorter });

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

@@ -1,7 +1,7 @@
 import { DownOutlined } from "@ant-design/icons";
 import { Dropdown, InputNumber, Space } from "antd";
 import { useTranslation } from "react-i18next";
-
+import { logImEXEvent } from "../../firebase/firebase.utils";
 export default function PartsOrderModalPriceChange({ form, field }) {
   const { t } = useTranslation();
   const menu = {
@@ -63,6 +63,7 @@ export default function PartsOrderModalPriceChange({ form, field }) {
       }
     ],
     onClick: ({ key }) => {
+      logImEXEvent("parts_order_manual_discount", {});
       if (key === "custom") return;
       const values = form.getFieldsValue();
       const { parts_order_lines } = values;

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

@@ -11,16 +11,27 @@ import LayoutFormRow from "../layout-form-row/layout-form-row.component";
 import VendorSearchSelect from "../vendor-search-select/vendor-search-select.component";
 import PartsOrderModalPriceChange from "./parts-order-modal-price-change.component";
 import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
+import { selectIsPartsEntry } from "../../redux/application/application.selectors.js";
 
 const mapStateToProps = createStructuredSelector({
-  bodyshop: selectBodyshop
+  bodyshop: selectBodyshop,
+  isPartsEntry: selectIsPartsEntry
 });
 const mapDispatchToProps = () => ({
   //setUserLanguage: language => dispatch(setUserLanguage(language))
 });
 export default connect(mapStateToProps, mapDispatchToProps)(PartsOrderModalComponent);
 
-export function PartsOrderModalComponent({ bodyshop, vendorList, sendTypeState, isReturn, preferredMake, job, form }) {
+export function PartsOrderModalComponent({
+  bodyshop,
+  vendorList,
+  sendTypeState,
+  isReturn,
+  preferredMake,
+  job,
+  form,
+  isPartsEntry
+}) {
   const [sendType, setSendType] = sendTypeState;
 
   const {
@@ -83,7 +94,7 @@ export function PartsOrderModalComponent({ bodyshop, vendorList, sendTypeState,
             </Space>
           </Tag>
         )}
-        {!isReturn && (
+        {!isReturn && !isPartsEntry && (
           <Form.Item
             name="removefrompartsqueue"
             label={t("parts_orders.labels.removefrompartsqueue")}
@@ -92,7 +103,7 @@ export function PartsOrderModalComponent({ bodyshop, vendorList, sendTypeState,
             <Checkbox />
           </Form.Item>
         )}
-        {OEConnection.treatment === "on" && !isReturn && (
+        {OEConnection.treatment === "on" && !isReturn && !isPartsEntry && (
           <Form.Item name="is_quote" label={t("parts_orders.labels.is_quote")} valuePropName="checked">
             <Checkbox />
           </Form.Item>
@@ -249,7 +260,7 @@ export function PartsOrderModalComponent({ bodyshop, vendorList, sendTypeState,
               <Radio disabled={is_quote} value={"p"}>
                 {t("parts_orders.labels.print")}
               </Radio>
-              {OEConnection.treatment === "on" && !isReturn && (
+              {OEConnection.treatment === "on" && !isReturn && !isPartsEntry && (
                 <Radio value={"oec"}>{t("parts_orders.labels.oec")}</Radio>
               )}
             </Radio.Group>

client/src/components/parts-queue-card/parts-queue-card.component.jsx

@@ -8,6 +8,7 @@ import AlertComponent from "../alert/alert.component";
 import JobsDetailHeader from "../jobs-detail-header/jobs-detail-header.component";
 import LoadingSpinner from "../loading-spinner/loading-spinner.component";
 import PartsQueueJobLinesComponent from "./parts-queue-job-lines.component";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 
 export default function PartsQueueDetailCard() {
   const selectedBreakpoint = Object.entries(Grid.useBreakpoint())
@@ -37,6 +38,8 @@ export default function PartsQueueDetailCard() {
   const { t } = useTranslation();
   const handleDrawerClose = () => {
     delete searchParams.selected;
+    logImEXEvent("parts_queue_drawer", {});
+
     history({
       search: queryString.stringify({
         ...searchParams

client/src/components/parts-queue-card/parts-queue-job-lines.component.jsx

@@ -145,7 +145,7 @@ export function PartsQueueJobLinesComponent({ loading, jobLines }) {
             .filter(onlyUnique)
             .map((s) => {
               return {
-                text: s || "No Status*",
+                text: s || t("dashboard.errors.status"),
                 value: [s]
               };
             })) ||

client/src/components/parts-queue-list/parts-queue.list.component.jsx

@@ -20,6 +20,7 @@ import JobPartsQueueCount from "../job-parts-queue-count/job-parts-queue-count.c
 import JobRemoveFromPartsQueue from "../job-remove-from-parst-queue/job-remove-from-parts-queue.component";
 import OwnerNameDisplay, { OwnerNameDisplayFunction } from "../owner-name-display/owner-name-display.component";
 import ProductionListColumnComment from "../production-list-columns/production-list-columns.comment.component";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -73,6 +74,7 @@ export function PartsQueueListComponent({ bodyshop }) {
     }
     setFilter(filters);
     history({ search: queryString.stringify(searchParams) });
+    logImEXEvent("parts_queue_sort_filter", { pagination, filters, sorter });
   };
 
   const handleOnRowClick = (record) => {
@@ -169,7 +171,7 @@ export function PartsQueueListComponent({ bodyshop }) {
       filters:
         bodyshop.md_ro_statuses.active_statuses.map((s) => {
           return {
-            text: s || "No Status*",
+            text: s || t("dashboard.errors.status"),
             value: [s]
           };
         }) || [],
@@ -233,7 +235,7 @@ export function PartsQueueListComponent({ bodyshop }) {
       title: t("jobs.fields.partsstatus"),
       dataIndex: "partsstatus",
       key: "partsstatus",
-      render: (text, record) => <JobPartsQueueCount style={{ minWidth: "10rem" }} parts={record.joblines_status} />
+      render: (text, record) => <JobPartsQueueCount parts={record.joblines_status} />
     },
     {
       title: t("jobs.fields.comment"),

client/src/components/production-board-filters/production-board-filters.component.jsx

@@ -10,6 +10,7 @@ import {
 } from "@ant-design/icons";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import EmployeeSearchSelectComponent from "../employee-search-select/employee-search-select.component";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -26,10 +27,12 @@ export function ProductionBoardFilters({ bodyshop, filter, setFilter, loading })
 
   const toggleAlertFilter = () => {
     setFilter({ ...filter, alert: !filter.alert });
+    logImEXEvent("visual_board_filter_alert", {});
   };
 
   const toggleUnassignedFilter = () => {
     setFilter({ ...filter, unassigned: !filter.unassigned });
+    logImEXEvent("visual_board_filter_unassigned", {});
   };
 
   return (
@@ -40,6 +43,7 @@ export function ProductionBoardFilters({ bodyshop, filter, setFilter, loading })
         placeholder={t("general.labels.search")}
         onChange={(e) => {
           setFilter({ ...filter, search: e.target.value });
+          logImEXEvent("visual_board_filter_search", { search: e.target.value });
         }}
       />
       <EmployeeSearchSelectComponent
@@ -47,7 +51,10 @@ export function ProductionBoardFilters({ bodyshop, filter, setFilter, loading })
         options={bodyshop.employees.filter((e) => e.active)}
         value={filter.employeeId}
         placeholder={t("production.labels.employeesearch")}
-        onChange={(emp) => setFilter({ ...filter, employeeId: emp })}
+        onChange={(emp) => {
+          setFilter({ ...filter, employeeId: emp });
+          logImEXEvent("visual_board_filter_alert", { employeeId: emp });
+        }}
         allowClear
       />
       <Button

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

@@ -5,6 +5,7 @@ import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { FaRegStickyNote } from "react-icons/fa";
 import { UPDATE_JOB } from "../../graphql/jobs.queries";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 
 export default function ProductionListColumnComment({ record }) {
   const { t } = useTranslation();
@@ -28,6 +29,7 @@ export default function ProductionListColumnComment({ record }) {
     }).then(() => {
       if (record.refetch) record.refetch();
     });
+    logImEXEvent("job_add_comment", { estimators: e });
   };
 
   const handleChange = (e) => {

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

@@ -34,8 +34,9 @@ const getEmployeeName = (employeeId, employees) => {
   return employee ? `${employee.first_name} ${employee.last_name}` : "";
 };
 
-const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatments }) => {
+const productionListColumnsData = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatments }) => {
   const { Enhanced_Payroll } = treatments;
+
   return [
     {
       title: i18n.t("jobs.actions.viewdetail"),
@@ -313,7 +314,7 @@ const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatme
         activeStatuses
           ?.map((s) => {
             return {
-              text: s || "No Status*",
+              text: s || i18n.t("dashboard.errors.status"),
               value: [s]
             };
           })
@@ -584,4 +585,4 @@ const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatme
     }
   ];
 };
-export default r;
+export default productionListColumnsData;

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

@@ -18,6 +18,7 @@ import ProductionListDetail from "../production-list-detail/production-list-deta
 import { ProductionListConfigManager } from "./production-list-config-manager.component.jsx";
 import ProductionListPrint from "./production-list-print.component";
 import ResizeableTitle from "./production-list-table.resizeable.component";
+import { logImEXEvent } from "../../firebase/firebase.utils.js";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -114,6 +115,7 @@ export function ProductionListTable({ loading, data, refetch, bodyshop, technici
       setState(newState);
       setHasUnsavedChanges(true);
     }
+    logImEXEvent("production_list_sort_filter", { pagination, filters, sorter });
   };
 
   const onDragEnd = (fromIndex, toIndex) => {
@@ -134,6 +136,7 @@ export function ProductionListTable({ loading, data, refetch, bodyshop, technici
       setColumns(newColumns);
       setHasUnsavedChanges(true);
     }
+    logImEXEvent("production_list_remove_column", { key });
   };
 
   const handleResize =
@@ -156,6 +159,7 @@ export function ProductionListTable({ loading, data, refetch, bodyshop, technici
       setColumns(updatedColumns);
       setHasUnsavedChanges(true);
     }
+    logImEXEvent("production_list_add_column", { key: newColumn.key });
   };
 
   const headerItem = (col) => {

client/src/components/profile-my/profile-my.component.jsx

@@ -1,5 +1,5 @@
-import { Button, Card, Col, Form, Input } from "antd";
-import { LockOutlined } from "@ant-design/icons";
+import { Button, Card, Col, Form, Input, Space, Switch, Tooltip, Typography } from "antd";
+import { AudioMutedOutlined, LockOutlined, SoundOutlined } from "@ant-design/icons";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -10,6 +10,8 @@ import LayoutFormRow from "../layout-form-row/layout-form-row.component";
 import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
 import { useSocket } from "../../contexts/SocketIO/useSocket.js";
 import NotificationSettingsForm from "../notification-settings/notification-settings-form.component.jsx";
+import { useMutation, useQuery } from "@apollo/client";
+import { QUERY_ACTIVE_ASSOCIATION_SOUND, UPDATE_NEW_MESSAGE_SOUND } from "../../graphql/user.queries.js";
 
 const mapStateToProps = createStructuredSelector({
   currentUser: selectCurrentUser
@@ -48,6 +50,28 @@ export default connect(
     }
   };
 
+  // ---- Notification sound (associations.new_message_sound) ----
+  const email = currentUser?.email;
+  const { data: assocData, loading: assocLoading } = useQuery(QUERY_ACTIVE_ASSOCIATION_SOUND, {
+    variables: { email },
+    skip: !email,
+    fetchPolicy: "network-only",
+    nextFetchPolicy: "cache-first"
+  });
+  const association = assocData?.associations?.[0];
+  // Treat null/undefined as ON for backward-compat
+  const soundEnabled = association?.new_message_sound === true;
+
+  const [updateNewMessageSound, { loading: updatingSound }] = useMutation(UPDATE_NEW_MESSAGE_SOUND, {
+    update(cache, { data }) {
+      const updated = data?.update_associations_by_pk;
+      if (!updated) return;
+      cache.modify({
+        id: cache.identify({ __typename: "associations", id: updated.id }),
+        fields: { new_message_sound: () => updated.new_message_sound }
+      });
+    }
+  });
   return (
     <>
       <Col span={24}>
@@ -80,6 +104,7 @@ export default connect(
           </Card>
         </Form>
       </Col>
+
       <Col span={24}>
         <Form onFinish={handleChangePassword} autoComplete={"no"} initialValues={currentUser} layout="vertical">
           <Card
@@ -119,6 +144,52 @@ export default connect(
           </Card>
         </Form>
       </Col>
+
+      {association && (
+        <Col span={24}>
+          <Card title={t("user.labels.user_settings")}>
+            <Space align="center" size="large">
+              <Typography.Text>{t("user.labels.play_sound_for_new_messages")}</Typography.Text>
+              <Tooltip
+                title={soundEnabled ? t("user.labels.notification_sound_on") : t("user.labels.notification_sound_off")}
+              >
+                <Switch
+                  checkedChildren={<SoundOutlined />}
+                  unCheckedChildren={<AudioMutedOutlined />}
+                  checked={!!soundEnabled}
+                  loading={assocLoading || updatingSound}
+                  onChange={(checked) => {
+                    updateNewMessageSound({
+                      variables: { id: association.id, value: checked },
+                      optimisticResponse: {
+                        update_associations_by_pk: {
+                          __typename: "associations",
+                          id: association.id,
+                          new_message_sound: checked
+                        }
+                      }
+                    })
+                      .then(() => {
+                        notification.success({
+                          message: checked
+                            ? t("user.labels.notification_sound_enabled")
+                            : t("user.labels.notification_sound_disabled")
+                        });
+                      })
+                      .catch((e) => {
+                        notification.error({ message: e.message || "Failed to update setting" });
+                      });
+                  }}
+                />
+              </Tooltip>
+            </Space>
+            <Typography.Paragraph type="secondary" style={{ marginTop: 8 }}>
+              {t("user.labels.notification_sound_help")}
+            </Typography.Paragraph>
+          </Card>
+        </Col>
+      )}
+
       {scenarioNotificationsOn && (
         <Col span={24}>
           <NotificationSettingsForm />

client/src/components/qbo-authorize/qbo-authorize.component.jsx

@@ -5,6 +5,7 @@ import { useEffect } from "react";
 import { useCookies } from "react-cookie";
 import { useLocation, useNavigate } from "react-router-dom";
 import QboSignIn from "../../assets/qbo/C2QB_green_btn_med_default.svg";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 
 export default function QboAuthorizeComponent() {
   const location = useLocation();
@@ -12,6 +13,7 @@ export default function QboAuthorizeComponent() {
   const [setCookie] = useCookies(["access_token", "refresh_token"]);
 
   const handleQbSignIn = async () => {
+    logImEXEvent("qbo_sign_in_clicked");
     const result = await Axios.post("/qbo/authorize");
     window.location.href = result.data;
   };

client/src/components/schedule-calendar-wrapper/schedule-calendar-header-graph.component.jsx

@@ -9,6 +9,7 @@ import { selectBodyshop } from "../../redux/user/user.selectors";
 import BlurWrapperComponent from "../feature-wrapper/blur-wrapper.component";
 import { upsellEnum, UpsellMaskWrapper } from "../upsell/upsell.component";
 import { HasFeatureAccess } from "../feature-wrapper/feature-wrapper.component";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -79,7 +80,12 @@ export function ScheduleCalendarHeaderGraph({ bodyshop, loadData }) {
   );
 
   return (
-    <Popover trigger="hover" placement="bottom" content={popContent}>
+    <Popover
+      trigger="hover"
+      placement="bottom"
+      onOpenChange={(open) => open && logImEXEvent("schedule_spider_graph", {})}
+      content={popContent}
+    >
       <RadarChartOutlined />
     </Popover>
   );

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

@@ -19,6 +19,7 @@ import OwnerNameDisplay from "../owner-name-display/owner-name-display.component
 import ScheduleBlockDay from "../schedule-block-day/schedule-block-day.component";
 import UpsellComponent, { upsellEnum } from "../upsell/upsell.component";
 import ScheduleCalendarHeaderGraph from "./schedule-calendar-header-graph.component";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -142,6 +143,7 @@ export function ScheduleCalendarHeaderComponent({ bodyshop, label, refetch, date
           content={jobsInPopup}
           trigger="hover"
           title={t("appointments.labels.arrivingjobs")}
+          onOpenChange={(open) => open && logImEXEvent("schedule_popover_arriving_jobs", {})}
         >
           <Space size="small">
             <Icon component={MdFileDownload} style={{ color: "green" }} />
@@ -159,6 +161,7 @@ export function ScheduleCalendarHeaderComponent({ bodyshop, label, refetch, date
           content={jobsOutPopup}
           trigger="hover"
           title={t("appointments.labels.completingjobs")}
+          onOpenChange={(open) => open && logImEXEvent("schedule_popover_departing_jobs", {})}
         >
           <Space size="small">
             <Icon component={MdFileUpload} style={{ color: "red" }} />

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

@@ -13,6 +13,7 @@ import Event from "../job-at-change/schedule-event.container";
 import JobDetailCards from "../job-detail-cards/job-detail-cards.component";
 import local from "./localizer";
 import HeaderComponent from "./schedule-calendar-header.component";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 import "./schedule-calendar.styles.scss";
 
 const mapStateToProps = createStructuredSelector({
@@ -40,27 +41,26 @@ export function ScheduleCalendarWrapperComponent({
   const currentView = search.view || defaultView || "week";
 
   const handleEventPropStyles = (event) => {
-    const hasColor = Boolean(event?.color?.hex || event?.color);
+    const { color, block, arrived } = event ?? {};
+    const hasColor = Boolean(color?.hex || color);
     const useBg = currentView !== "agenda";
 
     // Prioritize explicit blocked-day background to ensure red in all themes
     let bg;
     if (useBg) {
-      if (event?.block) {
-        bg = "var(--event-block-bg)";
-      } else if (hasColor) {
-        bg = event?.color?.hex ?? event?.color;
-      } else {
-        bg = "var(--event-bg-fallback)";
-      }
+      bg = block
+        ? "var(--event-block-bg)"
+        : arrived
+          ? "var(--event-arrived-bg)"
+          : (color?.hex ?? color ?? "var(--event-bg-fallback)");
     }
 
-    const usedFallback = !hasColor && !event?.block; // only mark as fallback when not blocked
+    const usedFallback = !hasColor && !block && !arrived; // only mark as fallback when not blocked or arrived
 
     const classes = [
       "imex-event",
-      event.arrived && "imex-event-arrived",
-      event.block && "imex-event-block",
+      arrived && "imex-event-arrived",
+      block && "imex-event-block",
       usedFallback && "imex-event-fallback"
     ]
       .filter(Boolean)
@@ -140,6 +140,8 @@ export function ScheduleCalendarWrapperComponent({
         }}
         onView={(view) => {
           search.view = view;
+          logImEXEvent("schedule_change_view", { view });
+
           history({ search: queryString.stringify(search) });
         }}
         step={15}

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

@@ -14,6 +14,7 @@ import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import _ from "lodash";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -80,6 +81,7 @@ export function ScheduleCalendarComponent({ data, refetch, bodyshop }) {
                 value={[...estimatorsFilter]}
                 onChange={(e) => {
                   setEstimatiorsFilter(e);
+                  logImEXEvent("schedule_filter_by_estimator", { estimators: e });
                 }}
                 options={estimators.map((e) => ({
                   label: e,
@@ -95,6 +97,7 @@ export function ScheduleCalendarComponent({ data, refetch, bodyshop }) {
                 value={filter?.ins_co_nm ? filter.ins_co_nm : []}
                 onChange={(e) => {
                   setFilter({ ...filter, ins_co_nm: e });
+                  logImEXEvent("schedule_filter_by_ins_co_nm", { ins_co_nm: e });
                 }}
                 options={bodyshop.md_ins_cos.map((i) => ({
                   label: i.name,

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

@@ -6,6 +6,7 @@ import { useTranslation } from "react-i18next";
 import { UPDATE_SCOREBOARD_ENTRY } from "../../graphql/scoreboard.queries";
 import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
+import { logImEXEvent } from "../../firebase/firebase.utils.js";
 
 export default function ScoreboardEntryEdit({ entry }) {
   const [open, setOpen] = useState(false);
@@ -16,6 +17,7 @@ export default function ScoreboardEntryEdit({ entry }) {
 
   const handleFinish = async (values) => {
     setLoading(true);
+    logImEXEvent("scoreboard_edit_job", {});
     values.date = dayjs(values.date).format("YYYY-MM-DD");
     const result = await updateScoreboardentry({
       variables: { sbId: entry.id, sbInput: values }

client/src/components/share-to-teams/share-to-teams.component.jsx

@@ -6,6 +6,7 @@ import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors.js";
+import { logImEXEvent } from "../../firebase/firebase.utils.js";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -52,6 +53,7 @@ const ShareToTeamsComponent = ({
   const teamsShareUrl = `https://teams.microsoft.com/share?href=${currentUrl}&preText=${messageText}&title=${pageTitle}`;
   // Function to open the centered share link in a new window/tab
   const handleShare = () => {
+    logImEXEvent("share_to_teams", {});
     const screenWidth = window.screen.width;
     const screenHeight = window.screen.height;
     const windowWidth = 600;

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

@@ -331,7 +331,10 @@ export function ShopEmployeesFormComponent({ bodyshop }) {
                             {t("timetickets.labels.shift")}
                           </Select.Option>
 
-                          {bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber || Enhanced_Payroll.treatment === "on"
+                          {bodyshop.cdk_dealerid ||
+                          bodyshop.pbs_serialnumber ||
+                          bodyshop.rr_dealerid ||
+                          Enhanced_Payroll.treatment === "on"
                             ? CiecaSelect(false, true)
                             : bodyshop.md_responsibility_centers.costs.map((c) => (
                                 <Select.Option key={c.name} value={c.name}>

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

@@ -23,13 +23,24 @@ export default function ShopInfoContainer() {
   });
   const notification = useNotification();
 
-  const combinedFeatureConfig = {
-    ...FEATURE_CONFIGS.general,
-    ...FEATURE_CONFIGS.responsibilitycenters
-  };
+  const combineFeatureConfigs = (...configs) =>
+    (configs || [])
+      .filter(Boolean)
+      .flatMap((cfg) => Object.entries(cfg))
+      .reduce((acc, [featureName, fieldPaths]) => {
+        if (!Array.isArray(fieldPaths)) return acc;
+        acc[featureName] = [...(acc[featureName] ?? []), ...fieldPaths];
+        return acc;
+      }, {});
+
+  const combinedFeatureConfig = combineFeatureConfigs(FEATURE_CONFIGS.general, FEATURE_CONFIGS.responsibilitycenters);
 
   // Use form data preservation for all shop-info features
-  const { createSubmissionHandler } = useFormDataPreservation(form, data?.bodyshops[0], combinedFeatureConfig);
+  const { createSubmissionHandler, preserveHiddenFormData } = useFormDataPreservation(
+    form,
+    data?.bodyshops[0],
+    combinedFeatureConfig
+  );
 
   const handleFinish = createSubmissionHandler((values) => {
     setSaveLoading(true);
@@ -51,8 +62,11 @@ export default function ShopInfoContainer() {
   });
 
   useEffect(() => {
-    if (data) form.resetFields();
-  }, [form, data]);
+    if (!data) return;
+    form.resetFields();
+    // After reset, re-apply hidden field preservation so values aren't wiped
+    preserveHiddenFormData();
+  }, [data, form, preserveHiddenFormData]);
 
   if (error) return <AlertComponent message={error.message} type="error" />;
   if (loading) return <LoadingSpinner />;

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

@@ -425,7 +425,15 @@ export function ShopInfoGeneral({ form, bodyshop }) {
                     ]
                   : [])
               ]
-            : [])
+            : []),
+          <Form.Item
+            key="accumulatePayableLines"
+            name={["accountingconfig", "accumulatePayableLines"]}
+            label={t("bodyshop.fields.accumulatePayableLines")}
+            valuePropName="checked"
+          >
+            <Switch />
+          </Form.Item>
         ]}
       </LayoutFormRow>
       <FeatureWrapper featureName="scoreboard" noauth={() => null}>
@@ -1183,7 +1191,17 @@ export function ShopInfoGeneral({ form, bodyshop }) {
                   {fields.map((field, index) => (
                     <Form.Item key={field.key}>
                       <LayoutFormRow noDivider>
-                        <Form.Item label={t("general.labels.label")} key={`${index}label`} name={[field.name, "label"]}>
+                        <Form.Item
+                          label={t("general.labels.label")}
+                          key={`${index}label`}
+                          name={[field.name, "label"]}
+                          rules={[
+                            {
+                              required: true
+                              //message: t("general.validation.required"),
+                            }
+                          ]}
+                        >
                           <Input />
                         </Form.Item>
                         <Form.Item
@@ -1294,7 +1312,17 @@ export function ShopInfoGeneral({ form, bodyshop }) {
                 {fields.map((field, index) => (
                   <Form.Item key={field.key}>
                     <LayoutFormRow noDivider>
-                      <Form.Item label={t("general.labels.label")} key={`${index}label`} name={[field.name, "label"]}>
+                      <Form.Item
+                        label={t("general.labels.label")}
+                        key={`${index}label`}
+                        name={[field.name, "label"]}
+                        rules={[
+                          {
+                            required: true
+                            //message: t("general.validation.required"),
+                          }
+                        ]}
+                      >
                         <Input />
                       </Form.Item>
                       <Form.Item
@@ -1483,15 +1511,31 @@ export function ShopInfoGeneral({ form, bodyshop }) {
                 {fields.map((field, index) => (
                   <Form.Item key={field.key}>
                     <LayoutFormRow noDivider>
-                      <Form.Item label={t("general.labels.label")} key={`${index}label`} name={[field.name, "label"]}>
+                      <Form.Item
+                        label={t("general.labels.label")}
+                        key={`${index}label`}
+                        name={[field.name, "label"]}
+                        rules={[
+                          {
+                            required: true
+                            //message: t("general.validation.required"),
+                          }
+                        ]}
+                      >
                         <Input />
                       </Form.Item>
                       <Form.Item
                         label={t("bodyshop.labels.md_to_emails_emails")}
                         key={`${index}emails`}
                         name={[field.name, "emails"]}
+                        rules={[
+                          {
+                            required: true
+                            //message: t("general.validation.required"),
+                          }
+                        ]}
                       >
-                        <Select mode="tags" tokenSeparators={[",", ";"]} />
+                        <FormItemEmail email={form.getFieldValue([field.name, "emails"])} />
                       </Form.Item>
 
                       <Space>