IO-3170-HotfixFoRedis

IO-2561 Return Items Modal

.circleci/config.yml

@@ -9,13 +9,13 @@ orbs:
 jobs:
   imex-api-deploy:
     docker:
-      - image: cimg/node:18.18.2
+      - image: cimg/node:22.13.1
     steps:
       - checkout
       - eb/setup
       - run:
           command: |
-            eb init imex-online-production-api -r ca-central-1 -p "Node.js 18 running on 64bit Amazon Linux 2"
+            eb init imex-online-production-api -r ca-central-1 -p "Node.js 22 running on 64bit Amazon Linux 2023"
             eb status --verbose
             eb deploy
             eb status
@@ -28,7 +28,7 @@ jobs:
 
   imex-hasura-migrate:
     docker:
-      - image: cimg/node:18.18.2
+      - image: cimg/node:22.13.1
     parameters:
       secret:
         type: string
@@ -52,7 +52,7 @@ jobs:
           pipeline_number: << pipeline.number >>
   imex-app-build:
     docker:
-      - image: cimg/node:18.18.2
+      - image: cimg/node:22.13.1
     resource_class: large
     working_directory: ~/repo/client
     steps:
@@ -77,7 +77,7 @@ jobs:
 
   imex-app-beta-build:
     docker:
-      - image: cimg/node:18.18.2
+      - image: cimg/node:22.13.1
     resource_class: large
     working_directory: ~/repo/client
 
@@ -88,7 +88,7 @@ jobs:
           name: Install Dependencies
           command: npm i
 
-      - run: npm run build:production:imex
+      - run: NODE_OPTIONS=--max-old-space-size=8192 npm run build:production:imex
 
       - aws-cli/setup:
           aws_access_key_id: AWS_ACCESS_KEY_ID
@@ -114,7 +114,7 @@ jobs:
       - eb/setup
       - run:
           command: |
-            eb init romeonline-productionapi -r us-east-2 -p "Node.js 18 running on 64bit Amazon Linux 2"
+            eb init romeonline-productionapi -r us-east-2 -p "Node.js 22 running on 64bit Amazon Linux 2023"
             eb status --verbose
             eb deploy
             eb status
@@ -126,7 +126,7 @@ jobs:
           pipeline_number: << pipeline.number >>
   rome-hasura-migrate:
     docker:
-      - image: cimg/node:18.18.2
+      - image: cimg/node:22.13.1
     parameters:
       secret:
         type: string
@@ -150,8 +150,8 @@ jobs:
           pipeline_number: << pipeline.number >>
   rome-app-build:
     docker:
-      - image: cimg/node:18.18.2
+      - image: cimg/node:22.13.1
-
+    resource_class: large
     working_directory: ~/repo/client
 
     steps:
@@ -161,7 +161,7 @@ jobs:
           name: Install Dependencies
           command: npm i
 
-      - run: npm run build:production:rome
+      - run: NODE_OPTIONS=--max-old-space-size=8192 npm run build:production:rome
 
       - aws-cli/setup:
           aws_access_key_id: AWS_ACCESS_KEY_ID
@@ -181,7 +181,7 @@ jobs:
 
   test-rome-hasura-migrate:
     docker:
-      - image: cimg/node:18.18.2
+      - image: cimg/node:22.13.1
     parameters:
       secret:
         type: string
@@ -208,8 +208,8 @@ jobs:
 
   test-rome-app-build:
     docker:
-      - image: cimg/node:18.18.2
+      - image: cimg/node:22.13.1
-
+    resource_class: large
     working_directory: ~/repo/client
 
     steps:
@@ -219,7 +219,7 @@ jobs:
           name: Install Dependencies
           command: npm i
 
-      - run: npm run build:test:rome
+      - run: NODE_OPTIONS=--max-old-space-size=8192 npm run build:test:rome
 
       - aws-cli/setup:
           aws_access_key_id: AWS_ACCESS_KEY_ID
@@ -239,7 +239,7 @@ jobs:
 
   test-hasura-migrate:
     docker:
-      - image: cimg/node:18.18.2
+      - image: cimg/node:22.13.1
     parameters:
       secret:
         type: string
@@ -266,7 +266,7 @@ jobs:
 
   imex-test-app-build:
     docker:
-      - image: cimg/node:18.18.2
+      - image: cimg/node:22.13.1
     resource_class: large
     working_directory: ~/repo/client
 
@@ -277,7 +277,7 @@ jobs:
           name: Install Dependencies
           command: npm i
 
-      - run: npm run build:test:imex
+      - run: NODE_OPTIONS=--max-old-space-size=8192 npm run build:test:imex
 
       - aws-s3/sync:
           from: build
@@ -286,7 +286,7 @@ jobs:
 
   imex-test-app-beta-build:
     docker:
-      - image: cimg/node:18.18.2
+      - image: cimg/node:22.13.1
     resource_class: large
     working_directory: ~/repo/client
 
@@ -298,7 +298,7 @@ jobs:
           name: Install Dependencies
           command: npm i
 
-      - run: npm run build:test:imex
+      - run: NODE_OPTIONS=--max-old-space-size=8192 npm run build:test:imex
 
       - aws-cli/setup:
           aws_access_key_id: AWS_ACCESS_KEY_ID

Dockerfile

@@ -3,7 +3,7 @@ FROM amazonlinux:2023
 
 # Install Git and Node.js (Amazon Linux 2023 uses the DNF package manager)
 RUN dnf install -y git \
-    && curl -sL https://rpm.nodesource.com/setup_20.x | bash - \
+    && curl -sL https://rpm.nodesource.com/setup_22.x | bash - \
     && dnf install -y nodejs \
     && dnf clean all
 

bodyshop_translations.babel

@@ -1,4 +1,4 @@
-<babeledit_project version="1.2" be_version="2.7.1">
+<babeledit_project be_version="2.7.1" version="1.2">
     <!--
 
     BabelEdit project file
@@ -6453,6 +6453,27 @@
                                                     </translation>
                                                 </translations>
                                             </concept_node>
+                                            <concept_node>
+                                                <name>mark_critical</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>operation</name>
                                                 <definition_loaded>false</definition_loaded>
@@ -6474,6 +6495,48 @@
                                                     </translation>
                                                 </translations>
                                             </concept_node>
+                                            <concept_node>
+                                                <name>update_field</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>update_value</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>value</name>
                                                 <definition_loaded>false</definition_loaded>
@@ -11943,6 +12006,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>shop_enabled_features</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>shopinfo</name>
                                         <definition_loaded>false</definition_loaded>
@@ -12312,6 +12396,37 @@
                                     </concept_node>
                                 </children>
                             </folder_node>
+                            <folder_node>
+                                <name>tooltips</name>
+                                <children>
+                                    <folder_node>
+                                        <name>md_parts_scan</name>
+                                        <children>
+                                            <concept_node>
+                                                <name>update_value_tooltip</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>
+                                        </children>
+                                    </folder_node>
+                                </children>
+                            </folder_node>
                             <folder_node>
                                 <name>validation</name>
                                 <children>
@@ -19091,6 +19206,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>ok</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>previous</name>
                                         <definition_loaded>false</definition_loaded>
@@ -19385,6 +19521,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>sharetoteams</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>submit</name>
                                         <definition_loaded>false</definition_loaded>
@@ -43090,6 +43247,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>parts_returns</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>print</name>
                                         <definition_loaded>false</definition_loaded>
@@ -48557,6 +48735,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>unassigned</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>vertical</name>
                                         <definition_loaded>false</definition_loaded>
@@ -52732,6 +52931,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>purchases_by_date_excel</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>purchases_by_date_range_detail</name>
                                         <definition_loaded>false</definition_loaded>
@@ -54483,6 +54703,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>view</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>
                                 </children>
                             </folder_node>
                             <folder_node>

client/package.json

@@ -8,74 +8,75 @@
   "private": true,
   "proxy": "http://localhost:4000",
   "dependencies": {
-    "@ant-design/pro-layout": "^7.19.12",
+    "@ant-design/pro-layout": "^7.22.0",
-    "@apollo/client": "^3.11.8",
+    "@apollo/client": "^3.12.6",
     "@emotion/is-prop-valid": "^1.3.1",
-    "@fingerprintjs/fingerprintjs": "^4.5.0",
+    "@fingerprintjs/fingerprintjs": "^4.5.1",
     "@jsreport/browser-client": "^3.1.0",
-    "@reduxjs/toolkit": "^2.2.7",
+    "@reduxjs/toolkit": "^2.5.0",
-    "@sentry/cli": "^2.36.2",
+    "@sentry/cli": "^2.42.2",
-    "@sentry/react": "^7.114.0",
+    "@sentry/react": "^9.3.0",
+    "@sentry/vite-plugin": "^3.2.1",
     "@splitsoftware/splitio-react": "^1.13.0",
-    "@tanem/react-nprogress": "^5.0.51",
+    "@tanem/react-nprogress": "^5.0.53",
-    "@vitejs/plugin-react": "^4.3.1",
+    "@vitejs/plugin-react": "^4.3.4",
-    "antd": "^5.20.1",
+    "antd": "^5.23.1",
     "apollo-link-logger": "^2.0.1",
-    "apollo-link-sentry": "^3.3.0",
+    "apollo-link-sentry": "^4.1.0",
     "autosize": "^6.0.1",
-    "axios": "^1.7.7",
+    "axios": "^1.7.9",
     "classnames": "^2.5.1",
     "css-box-model": "^1.2.1",
     "dayjs": "^1.11.13",
-    "dayjs-business-days2": "^1.2.2",
+    "dayjs-business-days2": "^1.2.3",
     "dinero.js": "^1.9.1",
-    "dotenv": "^16.4.5",
+    "dotenv": "^16.4.7",
     "env-cmd": "^10.1.0",
     "exifr": "^7.1.3",
     "firebase": "^10.13.2",
-    "graphql": "^16.9.0",
+    "graphql": "^16.10.0",
     "i18next": "^23.15.1",
-    "i18next-browser-languagedetector": "^8.0.0",
+    "i18next-browser-languagedetector": "^8.0.2",
     "immutability-helper": "^3.1.1",
-    "libphonenumber-js": "^1.11.9",
+    "libphonenumber-js": "^1.11.18",
     "logrocket": "^8.1.2",
-    "markerjs2": "^2.32.2",
+    "markerjs2": "^2.32.3",
     "memoize-one": "^6.0.0",
     "normalize-url": "^8.0.1",
     "object-hash": "^3.0.0",
     "prop-types": "^15.8.1",
-    "query-string": "^9.1.0",
+    "query-string": "^9.1.1",
     "raf-schd": "^4.0.3",
     "react": "^18.3.1",
-    "react-big-calendar": "^1.14.1",
+    "react-big-calendar": "^1.17.1",
     "react-color": "^2.19.3",
-    "react-cookie": "^7.2.0",
+    "react-cookie": "^7.2.2",
     "react-dom": "^18.3.1",
     "react-drag-listview": "^2.0.0",
     "react-grid-gallery": "^1.0.1",
     "react-grid-layout": "1.3.4",
     "react-i18next": "^14.1.3",
-    "react-icons": "^5.3.0",
+    "react-icons": "^5.4.0",
     "react-image-lightbox": "^5.1.4",
-    "react-markdown": "^9.0.1",
+    "react-markdown": "^9.0.3",
-    "react-number-format": "^5.4.2",
+    "react-number-format": "^5.4.3",
     "react-popopo": "^2.1.9",
     "react-product-fruits": "^2.2.61",
-    "react-redux": "^9.1.2",
+    "react-redux": "^9.2.0",
     "react-resizable": "^3.0.5",
     "react-router-dom": "^6.26.2",
     "react-sticky": "^6.0.3",
     "react-virtuoso": "^4.10.4",
-    "recharts": "^2.12.7",
+    "recharts": "^2.15.0",
     "redux": "^5.0.1",
     "redux-actions": "^3.0.3",
     "redux-persist": "^6.0.0",
     "redux-saga": "^1.3.0",
     "redux-state-sync": "^3.1.4",
     "reselect": "^5.1.1",
-    "sass": "^1.79.3",
+    "sass": "^1.83.4",
-    "socket.io-client": "^4.8.0",
+    "socket.io-client": "^4.8.1",
-    "styled-components": "^6.1.13",
+    "styled-components": "^6.1.14",
     "subscriptions-transport-ws": "^0.11.0",
     "use-memo-one": "^1.1.3",
     "userpilot": "^1.3.6",
@@ -98,8 +99,7 @@
     "test": "cypress open",
     "eject": "react-scripts eject",
     "madge": "madge  --image ./madge-graph.svg --extensions js,jsx,ts,tsx --circular .",
-    "eulaize": "node src/utils/eulaize.js",
+    "eulaize": "node src/utils/eulaize.js"
-    "sentry:sourcemaps:imex": "sentry-cli sourcemaps inject --org imex --project imexonline ./build && sentry-cli sourcemaps upload --org imex --project imexonline ./build"
   },
   "browserslist": {
     "production": [
@@ -120,36 +120,36 @@
     "@rollup/rollup-linux-x64-gnu": "4.6.1"
   },
   "devDependencies": {
-    "@ant-design/icons": "^5.5.1",
+    "@ant-design/icons": "^5.5.2",
     "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
-    "@babel/preset-react": "^7.24.7",
+    "@babel/preset-react": "^7.26.3",
-    "@dotenvx/dotenvx": "^1.14.1",
+    "@dotenvx/dotenvx": "^1.33.0",
-    "@emotion/babel-plugin": "^11.12.0",
+    "@emotion/babel-plugin": "^11.13.5",
-    "@emotion/react": "^11.13.3",
+    "@emotion/react": "^11.14.0",
-    "@eslint/js": "^9.15.0",
+    "@eslint/js": "^9.18.0",
-    "@sentry/webpack-plugin": "^2.22.4",
+    "@sentry/webpack-plugin": "^3.2.1",
     "@testing-library/cypress": "^10.0.2",
-    "browserslist": "^4.23.3",
+    "browserslist": "^4.24.4",
     "browserslist-to-esbuild": "^2.1.1",
-    "chalk": "^5.3.0",
+    "chalk": "^5.4.1",
     "cross-env": "^7.0.3",
-    "cypress": "^13.14.2",
+    "cypress": "^13.17.0",
     "eslint": "^8.57.1",
     "eslint-config-react-app": "^7.0.1",
     "eslint-plugin-cypress": "^2.15.1",
-    "eslint-plugin-react": "^7.37.2",
+    "eslint-plugin-react": "^7.37.4",
-    "globals": "^15.12.0",
+    "globals": "^15.14.0",
-    "memfs": "^4.12.0",
+    "memfs": "^4.17.0",
     "os-browserify": "^0.3.0",
     "react-error-overlay": "6.0.11",
     "redux-logger": "^3.0.6",
     "source-map-explorer": "^2.5.3",
-    "vite": "^5.4.7",
+    "vite": "^6.0.7",
-    "vite-plugin-babel": "^1.2.0",
+    "vite-plugin-babel": "^1.3.0",
     "vite-plugin-eslint": "^1.8.1",
-    "vite-plugin-node-polyfills": "^0.22.0",
+    "vite-plugin-node-polyfills": "^0.23.0",
-    "vite-plugin-pwa": "^0.20.5",
+    "vite-plugin-pwa": "^0.21.1",
     "vite-plugin-style-import": "^2.0.0",
-    "workbox-window": "^7.1.0"
+    "workbox-window": "^7.3.0"
   }
 }

client/src/App/App.styles.scss

@@ -5,6 +5,13 @@
   border-bottom: 1px solid #74695c !important;
 }
 
+// TODO: This was added because the newest release of ant was making the text color and the background color the same on a selected header
+// Tried all available tokens (https://ant.design/components/menu?locale=en-US) and even reverted all our custom styles, to no avail
+// This should be kept an eye on, especially if implementing DARK MODE
+.ant-menu-submenu-title {
+  color: rgba(255, 255, 255, 0.65) !important;
+}
+
 .imex-table-header {
   display: flex;
   flex-wrap: wrap;

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

@@ -42,8 +42,7 @@ export function ChatPopupComponent({ chatVisible, selectedConversation, toggleCh
   const { data: unreadData } = useQuery(UNREAD_CONVERSATION_COUNT, {
     fetchPolicy: "network-only",
     nextFetchPolicy: "network-only",
-    skip: chatVisible, // Skip when chat is visible
+    pollInterval: 60 * 1000 // TODO: This is a fix for now, should be coming from sockets
-    ...(pollInterval > 0 ? { pollInterval } : {})
   });
 
   // Socket connection status
@@ -85,29 +84,25 @@ export function ChatPopupComponent({ chatVisible, selectedConversation, toggleCh
 
   // Get unread count from the cache
   const unreadCount = (() => {
-    if (chatVisible) {
+    try {
-      try {
+      const cachedData = client.readQuery({
-        const cachedData = client.readQuery({
+        query: CONVERSATION_LIST_QUERY,
-          query: CONVERSATION_LIST_QUERY,
+        variables: { offset: 0 }
-          variables: { offset: 0 }
+      });
-        });
 
-        if (!cachedData?.conversations) return 0;
+      if (!cachedData?.conversations) {
-
+        return unreadData?.messages_aggregate?.aggregate?.count;
-        // Aggregate unread message count
-        return cachedData.conversations.reduce((total, conversation) => {
-          const unread = conversation.messages_aggregate?.aggregate?.count || 0;
-          return total + unread;
-        }, 0);
-      } catch (error) {
-        console.warn("Unread count not found in cache:", error);
-        return 0; // Fallback if not in cache
       }
-    } else if (unreadData?.messages_aggregate?.aggregate?.count) {
+
-      // Use the unread count from the query result
+      // Aggregate unread message count
-      return unreadData.messages_aggregate.aggregate.count;
+      return cachedData.conversations.reduce((total, conversation) => {
+        const unread = conversation.messages_aggregate?.aggregate?.count || 0;
+        return total + unread;
+      }, 0);
+    } catch (error) {
+      console.warn("Unread count not found in cache:", error);
+      return 0; // Fallback if not in cache
     }
-    return 0;
   })();
 
   return (

client/src/components/header/header.container.jsx

@@ -1,16 +1,15 @@
-import i18next from "i18next";
-import React from "react";
 import { connect } from "react-redux";
-import { setUserLanguage } from "../../redux/user/user.actions";
 import HeaderComponent from "./header.component";
-import { logImEXEvent } from "../../firebase/firebase.utils";
 
-const mapDispatchToProps = (dispatch) => ({
+// const mapDispatchToProps = (dispatch) => ({
-  setUserLanguage: (language) => dispatch(setUserLanguage(language))
+//   setUserLanguage: (language) => dispatch(setUserLanguage(language))
-});
+// });
 
-export function HeaderContainer({ setUserLanguage }) {
+// setUserLanguage was removed from signature because it is not used in the component, and it is throwing a deprecation warning
-  const handleMenuClick = (e) => {
+export function HeaderContainer() {
+  // Commented out the handleMenuClick function because it is not used in the component, and it is throwing a deprecation warning
+
+  /*  const handleMenuClick = (e) => {
     if (e.item.props.actiontype === "lang-select") {
       i18next.changeLanguage(e.key, (err, t) => {
         if (err) {
@@ -23,9 +22,10 @@ export function HeaderContainer({ setUserLanguage }) {
         setUserLanguage(e.key);
       });
     }
-  };
+  };*/
+  // return <HeaderComponent handleMenuClick={handleMenuClick} />;
 
-  return <HeaderComponent handleMenuClick={handleMenuClick} />;
+  return <HeaderComponent />;
 }
 
-export default connect(null, mapDispatchToProps)(HeaderContainer);
+export default connect(null, null)(HeaderContainer);

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

@@ -62,6 +62,9 @@ function JobLinesUpsertModalContainer({ jobLineEditModal, toggleModalVisible, bo
         refetchQueries: ["GET_LINE_TICKET_BY_PK"]
       });
       if (!r.errors) {
+        if (CriticalPartsScanning.treatment === "on") {
+          await CriticalPartsScan(jobLineEditModal.context.jobid, notification);
+        }
         await Axios.post("/job/totalsssu", {
           id: jobLineEditModal.context.jobid
         });
@@ -107,7 +110,9 @@ function JobLinesUpsertModalContainer({ jobLineEditModal, toggleModalVisible, bo
           })
         });
       }
-
+      if (CriticalPartsScanning.treatment === "on") {
+        await CriticalPartsScan(jobLineEditModal.context.jobid, notification);
+      }
       if (jobLineEditModal.actions.submit) {
         jobLineEditModal.actions.submit();
       } else {
@@ -115,9 +120,7 @@ function JobLinesUpsertModalContainer({ jobLineEditModal, toggleModalVisible, bo
       }
       toggleModalVisible();
     }
-    if (CriticalPartsScanning.treatment === "on") {
+
-      CriticalPartsScan(jobLineEditModal.context.jobid, notification);
-    }
     setLoading(false);
   };
 

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

@@ -172,13 +172,13 @@ export function JobsAvailableContainer({ bodyshop, currentUser, insertAuditTrail
           job: newJob
         }
       });
+      if (CriticalPartsScanning.treatment === "on") {
+        await CriticalPartsScan(r.data.insert_jobs.returning[0].id, notification);
+      }
       await Axios.post("/job/totalsssu", {
         id: r.data.insert_jobs.returning[0].id
       });
 
-      if (CriticalPartsScanning.treatment === "on") {
-        CriticalPartsScan(r.data.insert_jobs.returning[0].id, notification);
-      }
       notification["success"]({
         message: t("jobs.successes.created"),
         onClick: () => {
@@ -281,6 +281,7 @@ export function JobsAvailableContainer({ bodyshop, currentUser, insertAuditTrail
       if (CriticalPartsScanning.treatment === "on") {
         CriticalPartsScan(updateResult.data.update_jobs.returning[0].id, notification);
       }
+
       if (updateResult.errors) {
         //error while inserting
         notification["error"]({

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

@@ -1,26 +1,23 @@
 import { Collapse, Form, Input, InputNumber, Select, Space, Switch } from "antd";
-import React from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import InstanceRenderManager from "../../utils/instanceRenderMgr";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
 import FormItemEmail from "../form-items-formatted/email-form-item.component";
 import FormItemPhone, { PhoneItemFormatterValidation } from "../form-items-formatted/phone-form-item.component";
 import JobsDetailChangeEstimator from "../jobs-detail-change-estimator/jobs-detail-change-estimator.component";
 import JobsDetailChangeFilehandler from "../jobs-detail-change-filehandler/jobs-detail-change-filehandler.component";
 import JobsDetailRatesChangeButton from "../jobs-detail-rates-change-button/jobs-detail-rates-change-button.component";
-import JobsDetailRatesParts from "../jobs-detail-rates/jobs-detail-rates.parts.component";
-
 import JobsDetailRatesLabor from "../jobs-detail-rates/jobs-detail-rates.labor.component";
 import JobsDetailRatesMaterials from "../jobs-detail-rates/jobs-detail-rates.materials.component";
 import JobsDetailRatesOther from "../jobs-detail-rates/jobs-detail-rates.other.component";
+import JobsDetailRatesParts from "../jobs-detail-rates/jobs-detail-rates.parts.component";
 import JobsDetailRatesTaxes from "../jobs-detail-rates/jobs-detail-rates.taxes.component";
-
 import JobsMarkPstExempt from "../jobs-mark-pst-exempt/jobs-mark-pst-exempt.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
-import InstanceRenderManager from "../../utils/instanceRenderMgr";
-import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   //currentUser: selectCurrentUser
@@ -199,7 +196,9 @@ export function JobsCreateJobsInfo({ bodyshop, form, selected }) {
         </Collapse.Panel>
         <Collapse.Panel forceRender key="financial" header={t("menus.jobsdetail.financials")}>
           <JobsDetailRatesChangeButton form={form} />
-          <JobsMarkPstExempt form={form} />
+          {InstanceRenderManager({
+            imex: <JobsMarkPstExempt form={form} />
+          })}
           <LayoutFormRow>
             <Form.Item label={t("jobs.fields.ded_amt")} name="ded_amt">
               <CurrencyInput min={0} />
@@ -246,7 +245,6 @@ export function JobsCreateJobsInfo({ bodyshop, form, selected }) {
               </LayoutFormRow>
             )
           })}
-
           <LayoutFormRow>
             <Form.Item label={t("jobs.fields.rate_lab")} name="rate_lab">
               <CurrencyInput />

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

@@ -32,6 +32,7 @@ import AddToProduction from "./jobs-detail-header-actions.addtoproduction.util";
 import DuplicateJob from "./jobs-detail-header-actions.duplicate.util";
 import JobsDetailHeaderActionsToggleProduction from "./jobs-detail-header-actions.toggle-production";
 import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
+import ShareToTeamsButton from "../share-to-teams/share-to-teams.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -201,7 +202,10 @@ export function JobsDetailHeaderActions({
         message: t("appointments.successes.created")
       });
     } catch (error) {
-      notification.open({ type: "error", message: t("appointments.errors.saving", { error: error.message }) });
+      notification.open({
+        type: "error",
+        message: t("appointments.errors.saving", { error: error.message })
+      });
     } finally {
       setLoading(false);
       setVisibility(false);
@@ -838,7 +842,7 @@ export function JobsDetailHeaderActions({
           id: "job-actions-addtoproduction",
           disabled: !job.converted,
           label: t("jobs.actions.addtoproduction"),
-          onClick: () => AddToProduction(client, job.id, refetch, notification)
+          onClick: () => AddToProduction(client, job.id, refetch, false, notification)
         }
   );
 
@@ -971,6 +975,14 @@ export function JobsDetailHeaderActions({
     }
   );
 
+  if (bodyshop?.md_functionality_toggles?.teams) {
+    menuItems.push({
+      key: "sharetoteams",
+      id: "job-actions-sharetoteams",
+      label: <ShareToTeamsButton noIcon={true} urlOverride={`${window.location.origin}${window.location.pathname}`} />
+    });
+  }
+
   menuItems.push({
     key: "exportcustdata",
     id: "job-actions-exportcustdata",

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

@@ -13,6 +13,7 @@ import AuditTrailMapping from "../../utils/AuditTrailMappings";
 import { DateTimeFormatterFunction } from "../../utils/DateFormatter";
 import FormDateTimePickerComponent from "../form-date-time-picker/form-date-time-picker.component";
 import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
+import LoadingSpinner from "../loading-spinner/loading-spinner.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   //currentUser: selectCurrentUser,
@@ -39,7 +40,7 @@ export function JobsDetailHeaderActionsToggleProduction({
   const [form] = Form.useForm();
   const notification = useNotification();
 
-  const [getJobDetails] = useLazyQuery(GET_JOB_BY_PK_QUICK_INTAKE, {
+  const [getJobDetails, { loading: jobDetailsLoading }] = useLazyQuery(GET_JOB_BY_PK_QUICK_INTAKE, {
     variables: { id: job.id },
     onCompleted: (data) => {
       if (data?.jobs_by_pk) {
@@ -109,65 +110,69 @@ export function JobsDetailHeaderActionsToggleProduction({
 
   const popMenu = (
     <div onClick={(e) => e.stopPropagation()}>
-      <Form layout="vertical" form={form} onFinish={handleConvert}>
+      {jobDetailsLoading ? (
-        {scenario === "pre" && (
+        <LoadingSpinner />
-          <>
+      ) : (
-            <Form.Item
+        <Form layout="vertical" form={form} onFinish={handleConvert}>
-              name={["actual_in"]}
+          {scenario === "pre" && (
-              label={t("jobs.fields.actual_in")}
+            <>
-              rules={[
+              <Form.Item
-                {
+                name={["actual_in"]}
-                  required: true
+                label={t("jobs.fields.actual_in")}
-                  //message: t("general.validation.required"),
+                rules={[
-                }
+                  {
-              ]}
+                    required: true
-            >
+                    //message: t("general.validation.required"),
-              <FormDateTimePickerComponent disabled={jobRO} />
+                  }
-            </Form.Item>
+                ]}
-            <Form.Item
+              >
-              name={["scheduled_completion"]}
+                <FormDateTimePickerComponent disabled={jobRO} />
-              label={t("jobs.fields.scheduled_completion")}
+              </Form.Item>
-              rules={[
+              <Form.Item
-                {
+                name={["scheduled_completion"]}
-                  required: true
+                label={t("jobs.fields.scheduled_completion")}
-                  //message: t("general.validation.required"),
+                rules={[
-                }
+                  {
-              ]}
+                    required: true
-            >
+                    //message: t("general.validation.required"),
-              <FormDateTimePickerComponent disabled={jobRO} />
+                  }
-            </Form.Item>
+                ]}
-            <Form.Item name={["scheduled_delivery"]} label={t("jobs.fields.scheduled_delivery")}>
+              >
-              <FormDateTimePickerComponent disabled={jobRO} />
+                <FormDateTimePickerComponent disabled={jobRO} />
-            </Form.Item>
+              </Form.Item>
-          </>
+              <Form.Item name={["scheduled_delivery"]} label={t("jobs.fields.scheduled_delivery")}>
-        )}
+                <FormDateTimePickerComponent disabled={jobRO} />
-        {scenario === "prod" && (
+              </Form.Item>
-          <>
+            </>
-            <Form.Item
+          )}
-              name={["actual_completion"]}
+          {scenario === "prod" && (
-              label={t("jobs.fields.actual_completion")}
+            <>
-              rules={[
+              <Form.Item
-                {
+                name={["actual_completion"]}
-                  required: true
+                label={t("jobs.fields.actual_completion")}
-                  //message: t("general.validation.required"),
+                rules={[
-                }
+                  {
-              ]}
+                    required: true
-            >
+                    //message: t("general.validation.required"),
-              <FormDateTimePickerComponent disabled={jobRO} />
+                  }
-            </Form.Item>
+                ]}
+              >
+                <FormDateTimePickerComponent disabled={jobRO} />
+              </Form.Item>
 
-            <Form.Item name={["actual_delivery"]} label={t("jobs.fields.actual_delivery")}>
+              <Form.Item name={["actual_delivery"]} label={t("jobs.fields.actual_delivery")}>
-              <FormDateTimePickerComponent disabled={jobRO} />
+                <FormDateTimePickerComponent disabled={jobRO} />
-            </Form.Item>
+              </Form.Item>
-          </>
+            </>
-        )}
+          )}
 
-        <Space wrap>
+          <Space wrap>
-          <Button type="primary" onClick={() => form.submit()} loading={loading}>
+            <Button type="primary" onClick={() => form.submit()} loading={loading}>
-            {t("general.actions.save")}
+              {t("general.actions.save")}
-          </Button>
+            </Button>
-        </Space>
+          </Space>
-      </Form>
+        </Form>
+      )}
     </div>
   );
 

client/src/components/jobs-documents-gallery/jobs-document-gallery.reassign.component.jsx

@@ -1,14 +1,14 @@
 import { useApolloClient } from "@apollo/client";
 import { Button, Form, Popover, Space } from "antd";
 import axios from "axios";
-import React, { useMemo, useState } from "react";
+import { useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
+import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
 import { GET_DOC_SIZE_BY_JOB } from "../../graphql/documents.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import JobSearchSelect from "../job-search-select/job-search-select.component";
-import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -134,7 +134,7 @@ export function JobsDocumentsGalleryReassign({ bodyshop, galleryImages, callback
           ]}
           name={"jobid"}
         >
-          <JobSearchSelect />
+          <JobSearchSelect notExported={false} notInvoiced={false} />
         </Form.Item>
       </Form>
       <Space>

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

@@ -1,5 +1,5 @@
 import { Button, Form, Popover, Space } from "antd";
-import React, { useState } from "react";
+import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -60,7 +60,7 @@ export function JobsDocumentsLocalGalleryReassign({ bodyshop, jobid, allMedia, g
           ]}
           name={"jobid"}
         >
-          <JobSearchSelect />
+          <JobSearchSelect notExported={false} notInvoiced={false}/>
         </Form.Item>
       </Form>
       <Space>

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

@@ -19,6 +19,7 @@ import LockWrapperComponent from "../lock-wrapper/lock-wrapper.component";
 import PartsReceiveModalContainer from "../parts-receive-modal/parts-receive-modal.container";
 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";
 
 const mapStateToProps = createStructuredSelector({
   jobRO: selectJobReadOnly,
@@ -66,19 +67,20 @@ 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
+        linkText={""}
+        urlOverride={`${window.location.origin}/manage/jobs/${job.id}?partsorderid=${record.id}&tab=partssublet `}
+      />
       {showView && (
         <Button
+          icon={<EyeFilled />}
           onClick={() => {
             handleOnRowClick(record);
           }}
-        >
+        />
-          <EyeFilled />
-        </Button>
       )}
-
       <Button
         disabled={jobRO || record.return || record.vendor.id === bodyshop.inhousevendorid}
         onClick={() => {
@@ -106,6 +108,7 @@ export function PartsOrderListTableComponent({
       </Button>
       <Button
         title={t("tasks.buttons.create")}
+        icon={<FaTasks />}
         onClick={() => {
           setTaskUpsertContext({
             context: {
@@ -114,9 +117,7 @@ export function PartsOrderListTableComponent({
             }
           });
         }}
-      >
+      />
-        <FaTasks />
-      </Button>
       <Popconfirm
         title={t("parts_orders.labels.confirmdelete")}
         disabled={jobRO}
@@ -137,9 +138,7 @@ export function PartsOrderListTableComponent({
           });
         }}
       >
-        <Button disabled={jobRO}>
+        <Button disabled={jobRO} icon={<DeleteFilled />} />
-          <DeleteFilled />
-        </Button>
       </Popconfirm>
 
       <Button

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

@@ -1,17 +1,16 @@
 import { DeleteFilled, DownOutlined, WarningFilled } from "@ant-design/icons";
 import { useSplitTreatments } from "@splitsoftware/splitio-react";
 import { Checkbox, Divider, Dropdown, Form, Input, InputNumber, Radio, Select, Space, Tag } from "antd";
-import React from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
 import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
 import VendorSearchSelect from "../vendor-search-select/vendor-search-select.component";
 import PartsOrderModalPriceChange from "./parts-order-modal-price-change.component";
-import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -33,7 +32,7 @@ export function PartsOrderModalComponent({ bodyshop, vendorList, sendTypeState,
   });
 
   const { t } = useTranslation();
-  const handleClick = ({ item, key, keyPath }) => {
+  const handleClick = ({ item }) => {
     form.setFieldsValue({ comments: item.props.value });
   };
 
@@ -98,17 +97,18 @@ export function PartsOrderModalComponent({ bodyshop, vendorList, sendTypeState,
             <Checkbox />
           </Form.Item>
         )}
-
+        {!isReturn && (
-        <Form.Item name="order_type" initialValue="parts_order" label={t("parts_orders.labels.order_type")}>
+          <Form.Item name="order_type" initialValue="parts_order" label={t("parts_orders.labels.order_type")}>
-          <Radio.Group disabled={sendType === "oec"}>
+            <Radio.Group disabled={sendType === "oec"}>
-            <Radio value={"parts_order"}>{t("parts_orders.labels.parts_order")}</Radio>
+              <Radio value={"parts_order"}>{t("parts_orders.labels.parts_order")}</Radio>
-            <Radio value={"sublet"}>{t("parts_orders.labels.sublet_order")}</Radio>
+              <Radio value={"sublet"}>{t("parts_orders.labels.sublet_order")}</Radio>
-          </Radio.Group>
+            </Radio.Group>
-        </Form.Item>
+          </Form.Item>
+        )}
       </LayoutFormRow>
       <Divider orientation="left">{t("parts_orders.labels.inthisorder")}</Divider>
       <Form.List name={["parts_order_lines", "data"]}>
-        {(fields, { add, remove, move }) => {
+        {(fields, { remove, move }) => {
           return (
             <div>
               {fields.map((field, index) => (

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

@@ -1,9 +1,13 @@
 import { Button, Input, Space, Spin } from "antd";
-import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
-import { ExclamationCircleFilled, ExclamationCircleOutlined } from "@ant-design/icons";
+import {
+  ExclamationCircleFilled,
+  ExclamationCircleOutlined,
+  UserDeleteOutlined,
+  UsergroupDeleteOutlined
+} from "@ant-design/icons";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import EmployeeSearchSelectComponent from "../employee-search-select/employee-search-select.component";
 
@@ -19,12 +23,13 @@ export default connect(mapStateToProps, mapDispatchToProps)(ProductionBoardFilte
 
 export function ProductionBoardFilters({ bodyshop, filter, setFilter, loading }) {
   const { t } = useTranslation();
-  const [alertFilter, setAlertFilter] = useState(false);
 
   const toggleAlertFilter = () => {
-    const newAlertFilter = !alertFilter;
+    setFilter({ ...filter, alert: !filter.alert });
-    setAlertFilter(newAlertFilter);
+  };
-    setFilter({ ...filter, alert: newAlertFilter });
+
+  const toggleUnassignedFilter = () => {
+    setFilter({ ...filter, unassigned: !filter.unassigned });
   };
 
   return (
@@ -46,12 +51,19 @@ export function ProductionBoardFilters({ bodyshop, filter, setFilter, loading })
         allowClear
       />
       <Button
-        type={alertFilter ? "primary" : "default"}
+        type={filter?.alert ? "primary" : "default"}
         onClick={toggleAlertFilter}
-        icon={alertFilter ? <ExclamationCircleFilled /> : <ExclamationCircleOutlined />}
+        icon={filter?.alert ? <ExclamationCircleFilled /> : <ExclamationCircleOutlined />}
       >
         {t("production.labels.alerts")}
       </Button>
+      <Button
+        type={filter?.unassigned ? "primary" : "default"}
+        onClick={toggleUnassignedFilter}
+        icon={filter?.unassigned ? <UserDeleteOutlined /> : <UsergroupDeleteOutlined />}
+      >
+        {t("production.labels.unassigned")}
+      </Button>
     </Space>
   );
 }

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

@@ -20,6 +20,8 @@ import dayjs from "../../utils/day";
 
 import JobPartsQueueCount from "../job-parts-queue-count/job-parts-queue-count.component";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+import ShareToTeamsButton from "../share-to-teams/share-to-teams.component.jsx";
+import { PiMicrosoftTeamsLogo } from "react-icons/pi";
 
 const cardColor = (ssbuckets, totalHrs) => {
   const bucket = ssbuckets.find((bucket) => bucket.gte <= totalHrs && (!bucket.lt || bucket.lt > totalHrs));
@@ -417,9 +419,20 @@ export default function ProductionBoardCard({ technician, card, bodyshop, cardSe
       title={!isBodyEmpty ? headerContent : null}
       extra={
         !isBodyEmpty && (
-          <Link to={{ search: `?selected=${card.id}` }}>
+          <Space>
-            <EyeFilled />
+            <ShareToTeamsButton
-          </Link>
+              noIcon={true}
+              linkText={
+                <div className="share-to-teams-badge">
+                  <PiMicrosoftTeamsLogo />
+                </div>
+              }
+              urlOverride={`${window.location.origin}/manage/jobs/${card.id}`}
+            />
+            <Link to={{ search: `?selected=${card.id}` }}>
+              <EyeFilled />
+            </Link>
+          </Space>
         )
       }
     >

client/src/components/production-board-kanban/production-board-kanban.styles.scss

@@ -10,6 +10,16 @@
 .height-preserving-container {
 }
 
+.share-to-teams-badge {
+  background-color: #cccccc;
+  border-radius: 50%;
+  width: 24px;
+  height: 24px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
 .react-trello-column-header {
   font-weight: bold;
   cursor: pointer;

client/src/components/production-board-kanban/production-board-kanban.utils.js

@@ -29,7 +29,7 @@ const sortByParentId = (arr) => {
 
 // Function to create board data based on statuses and jobs, with optional filtering
 export const createBoardData = ({ statuses, data, filter, cardSettings }) => {
-  const { search, employeeId, alert } = filter;
+  const { search, employeeId, alert, unassigned } = filter;
 
   const lanes = statuses.map((status) => ({
     id: status,
@@ -40,6 +40,13 @@ export const createBoardData = ({ statuses, data, filter, cardSettings }) => {
   let filteredJobs =
     (search === "" || !search) && !employeeId ? data : data.filter((job) => checkFilter(search, employeeId, job));
 
+  // Apply "Unassigned" filter
+  if (unassigned) {
+    filteredJobs = filteredJobs.filter(
+      (job) => !job.employee_body && !job.employee_prep && !job.employee_refinish && !job.employee_csr
+    );
+  }
+
   // Filter jobs by selectedMdInsCos if it has values
   if (cardSettings?.selectedMdInsCos?.length > 0) {
     filteredJobs = filteredJobs.filter((job) => cardSettings.selectedMdInsCos.includes(job.ins_co_nm));

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

@@ -1,6 +1,6 @@
 import { useMutation } from "@apollo/client";
 import { Button, Card, Col, Form, Popover, Row, Tabs } from "antd";
-import React, { useEffect, useState } from "react";
+import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { UPDATE_KANBAN_SETTINGS } from "../../../graphql/user.queries.js";
 import { defaultKanbanSettings, mergeWithDefaults } from "./defaultKanbanSettings.js";
@@ -11,6 +11,7 @@ import FilterSettings from "./FilterSettings.jsx";
 import PropTypes from "prop-types";
 import { isFunction } from "lodash";
 import { useNotification } from "../../../contexts/Notifications/notificationContext.jsx";
+import { SettingOutlined } from "@ant-design/icons";
 
 function ProductionBoardKanbanSettings({ associationSettings, parentLoading, bodyshop, data, onSettingsChange }) {
   const [form] = Form.useForm();
@@ -153,7 +154,7 @@ function ProductionBoardKanbanSettings({ associationSettings, parentLoading, bod
 
   return (
     <Popover content={overlay} open={open} placement="topRight">
-      <Button loading={loading} onClick={() => setOpen(!open)}>
+      <Button icon={<SettingOutlined />} loading={loading} onClick={() => setOpen(!open)}>
         {t("production.settings.board_settings")}
       </Button>
     </Popover>

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

@@ -27,6 +27,7 @@ import ProductionListColumnNote from "./production-list-columns.productionnote.c
 import ProductionListColumnCategory from "./production-list-columns.status.category";
 import ProductionListColumnStatus from "./production-list-columns.status.component";
 import ProductionListColumnTouchTime from "./prodution-list-columns.touchtime.component";
+import ShareToTeamsButton from "../share-to-teams/share-to-teams.component.jsx";
 
 const getEmployeeName = (employeeId, employees) => {
   const employee = employees.find((e) => e.id === employeeId);
@@ -41,7 +42,17 @@ const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatme
       dataIndex: "viewdetail",
       key: "viewdetail",
       ellipsis: true,
-      render: (text, record) => <Link to={{ search: `?selected=${record.id}` }}>{i18n.t("general.labels.view")}</Link>
+      render: (text, record) => (
+        <Space>
+          <Link to={{ search: `?selected=${record.id}` }}>{i18n.t("general.labels.view")}</Link>
+          <ShareToTeamsButton
+            noIcon={true}
+            linkText={"Share"}
+            noIconStyle={{ color: "#1890ff" }}
+            urlOverride={`${window.location.origin}/manage/jobs/${record.id}`}
+          />
+        </Space>
+      )
     },
     ...(Enhanced_Payroll.treatment === "on"
       ? [

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

@@ -1,5 +1,5 @@
 import { Button, Dropdown } from "antd";
-import React, { useState } from "react";
+import { useState } from "react";
 import { TemplateList } from "../../utils/TemplateConstants";
 import { useTranslation } from "react-i18next";
 import { GenerateDocument } from "../../utils/RenderTemplate";
@@ -7,6 +7,7 @@ import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
+import { PrinterFilled } from "@ant-design/icons";
 
 const ProdTemplates = TemplateList("production");
 const { production_by_technician_one, production_by_category_one, production_by_repair_status_one } =
@@ -123,7 +124,9 @@ export function ProductionListPrint({ bodyshop }) {
 
   return (
     <Dropdown trigger="click" menu={menu}>
-      <Button loading={loading}>{t("general.labels.print")}</Button>
+      <Button icon={<PrinterFilled />} loading={loading}>
+        {t("general.labels.print")}
+      </Button>
     </Dropdown>
   );
 }

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

@@ -0,0 +1,111 @@
+import PropTypes from "prop-types";
+import { Button } from "antd";
+import { useLocation } from "react-router-dom";
+import { PiMicrosoftTeamsLogo } from "react-icons/pi";
+import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { selectBodyshop } from "../../redux/user/user.selectors.js";
+
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop
+});
+
+/**
+ * ShareToTeamsButton component for sharing content to Microsoft Teams via an HTTP link.
+ *
+ * This component creates a button or link that opens the Microsoft Teams share dialog with
+ * the provided URL, title, and message text through query parameters. The popup window is centered on the screen.
+ *
+ * @param {Object} props - The component's props.
+ * @param {string} [props.messageTextOverride] - Custom message text for sharing.
+ * @param {string} [props.urlOverride] - Custom URL to share instead of the current page's URL.
+ * @param {string} [props.pageTitleOverride] - Custom title for the shared page.
+ * @param {boolean} [props.noIcon=false] - If true, renders as a simple text link instead of a button with an icon.
+ * @param {Object} [props.noIconStyle={}] - Style object for the text link when noIcon is true.
+ * @param {Object} [props.buttonStyle={}] - Style object for the Ant Design button.
+ * @param {Object} [props.buttonIconStyle={}] - Style object for the icon within the button.
+ * @param {string} [props.linkText] - Text to display on the button or link.
+ * @returns {React.ReactElement} A button or text link for sharing to Microsoft Teams.
+ */
+const ShareToTeamsComponent = ({
+  bodyshop,
+  messageTextOverride,
+  urlOverride,
+  pageTitleOverride,
+  noIcon = false,
+  noIconStyle = {},
+  buttonStyle = {},
+  buttonIconStyle = {},
+  linkText
+}) => {
+  const location = useLocation();
+  const { t } = useTranslation();
+
+  const currentUrl =
+    urlOverride ||
+    encodeURIComponent(`${window.location.origin}${location.pathname}${location.search}${location.hash}`);
+  const pageTitle =
+    pageTitleOverride ||
+    encodeURIComponent(typeof document !== "undefined" ? document.title : t("general.actions.sharetoteams"));
+  const messageText = messageTextOverride || encodeURIComponent(t("general.actions.sharetoteams"));
+
+  // Construct the Teams share URL with parameters
+  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 = () => {
+    const screenWidth = window.screen.width;
+    const screenHeight = window.screen.height;
+    const windowWidth = 600;
+    const windowHeight = 400;
+
+    const left = screenWidth / 2 - windowWidth / 2;
+    const top = screenHeight / 2 - windowHeight / 2;
+
+    const windowFeatures = `width=${windowWidth},height=${windowHeight},left=${left},top=${top}`;
+
+    // noinspection JSIgnoredPromiseFromCall
+    window.open(teamsShareUrl, "_blank", windowFeatures);
+  };
+
+  // Feature is disabled
+  if (!bodyshop?.md_functionality_toggles?.teams) {
+    return null;
+  }
+
+  if (noIcon) {
+    return (
+      <div style={{ cursor: "pointer", ...noIconStyle }} onClick={handleShare}>
+        {!linkText ? t("general.actions.sharetoteams") : linkText}
+      </div>
+    );
+  }
+
+  return (
+    <Button
+      style={{
+        backgroundColor: "#6264A7",
+        borderColor: "#6264A7",
+        color: "#FFFFFF",
+        ...buttonStyle
+      }}
+      icon={<PiMicrosoftTeamsLogo style={{ color: "#FFFFFF", ...buttonIconStyle }} />}
+      onClick={handleShare}
+      title={linkText === null ? t("general.actions.sharetoteams") : linkText}
+    />
+  );
+};
+
+ShareToTeamsComponent.propTypes = {
+  messageTextOverride: PropTypes.string,
+  urlOverride: PropTypes.string,
+  pageTitleOverride: PropTypes.string,
+  noIcon: PropTypes.bool,
+  noIconStyle: PropTypes.object,
+  buttonStyle: PropTypes.object,
+  buttonIconStyle: PropTypes.object,
+  linkText: PropTypes.oneOfType([PropTypes.string, PropTypes.node])
+};
+
+export default connect(mapStateToProps)(ShareToTeamsComponent);

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

@@ -14,7 +14,7 @@ import FormItemEmail from "../form-items-formatted/email-form-item.component";
 import PhoneFormItem, { PhoneItemFormatterValidation } from "../form-items-formatted/phone-form-item.component";
 import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
-// TODO: Client Update, this might break
+
 const timeZonesList = Intl.supportedValuesOf("timeZone");
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -642,6 +642,15 @@ export function ShopInfoGeneral({ form, bodyshop }) {
           <Input />
         </Form.Item>
       </LayoutFormRow>
+      <LayoutFormRow header={t("bodyshop.labels.shop_enabled_features")} id="sharing">
+        <Form.Item
+          label={t("general.actions.sharetoteams")}
+          valuePropName="checked"
+          name={["md_functionality_toggles", "teams"]}
+        >
+          <Switch />
+        </Form.Item>
+      </LayoutFormRow>
       <LayoutFormRow grow header={t("bodyshop.labels.messagingpresets")} id="messagingpresets">
         <Form.List name={["md_messaging_presets"]}>
           {(fields, { add, remove, move }) => {

client/src/components/shop-info/shop-info.parts-scan.jsx

@@ -1,16 +1,27 @@
-import {DeleteFilled} from "@ant-design/icons";
+import { DeleteFilled } from "@ant-design/icons";
-import {Button, Col, Form, Input, Row, Select, Space, Switch} from "antd";
+import { Button, Col, Form, Input, Row, Select, Space, Switch } from "antd";
-import React, {useMemo} from "react";
+import { useMemo } from "react";
-import {useTranslation} from "react-i18next";
+import { useTranslation } from "react-i18next";
 import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
+import i18n from "i18next";
 
-const predefinedPartTypes = [
+const predefinedPartTypes = ["PAN", "PAC", "PAR", "PAL", "PAA", "PAM", "PAP", "PAS", "PASL", "PAG"];
-  "PAN", "PAC", "PAR", "PAL", "PAA", "PAM", "PAP", "PAS", "PASL", "PAG"
-];
 const predefinedModLbrTypes = [
-  "LAA", "LAB", "LAD", "LAE", "LAF", "LAG", "LAM", "LAR", "LAS", "LAU",
+  "LAA",
-  "LA1", "LA2", "LA3", "LA4"
+  "LAB",
+  "LAD",
+  "LAE",
+  "LAF",
+  "LAG",
+  "LAM",
+  "LAR",
+  "LAS",
+  "LAU",
+  "LA1",
+  "LA2",
+  "LA3",
+  "LA4"
 ];
 
 const getFieldType = (field) => {
@@ -20,30 +31,46 @@ const getFieldType = (field) => {
   return null;
 };
 
-export default function ShopInfoPartsScan({form}) {
+const fieldSelectOptions = [
-  const {t} = useTranslation();
+  { label: i18n.t("joblines.fields.line_desc"), value: "line_desc" },
+  { label: i18n.t("joblines.fields.part_type"), value: "part_type" },
+  { label: i18n.t("joblines.fields.act_price"), value: "act_price" },
+  { label: i18n.t("joblines.fields.part_qty"), value: "part_qty" },
+  { label: i18n.t("joblines.fields.mod_lbr_ty"), value: "mod_lbr_ty" },
+
+  {
+    label: `${i18n.t("joblines.fields.oem_partno")} / ${i18n.t("joblines.fields.alt_partno")}`,
+    value: "part_number"
+  },
+  { label: i18n.t("joblines.fields.op_code_desc"), value: "op_code_desc" }
+];
+export default function ShopInfoPartsScan({ form }) {
+  const { t } = useTranslation();
 
   const watchedFields = Form.useWatch("md_parts_scan", form);
 
-  const operationOptions = useMemo(() => ({
+  const operationOptions = useMemo(
-    string: [
+    () => ({
-      {label: t("bodyshop.operations.contains"), value: "contains"},
+      string: [
-      {label: t("bodyshop.operations.equals"), value: "equals"},
+        { label: t("bodyshop.operations.contains"), value: "contains" },
-      {label: t("bodyshop.operations.starts_with"), value: "startsWith"},
+        { label: t("bodyshop.operations.equals"), value: "equals" },
-      {label: t("bodyshop.operations.ends_with"), value: "endsWith"},
+        { label: t("bodyshop.operations.starts_with"), value: "startsWith" },
-    ],
+        { label: t("bodyshop.operations.ends_with"), value: "endsWith" }
-    number: [
+      ],
-      {label: t("bodyshop.operations.equals"), value: "="},
+      number: [
-      {label: t("bodyshop.operations.greater_than"), value: ">"},
+        { label: t("bodyshop.operations.equals"), value: "=" },
-      {label: t("bodyshop.operations.less_than"), value: "<"},
+        { label: t("bodyshop.operations.greater_than"), value: ">" },
-    ],
+        { label: t("bodyshop.operations.less_than"), value: "<" }
-  }), [t]);
+      ]
+    }),
+    [t]
+  );
 
   return (
     <div>
       <LayoutFormRow header={t("bodyshop.labels.md_parts_scan")}>
         <Form.List name={["md_parts_scan"]}>
-          {(fields, {add, remove, move}) => (
+          {(fields, { add, remove, move }) => (
             <div>
               {fields.map((field, index) => {
                 const selectedField = watchedFields?.[index]?.field || "line_desc";
@@ -61,28 +88,17 @@ export default function ShopInfoPartsScan({form}) {
                             {
                               required: true,
                               message: t("general.validation.required", {
-                                label: t("bodyshop.fields.md_parts_scan.field"),
+                                label: t("bodyshop.fields.md_parts_scan.field")
-                              }),
+                              })
-                            },
+                            }
                           ]}
                         >
                           <Select
-                            options={[
+                            options={fieldSelectOptions}
-                              {label: t("joblines.fields.line_desc"), value: "line_desc"},
-                              {label: t("joblines.fields.part_type"), value: "part_type"},
-                              {label: t("joblines.fields.act_price"), value: "act_price"},
-                              {label: t("joblines.fields.part_qty"), value: "part_qty"},
-                              {label: t("joblines.fields.mod_lbr_ty"), value: "mod_lbr_ty"},
-                              {label: t("joblines.fields.mod_lb_hrs"), value: "mod_lb_hrs"},
-                              {
-                                label: `${t("joblines.fields.oem_partno")} / ${t("joblines.fields.alt_partno")}`,
-                                value: "part_number"
-                              },
-                            ]}
                             onChange={() => {
                               form.setFields([
-                                {name: ["md_parts_scan", index, "operation"], value: "contains"},
+                                { name: ["md_parts_scan", index, "operation"], value: "contains" },
-                                {name: ["md_parts_scan", index, "value"], value: undefined},
+                                { name: ["md_parts_scan", index, "value"], value: undefined }
                               ]);
                             }}
                           />
@@ -99,12 +115,12 @@ export default function ShopInfoPartsScan({form}) {
                               {
                                 required: true,
                                 message: t("general.validation.required", {
-                                  label: t("bodyshop.fields.md_parts_scan.operation"),
+                                  label: t("bodyshop.fields.md_parts_scan.operation")
-                                }),
+                                })
-                              },
+                              }
                             ]}
                           >
-                            <Select options={operationOptions[fieldType]}/>
+                            <Select options={operationOptions[fieldType]} />
                           </Form.Item>
                         </Col>
                       )}
@@ -119,9 +135,9 @@ export default function ShopInfoPartsScan({form}) {
                               {
                                 required: true,
                                 message: t("general.validation.required", {
-                                  label: t("bodyshop.fields.md_parts_scan.value"),
+                                  label: t("bodyshop.fields.md_parts_scan.value")
-                                }),
+                                })
-                              },
+                              }
                             ]}
                           >
                             {fieldType === "predefined" ? (
@@ -129,17 +145,17 @@ export default function ShopInfoPartsScan({form}) {
                                 options={
                                   selectedField === "part_type"
                                     ? predefinedPartTypes.map((type) => ({
-                                      label: type,
+                                        label: type,
-                                      value: type
+                                        value: type
-                                    }))
+                                      }))
                                     : predefinedModLbrTypes.map((type) => ({
-                                      label: type,
+                                        label: type,
-                                      value: type
+                                        value: type
-                                    }))
+                                      }))
                                 }
                               />
                             ) : (
-                              <Input/>
+                              <Input />
                             )}
                           </Form.Item>
                         </Col>
@@ -152,19 +168,70 @@ export default function ShopInfoPartsScan({form}) {
                             label={t("bodyshop.fields.md_parts_scan.caseInsensitive")}
                             name={[field.name, "caseInsensitive"]}
                             valuePropName="checked"
-                            labelCol={{span: 14}}
+                            initialValue={true}
-                            wrapperCol={{span: 10}}
+                            labelCol={{ span: 14 }}
+                            wrapperCol={{ span: 10 }}
                           >
-                            <Switch defaultChecked={true}/>
+                            <Switch />
                           </Form.Item>
                         </Col>
                       )}
 
+                      {/* Mark Line as Critical */}
+                      <Col span={4}>
+                        <Form.Item
+                          label={t("bodyshop.fields.md_parts_scan.mark_critical")}
+                          name={[field.name, "mark_critical"]}
+                          valuePropName="checked"
+                          initialValue={true}
+                          labelCol={{ span: 14 }}
+                          wrapperCol={{ span: 10 }}
+                        >
+                          <Switch />
+                        </Form.Item>
+                      </Col>
+
+                      {/* Update Field */}
+                      <Col span={4}>
+                        <Form.Item
+                          label={t("bodyshop.fields.md_parts_scan.update_field")}
+                          name={[field.name, "update_field"]}
+                        >
+                          <Select
+                            options={fieldSelectOptions}
+                            allowClear
+                            onClear={() =>
+                              form.setFields([{ name: ["md_parts_scan", index, "update_field"], value: null }])
+                            }
+                          />
+                        </Form.Item>
+                      </Col>
+
+                      {/* Update Field */}
+                      <Col span={4}>
+                        <Form.Item
+                          label={t("bodyshop.fields.md_parts_scan.update_value")}
+                          name={[field.name, "update_value"]}
+                          dependencies={[["md_parts_scan", index, "update_field"]]}
+                          tooltip={t("bodyshop.tooltips.md_parts_scan.update_value_tooltip")}
+                          rules={[
+                            {
+                              required: form.getFieldValue(["md_parts_scan", index, "update_field"]),
+                              message: t("general.validation.required", {
+                                label: t("bodyshop.fields.md_parts_scan.update_value")
+                              })
+                            }
+                          ]}
+                        >
+                          <Input />
+                        </Form.Item>
+                      </Col>
+
                       {/* Actions */}
                       <Col span={2}>
                         <Space>
-                          <DeleteFilled onClick={() => remove(field.name)}/>
+                          <DeleteFilled onClick={() => remove(field.name)} />
-                          <FormListMoveArrows move={move} index={index} total={fields.length}/>
+                          <FormListMoveArrows move={move} index={index} total={fields.length} />
                         </Space>
                       </Col>
                     </Row>
@@ -175,8 +242,8 @@ export default function ShopInfoPartsScan({form}) {
               <Form.Item>
                 <Button
                   type="dashed"
-                  onClick={() => add({field: "line_desc", operation: "contains"})}
+                  onClick={() => add({ field: "line_desc", operation: "contains" })}
-                  style={{width: "100%"}}
+                  style={{ width: "100%" }}
                 >
                   {t("bodyshop.actions.addpartsrule")}
                 </Button>

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

@@ -18,6 +18,7 @@ import { setModalContext } from "../../redux/modals/modals.actions";
 import { pageLimit } from "../../utils/config";
 import { DateFormatter, DateTimeFormatter } from "../../utils/DateFormatter.jsx";
 import dayjs from "../../utils/day";
+import ShareToTeamsButton from "../share-to-teams/share-to-teams.component.jsx";
 
 /**
  * Task List Component
@@ -266,8 +267,13 @@ function TaskListComponent({
       width: "8%",
       render: (text, record) => (
         <Space direction="horizontal">
+          <ShareToTeamsButton
+            linkText=""
+            urlOverride={`${window.location.origin}/manage/tasks/alltasks?taskid=${record.id}`}
+          />
           <Button
             title={t("tasks.buttons.edit")}
+            icon={<EditFilled />}
             onClick={() => {
               setTaskUpsertContext({
                 context: {
@@ -276,18 +282,18 @@ function TaskListComponent({
                 }
               });
             }}
-          >
+          />
-            <EditFilled />
-          </Button>
           <Button
             title={t("tasks.buttons.complete")}
             onClick={() => toggleCompletedStatus(record.id, record.completed)}
-          >
+            icon={record.completed ? <CheckCircleOutlined /> : <CheckCircleFilled />}
-            {record.completed ? <CheckCircleOutlined /> : <CheckCircleFilled />}
+          />
-          </Button>
+
-          <Button title={t("tasks.buttons.delete")} onClick={() => toggleDeletedStatus(record.id, record.deleted)}>
+          <Button
-            {record.deleted ? <DeleteOutlined /> : <DeleteFilled />}
+            title={t("tasks.buttons.delete")}
-          </Button>
+            onClick={() => toggleDeletedStatus(record.id, record.deleted)}
+            icon={record.deleted ? <DeleteOutlined /> : <DeleteFilled />}
+          />
         </Space>
       )
     }

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

@@ -1,6 +1,6 @@
 import { useMutation, useQuery } from "@apollo/client";
 import { Form, Modal } from "antd";
-import React, { useEffect, useMemo, useState } from "react";
+import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -35,7 +35,7 @@ export function TaskUpsertModalContainer({ bodyshop, currentUser, taskUpsert, to
   const [insertTask] = useMutation(MUTATION_INSERT_NEW_TASK);
   const [updateTask] = useMutation(MUTATION_UPDATE_TASK);
   const { open, context } = taskUpsert;
-  const { jobid, joblineid, billid, partsorderid, taskId, existingTask, query } = context;
+  const { jobid, joblineid, billid, partsorderid, taskId, existingTask, query, view } = context;
   const [form] = Form.useForm();
   const [selectedJobId, setSelectedJobId] = useState(null);
   const [selectedJobDetails, setSelectedJobDetails] = useState(null);
@@ -255,16 +255,17 @@ export function TaskUpsertModalContainer({ bodyshop, currentUser, taskUpsert, to
     }
   };
 
-  const taskTitle = useMemo(() => {
-    return existingTask ? t("tasks.actions.edit") : t("tasks.actions.new");
-  }, [existingTask, t]);
-
   return (
     <Modal
-      title={<span id="task-upsert-modal-title">{taskTitle}</span>}
+      title={
+        <span id="task-upsert-modal-title">
+          {view ? t("tasks.actions.view") : existingTask ? t("tasks.actions.edit") : t("tasks.actions.new")}
+        </span>
+      }
       open={open}
       okText={t("general.actions.save")}
       width="50%"
+      cancelText={!isTouched ? t("general.actions.ok") : t("general.actions.cancel")}
       onOk={() => {
         removeTaskIdFromUrl();
         form.submit();
@@ -289,6 +290,7 @@ export function TaskUpsertModalContainer({ bodyshop, currentUser, taskUpsert, to
           loading={loading || (taskId && taskLoading)}
           error={error}
           data={data}
+          view={view}
           existingTask={existingTask || taskData?.tasks_by_pk}
           selectedJobId={selectedJobId}
           setSelectedJobId={setSelectedJobId}

client/src/graphql/apollo-error-handling.js

@@ -1,12 +1,10 @@
 import { onError } from "@apollo/client/link/error";
 //https://stackoverflow.com/questions/57163454/refreshing-a-token-with-apollo-client-firebase-auth
-import * as Sentry from "@sentry/react";
 
 const errorLink = onError(({ graphQLErrors, networkError, operation, forward }) => {
   if (graphQLErrors) {
     graphQLErrors.forEach(({ message, locations, path }) => {
       console.log(`[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`);
-      Sentry.captureException({ message, locations, path });
     });
   }
   if (networkError) console.log(`[Network error]: ${JSON.stringify(networkError)}`);

client/src/graphql/jobs.queries.js

@@ -1890,6 +1890,7 @@ export const QUERY_JOB_CLOSE_DETAILS = gql`
       kmout
       qb_multiple_payers
       lbr_adjustments
+      ownr_ea
       payments {
         amount
         created_at

client/src/index.jsx

@@ -1,10 +1,12 @@
+import "./utils/sentry"; //Must be first.
 import * as Sentry from "@sentry/react";
+import { ConfigProvider } from "antd";
 import Dinero from "dinero.js";
-import React from "react";
 import ReactDOM from "react-dom/client";
 import { Provider } from "react-redux";
 import { createBrowserRouter, createRoutesFromElements, Route, RouterProvider } from "react-router-dom";
 import { PersistGate } from "redux-persist/integration/react";
+import { registerSW } from "virtual:pwa-register";
 import AppContainer from "./App/App.container";
 import LoadingSpinner from "./components/loading-spinner/loading-spinner.component";
 import "./index.css";
@@ -12,56 +14,18 @@ import { persistor, store } from "./redux/store";
 import reportWebVitals from "./reportWebVitals";
 import "./translations/i18n";
 import "./utils/CleanAxios";
-import { ConfigProvider } from "antd";
-import InstanceRenderManager from "./utils/instanceRenderMgr";
-import { registerSW } from "virtual:pwa-register";
 
 window.global ||= window;
 
 registerSW({ immediate: true });
-//import { BrowserTracing } from "@sentry/tracing";
-//import "antd/dist/antd.css";
-// import "antd/dist/antd.less";
 
 // Dinero.defaultCurrency = "CAD";
 // Dinero.globalLocale = "en-CA";
 Dinero.globalRoundingMode = "HALF_EVEN";
 
-if (import.meta.env.PROD) {
+const sentryCreateBrowserRouter = Sentry.wrapCreateBrowserRouterV6(createBrowserRouter);
-  Sentry.init({
-    dsn: InstanceRenderManager({
-      imex: "https://fd7e89369b6b4bdc9c6c4c9f22fa4ee4@o492140.ingest.sentry.io/5651027",
-      rome: "https://a6acc91c073e414196014b8484627a61@o492140.ingest.sentry.io/4504561071161344"
-    }),
 
-    ignoreErrors: [
+const router = sentryCreateBrowserRouter(createRoutesFromElements(<Route path="*" element={<AppContainer />} />));
-      "ResizeObserver loop",
-      "ResizeObserver loop limit exceeded",
-      "Module specifier, 'fs' does not start",
-      "Module specifier, 'zlib' does not start with"
-    ],
-    integrations: [
-      Sentry.replayIntegration({
-        maskAllText: false,
-        blockAllMedia: true
-      }),
-      Sentry.browserTracingIntegration()
-    ],
-    tracePropagationTargets: [
-      "api.imex.online",
-      "api.test.imex.online",
-      "db.imex.online",
-      "api.romeonline.io",
-      "api.test.romeonline.io",
-      "db.romeonline.io"
-    ],
-    tracesSampleRate: 1.0,
-    replaysOnErrorSampleRate: 1.0,
-    environment: import.meta.env.MODE
-  });
-}
-
-const router = createBrowserRouter(createRoutesFromElements(<Route path="*" element={<AppContainer />} />));
 
 if (import.meta.env.DEV) {
   let styles =

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

@@ -1,4 +1,5 @@
-import { DeleteFilled } from "@ant-design/icons";
+import { DeleteFilled, PrinterFilled } from "@ant-design/icons";
+import { PageHeader } from "@ant-design/pro-layout";
 import { useApolloClient, useMutation } from "@apollo/client";
 import {
   Alert,
@@ -16,32 +17,31 @@ import {
   Switch,
   Typography
 } from "antd";
-import { PageHeader } from "@ant-design/pro-layout";
+import { useState } from "react";
-
-import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 // import { useNavigate } from 'react-router-dom';
 import { useSplitTreatments } from "@splitsoftware/splitio-react";
 import Dinero from "dinero.js";
-import dayjs from "../../utils/day";
 import { Link } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
 import DateTimePicker from "../../components/form-date-time-picker/form-date-time-picker.component";
 import FormsFieldChanged from "../../components/form-fields-changed-alert/form-fields-changed-alert.component";
 import CurrencyInput from "../../components/form-items-formatted/currency-form-item.component";
+import JobCloseRoGuardContainer from "../../components/job-close-ro-guard/job-close-ro-guard.container";
 import JobsScoreboardAdd from "../../components/job-scoreboard-add-button/job-scoreboard-add-button.component";
 import JobsCloseAutoAllocate from "../../components/jobs-close-auto-allocate/jobs-close-auto-allocate.component";
 import JobsCloseLines from "../../components/jobs-close-lines/jobs-close-lines.component";
 import LayoutFormRow from "../../components/layout-form-row/layout-form-row.component";
+import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
 import { generateJobLinesUpdatesForInvoicing } from "../../graphql/jobs-lines.queries";
 import { UPDATE_JOB } from "../../graphql/jobs.queries";
 import { insertAuditTrail } from "../../redux/application/application.actions";
 import { selectJobReadOnly } from "../../redux/application/application.selectors";
+import { setModalContext } from "../../redux/modals/modals.actions.js";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import AuditTrailMapping from "../../utils/AuditTrailMappings";
-import JobCloseRoGuardContainer from "../../components/job-close-ro-guard/job-close-ro-guard.container";
+import dayjs from "../../utils/day";
-import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -49,10 +49,17 @@ const mapStateToProps = createStructuredSelector({
 });
 
 const mapDispatchToProps = (dispatch) => ({
-  insertAuditTrail: ({ jobid, operation, type }) => dispatch(insertAuditTrail({ jobid, operation, type }))
+  insertAuditTrail: ({ jobid, operation, type }) => dispatch(insertAuditTrail({ jobid, operation, type })),
+  setPrintCenterContext: (context) =>
+    dispatch(
+      setModalContext({
+        context: context,
+        modal: "printCenter"
+      })
+    )
 });
 
-export function JobsCloseComponent({ job, bodyshop, jobRO, insertAuditTrail }) {
+export function JobsCloseComponent({ job, bodyshop, jobRO, insertAuditTrail, setPrintCenterContext }) {
   const { t } = useTranslation();
   const [form] = Form.useForm();
   const client = useApolloClient();
@@ -171,7 +178,6 @@ export function JobsCloseComponent({ job, bodyshop, jobRO, insertAuditTrail }) {
           extra={
             <Space>
               <JobsCloseAutoAllocate joblines={job.joblines} form={form} disabled={!!job.date_exported || jobRO} />
-
               <Popconfirm
                 onConfirm={() => form.submit()}
                 disabled={jobRO}
@@ -188,6 +194,21 @@ export function JobsCloseComponent({ job, bodyshop, jobRO, insertAuditTrail }) {
                   <Button disabled={job.date_exported || !jobRO}>{t("jobs.actions.sendtodms")}</Button>
                 </Link>
               )}
+              <Button
+                onClick={() => {
+                  setPrintCenterContext({
+                    context: {
+                      id: job.id,
+                      job: job,
+                      type: "job"
+                    }
+                  });
+                }}
+                key="printing"
+                icon={<PrinterFilled />}
+              >
+                {t("jobs.actions.printCenter")}
+              </Button>
               <JobsScoreboardAdd job={job} disabled={false} />
             </Space>
           }

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

@@ -142,7 +142,7 @@ export function Manage({ conflict, bodyshop, alerts, setAlerts }) {
         const fetchedAlerts = await response.json();
         setAlerts(fetchedAlerts);
       } catch (error) {
-        console.error("Error fetching alerts:", error);
+        console.warn("Error fetching alerts:", error.message);
       }
     };
 

client/src/pages/tasks/allTasksPageContainer.jsx

@@ -46,7 +46,8 @@ export function AllTasksPageContainer({ setBreadcrumbs, setSelectedHeader, setTa
     if (taskId) {
       setTaskUpsertContext({
         context: {
-          taskId
+          taskId,
+          view: true
         }
       });
       urlParams.delete("taskid");

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

@@ -235,7 +235,12 @@ export function* signInSuccessSaga({ payload }) {
 
   try {
     window.$crisp.push(["set", "user:nickname", [payload.displayName || payload.email]]);
-    window.$crisp.push(["set", "session:segments", [["user"]]]);
+    const currentUserSegment = InstanceRenderManager({
+      imex: "imex-online-user",
+      rome: "rome-online-user"
+    });
+    window.$crisp.push(["set", "session:segments", [[currentUserSegment]]]);
+
     InstanceRenderManager({
       executeFunction: true,
       args: [],
@@ -342,8 +347,11 @@ export function* SetAuthLevelFromShopDetails({ payload }) {
           window.$zoho.salesiq.visitor.info({ "Shop Name": payload.shopname });
         }
       });
+      payload.features?.allAccess === true
+        ? window.$crisp.push(["set", "session:segments", [["allAccess"]]])
+        : window.$crisp.push(["set", "session:segments", [["basic"]]]);
     } catch (error) {
-      console.error("Couldnt find $crisp.");
+      console.warn("Couldnt find $crisp.", error.message);
     }
   } catch (error) {
     yield put(signInFailure(error.message));

client/src/utils/GraphQLClient.js

@@ -7,9 +7,9 @@ import { getMainDefinition } from "@apollo/client/utilities";
 //import { split } from "apollo-link";
 import apolloLogger from "apollo-link-logger";
 //import axios from "axios";
+import { SentryLink } from "apollo-link-sentry";
 import { auth } from "../firebase/firebase.utils";
 import errorLink from "../graphql/apollo-error-handling";
-import { SentryLink } from "apollo-link-sentry";
 
 //import { store } from "../redux/store";
 const httpLink = new HttpLink({

client/src/utils/RenderTemplate.js

@@ -9,7 +9,6 @@ import client from "../utils/GraphQLClient";
 import cleanAxios from "./CleanAxios";
 import { TemplateList } from "./TemplateConstants";
 import { generateTemplate } from "./graphQLmodifier";
-import InstanceRenderManager from "./instanceRenderMgr";
 
 const server = import.meta.env.VITE_APP_REPORTS_SERVER_URL;
 
@@ -39,7 +38,7 @@ export default async function RenderTemplate(
   jsreport.headers["Authorization"] = jsrAuth;
 
   //Query assets that match the template name. Must be in format <<templateName>>.query
-  let { contextData, useShopSpecificTemplate } = await fetchContextData(templateObject, jsrAuth);
+  let { contextData, useShopSpecificTemplate, shopSpecificFolder } = await fetchContextData(templateObject, jsrAuth);
 
   const { ignoreCustomMargins } = Templates[templateObject.name];
 
@@ -74,14 +73,8 @@ export default async function RenderTemplate(
       ...contextData,
       ...templateObject.variables,
       ...templateObject.context,
-      headerpath: `/${InstanceRenderManager({
+      headerpath: shopSpecificFolder ? `/${bodyshop.imexshopid}/header.html` : `/GENERIC/header.html`,
-        imex: bodyshop.imexshopid,
+      footerpath: shopSpecificFolder ? `/${bodyshop.imexshopid}/footer.html` : `/GENERIC/footer.html`,
-        rome: bodyshop.imexshopid
-      })}/header.html`,
-      footerpath: `/${InstanceRenderManager({
-        imex: bodyshop.imexshopid,
-        rome: bodyshop.imexshopid
-      })}/footer.html`,
       bodyshop: bodyshop,
       filters: templateObject?.filters,
       sorters: templateObject?.sorters,
@@ -149,11 +142,12 @@ export async function RenderTemplates(templateObjects, bodyshop, renderAsHtml =
   templateObjects.forEach((template) => {
     proms.push(
       (async () => {
-        let { contextData, useShopSpecificTemplate } = await fetchContextData(template, jsrAuth);
+        let { contextData, useShopSpecificTemplate, shopSpecificFolder } = await fetchContextData(template, jsrAuth);
         unsortedTemplatesAndData.push({
           templateObject: template,
           contextData,
-          useShopSpecificTemplate
+          useShopSpecificTemplate,
+          shopSpecificFolder
         });
       })()
     );
@@ -248,8 +242,8 @@ export async function RenderTemplates(templateObjects, bodyshop, renderAsHtml =
 
       // ...rootTemplate.templateObject.variables,
       // ...rootTemplate.templateObject.context,
-      headerpath: `/${bodyshop.imexshopid}/header.html`,
+      headerpath: rootTemplate.shopSpecificFolder ? `/${bodyshop.imexshopid}/header.html` : `/GENERIC/header.html`,
-      footerpath: `/${bodyshop.imexshopid}/footer.html`,
+      footerpath: rootTemplate.shopSpecificFolder ? `/${bodyshop.imexshopid}/footer.html` : `/GENERIC/footer.html`,
       bodyshop: bodyshop,
       offset: bodyshop.timezone
     }
@@ -397,10 +391,10 @@ const fetchContextData = async (templateObject, jsrAuth) => {
       });
       contextData = data;
     }
-    return { contextData, useShopSpecificTemplate };
+    return { contextData, useShopSpecificTemplate, shopSpecificFolder };
   }
 
-  return await generateTemplate(templateQueryToExecute, templateObject, useShopSpecificTemplate);
+  return await generateTemplate(templateQueryToExecute, templateObject, useShopSpecificTemplate, shopSpecificFolder);
 };
 
 //export const displayTemplateInWindow = (html) => {

client/src/utils/graphQLmodifier.js

@@ -1,6 +1,6 @@
+import { gql } from "@apollo/client";
 import { Kind, parse, print, visit } from "graphql";
 import client from "./GraphQLClient";
-import { gql } from "@apollo/client";
 
 /* eslint-disable no-loop-func */
 
@@ -114,9 +114,10 @@ export function printQuery(query) {
  * @param templateQueryToExecute
  * @param templateObject
  * @param useShopSpecificTemplate
- * @returns {Promise<{contextData: {}, useShopSpecificTemplate}>}
+ * @param shopSpecificTemplate
+ * @returns {Promise<{contextData: {}, useShopSpecificTemplate, shopSpecificTemplate}>}
  */
-export async function generateTemplate(templateQueryToExecute, templateObject, useShopSpecificTemplate) {
+export async function generateTemplate(templateQueryToExecute, templateObject, useShopSpecificTemplate, shopSpecificFolder) {
   // Advanced Filtering and Sorting modifications start here
 
   // Parse the query and apply the filters and sorters
@@ -147,7 +148,7 @@ export async function generateTemplate(templateQueryToExecute, templateObject, u
     contextData = data;
   }
 
-  return { contextData, useShopSpecificTemplate };
+  return { contextData, useShopSpecificTemplate, shopSpecificFolder };
 }
 
 /**

client/src/utils/sentry.js

@@ -0,0 +1,63 @@
+import * as Sentry from "@sentry/react";
+import { excludeGraphQLFetch } from "apollo-link-sentry";
+import { useEffect } from "react";
+import { createRoutesFromChildren, matchRoutes, useLocation, useNavigationType } from "react-router-dom";
+import InstanceRenderManager from "./instanceRenderMgr";
+
+const currentDatePST = new Date()
+  .toLocaleDateString("en-US", {
+    timeZone: "America/Los_Angeles",
+    year: "numeric",
+    month: "2-digit",
+    day: "2-digit"
+  })
+  .split("/")
+  .reverse()
+  .join("-");
+const sentryRelease =
+  `${import.meta.env.VITE_APP_IS_TEST ? "test" : "production"}-${currentDatePST}-${process.env.VITE_GIT_COMMIT_HASH}`.trim();
+
+if (!import.meta.env.DEV) {
+  Sentry.init({
+    dsn: InstanceRenderManager({
+      imex: "https://fd7e89369b6b4bdc9c6c4c9f22fa4ee4@o492140.ingest.sentry.io/5651027",
+      rome: "https://a6acc91c073e414196014b8484627a61@o492140.ingest.sentry.io/4504561071161344"
+    }),
+    release: sentryRelease,
+
+    ignoreErrors: [
+      "ResizeObserver loop",
+      "ResizeObserver loop limit exceeded",
+      "Module specifier, 'fs' does not start",
+      "Module specifier, 'zlib' does not start with",
+      "Messaging: This browser doesn't support the API's required to use the Firebase SDK.",
+      "Failed to update a ServiceWorker for scope"
+    ],
+    integrations: [
+      // See docs for support of different versions of variation of react router
+      // https://docs.sentry.io/platforms/javascript/guides/react/configuration/integrations/react-router/
+      Sentry.reactRouterV6BrowserTracingIntegration({
+        useEffect,
+        useLocation,
+        useNavigationType,
+        createRoutesFromChildren,
+        matchRoutes
+      }),
+      Sentry.replayIntegration(),
+      Sentry.browserProfilingIntegration()
+    ],
+
+    tracePropagationTargets: [
+      "api.imex.online",
+      "api.test.imex.online",
+      "db.imex.online",
+      "api.romeonline.io",
+      "api.test.romeonline.io",
+      "db.romeonline.io"
+    ],
+    tracesSampleRate: 1.0,
+    replaysOnErrorSampleRate: 1.0,
+    environment: import.meta.env.MODE,
+    beforeBreadcrumb: excludeGraphQLFetch
+  });
+}

client/vite.config.js

@@ -1,16 +1,31 @@
+import { sentryVitePlugin } from "@sentry/vite-plugin";
 import react from "@vitejs/plugin-react";
+import chalk from "chalk";
+import * as child from "child_process";
 import { promises as fsPromises } from "fs";
 import { createLogger, defineConfig } from "vite";
 import { ViteEjsPlugin } from "vite-plugin-ejs";
 import eslint from "vite-plugin-eslint";
 import { VitePWA } from "vite-plugin-pwa";
 import InstanceRenderManager from "./src/utils/instanceRenderMgr";
-import chalk from "chalk";
-//import { visualizer } from "rollup-plugin-visualizer";
 
+// Ensure your environment variables are set correctly for Vite 6
 process.env.VITE_APP_GIT_SHA_DATE = new Date().toLocaleString("en-US", {
   timeZone: "America/Los_Angeles"
 });
+const commitHash = child.execSync("git rev-parse HEAD").toString().trimEnd();
+process.env.VITE_GIT_COMMIT_HASH = commitHash;
+
+const currentDatePST = new Date()
+  .toLocaleDateString("en-US", {
+    timeZone: "America/Los_Angeles",
+    year: "numeric",
+    month: "2-digit",
+    day: "2-digit"
+  })
+  .split("/")
+  .reverse()
+  .join("-");
 
 const getFormattedTimestamp = () =>
   new Date().toLocaleTimeString("en-US", { hour12: true }).replace("AM", "a.m.").replace("PM", "p.m.");
@@ -22,7 +37,7 @@ export const logger = createLogger("info", {
 export default defineConfig({
   base: "/",
   plugins: [
-    //visualizer(),
+    // Ensure all plugins are Vite 6 compatible
     ViteEjsPlugin((viteConfig) => ({ env: viteConfig.env })),
     VitePWA({
       injectRegister: "auto",
@@ -31,14 +46,12 @@ export default defineConfig({
         short_name: InstanceRenderManager({
           instance: process.env.VITE_APP_INSTANCE,
           imex: "ImEX Online",
-          rome: "Rome Online",
+          rome: "Rome Online"
-          
         }),
         name: InstanceRenderManager({
           instance: process.env.VITE_APP_INSTANCE,
           imex: "ImEX Online",
-          rome: "Rome Online",
+          rome: "Rome Online"
-          
         }),
         description: "The ultimate bodyshop management system.",
         icons: [
@@ -46,7 +59,7 @@ export default defineConfig({
             src: InstanceRenderManager({
               instance: process.env.VITE_APP_INSTANCE,
               imex: "favicon.png",
-              rome: "ro-favicon.png",
+              rome: "ro-favicon.png"
             }),
             sizes: "64x64 32x32 24x24 16x16",
             type: "image/x-icon"
@@ -55,7 +68,7 @@ export default defineConfig({
             src: InstanceRenderManager({
               instance: process.env.VITE_APP_INSTANCE,
               imex: "logo192.png",
-              rome: "logo192.png",
+              rome: "logo192.png"
             }),
             type: "image/png",
             sizes: "192x192"
@@ -64,7 +77,7 @@ export default defineConfig({
             src: InstanceRenderManager({
               instance: process.env.VITE_APP_INSTANCE,
               imex: "logo512.png",
-              rome: "ro-favicon.png",
+              rome: "ro-favicon.png"
             }),
             type: "image/png",
             sizes: "512x512"
@@ -73,17 +86,32 @@ export default defineConfig({
         theme_color: InstanceRenderManager({
           instance: process.env.VITE_APP_INSTANCE,
           imex: "#1890ff",
-          rome: "#fff",
+          rome: "#fff"
         }),
         background_color: "#fff",
         gcm_sender_id: "103953800507"
       }
     }),
     react(),
-    eslint()
+    eslint(),
+    sentryVitePlugin({
+      org: "imex",
+      reactComponentAnnotation: {
+        enabled: true
+      },
+      release: {
+        name: `${process.env.VITE_APP_IS_TEST ? "test" : "production"}-${currentDatePST}-${commitHash}`.trim()
+      },
+      project: InstanceRenderManager({
+        instance: process.env.VITE_APP_INSTANCE,
+        imex: "imexonline",
+        rome: "rome-online"
+      })
+    })
   ],
   define: {
-    APP_VERSION: JSON.stringify(process.env.npm_package_version)
+    APP_VERSION: JSON.stringify(process.env.npm_package_version),
+    __COMMIT_HASH__: JSON.stringify(commitHash)
   },
   server: {
     host: true,
@@ -186,7 +214,9 @@ export default defineConfig({
           "libphonenumber-js": ["libphonenumber-js"]
         }
       }
-    }
+    },
+
+    sourcemap: true
   },
   optimizeDeps: {
     include: [
@@ -204,8 +234,10 @@ export default defineConfig({
       "react-redux"
     ],
     esbuildOptions: {
+      // Update for Vite 6: Use proper file extensions
       loader: {
-        ".js": "jsx"
+        ".jsx": "jsx",
+        ".tsx": "tsx"
       }
     }
   },

hasura/metadata/cron_triggers.yaml

@@ -39,3 +39,11 @@
   headers:
     - name: event-secret
       value_from_env: EVENT_SECRET
+- name: Rome Usage Report
+  webhook: '{{HASURA_API_URL}}/data/usagereport'
+  schedule: 0 12 * * 5
+  include_in_metadata: true
+  payload: {}
+  headers:
+    - name: x-imex-auth
+      value_from_env: DATAPUMP_AUTH

package.json

@@ -19,12 +19,12 @@
     "makeitpretty": "prettier --write \"**/*.{css,js,json,jsx,scss}\""
   },
   "dependencies": {
-    "@aws-sdk/client-cloudwatch-logs": "^3.693.0",
+    "@aws-sdk/client-cloudwatch-logs": "^3.738.0",
-    "@aws-sdk/client-elasticache": "^3.693.0",
+    "@aws-sdk/client-elasticache": "^3.738.0",
-    "@aws-sdk/client-s3": "^3.693.0",
+    "@aws-sdk/client-s3": "^3.738.0",
-    "@aws-sdk/client-secrets-manager": "^3.693.0",
+    "@aws-sdk/client-secrets-manager": "^3.738.0",
-    "@aws-sdk/client-ses": "^3.693.0",
+    "@aws-sdk/client-ses": "^3.738.0",
-    "@aws-sdk/credential-provider-node": "^3.693.0",
+    "@aws-sdk/credential-provider-node": "^3.738.0",
     "@opensearch-project/opensearch": "^2.13.0",
     "@socket.io/admin-ui": "^0.5.1",
     "@socket.io/redis-adapter": "^8.3.0",
@@ -33,7 +33,6 @@
     "better-queue": "^3.8.12",
     "bluebird": "^3.7.2",
     "body-parser": "^1.20.3",
-    "canvas": "^2.11.2",
     "chart.js": "^4.4.6",
     "cloudinary": "^2.5.1",
     "compression": "^1.7.5",
@@ -41,31 +40,31 @@
     "cors": "2.8.5",
     "crisp-status-reporter": "^1.2.2",
     "csrf": "^3.1.0",
-    "dd-trace": "^5.28.0",
+    "dd-trace": "^5.33.1",
     "dinero.js": "^1.9.1",
     "dotenv": "^16.4.5",
     "express": "^4.21.1",
-    "firebase-admin": "^13.0.0",
+    "firebase-admin": "^13.0.2",
-    "graphql": "^16.9.0",
+    "graphql": "^16.10.0",
     "graphql-request": "^6.1.0",
-    "inline-css": "^4.0.2",
+    "inline-css": "^4.0.3",
     "intuit-oauth": "^4.1.3",
-    "ioredis": "^5.4.1",
+    "ioredis": "^5.4.2",
-    "json-2-csv": "^5.5.6",
+    "json-2-csv": "^5.5.8",
     "juice": "^11.0.0",
     "lodash": "^4.17.21",
     "moment": "^2.30.1",
-    "moment-timezone": "^0.5.46",
+    "moment-timezone": "^0.5.47",
     "multer": "^1.4.5-lts.1",
     "node-mailjet": "^6.0.6",
-    "node-persist": "^4.0.3",
+    "node-persist": "^4.0.4",
-    "nodemailer": "^6.9.16",
+    "nodemailer": "^6.10.0",
-    "phone": "^3.1.53",
+    "phone": "^3.1.58",
     "recursive-diff": "^1.0.9",
     "redis": "^4.7.0",
     "rimraf": "^6.0.1",
-    "skia-canvas": "^2.0.0",
+    "skia-canvas": "^2.0.2",
-    "soap": "^1.1.6",
+    "soap": "^1.1.7",
     "socket.io": "^4.8.1",
     "socket.io-adapter": "^2.5.5",
     "ssh2-sftp-client": "^11.0.0",
@@ -77,12 +76,12 @@
     "xmlbuilder2": "^3.1.1"
   },
   "devDependencies": {
-    "@eslint/js": "^9.15.0",
+    "@eslint/js": "^9.19.0",
     "@trivago/prettier-plugin-sort-imports": "^4.3.0",
     "concurrently": "^8.2.2",
-    "eslint": "^9.15.0",
+    "eslint": "^9.19.0",
-    "eslint-plugin-react": "^7.37.2",
+    "eslint-plugin-react": "^7.37.4",
-    "globals": "^15.12.0",
+    "globals": "^15.14.0",
     "p-limit": "^3.1.0",
     "prettier": "^3.3.3",
     "source-map-explorer": "^2.5.2"

server.js

@@ -28,7 +28,11 @@ const logger = require("./server/utils/logger");
 const { applyRedisHelpers } = require("./server/utils/redisHelpers");
 const { applyIOHelpers } = require("./server/utils/ioHelpers");
 const { redisSocketEvents } = require("./server/web-sockets/redisSocketEvents");
-const { ElastiCacheClient, DescribeCacheClustersCommand } = require("@aws-sdk/client-elasticache");
+const {
+  ElastiCacheClient,
+  DescribeCacheClustersCommand,
+  DescribeReplicationGroupsCommand
+} = require("@aws-sdk/client-elasticache");
 const { InstanceRegion } = require("./server/utils/instanceMgr");
 const StartStatusReporter = require("./server/utils/statusReporter");
 
@@ -124,26 +128,48 @@ const applyRoutes = ({ app }) => {
  * @returns {Promise<string[]>}
  */
 const getRedisNodesFromAWS = async () => {
-  const client = new ElastiCacheClient({
+  const client = new ElastiCacheClient({ region: InstanceRegion() });
-    region: InstanceRegion()
-  });
-
-  const params = {
-    ReplicationGroupId: process.env.REDIS_CLUSTER_ID,
-    ShowCacheNodeInfo: true
-  };
 
   try {
-    // Fetch the cache clusters associated with the replication group
+    const describeReplicationGroupCommand = new DescribeReplicationGroupsCommand({
-    const command = new DescribeCacheClustersCommand(params);
+      ReplicationGroupId: process.env.REDIS_CLUSTER_ID
-    const response = await client.send(command);
+    });
-    const cacheClusters = response.CacheClusters;
+    const describeReplicationGroupResponse = await client.send(describeReplicationGroupCommand);
 
-    return cacheClusters.flatMap((cluster) =>
+    //TODO: add checking to make sure there's only 1.
-      cluster.CacheNodes.map((node) => `${node.Endpoint.Address}:${node.Endpoint.Port}`)
+    const cacheClusterIds = describeReplicationGroupResponse.ReplicationGroups[0].MemberClusters;
-    );
+
+    // Ensure cacheClusters exists and is an array
+    if (!cacheClusterIds || !Array.isArray(cacheClusterIds) || cacheClusterIds.length === 0) {
+      logger.log(`No cache clusters found for cluster id ${process.env.REDIS_CLUSTER_ID}`, "ERROR", "redis", "api");
+      return [];
+    }
+
+    const nodeEndpointAddresses = [];
+
+    for (const cluster of cacheClusterIds) {
+      const params = { CacheClusterId: cluster, ShowCacheNodeInfo: true };
+      const command = new DescribeCacheClustersCommand(params);
+      const response = await client.send(command);
+
+      if (response.CacheClusters && Array.isArray(response.CacheClusters)) {
+        // Map nodes to address strings
+        //TODO: What happens if we have more shards?
+        const nodeAddress = `${response.CacheClusters[0].CacheNodes[0].Endpoint.Address}:${response.CacheClusters[0].CacheNodes[0].Endpoint.Port}`;
+        // Debug log node addresses
+        logger.log(`Cluster node addresses: ${nodeAddress}`, "DEBUG", "redis", "api");
+        // Return only those addresses that start with the current cluster id
+        nodeEndpointAddresses.push(nodeAddress);
+      }
+    }
+
+    return nodeEndpointAddresses;
+    // Process each cluster
   } catch (err) {
-    logger.log(`Error fetching Redis nodes from AWS: ${err.message}`, "ERROR", "redis", "api");
+    logger.log(`Error fetching Redis nodes from AWS:`, "ERROR", "redis", "api", {
+      message: err?.message,
+      stack: err?.stack
+    });
     throw err;
   }
 };

server/data/usageReport.js

@@ -55,7 +55,7 @@ exports.default = async (req, res) => {
     const csv = converter.json2csv(shopList, { emptyFieldValue: "" });
     emailer
       .sendTaskEmail({
-        to: ["patrick.fic@convenient-brands.com", "bradley.rhoades@convenient-brands.com"],
+        to: ["patrick.fic@convenient-brands.com", "bradley.rhoades@convenient-brands.com", "jrome@rometech.com"],
         subject: `RO Usage Report - ${moment().format("MM/DD/YYYY")}`,
         text: `
 Usage Report for ${moment().format("MM/DD/YYYY")} for Rome Online Customers. 

server/email/sendemail.js

@@ -55,7 +55,7 @@ const sendServerEmail = async ({ subject, text }) => {
           imex: `ImEX Online API - ${process.env.NODE_ENV} <noreply@imex.online>`,
           rome: `Rome Online API - ${process.env.NODE_ENV} <noreply@romeonline.io>`
         }),
-        to: ["patrick@imexsystems.ca", "support@thinkimex.com"],
+        to: ["support@thinkimex.com"],
         subject: subject,
         text: text,
         ses: {
@@ -92,7 +92,7 @@ const sendTaskEmail = async ({ to, subject, type = "text", html, text, attachmen
       },
       (err, info) => {
         // (message, type, user, record, meta
-        logger.log("server-email", err ? "error" : "debug", null, null, { message: err || info });
+        logger.log("server-email", err ? "error" : "debug", null, null, { message: err ? err?.message : info });
       }
     );
   } catch (error) {
@@ -239,24 +239,24 @@ const emailBounce = async (req, res) => {
         return;
       }
       //If it's bounced, log it as bounced in audit log. Send an email to the user.
-      const result = await client.request(queries.UPDATE_EMAIL_AUDIT, {
+      await client.request(queries.UPDATE_EMAIL_AUDIT, {
         sesid: messageId,
         status: "Bounced",
         context: message.bounce?.bouncedRecipients
       });
       mailer.sendMail(
         {
-          from: InstanceMgr({
+          from: InstanceManager({
             imex: `ImEX Online <noreply@imex.online>`,
             rome: `Rome Online <noreply@romeonline.io>`
           }),
           to: replyTo,
           //bcc: "patrick@snapt.ca",
-          subject: `${InstanceMgr({
+          subject: `${InstanceManager({
             imex: "ImEX Online",
             rome: "Rome Online"
           })} Bounced Email - RE: ${subject}`,
-          text: `${InstanceMgr({
+          text: `${InstanceManager({
             imex: "ImEX Online",
             rome: "Rome Online"
           })} has tried to deliver an email with the subject: ${subject} to the intended recipients but encountered an error.
@@ -270,7 +270,7 @@ ${body.bounce?.bouncedRecipients.map(
         },
         (err, info) => {
           logger.log("sns-error", err ? "error" : "debug", "api", null, {
-            message: err ? JSON.stringify(error) : info
+            message: err ? err?.message : info
           });
         }
       );

server/graphql-client/queries.js

@@ -2241,6 +2241,7 @@ exports.QUERY_PARTS_SCAN = `query QUERY_PARTS_SCAN ($id: uuid!) {
       mod_lb_hrs
       oem_partno
       alt_partno
+      op_code_desc
     }
   }
 }`;
@@ -2252,7 +2253,7 @@ exports.UPDATE_PARTS_CRITICAL = `mutation UPDATE_PARTS_CRITICAL ($IdsToMarkCriti
   notcritical: update_joblines(where: {id: {_nin: $IdsToMarkCritical}, jobid: {_eq: $jobid}}, _set: {critical: false}) {
     affected_rows
   }
-}`
+}`;
 
 exports.ACTIVE_SHOP_BY_USER = `query ACTIVE_SHOP_BY_USER($user: String) {
   associations(where: {active: {_eq: true}, useremail: {_eq: $user}}) {
@@ -2618,7 +2619,6 @@ exports.CREATE_CONVERSATION = `mutation CREATE_CONVERSATION($conversation: [conv
 }
 `;
 
-
 exports.STATUS_UPDATE = `query STATUS_UPDATE($period: timestamptz!, $today: timestamptz!) {
   bodyshops(where: { created_at: { _gte: $period } }) {
     shopname
@@ -2689,4 +2689,19 @@ exports.STATUS_UPDATE = `query STATUS_UPDATE($period: timestamptz!, $today: time
     }
   }
 }
-`
+`;
+
+exports.INSERT_AUDIT_TRAIL = `
+  mutation INSERT_AUDIT_TRAIL($auditObj: audit_trail_insert_input!) {
+    insert_audit_trail_one(object: $auditObj) {
+      id
+      jobid
+      billid
+      bodyshopid
+      created
+      operation
+      type
+      useremail
+    }
+  }
+`;

server/opensearch/os-handler.js

@@ -99,6 +99,7 @@ async function OpenSearchUpdateHandler(req, res) {
           break;
         case "payments":
           //Query to get the job and RO number
+
           const payment = await client.request(
             `query ADMIN_GET_PAYMENT_BY_ID($paymentId: uuid!) {
                 payments_by_pk(id: $paymentId) {
@@ -147,11 +148,25 @@ async function OpenSearchUpdateHandler(req, res) {
         body: document
       };
 
+      logger.log("os-handler", "DEBUG", null, null, {
+        id: req.body.event.data.new.id,
+        index: req.body.table.name,
+        bodyshopid: payload.body.bodyshopid
+        // body: document
+      });
+
       const response = await osClient.index(payload);
       //console.log(response.body);
       res.status(200).json(response.body);
     }
   } catch (error) {
+    logger.log("os-handler-error", "ERROR", null, null, {
+      id: req.body.event.data.new.id,
+      index: req.body.table.name,
+      message: error.message,
+      stack: error.stack
+      // body: document
+    });
     res.status(400).json(JSON.stringify(error));
   }
 }
@@ -166,7 +181,9 @@ async function OpenSearchSearchHandler(req, res) {
     }
 
     logger.log("os-search", "DEBUG", req.user.email, null, {
-      search
+      search,
+      index,
+      bodyshopid
     });
 
     const BearerToken = req.BearerToken;
@@ -187,7 +204,7 @@ async function OpenSearchSearchHandler(req, res) {
       : process.env.BODY_SHOP_ID_MATCH_OVERRIDE;
 
     const { body } = await osClient.search({
-      ...(index ? { index } : {}),
+      ...(index ? { index } : { index: ["jobs", "vehicles", "owners", "bills", "payments"] }),
       body: {
         size: 100,
         query: {
@@ -231,8 +248,8 @@ async function OpenSearchSearchHandler(req, res) {
                           "*ownr_fn^8",
                           "*ownr_co_nm^8",
                           "*ownr_ph1^8",
-                          "*ownr_ph2^8",
+                          "*ownr_ph2^8"
-                          "*"
+                          //  "*"
                         ]
                       }
                     }

server/parts-scan/parts-scan.js

@@ -1,16 +1,25 @@
 const queries = require("../graphql-client/queries");
 const logger = require("../utils/logger");
 
-const predefinedPartTypes = [
+const predefinedPartTypes = ["PAN", "PAC", "PAR", "PAL", "PAA", "PAM", "PAP", "PAS", "PASL", "PAG"];
-  "PAN", "PAC", "PAR", "PAL", "PAA", "PAM", "PAP", "PAS", "PASL", "PAG",
-];
 const predefinedModLbrTypes = [
-  "LAA", "LAB", "LAD", "LAE", "LAF", "LAG", "LAM", "LAR", "LAS", "LAU",
+  "LAA",
-  "LA1", "LA2", "LA3", "LA4",
+  "LAB",
+  "LAD",
+  "LAE",
+  "LAF",
+  "LAG",
+  "LAM",
+  "LAR",
+  "LAS",
+  "LAU",
+  "LA1",
+  "LA2",
+  "LA3",
+  "LA4"
 ];
 
 exports.partsScan = async function (req, res) {
-  console.log('hello')
   const { jobid } = req.body;
   const BearerToken = req.BearerToken;
   const client = req.userGraphQLClient;
@@ -18,10 +27,9 @@ exports.partsScan = async function (req, res) {
   logger.log("job-parts-scan", "DEBUG", req.user?.email, jobid, null);
 
   try {
-    const data = await client.setHeaders({ Authorization: BearerToken }).request(
+    const data = await client
-      queries.QUERY_PARTS_SCAN,
+      .setHeaders({ Authorization: BearerToken })
-      { id: jobid }
+      .request(queries.QUERY_PARTS_SCAN, { id: jobid });
-    );
 
     const rules = data.jobs_by_pk.bodyshop.md_parts_scan || [];
     if (!Array.isArray(rules)) {
@@ -36,21 +44,22 @@ exports.partsScan = async function (req, res) {
           ? new RegExp(rule.value, "i")
           : typeof rule.value === "string"
             ? new RegExp(rule.value)
-            : null,
+            : null
     }));
 
     const criticalIds = new Set();
 
     for (const jobline of data.jobs_by_pk.joblines) {
-      for (const { field, regex, operation, value } of compiledRules) {
+      for (const { field, regex, operation, value, mark_critical, update_field, update_value } of compiledRules) {
-        if (criticalIds.has(jobline.id)) break; // Skip further evaluation if already critical
+        // IO-3077 - Remove skip as this is extended to include line updates.
+        // if (criticalIds.has(jobline.id)) break; // Skip further evaluation if already critical
 
         let jobValue = jobline[field];
         let match = false;
 
         if (field === "part_number") {
           match = regex
-            ? regex.test(jobline.oem_partno || '') || regex.test(jobline.alt_partno || '')
+            ? regex.test(jobline.oem_partno || "") || regex.test(jobline.alt_partno || "")
             : jobline.oem_partno === value || jobline.alt_partno === value;
         } else if (field === "part_type") {
           match = predefinedPartTypes.includes(value) && value === jobValue;
@@ -68,22 +77,44 @@ exports.partsScan = async function (req, res) {
         }
 
         if (match) {
-          criticalIds.add(jobline.id);
+          if (mark_critical) {
-          break; // No need to evaluate further rules for this jobline
+            //Could technically lead to duplicates, but they'd only be n positives, ultimately leading a positive.
+            criticalIds.add(jobline.id);
+          }
+          if (update_field && update_value) {
+            const result = await client.setHeaders({ Authorization: BearerToken }).request(queries.UPDATE_JOB_LINE, {
+              lineId: jobline.id,
+              line: { [update_field]: update_value, manual_line: true }
+            });
+
+            const auditResult = await client
+              .setHeaders({ Authorization: BearerToken })
+              .request(queries.INSERT_AUDIT_TRAIL, {
+                auditObj: {
+                  bodyshopid: data.jobs_by_pk.bodyshop.id,
+                  jobid,
+                  operation: `Jobline (#${jobline.line_no} ${jobline.line_desc}/${jobline.id}) ${update_field} updated from ${jobline[update_field]} to ${update_value}. Lined marked as manual line.`,
+                  type: "partscanupdate",
+                  useremail: req.user.email
+                }
+              });
+          }
+
+          //break; // No need to evaluate further rules for this jobline
         }
       }
     }
 
-    const result = await client.setHeaders({ Authorization: BearerToken }).request(
+    const result = await client
-      queries.UPDATE_PARTS_CRITICAL,
+      .setHeaders({ Authorization: BearerToken })
-      { IdsToMarkCritical: Array.from(criticalIds), jobid }
+      .request(queries.UPDATE_PARTS_CRITICAL, { IdsToMarkCritical: Array.from(criticalIds), jobid });
-    );
 
     res.status(200).json(result);
   } catch (error) {
     logger.log("job-parts-scan-error", "ERROR", req.user?.email, jobid, {
       jobid,
       error: error.message,
+      stack: error.stack
     });
     res.status(400).json(JSON.stringify({ message: error?.message }));
   }

server/render/canvas-handler.js

@@ -1,4 +1,3 @@
-const { createCanvas } = require("canvas");
 const { Canvas, FontLibrary } = require("skia-canvas");
 const Chart = require("chart.js/auto");
 
@@ -65,7 +64,7 @@ const getChartConfiguration = (keys, values, override) => {
   return defaultsDeep(override || {}, defaultConfiguration);
 };
 
-const processCanvasRequest = async (req, res, isSkia = false) => {
+const processCanvasRequest = async (req, res) => {
   const { logger } = req;
   const { w, h, values, keys, override } = req.body;
 
@@ -77,7 +76,6 @@ const processCanvasRequest = async (req, res, isSkia = false) => {
 
   const configuration = getChartConfiguration(keys, values, override);
 
-  // Placeholders to allow fine control over GAC
   let canvas = null;
   let ctx = null;
   let chart = null;
@@ -85,16 +83,15 @@ const processCanvasRequest = async (req, res, isSkia = false) => {
 
   try {
     // Create the canvas
-    canvas = isSkia ? new Canvas(width, height) : createCanvas(width, height);
+    canvas = new Canvas(width, height);
     ctx = canvas.getContext("2d");
 
     // Render the chart
     chart = new Chart(ctx, configuration);
 
     // Generate and send the image
-    chartImage = isSkia ? (await canvas.toBuffer("image/png")).toString("base64") : canvas.toDataURL();
+    chartImage = (await canvas.toBuffer("image/png")).toString("base64");
-
+    res.status(200).send(`data:image/png;base64,${chartImage}`);
-    res.status(200).send(isSkia ? `data:image/png;base64,${chartImage}` : chartImage);
   } catch (error) {
     // Log the error and send the response
     logger.log("canvas-error", "error", "jsr", null, { error: error.message });
@@ -104,27 +101,27 @@ const processCanvasRequest = async (req, res, isSkia = false) => {
     if (chart) {
       chart.destroy();
     }
-    ctx = null; // Explicitly nullify for garbage collection
+    ctx = null;
-    canvas = null; // Explicitly nullify for garbage collection
+    canvas = null;
     chartImage = null;
   }
 };
 
-const enqueueRequest = (req, res, isSkia) => {
+const enqueueRequest = (req, res) => {
   if (requestQueue.length >= CANVAS_QUEUE_LIMIT) {
     res.status(503).send("Server is busy. Please try again later.");
     return false;
   }
-  requestQueue.push({ req, res, isSkia });
+  requestQueue.push({ req, res });
   req.logger.log("inbound-canvas-creation-queue", "debug", "jsr", null, { queue: requestQueue.length });
   return true;
 };
 
 const processNextInQueue = async () => {
   while (requestQueue.length > 0) {
-    const { req, res, isSkia } = requestQueue.shift();
+    const { req, res } = requestQueue.shift();
     try {
-      await processCanvasRequest(req, res, isSkia);
+      await processCanvasRequest(req, res);
     } catch (err) {
       console.error("canvas-queue-error", "error", "jsr", null, { error: err.message });
     }
@@ -137,13 +134,7 @@ exports.canvastest = function (req, res) {
 };
 
 exports.canvas = async (req, res) => {
-  if (isProcessing || !enqueueRequest(req, res, false)) return;
+  if (isProcessing || !enqueueRequest(req, res)) return;
-  isProcessing = true;
-  processNextInQueue().catch((err) => console.error("canvas-processing-error", { error: err.message }));
-};
-
-exports.canvasSkia = async (req, res) => {
-  if (isProcessing || !enqueueRequest(req, res, true)) return;
   isProcessing = true;
   processNextInQueue().catch((err) => console.error("canvas-processing-error", { error: err.message }));
 };

server/routes/renderRoutes.js

@@ -2,12 +2,12 @@ const express = require("express");
 const router = express.Router();
 const { inlinecss } = require("../render/inlinecss");
 const validateFirebaseIdTokenMiddleware = require("../middleware/validateFirebaseIdTokenMiddleware");
-const { canvas, canvasSkia } = require("../render/canvas-handler");
+const { canvas } = require("../render/canvas-handler");
 const validateCanvasInputMiddleware = require("../middleware/validateCanvasInputMiddleware");
 
 // Define the route for inline CSS rendering
 router.post("/inlinecss", validateFirebaseIdTokenMiddleware, inlinecss);
-router.post("/canvas", [validateFirebaseIdTokenMiddleware, validateCanvasInputMiddleware], canvas);
+router.post("/canvas-skia", validateFirebaseIdTokenMiddleware, validateCanvasInputMiddleware, canvas);
-router.post("/canvas-skia", [validateFirebaseIdTokenMiddleware, validateCanvasInputMiddleware], canvasSkia);
+router.post("/canvas", validateFirebaseIdTokenMiddleware, validateCanvasInputMiddleware, canvas);
 
 module.exports = router;