Resolve UI issue.

Remove sentry tracing.

.circleci/config.yml

@@ -0,0 +1,180 @@
+version: 2.1
+orbs:
+  #snyk: snyk/snyk@0.0.8
+  #cypress: cypress-io/cypress@1.23.0
+  aws-s3: circleci/aws-s3@2.0.0
+  eb: circleci/aws-elastic-beanstalk@1.0.2
+  jira: circleci/jira@1.3.1
+jobs:
+  api-deploy:
+    docker:
+      - image: "cimg/base:stable"
+    steps:
+      - checkout
+      - eb/setup
+      - run:
+          command: |
+            eb init imex-online-production-api -r ca-central-1 -p "Node.js 16 running on 64bit Amazon Linux 2"
+            eb status --verbose
+            eb deploy
+            eb status
+      - jira/notify
+
+  hasura-migrate:
+    docker:
+      - image: cimg/node:16.15.0
+    parameters:
+      secret:
+        type: string
+        default: $HASURA_PROD_SECRET
+    working_directory: ~/repo/hasura
+    steps:
+      - checkout:
+          path: ~/repo
+      - run:
+          name: Execute migration
+          command: |
+            npm install hasura-cli -g
+            hasura migrate apply --endpoint https://db.imex.online/ --admin-secret << parameters.secret >>
+            hasura metadata apply --endpoint https://db.imex.online/ --admin-secret << parameters.secret >>
+            hasura metadata reload --endpoint https://db.imex.online/ --admin-secret << parameters.secret >>
+
+  app-build:
+    docker:
+      - image: cimg/node:16.15.0
+
+    working_directory: ~/repo/client
+
+    steps:
+      - checkout:
+          path: ~/repo
+
+      - restore_cache:
+          name: Restore Yarn Package Cache
+          keys:
+            - yarn-packages-{{ checksum "yarn.lock" }}
+      - run:
+          name: Install Dependencies
+          command: yarn install --frozen-lockfile --cache-folder ~/.cache/yarn
+      - save_cache:
+          name: Save Yarn Package Cache
+          key: yarn-packages-{{ checksum "yarn.lock" }}
+          paths:
+            - ~/.cache/yarn
+
+      - run: yarn run build
+
+      - aws-s3/sync:
+          from: build
+          to: "s3://imex-online-production/"
+      - jira/notify
+
+  test-hasura-migrate:
+    docker:
+      - image: cimg/node:16.15.0
+    parameters:
+      secret:
+        type: string
+        default: $HASURA_TEST_SECRET
+    working_directory: ~/repo/hasura
+    steps:
+      - checkout:
+          path: ~/repo
+      - run:
+          name: Execute migration
+          command: |
+            npm install hasura-cli -g
+            echo ${HASURA_TEST_SECRET}
+            hasura migrate apply --endpoint https://db.test.bodyshop.app/ --admin-secret << parameters.secret >>
+            hasura metadata apply --endpoint https://db.test.bodyshop.app/ --admin-secret << parameters.secret >>
+            hasura metadata reload --endpoint https://db.test.bodyshop.app/ --admin-secret << parameters.secret >>
+
+  test-app-build:
+    docker:
+      - image: cimg/node:16.15.0
+
+    working_directory: ~/repo/client
+
+    steps:
+      - checkout:
+          path: ~/repo
+
+      - restore_cache:
+          name: Restore Yarn Package Cache
+          keys:
+            - yarn-packages-{{ checksum "yarn.lock" }}
+      - run:
+          name: Install Dependencies
+          command: yarn install --frozen-lockfile --cache-folder ~/.cache/yarn
+      - save_cache:
+          name: Save Yarn Package Cache
+          key: yarn-packages-{{ checksum "yarn.lock" }}
+          paths:
+            - ~/.cache/yarn
+
+      - run: yarn run build:test
+
+      - aws-s3/sync:
+          from: build
+          to: "s3://imex-online-test/"
+      - jira/notify
+
+  admin-app-build:
+    docker:
+      - image: cimg/node:16.15.0
+
+    working_directory: ~/repo/admin
+
+    steps:
+      - checkout:
+          path: ~/repo
+
+      - restore_cache:
+          keys:
+            - v1-dependencies-{{ checksum "package.json" }}
+            # fallback to using the latest cache if no exact match is found
+            - v1-dependencies-
+      - run: npm i
+
+      - save_cache:
+          paths:
+            - node_modules
+            - ~/.npm
+            - ~/.cache
+          key: v1-dependencies-{{ checksum "package.json" }}
+
+      - run: npm run build
+
+      - aws-s3/sync:
+          from: build
+          to: "s3://adm.imex.online/"
+
+workflows:
+  deploy_and_build:
+    jobs:
+      - api-deploy:
+          filters:
+            branches:
+              only: master
+      - app-build:
+          filters:
+            branches:
+              only: master
+      - hasura-migrate:
+          secret: ${HASURA_PROD_SECRET}
+          filters:
+            branches:
+              only: master
+      - test-app-build:
+          filters:
+            branches:
+              only: test
+      - test-hasura-migrate:
+          secret: ${HASURA_TEST_SECRET}
+          filters:
+            branches:
+              only: test
+      #- admin-app-build:
+      #filters:
+      #branches:
+      #only: master

.eslintrc.json

@@ -17,5 +17,4 @@
     "no-console": "off"
   },
   "settings": {}
-  //"plugins": ["cypress"]
 }

.gitignore

@@ -115,4 +115,6 @@ firebase/.env
 logs/oAuthClient-log.log
 
 
-.node-persist/**
+.node-persist/**
+
+/*.env.*

admin/README.md

@@ -1,68 +0,0 @@
-This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
-
-## Available Scripts
-
-In the project directory, you can run:
-
-### `yarn start`
-
-Runs the app in the development mode.<br />
-Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
-
-The page will reload if you make edits.<br />
-You will also see any lint errors in the console.
-
-### `yarn test`
-
-Launches the test runner in the interactive watch mode.<br />
-See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
-
-### `yarn build`
-
-Builds the app for production to the `build` folder.<br />
-It correctly bundles React in production mode and optimizes the build for the best performance.
-
-The build is minified and the filenames include the hashes.<br />
-Your app is ready to be deployed!
-
-See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
-
-### `yarn eject`
-
-**Note: this is a one-way operation. Once you `eject`, you can’t go back!**
-
-If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
-
-Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
-
-You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
-
-## Learn More
-
-You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
-
-To learn React, check out the [React documentation](https://reactjs.org/).
-
-### Code Splitting
-
-This section has moved here: https://facebook.github.io/create-react-app/docs/code-splitting
-
-### Analyzing the Bundle Size
-
-This section has moved here: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size
-
-### Making a Progressive Web App
-
-This section has moved here: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app
-
-### Advanced Configuration
-
-This section has moved here: https://facebook.github.io/create-react-app/docs/advanced-configuration
-
-### Deployment
-
-This section has moved here: https://facebook.github.io/create-react-app/docs/deployment
-
-### `yarn build` fails to minify
-
-This section has moved here: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify

admin/package.json

@@ -1,47 +0,0 @@
-{
-  "name": "admin",
-  "version": "0.1.0",
-  "private": true,
-  "dependencies": {
-    "@apollo/client": "^3.3.15",
-    "@testing-library/jest-dom": "^5.11.10",
-    "@testing-library/react": "^11.2.6",
-    "@testing-library/user-event": "^13.1.5",
-    "@types/prop-types": "^15.7.3",
-    "apollo-boost": "^0.4.9",
-    "apollo-link-context": "^1.0.20",
-    "apollo-link-logger": "^2.0.0",
-    "dotenv": "^8.2.0",
-    "firebase": "^8.4.1",
-    "graphql": "^15.4.0",
-    "prop-types": "^15.7.2",
-    "ra-data-hasura-graphql": "^0.1.13",
-    "react": "^17.0.1",
-    "react-admin": "^3.14.4",
-    "react-dom": "^17.0.1",
-    "react-icons": "^4.2.0",
-    "react-scripts": "4.0.3",
-    "sass": "^1.32.10"
-  },
-  "scripts": {
-    "start": "set PORT=3001 && react-scripts start",
-    "build": "react-scripts build",
-    "test": "react-scripts test",
-    "eject": "react-scripts eject"
-  },
-  "eslintConfig": {
-    "extends": "react-app"
-  },
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
-  }
-}

admin/public/index.html

@@ -1,43 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <link rel="icon" href="%PUBLIC_URL%/favicon.png" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <meta name="theme-color" content="#000000" />
-    <meta
-      name="description"
-      content="Web site created using create-react-app"
-    />
-    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
-    <!--
-      manifest.json provides metadata used when your web app is installed on a
-      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
-
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
-    <title>ImEX Online - ADMIN</title>
-  </head>
-  <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-    <div id="root"></div>
-    <!--
-      This HTML file is a template.
-      If you open it directly in the browser, you will see an empty page.
-
-      You can add webfonts, meta tags, or analytics to this file.
-      The build step will place the bundled scripts into the <body> tag.
-
-      To begin the development, run `npm start` or `yarn start`.
-      To create a production bundle, use `npm run build` or `yarn build`.
-    -->
-  </body>
-</html>

admin/public/manifest.json

@@ -1,25 +0,0 @@
-{
-  "short_name": "React App",
-  "name": "Create React App Sample",
-  "icons": [
-    {
-      "src": "favicon.ico",
-      "sizes": "64x64 32x32 24x24 16x16",
-      "type": "image/x-icon"
-    },
-    {
-      "src": "logo192.png",
-      "type": "image/png",
-      "sizes": "192x192"
-    },
-    {
-      "src": "logo512.png",
-      "type": "image/png",
-      "sizes": "512x512"
-    }
-  ],
-  "start_url": ".",
-  "display": "standalone",
-  "theme_color": "#000000",
-  "background_color": "#ffffff"
-}

admin/public/robots.txt

@@ -1,3 +0,0 @@
-# https://www.robotstxt.org/robotstxt.html
-User-agent: *
-Disallow:

admin/src/App/App.css

@@ -1,38 +0,0 @@
-.App {
-  text-align: center;
-}
-
-.App-logo {
-  height: 40vmin;
-  pointer-events: none;
-}
-
-@media (prefers-reduced-motion: no-preference) {
-  .App-logo {
-    animation: App-logo-spin infinite 20s linear;
-  }
-}
-
-.App-header {
-  background-color: #282c34;
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  font-size: calc(10px + 2vmin);
-  color: white;
-}
-
-.App-link {
-  color: #61dafb;
-}
-
-@keyframes App-logo-spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}

admin/src/App/App.js

@@ -1,12 +0,0 @@
-import React from "react";
-import AdminRoot from "../components/admin-root/admin-root.component";
-import "./App.css";
-function App() {
-  return (
-    <div className="App">
-      <AdminRoot />
-    </div>
-  );
-}
-
-export default App;

admin/src/App/App.test.js

@@ -1,9 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import App from './App';
-
-test('renders learn react link', () => {
-  const { getByText } = render(<App />);
-  const linkElement = getByText(/learn react/i);
-  expect(linkElement).toBeInTheDocument();
-});

admin/src/Assets/logo.svg

@@ -1,7 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3">
-    <g fill="#61DAFB">
-        <path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/>
-        <circle cx="420.9" cy="296.5" r="45.7"/>
-        <path d="M520.5 78.1z"/>
-    </g>
-</svg>

admin/src/components/admin-root/admin-root.component.jsx

@@ -1,283 +0,0 @@
-import { ApolloClient, ApolloProvider, InMemoryCache } from "@apollo/client";
-import { ApolloLink } from "apollo-boost";
-import { setContext } from "apollo-link-context";
-import { HttpLink } from "apollo-link-http";
-import apolloLogger from "apollo-link-logger";
-import buildHasuraProvider from "ra-data-hasura-graphql";
-import React, { Component } from "react";
-import {
-  Admin,
-  EditGuesser,
-  ListGuesser,
-  Resource,
-  ShowGuesser,
-} from "react-admin";
-import { FaFileInvoiceDollar } from "react-icons/fa";
-import CircularProgress from "@material-ui/core/CircularProgress";
-import { auth } from "../../firebase/admin-firebase-utils";
-import authProvider from "../auth-provider/auth-provider";
-import JoblinesCreate from "../joblines/joblines.create";
-import JoblinesEdit from "../joblines/joblines.edit";
-import JoblinesList from "../joblines/joblines.list";
-import JoblinesShow from "../joblines/joblines.show";
-import JobsCreate from "../jobs/jobs.create";
-import JobsEdit from "../jobs/jobs.edit";
-import JobsList from "../jobs/jobs.list";
-import JobsShow from "../jobs/jobs.show";
-
-const httpLink = new HttpLink({
-  uri: process.env.REACT_APP_GRAPHQL_ENDPOINT,
-  headers: {
-    "x-hasura-admin-secret": `Dev-BodyShopApp!`,
-    // 'Authorization': `Bearer xxxx`,
-  },
-});
-
-const authLink = setContext((_, { headers }) => {
-  return (
-    auth.currentUser &&
-    auth.currentUser.getIdToken().then((token) => {
-      if (token) {
-        return {
-          headers: {
-            ...headers,
-            authorization: token ? `Bearer ${token}` : "",
-          },
-        };
-      } else {
-        return { headers };
-      }
-    })
-  );
-});
-
-const middlewares = [];
-if (process.env.NODE_ENV === "development") {
-  middlewares.push(apolloLogger);
-}
-
-middlewares.push(authLink.concat(httpLink));
-
-const client = new ApolloClient({
-  link: ApolloLink.from(middlewares),
-  cache: new InMemoryCache(),
-});
-
-// const client = new ApolloClient({
-//   uri: process.env.REACT_APP_GRAPHQL_ENDPOINT,
-//   cache: new InMemoryCache(),
-//   headers: {
-//     "x-hasura-admin-secret": `Dev-BodyShopApp!`,
-//     // 'Authorization': `Bearer xxxx`,
-//   },
-// });
-
-class AdminRoot extends Component {
-  constructor() {
-    super();
-    this.state = { dataProvider: null };
-  }
-  componentDidMount() {
-    buildHasuraProvider({
-      client,
-    }).then((dataProvider) => this.setState({ dataProvider }));
-  }
-
-  render() {
-    const { dataProvider } = this.state;
-
-    if (!dataProvider) {
-      return (
-        <div>
-          <CircularProgress />
-        </div>
-      );
-    }
-
-    return (
-      <ApolloProvider client={client}>
-        <Admin dataProvider={dataProvider} authProvider={authProvider}>
-          <Resource
-            icon={FaFileInvoiceDollar}
-            name="jobs"
-            list={JobsList}
-            edit={JobsEdit}
-            create={JobsCreate}
-            show={JobsShow}
-          />
-          <Resource
-            name="joblines"
-            list={JoblinesList}
-            edit={JoblinesEdit}
-            create={JoblinesCreate}
-            show={JoblinesShow}
-          />
-          <Resource
-            name="bodyshops"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="owners"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="vehicles"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="appointments"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="available_jobs"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="cccontracts"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="conversations"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="counters"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="courtesycars"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="csi"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="csiquestions"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="documents"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="employees"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="invoicelines"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="invoices"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="job_conversations"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="masterdata"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="messages"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="notes"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="parts_order_lines"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="parts_orders"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="payments"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="scoreboard"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="templates"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="timetickets"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="users"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-          <Resource
-            name="vendors"
-            list={ListGuesser}
-            edit={EditGuesser}
-            show={ShowGuesser}
-          />
-        </Admin>
-      </ApolloProvider>
-    );
-  }
-}
-
-export default AdminRoot;

admin/src/components/auth-provider/auth-provider.js

@@ -1,39 +0,0 @@
-import { auth, getCurrentUser } from "../../firebase/admin-firebase-utils";
-
-const authProvider = {
-  login: async ({ username, password }) => {
-    console.log(username, password);
-    try {
-      const { user } = await auth.signInWithEmailAndPassword(
-        username,
-        password
-      );
-      const token = await user.getIdToken();
-      localStorage.setItem("token", token);
-      return Promise.resolve();
-    } catch (error) {
-      console.log("error", error);
-      return Promise.reject();
-    }
-  },
-  logout: async (params) => {
-    await auth.signOut();
-    localStorage.removeItem("token");
-    return Promise.resolve();
-  },
-  checkAuth: async (params) => {
-    const user = await getCurrentUser();
-    if (!!user) {
-      return Promise.resolve();
-    } else {
-      return Promise.reject();
-    }
-  },
-  checkError: (error) => {
-    return Promise.resolve();
-  },
-  getPermissions: (params) => {
-    return Promise.resolve();
-  },
-};
-export default authProvider;

admin/src/components/joblines/joblines.create.jsx

@@ -1,26 +0,0 @@
-import React from "react";
-import {
-  Create,
-
-
-
-  NumberInput, SimpleForm,
-  TextInput
-} from "react-admin";
-
-const JoblinesCreate = (props) => (
-  <Create {...props}>
-    <SimpleForm>
-      <TextInput source="line_ref" />
-      <TextInput source="line_ind" />
-      <NumberInput source="db_price" />
-      <NumberInput source="act_price" />
-      <NumberInput source="part_qty" />
-      <NumberInput source="mod_lb_hrs" />
-      <TextInput source="mod_lbr_type" />
-      <TextInput source="lbr_op" />
-    </SimpleForm>
-  </Create>
-);
-
-export default JoblinesCreate;

admin/src/components/joblines/joblines.edit.jsx

@@ -1,70 +0,0 @@
-import React from "react";
-import {
-  BooleanInput,
-  DateField,
-  Edit,
-  NumberInput,
-  SimpleForm,
-  TextInput,
-} from "react-admin";
-
-const JoblinesEdit = (props) => (
-  <Edit {...props}>
-    <SimpleForm>
-      <TextInput source="id" />
-      <DateField showTime source="created_at" />
-      <DateField showTime source="updated_at" />
-      <TextInput source="jobid" />
-      <NumberInput source="unq_seq" />
-      <NumberInput source="line_ind" />
-      <TextInput source="line_desc" />
-      <TextInput source="part_type" />
-      <TextInput source="oem_partno" />
-      <TextInput source="est_seq" />
-      <TextInput source="db_ref" />
-      <TextInput source="line_ref" />
-      <BooleanInput source="tax_part" />
-      <NumberInput source="db_price" />
-      <NumberInput source="act_price" />
-      <NumberInput source="part_qty" />
-      <TextInput source="alt_partno" />
-      <TextInput source="mod_lbr_ty" />
-      <NumberInput source="db_hrs" />
-      <NumberInput source="mod_lb_hrs" />
-      <TextInput source="lbr_op" />
-      <NumberInput source="lbr_amt" />
-      <BooleanInput source="glass_flag" />
-      <TextInput source="price_inc" />
-      <TextInput source="alt_part_i" />
-      <TextInput source="price_j" />
-      <TextInput source="cert_part" />
-      <TextInput source="alt_co_id" />
-      <TextInput source="alt_overrd" />
-      <TextInput source="alt_partm" />
-      <TextInput source="prt_dsmk_p" />
-      <TextInput source="prt_dsmk_m" />
-      <TextInput source="lbr_inc" />
-      <TextInput source="lbr_hrs_j" />
-      <TextInput source="lbr_typ_j" />
-      <TextInput source="lbr_op_j" />
-      <TextInput source="paint_stg" />
-      <TextInput source="paint_tone" />
-      <TextInput source="lbr_tax" />
-      <NumberInput source="misc_amt" />
-      <TextInput source="misc_sublt" />
-      <TextInput source="misc_tax" />
-      <TextInput source="bett_type" />
-      <NumberInput source="bett_pctg" />
-      <NumberInput source="bett_amt" />
-      <TextInput source="bett_tax" />
-      <TextInput source="op_code_desc" />
-      <TextInput source="status" />
-      <TextInput source="removed" />
-      <NumberInput source="line_no" />
-      <TextInput source="notes" />
-      <TextInput source='"location"' />
-    </SimpleForm>
-  </Edit>
-);
-
-export default JoblinesEdit;

admin/src/components/joblines/joblines.list.jsx

@@ -1,29 +0,0 @@
-import React from "react";
-import {
-  Datagrid, List,
-
-
-  NumberField,
-
-  ReferenceField, TextField
-} from "react-admin";
-
-const JoblinesList = (props) => (
-  <List {...props}>
-    <Datagrid rowClick="edit">
-      <ReferenceField source="jobid" reference="jobs">
-        <TextField source="ro_number" />
-      </ReferenceField>
-      <TextField source="line_ref" />
-      <TextField source="line_ind" />
-      <NumberField source="db_price" />
-      <NumberField source="act_price" />
-      <NumberField source="part_qty" />
-      <NumberField source="mod_lb_hrs" />
-      <TextField source="mod_lbr_type" />
-      <TextField source="lbr_op" />
-    </Datagrid>
-  </List>
-);
-
-export default JoblinesList;

admin/src/components/joblines/joblines.show.jsx

@@ -1,24 +0,0 @@
-import React from "react";
-import {
-  NumberInput, Show,
-
-  SimpleShowLayout,
-  TextInput
-} from "react-admin";
-
-const JoblinesShow = (props) => (
-  <Show {...props}>
-    <SimpleShowLayout>
-      <TextInput source="line_ref" />
-      <TextInput source="line_ind" />
-      <NumberInput source="db_price" />
-      <NumberInput source="act_price" />
-      <NumberInput source="part_qty" />
-      <NumberInput source="mod_lb_hrs" />
-      <TextInput source="mod_lbr_type" />
-      <TextInput source="lbr_op" />
-    </SimpleShowLayout>
-  </Show>
-);
-
-export default JoblinesShow;

admin/src/components/jobs/jobs.create.jsx

@@ -1,17 +0,0 @@
-import React from "react";
-import { Create, EmailField, SimpleForm, TextInput } from "react-admin";
-
-const JobsCreate = (props) => (
-  <Create {...props}>
-    <SimpleForm>
-      <TextInput source="ro_number" />
-
-      <TextInput source="ownr_fn" />
-      <TextInput source="ownr_ln" />
-      <TextInput source="converted" />
-      <EmailField source="ownr_ea" />
-    </SimpleForm>
-  </Create>
-);
-
-export default JobsCreate;

admin/src/components/jobs/jobs.edit.jsx

@@ -1,316 +0,0 @@
-import React from "react";
-//@ts-ignore
-import {
-  AutocompleteInput,
-  BooleanInput,
-  Edit,
-  FormTab,
-  NumberInput,
-  ReferenceInput,
-  SelectInput,
-  SimpleForm,
-  TabbedForm,
-  TextInput,
-} from "react-admin";
-
-const JobsEdit = (props) => (
-  <Edit {...props}>
-    <TabbedForm>
-      <FormTab label="Job Info">
-        <SimpleForm>
-          <ReferenceInput label="Shopid" source="shopid" reference="bodyshops">
-            <SelectInput disabled optionText="shopname" />
-          </ReferenceInput>
-          <TextInput source="ro_number" />
-          <ReferenceInput label="Owner ID" source="ownerid" reference="owners">
-            <AutocompleteInput
-              matchSuggestion={(filter, choice) =>
-                choice.ownr_fn &&
-                choice.ownr_fn.toLowerCase().includes(filter.toLowerCase())
-              }
-              optionText={(record) =>
-                `${record.ownr_fn || ""} ${record.ownr_ln || ""} ${
-                  record.ownr_co_nm || ""
-                } (${record.ownr_ph1 || ""})`
-              }
-            />
-          </ReferenceInput>
-          <ReferenceInput
-            label="Vehicle Id"
-            source="vehicleid"
-            reference="vehicles"
-          >
-            <SelectInput optionText="v_vin" />
-          </ReferenceInput>
-          <ReferenceInput label="Shopid" source="shopid" reference="bodyshops">
-            <SelectInput disabled optionText="shopname" />
-          </ReferenceInput>
-          <TextInput source="ro_number" />
-          <ReferenceInput label="Owner ID" source="ownerid" reference="owners">
-            <AutocompleteInput
-              matchSuggestion={(filter, choice) =>
-                choice.ownr_fn &&
-                choice.ownr_fn.toLowerCase().includes(filter.toLowerCase())
-              }
-              optionText={(record) =>
-                `${record.ownr_fn || ""} ${record.ownr_ln || ""} ${
-                  record.ownr_co_nm || ""
-                } (${record.ownr_ph1 || ""})`
-              }
-            />
-          </ReferenceInput>
-          <ReferenceInput
-            label="Vehicle Id"
-            source="vehicleid"
-            reference="vehicles"
-          >
-            <SelectInput optionText="v_vin" />
-          </ReferenceInput>
-          <BooleanInput source="inproduction" />
-          <BooleanInput source="converted" />
-          <TextInput disabled source="id" />
-          <TextInput disabled source="created_at" />
-          <TextInput disabled source="updated_at" />
-        </SimpleForm>
-      </FormTab>
-
-      <FormTab label="Labor Rates">
-        <NumberInput source="labor_rate_id" />
-        <NumberInput source="labor_rate_desc" />
-        <NumberInput source="rate_lab" />
-        <NumberInput source="rate_lad" />
-        <NumberInput source="rate_lae" />
-        <NumberInput source="rate_lar" />
-        <NumberInput source="rate_las" />
-        <NumberInput source="rate_laf" />
-        <NumberInput source="rate_lam" />
-        <NumberInput source="rate_lag" />
-        <NumberInput source="rate_atp" />
-        <NumberInput source="rate_lau" />
-        <NumberInput source="rate_la1" />
-        <NumberInput source="rate_la2" />
-        <NumberInput source="rate_la3" />
-        <NumberInput source="rate_la4" />
-        <NumberInput source="rate_mapa" />
-        <NumberInput source="rate_mash" />
-        <NumberInput source="rate_mahw" />
-        <NumberInput source="rate_ma2s" />
-        <NumberInput source="rate_ma3s" />
-        <NumberInput source="rate_ma2t" />
-        <NumberInput source="rate_mabl" />
-        <NumberInput source="rate_macs" />
-        <NumberInput source="rate_matd" />
-        <NumberInput source="federal_tax_rate" />
-        <NumberInput source="state_tax_rate" />
-        <NumberInput source="local_tax_rate" />
-      </FormTab>
-      <FormTab label="Dates">
-        <TextInput source="scheduled_in" />
-        <TextInput source="actual_in" />
-        <TextInput source="scheduled_completion" />
-        <TextInput source="actual_completion" />
-        <TextInput source="scheduled_delivery" />
-        <TextInput source="actual_delivery" />
-        <TextInput source="invoice_date" />
-        <TextInput source="date_estimated" />
-        <TextInput source="date_open" />
-        <TextInput source="date_scheduled" />
-        <TextInput source="date_invoiced" />
-        <TextInput source="date_exported" />
-      </FormTab>
-      <FormTab label="Insurance info">
-        <TextInput source="est_co_nm" />
-        <TextInput source="est_addr1" />
-        <TextInput source="est_addr2" />
-        <TextInput source="est_city" />
-        <TextInput source="est_st" />
-        <TextInput source="est_zip" />
-        <TextInput source="est_ctry" />
-        <TextInput source="est_ph1" />
-        <TextInput source="est_ea" />
-        <TextInput source="est_ct_ln" />
-        <TextInput source="est_ct_fn" />
-        <TextInput source="regie_number" />
-        <TextInput source="statusid" />
-        <TextInput source="ins_co_id" />
-        <TextInput source="ins_co_nm" />
-        <TextInput source="ins_addr1" />
-        <TextInput source="ins_addr2" />
-        <TextInput source="ins_city" />
-        <TextInput source="ins_st" />
-        <TextInput source="ins_zip" />
-        <TextInput source="ins_ctry" />
-        <TextInput source="ins_ph1" />
-        <TextInput source="ins_ph1x" />
-        <TextInput source="ins_ph2" />
-        <TextInput source="ins_ph2x" />
-        <TextInput source="ins_fax" />
-        <TextInput source="ins_faxx" />
-        <TextInput source="ins_ct_ln" />
-        <TextInput source="ins_ct_fn" />
-        <TextInput source="ins_title" />
-        <TextInput source="ins_ct_ph" />
-        <TextInput source="ins_ct_phx" />
-        <TextInput source="ins_ea" />
-        <TextInput source="ins_memo" />
-        <TextInput source="policy_no" />
-        <TextInput source="ded_amt" />
-        <TextInput source="ded_status" />
-        <TextInput source="asgn_no" />
-        <TextInput source="asgn_date" />
-        <TextInput source="asgn_type" />
-        <TextInput source="clm_no" />
-        <TextInput source="clm_ofc_id" />
-        <TextInput source="agt_co_id" />
-        <TextInput source="agt_co_nm" />
-        <TextInput source="agt_addr1" />
-        <TextInput source="agt_addr2" />
-        <TextInput source="agt_city" />
-        <TextInput source="agt_st" />
-        <TextInput source="agt_zip" />
-        <TextInput source="agt_ctry" />
-        <TextInput source="agt_ph1" />
-        <TextInput source="agt_ph1x" />
-        <TextInput source="agt_ph2" />
-        <TextInput source="agt_ph2x" />
-        <TextInput source="agt_fax" />
-        <TextInput source="agt_faxx" />
-        <TextInput source="agt_ct_ln" />
-        <TextInput source="agt_ct_fn" />
-        <TextInput source="agt_ct_ph" />
-        <TextInput source="agt_ct_phx" />
-        <TextInput source="agt_ea" />
-        <TextInput source="agt_lic_no" />
-        <TextInput source="loss_type" />
-        <TextInput source="loss_desc" />
-        <TextInput source="theft_ind" />
-        <TextInput source="cat_no" />
-        <TextInput source="tlos_ind" />
-        <TextInput source="ciecaid" />
-        <TextInput source="loss_date" />
-        <TextInput source="clm_ofc_nm" />
-        <TextInput source="clm_addr1" />
-        <TextInput source="clm_addr2" />
-        <TextInput source="clm_city" />
-        <TextInput source="clm_st" />
-        <TextInput source="clm_zip" />
-        <TextInput source="clm_ctry" />
-        <TextInput source="clm_ph1" />
-        <TextInput source="clm_ph1x" />
-        <TextInput source="clm_ph2" />
-        <TextInput source="clm_ph2x" />
-        <TextInput source="clm_fax" />
-        <TextInput source="clm_faxx" />
-        <TextInput source="clm_ct_ln" />
-        <TextInput source="clm_ct_fn" />
-        <TextInput source="clm_title" />
-        <TextInput source="clm_ct_ph" />
-        <TextInput source="clm_ct_phx" />
-        <TextInput source="clm_ea" />
-        <TextInput source="payee_nms" />
-        <TextInput source="pay_type" />
-        <TextInput source="pay_date" />
-        <TextInput source="pay_chknm" />
-        <TextInput source="pay_amt" />
-      </FormTab>
-      <FormTab label="Owner Data on Job">
-        <TextInput source="cust_pr" />
-        <TextInput source="insd_ln" />
-        <TextInput source="insd_fn" />
-        <TextInput source="insd_title" />
-        <TextInput source="insd_co_nm" />
-        <TextInput source="insd_addr1" />
-        <TextInput source="insd_addr2" />
-        <TextInput source="insd_city" />
-        <TextInput source="insd_st" />
-        <TextInput source="insd_zip" />
-        <TextInput source="insd_ctry" />
-        <TextInput source="insd_ph1" />
-        <TextInput source="insd_ph1x" />
-        <TextInput source="insd_ph2" />
-        <TextInput source="insd_ph2x" />
-        <TextInput source="insd_fax" />
-        <TextInput source="insd_faxx" />
-        <TextInput source="insd_ea" />
-        <TextInput source="ownr_ln" />
-        <TextInput source="ownr_fn" />
-        <TextInput source="ownr_title" />
-        <TextInput source="ownr_co_nm" />
-        <TextInput source="ownr_addr1" />
-        <TextInput source="ownr_addr2" />
-        <TextInput source="ownr_city" />
-        <TextInput source="ownr_st" />
-        <TextInput source="ownr_zip" />
-        <TextInput source="ownr_ctry" />
-        <TextInput source="ownr_ph1" />
-        <TextInput source="ownr_ph1x" />
-        <TextInput source="ownr_ph2" />
-        <TextInput source="ownr_ph2x" />
-        <TextInput source="ownr_fax" />
-        <TextInput source="ownr_faxx" />
-        <TextInput source="ownr_ea" />
-      </FormTab>
-      <FormTab label="Financial">
-        <TextInput source="clm_total" />
-        <TextInput source="owner_owing" />
-      </FormTab>
-      <FormTab label="Other">
-        <TextInput source="area_of_damage" />
-        <TextInput source="loss_cat" />
-        <TextInput source="special_coverage_policy" />
-        <TextInput source="csr" />
-        <TextInput source="po_number" />
-        <TextInput source="unit_number" />
-        <TextInput source="kmin" />
-        <TextInput source="kmout" />
-        <TextInput source="referral_source" />
-        <TextInput source="selling_dealer" />
-        <TextInput source="servicing_dealer" />
-        <TextInput source="servicing_dealer_contact" />
-        <TextInput source="selling_dealer_contact" />
-        <TextInput source="depreciation_taxes" />
-        <TextInput source="federal_tax_payable" />
-        <TextInput source="other_amount_payable" />
-        <TextInput source="towing_payable" />
-        <TextInput source="storage_payable" />
-        <TextInput source="adjustment_bottom_line" />
-        <TextInput source="tax_pstthr" />
-        <TextInput source="tax_tow_rt" />
-        <TextInput source="tax_sub_rt" />
-        <TextInput source="tax_paint_mat_rt" />
-        <TextInput source="tax_levies_rt" />
-        <TextInput source="tax_prethr" />
-        <TextInput source="tax_thramt" />
-        <TextInput source="tax_str_rt" />
-        <TextInput source="tax_lbr_rt" />
-        <TextInput source="adj_g_disc" />
-        <TextInput source="adj_towdis" />
-        <TextInput source="adj_strdis" />
-        <TextInput source="tax_predis" />
-        <TextInput source="rate_laa" />
-        <TextInput source="status" />
-        <TextInput source="cieca_stl" />
-        <TextInput source="g_bett_amt" />
-        <TextInput source="cieca_ttl" />
-        <TextInput source="plate_no" />
-        <TextInput source="plate_st" />
-        <TextInput source="v_vin" />
-        <TextInput source="v_model_yr" />
-        <TextInput source="v_model_desc" />
-        <TextInput source="v_make_desc" />
-        <TextInput source="v_color" />
-        <TextInput source="parts_tax_rates" />
-        <TextInput source="job_totals" />
-        <TextInput source="production_vars" />
-        <TextInput source="intakechecklist" />
-        <TextInput source="invoice_allocation" />
-        <TextInput source="kanbanparent" />
-        <TextInput source="employee_body" />
-        <TextInput source="employee_refinish" />
-        <TextInput source="employee_prep" />
-      </FormTab>
-    </TabbedForm>
-  </Edit>
-);
-
-export default JobsEdit;

admin/src/components/jobs/jobs.list.jsx

@@ -1,69 +0,0 @@
-import { useQuery } from "@apollo/client";
-import CircularProgress from "@material-ui/core/CircularProgress";
-import React from "react";
-import {
-  Datagrid,
-  Filter,
-  List,
-  ReferenceField,
-  SelectInput,
-  TextField,
-  TextInput,
-} from "react-admin";
-import { QUERY_ALL_SHOPS } from "../../graphql/admin.shop.queries";
-
-const JobsList = (props) => (
-  <List filters={<JobsFilter />} {...props}>
-    <Datagrid rowClick="edit">
-      <TextField source="id" label="Job ID" />
-      <ReferenceField source="shopid" reference="bodyshops" label="Shop Name">
-        <TextField source="shopname" />
-      </ReferenceField>
-      <TextField source="ro_number" label="RO Number" />
-
-      <TextField source="ownr_fn" label="Owner FN" />
-      <TextField source="ownr_ln" label="Owner LN" />
-      <TextField source="ownr_co_nm" label="Owner CO" />
-
-      <ReferenceField source="ownerid" reference="owners" label="Owner Record">
-        <TextField source="id" />
-      </ReferenceField>
-      <TextField source="v_model_yr" label="Year" />
-      <TextField source="v_make_desc" label="Make" />
-      <TextField source="v_model_desc" label="Model" />
-
-      <ReferenceField
-        source="vehicleid"
-        reference="vehicles"
-        label="Vehicle ID"
-      >
-        <TextField source="id" />
-      </ReferenceField>
-    </Datagrid>
-  </List>
-);
-
-const JobsFilter = (props) => {
-  const { loading, error, data } = useQuery(QUERY_ALL_SHOPS, {
-    fetchPolicy: "network-only",
-    nextFetchPolicy: "network-only",
-  });
-  if (loading) return <CircularProgress />;
-  if (error) return JSON.stringify(error);
-
-  return (
-    <Filter {...props}>
-      <TextInput label="RO Number" source="ro_number" />
-      <TextInput label="Job ID" source="id" />
-      <SelectInput
-        source="shopid"
-        label="Bodyshop"
-        choices={data.bodyshops.map((b) => {
-          return { id: b.id, name: b.shopname };
-        })}
-      />
-    </Filter>
-  );
-};
-
-export default JobsList;

admin/src/components/jobs/jobs.show.jsx

@@ -1,280 +0,0 @@
-import React from "react";
-import {
-  Datagrid,
-  EditButton,
-  NumberField,
-  ReferenceManyField,
-  Show,
-  Tab,
-  TabbedShowLayout,
-  TextField,
-} from "react-admin";
-
-const JobsShow = (props) => (
-  <Show {...props}>
-    <TabbedShowLayout>
-      <Tab label="summary">
-        <TextField source="id" />
-        <TextField source="created_at" />
-        <TextField source="updated_at" />
-        <TextField source="shopid" />
-        <TextField source="ro_number" />
-        <TextField source="ownerid" />
-        <TextField source="vehicleid" />
-      </Tab>
-      <Tab label="Job Lines">
-        <ReferenceManyField
-          reference="joblines"
-          target="jobid"
-          label="Job Lines"
-        >
-          <Datagrid>
-            <TextField source="id" />
-
-            <TextField source="line_ref" />
-            <TextField source="line_desc" />
-            <TextField source="line_ind" />
-            <NumberField source="db_price" />
-            <NumberField source="act_price" />
-            <NumberField source="part_qty" />
-            <NumberField source="mod_lb_hrs" />
-            <TextField source="mod_lbr_type" />
-            <TextField source="lbr_op" />
-
-            <EditButton />
-          </Datagrid>
-        </ReferenceManyField>
-      </Tab>
-      <Tab label="other">
-        <TextField source="labor_rate_id" />
-        <TextField source="labor_rate_desc" />
-        <TextField source="rate_lab" />
-        <TextField source="rate_lad" />
-        <TextField source="rate_lae" />
-        <TextField source="rate_lar" />
-        <TextField source="rate_las" />
-        <TextField source="rate_laf" />
-        <TextField source="rate_lam" />
-        <TextField source="rate_lag" />
-        <TextField source="rate_atp" />
-        <TextField source="rate_lau" />
-        <TextField source="rate_la1" />
-        <TextField source="rate_la2" />
-        <TextField source="rate_la3" />
-        <TextField source="rate_la4" />
-        <TextField source="rate_mapa" />
-        <TextField source="rate_mash" />
-        <TextField source="rate_mahw" />
-        <TextField source="rate_ma2s" />
-        <TextField source="rate_ma3s" />
-        <TextField source="rate_ma2t" />
-        <TextField source="rate_mabl" />
-        <TextField source="rate_macs" />
-        <TextField source="rate_matd" />
-        <TextField source="federal_tax_rate" />
-        <TextField source="state_tax_rate" />
-        <TextField source="local_tax_rate" />
-        <TextField source="est_co_nm" />
-        <TextField source="est_addr1" />
-        <TextField source="est_addr2" />
-        <TextField source="est_city" />
-        <TextField source="est_st" />
-        <TextField source="est_zip" />
-        <TextField source="est_ctry" />
-        <TextField source="est_ph1" />
-        <TextField source="est_ea" />
-        <TextField source="est_ct_ln" />
-        <TextField source="est_ct_fn" />
-        <TextField source="scheduled_in" />
-        <TextField source="actual_in" />
-        <TextField source="scheduled_completion" />
-        <TextField source="actual_completion" />
-        <TextField source="scheduled_delivery" />
-        <TextField source="actual_delivery" />
-        <TextField source="regie_number" />
-        <TextField source="invoice_date" />
-        <TextField source="inproduction" />
-        <TextField source="statusid" />
-        <TextField source="ins_co_id" />
-        <TextField source="ins_co_nm" />
-        <TextField source="ins_addr1" />
-        <TextField source="ins_addr2" />
-        <TextField source="ins_city" />
-        <TextField source="ins_st" />
-        <TextField source="ins_zip" />
-        <TextField source="ins_ctry" />
-        <TextField source="ins_ph1" />
-        <TextField source="ins_ph1x" />
-        <TextField source="ins_ph2" />
-        <TextField source="ins_ph2x" />
-        <TextField source="ins_fax" />
-        <TextField source="ins_faxx" />
-        <TextField source="ins_ct_ln" />
-        <TextField source="ins_ct_fn" />
-        <TextField source="ins_title" />
-        <TextField source="ins_ct_ph" />
-        <TextField source="ins_ct_phx" />
-        <TextField source="ins_ea" />
-        <TextField source="ins_memo" />
-        <TextField source="policy_no" />
-        <TextField source="ded_amt" />
-        <TextField source="ded_status" />
-        <TextField source="asgn_no" />
-        <TextField source="asgn_date" />
-        <TextField source="asgn_type" />
-        <TextField source="clm_no" />
-        <TextField source="clm_ofc_id" />
-        <TextField source="date_estimated" />
-        <TextField source="date_open" />
-        <TextField source="date_scheduled" />
-        <TextField source="date_invoiced" />
-        <TextField source="date_exported" />
-        <TextField source="clm_total" />
-        <TextField source="owner_owing" />
-        <TextField source="converted" />
-        <TextField source="ciecaid" />
-        <TextField source="loss_date" />
-        <TextField source="clm_ofc_nm" />
-        <TextField source="clm_addr1" />
-        <TextField source="clm_addr2" />
-        <TextField source="clm_city" />
-        <TextField source="clm_st" />
-        <TextField source="clm_zip" />
-        <TextField source="clm_ctry" />
-        <TextField source="clm_ph1" />
-        <TextField source="clm_ph1x" />
-        <TextField source="clm_ph2" />
-        <TextField source="clm_ph2x" />
-        <TextField source="clm_fax" />
-        <TextField source="clm_faxx" />
-        <TextField source="clm_ct_ln" />
-        <TextField source="clm_ct_fn" />
-        <TextField source="clm_title" />
-        <TextField source="clm_ct_ph" />
-        <TextField source="clm_ct_phx" />
-        <TextField source="clm_ea" />
-        <TextField source="payee_nms" />
-        <TextField source="pay_type" />
-        <TextField source="pay_date" />
-        <TextField source="pay_chknm" />
-        <TextField source="pay_amt" />
-        <TextField source="agt_co_id" />
-        <TextField source="agt_co_nm" />
-        <TextField source="agt_addr1" />
-        <TextField source="agt_addr2" />
-        <TextField source="agt_city" />
-        <TextField source="agt_st" />
-        <TextField source="agt_zip" />
-        <TextField source="agt_ctry" />
-        <TextField source="agt_ph1" />
-        <TextField source="agt_ph1x" />
-        <TextField source="agt_ph2" />
-        <TextField source="agt_ph2x" />
-        <TextField source="agt_fax" />
-        <TextField source="agt_faxx" />
-        <TextField source="agt_ct_ln" />
-        <TextField source="agt_ct_fn" />
-        <TextField source="agt_ct_ph" />
-        <TextField source="agt_ct_phx" />
-        <TextField source="agt_ea" />
-        <TextField source="agt_lic_no" />
-        <TextField source="loss_type" />
-        <TextField source="loss_desc" />
-        <TextField source="theft_ind" />
-        <TextField source="cat_no" />
-        <TextField source="tlos_ind" />
-        <TextField source="cust_pr" />
-        <TextField source="insd_ln" />
-        <TextField source="insd_fn" />
-        <TextField source="insd_title" />
-        <TextField source="insd_co_nm" />
-        <TextField source="insd_addr1" />
-        <TextField source="insd_addr2" />
-        <TextField source="insd_city" />
-        <TextField source="insd_st" />
-        <TextField source="insd_zip" />
-        <TextField source="insd_ctry" />
-        <TextField source="insd_ph1" />
-        <TextField source="insd_ph1x" />
-        <TextField source="insd_ph2" />
-        <TextField source="insd_ph2x" />
-        <TextField source="insd_fax" />
-        <TextField source="insd_faxx" />
-        <TextField source="insd_ea" />
-        <TextField source="ownr_ln" />
-        <TextField source="ownr_fn" />
-        <TextField source="ownr_title" />
-        <TextField source="ownr_co_nm" />
-        <TextField source="ownr_addr1" />
-        <TextField source="ownr_addr2" />
-        <TextField source="ownr_city" />
-        <TextField source="ownr_st" />
-        <TextField source="ownr_zip" />
-        <TextField source="ownr_ctry" />
-        <TextField source="ownr_ph1" />
-        <TextField source="ownr_ph1x" />
-        <TextField source="ownr_ph2" />
-        <TextField source="ownr_ph2x" />
-        <TextField source="ownr_fax" />
-        <TextField source="ownr_faxx" />
-        <TextField source="ownr_ea" />
-        <TextField source="area_of_damage" />
-        <TextField source="loss_cat" />
-
-        <TextField source="special_coverage_policy" />
-        <TextField source="csr" />
-        <TextField source="po_number" />
-        <TextField source="unit_number" />
-        <TextField source="kmin" />
-        <TextField source="kmout" />
-        <TextField source="referral_source" />
-        <TextField source="selling_dealer" />
-        <TextField source="servicing_dealer" />
-        <TextField source="servicing_dealer_contact" />
-        <TextField source="selling_dealer_contact" />
-        <TextField source="depreciation_taxes" />
-        <TextField source="federal_tax_payable" />
-        <TextField source="other_amount_payable" />
-        <TextField source="towing_payable" />
-        <TextField source="storage_payable" />
-        <TextField source="adjustment_bottom_line" />
-        <TextField source="tax_pstthr" />
-        <TextField source="tax_tow_rt" />
-        <TextField source="tax_sub_rt" />
-        <TextField source="tax_paint_mat_rt" />
-        <TextField source="tax_levies_rt" />
-        <TextField source="tax_prethr" />
-        <TextField source="tax_thramt" />
-        <TextField source="tax_str_rt" />
-        <TextField source="tax_lbr_rt" />
-        <TextField source="adj_g_disc" />
-        <TextField source="adj_towdis" />
-        <TextField source="adj_strdis" />
-        <TextField source="tax_predis" />
-        <TextField source="rate_laa" />
-        <TextField source="status" />
-        <TextField source="cieca_stl" />
-        <TextField source="g_bett_amt" />
-        <TextField source="cieca_ttl" />
-        <TextField source="plate_no" />
-        <TextField source="plate_st" />
-        <TextField source="v_vin" />
-        <TextField source="v_model_yr" />
-        <TextField source="v_model_desc" />
-        <TextField source="v_make_desc" />
-        <TextField source="v_color" />
-        <TextField source="parts_tax_rates" />
-        <TextField source="job_totals" />
-        <TextField source="production_vars" />
-        <TextField source="intakechecklist" />
-        <TextField source="invoice_allocation" />
-        <TextField source="kanbanparent" />
-        <TextField source="employee_body" />
-        <TextField source="employee_refinish" />
-        <TextField source="employee_prep" />
-      </Tab>
-    </TabbedShowLayout>
-  </Show>
-);
-
-export default JobsShow;

admin/src/firebase/admin-firebase-utils.js

@@ -1,31 +0,0 @@
-import firebase from "firebase/app";
-import "firebase/firestore";
-import "firebase/auth";
-
-const config = JSON.parse(process.env.REACT_APP_FIREBASE_CONFIG);
-firebase.initializeApp(config);
-
-export const auth = firebase.auth();
-export const firestore = firebase.firestore();
-
-export default firebase;
-
-export const getCurrentUser = () => {
-  return new Promise((resolve, reject) => {
-    const unsubscribe = auth.onAuthStateChanged((userAuth) => {
-      unsubscribe();
-      resolve(userAuth);
-    }, reject);
-  });
-};
-
-export const updateCurrentUser = (userDetails) => {
-  return new Promise((resolve, reject) => {
-    const unsubscribe = auth.onAuthStateChanged((userAuth) => {
-      userAuth.updateProfile(userDetails).then((r) => {
-        unsubscribe();
-        resolve(userAuth);
-      });
-    }, reject);
-  });
-};

admin/src/graphql/admin.shop.queries.js

@@ -1,10 +0,0 @@
-import { gql } from "@apollo/client";
-
-export const QUERY_ALL_SHOPS = gql`
-  query QUERY_ALL_SHOPS {
-    bodyshops {
-      id
-      shopname
-    }
-  }
-`;

admin/src/index.css

@@ -1,13 +0,0 @@
-body {
-  margin: 0;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
-    sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-code {
-  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
-    monospace;
-}

admin/src/index.js

@@ -1,17 +0,0 @@
-import React from "react";
-import ReactDOM from "react-dom";
-import "./index.css";
-import App from "./App/App";
-import * as serviceWorker from "./serviceWorker";
-
-ReactDOM.render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-  document.getElementById("root")
-);
-
-// If you want your app to work offline and load faster, you can change
-// unregister() to register() below. Note this comes with some pitfalls.
-// Learn more about service workers: https://bit.ly/CRA-PWA
-serviceWorker.unregister();

admin/src/serviceWorker.js

@@ -1,141 +0,0 @@
-// This optional code is used to register a service worker.
-// register() is not called by default.
-
-// This lets the app load faster on subsequent visits in production, and gives
-// it offline capabilities. However, it also means that developers (and users)
-// will only see deployed updates on subsequent visits to a page, after all the
-// existing tabs open on the page have been closed, since previously cached
-// resources are updated in the background.
-
-// To learn more about the benefits of this model and instructions on how to
-// opt-in, read https://bit.ly/CRA-PWA
-
-const isLocalhost = Boolean(
-  window.location.hostname === 'localhost' ||
-    // [::1] is the IPv6 localhost address.
-    window.location.hostname === '[::1]' ||
-    // 127.0.0.0/8 are considered localhost for IPv4.
-    window.location.hostname.match(
-      /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
-    )
-);
-
-export function register(config) {
-  if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
-    // The URL constructor is available in all browsers that support SW.
-    const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
-    if (publicUrl.origin !== window.location.origin) {
-      // Our service worker won't work if PUBLIC_URL is on a different origin
-      // from what our page is served on. This might happen if a CDN is used to
-      // serve assets; see https://github.com/facebook/create-react-app/issues/2374
-      return;
-    }
-
-    window.addEventListener('load', () => {
-      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
-
-      if (isLocalhost) {
-        // This is running on localhost. Let's check if a service worker still exists or not.
-        checkValidServiceWorker(swUrl, config);
-
-        // Add some additional logging to localhost, pointing developers to the
-        // service worker/PWA documentation.
-        navigator.serviceWorker.ready.then(() => {
-          console.log(
-            'This web app is being served cache-first by a service ' +
-              'worker. To learn more, visit https://bit.ly/CRA-PWA'
-          );
-        });
-      } else {
-        // Is not localhost. Just register service worker
-        registerValidSW(swUrl, config);
-      }
-    });
-  }
-}
-
-function registerValidSW(swUrl, config) {
-  navigator.serviceWorker
-    .register(swUrl)
-    .then(registration => {
-      registration.onupdatefound = () => {
-        const installingWorker = registration.installing;
-        if (installingWorker == null) {
-          return;
-        }
-        installingWorker.onstatechange = () => {
-          if (installingWorker.state === 'installed') {
-            if (navigator.serviceWorker.controller) {
-              // At this point, the updated precached content has been fetched,
-              // but the previous service worker will still serve the older
-              // content until all client tabs are closed.
-              console.log(
-                'New content is available and will be used when all ' +
-                  'tabs for this page are closed. See https://bit.ly/CRA-PWA.'
-              );
-
-              // Execute callback
-              if (config && config.onUpdate) {
-                config.onUpdate(registration);
-              }
-            } else {
-              // At this point, everything has been precached.
-              // It's the perfect time to display a
-              // "Content is cached for offline use." message.
-              console.log('Content is cached for offline use.');
-
-              // Execute callback
-              if (config && config.onSuccess) {
-                config.onSuccess(registration);
-              }
-            }
-          }
-        };
-      };
-    })
-    .catch(error => {
-      console.error('Error during service worker registration:', error);
-    });
-}
-
-function checkValidServiceWorker(swUrl, config) {
-  // Check if the service worker can be found. If it can't reload the page.
-  fetch(swUrl, {
-    headers: { 'Service-Worker': 'script' },
-  })
-    .then(response => {
-      // Ensure service worker exists, and that we really are getting a JS file.
-      const contentType = response.headers.get('content-type');
-      if (
-        response.status === 404 ||
-        (contentType != null && contentType.indexOf('javascript') === -1)
-      ) {
-        // No service worker found. Probably a different app. Reload the page.
-        navigator.serviceWorker.ready.then(registration => {
-          registration.unregister().then(() => {
-            window.location.reload();
-          });
-        });
-      } else {
-        // Service worker found. Proceed as normal.
-        registerValidSW(swUrl, config);
-      }
-    })
-    .catch(() => {
-      console.log(
-        'No internet connection found. App is running in offline mode.'
-      );
-    });
-}
-
-export function unregister() {
-  if ('serviceWorker' in navigator) {
-    navigator.serviceWorker.ready
-      .then(registration => {
-        registration.unregister();
-      })
-      .catch(error => {
-        console.error(error.message);
-      });
-  }
-}

admin/src/setupTests.js

@@ -1,5 +0,0 @@
-// jest-dom adds custom jest matchers for asserting on DOM nodes.
-// allows you to do things like:
-// expect(element).toHaveTextContent(/react/i)
-// learn more: https://github.com/testing-library/jest-dom
-import '@testing-library/jest-dom/extend-expect';

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
@@ -736,6 +736,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>expectedprodhrs</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>history</name>
                                         <definition_loaded>false</definition_loaded>
@@ -4213,6 +4234,27 @@
                                                     </translation>
                                                 </translations>
                                             </concept_node>
+                                            <concept_node>
+                                                <name>disablebillwip</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>disablecontactvehiclecreation</name>
                                                 <definition_loaded>false</definition_loaded>
@@ -4381,6 +4423,27 @@
                                                     </translation>
                                                 </translations>
                                             </concept_node>
+                                            <concept_node>
+                                                <name>sendmaterialscosting</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>srcco</name>
                                                 <definition_loaded>false</definition_loaded>
@@ -4446,6 +4509,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>enforce_conversion_csr</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>enforce_referral</name>
                                         <definition_loaded>false</definition_loaded>
@@ -14191,6 +14275,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>emailpreview</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>generatingemail</name>
                                         <definition_loaded>false</definition_loaded>
@@ -22222,6 +22327,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>date_repairstarted</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>date_scheduled</name>
                                         <definition_loaded>false</definition_loaded>
@@ -22414,6 +22540,32 @@
                                                     </translation>
                                                 </translations>
                                             </concept_node>
+                                            <folder_node>
+                                                <name>control_type</name>
+                                                <children>
+                                                    <concept_node>
+                                                        <name>account_number</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>
                                             <concept_node>
                                                 <name>cost</name>
                                                 <definition_loaded>false</definition_loaded>
@@ -27535,6 +27687,27 @@
                                                     </translation>
                                                 </translations>
                                             </concept_node>
+                                            <concept_node>
+                                                <name>disablebillwip</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>invoicedatefuture</name>
                                                 <definition_loaded>false</definition_loaded>
@@ -32518,11 +32691,53 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>updatinglabel</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>
                                 <name>labels</name>
                                 <children>
+                                    <concept_node>
+                                        <name>addlabel</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>archive</name>
                                         <definition_loaded>false</definition_loaded>
@@ -36367,6 +36582,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>courtesy_car_inventory</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>courtesy_car_terms</name>
                                         <definition_loaded>false</definition_loaded>
@@ -38025,6 +38261,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>timetickets_ro</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>vehicle_check_in</name>
                                         <definition_loaded>false</definition_loaded>
@@ -40392,6 +40649,27 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>cycle_time_analysis</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>estimates_written_converted</name>
                                         <definition_loaded>false</definition_loaded>
@@ -41820,6 +42098,48 @@
                                             </translation>
                                         </translations>
                                     </concept_node>
+                                    <concept_node>
+                                        <name>returns_grouped_by_vendor_detailed</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>returns_grouped_by_vendor_summary</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>schedule</name>
                                         <definition_loaded>false</definition_loaded>
@@ -42082,6 +42402,27 @@
                             <folder_node>
                                 <name>labels</name>
                                 <children>
+                                    <concept_node>
+                                        <name>atssummary</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>employeevacation</name>
                                         <definition_loaded>false</definition_loaded>

client/.env.development

@@ -0,0 +1,13 @@
+REACT_APP_GRAPHQL_ENDPOINT=https://db.dev.bodyshop.app/v1/graphql
+REACT_APP_GRAPHQL_ENDPOINT_WS=wss://db.dev.bodyshop.app/v1/graphql
+REACT_APP_GA_CODE=231099835
+REACT_APP_FIREBASE_CONFIG={"apiKey":"AIzaSyDPLT8GiDHDR1R4nI66Qi0BY1aYviDPioc","authDomain":"imex-dev.firebaseapp.com","databaseURL":"https://imex-dev.firebaseio.com","projectId":"imex-dev","storageBucket":"imex-dev.appspot.com","messagingSenderId":"759548147434","appId":"1:759548147434:web:e8239868a48ceb36700993","measurementId":"G-K5XRBVVB4S"}
+REACT_APP_CLOUDINARY_ENDPOINT_API=https://api.cloudinary.com/v1_1/io-test
+REACT_APP_CLOUDINARY_ENDPOINT=https://res.cloudinary.com/io-test
+REACT_APP_CLOUDINARY_API_KEY=957865933348715
+REACT_APP_CLOUDINARY_THUMB_TRANSFORMATIONS=c_fill,h_250,w_250
+REACT_APP_FIREBASE_PUBLIC_VAPID_KEY='BG3tzU7L2BXlGZ_3VLK4PNaRceoEXEnmHfxcVbRMF5o5g05ejslhVPki9kBM9cBBT-08Ad9kN3HSpS6JmrWD6h4'
+REACT_APP_STRIPE_PUBLIC_KEY=pk_test_51GqB4TJl3nQjrZ0wCQWAxAhlNF8jKe0tipIa6ExBaxwJGitwvFsIZUEua4dUzaMIAuXp4qwYHXx7lgjyQSwP0Pe900vzm38C7g
+REACT_APP_AXIOS_BASE_API_URL=https://api.imex.online/
+REACT_APP_REPORTS_SERVER_URL=https://reports3.test.imex.online
+REACT_APP_SPLIT_API=ts615lqgnmk84thn72uk18uu5pgce6e0l4rc

client/.env.production

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

client/.env.test

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

client/craco.config.js

@@ -1,6 +1,5 @@
 // craco.config.js
 const TerserPlugin = require("terser-webpack-plugin");
-const CracoLessPlugin = require("craco-less");
 const SentryWebpackPlugin = require("@sentry/webpack-plugin");
 
 module.exports = {
@@ -20,37 +19,6 @@ module.exports = {
         ignore: ["node_modules", "webpack.config.js"],
       },
     },
-    {
-      plugin: CracoLessPlugin,
-      options: {
-        lessLoaderOptions: {
-          lessOptions: {
-            modifyVars: {
-              ...(process.env.NODE_ENV === "development"
-                ? { "@primary-color": "#a51d1d" }
-                : {
-                    //"@primary-color": "#1DA57A"
-                  }),
-              // "@primary-color": " #1890ff", // primary color for all components
-              // "@link-color": "#1890ff", // link color
-              // "@success-color": "#52c41a", // success state color
-              // "@warning-color": "#faad14", // warning state color
-              // "@error-color": "#f5222d", // error state color
-              // "@font-size-base": "14px", // major text font size
-              // " @heading-color": "rgba(0, 0, 0, 0.85)", // heading text color
-              // "@text-color": "rgba(0, 0, 0, 0.65)", // major text color
-              // "@text-color-secondary": "rgba(0, 0, 0, 0.45)", // secondary text color
-              // "@disabled-color": "rgba(0, 0, 0, 0.25)", // disable state color
-              // "@border-radius-base": "2px", // major border radius
-              // "@border-color-base": "#d9d9d9", // major border color
-              // "@box-shadow-base":
-              //   "0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08),0 9px 28px 8px rgba(0, 0, 0, 0.05); // major shadow for layers }",
-            },
-            javascriptEnabled: true,
-          },
-        },
-      },
-    },
   ],
   webpack: {
     configure: (webpackConfig) => ({

client/package.json

@@ -4,61 +4,55 @@
   "private": true,
   "proxy": "http://localhost:4000",
   "dependencies": {
+    "@ant-design/pro-layout": "^7.6.1",
     "@apollo/client": "^3.6.9",
     "@asseinfo/react-kanban": "^2.2.0",
-    "@craco/craco": "^6.4.5",
-    "@fingerprintjs/fingerprintjs": "^3.3.3",
+    "@craco/craco": "^7.0.0",
     "@jsreport/browser-client": "^3.1.0",
-    "@sentry/react": "^7.7.0",
-    "@sentry/tracing": "^7.7.0",
+    "@sentry/react": "^7.28.1",
+    "@sentry/tracing": "^7.28.1",
     "@splitsoftware/splitio-react": "^1.6.0",
-    "@stripe/react-stripe-js": "^1.9.0",
-    "@stripe/stripe-js": "^1.32.0",
     "@tanem/react-nprogress": "^5.0.8",
-    "antd": "^4.22.3",
+    "antd": "5.1.5",
     "apollo-link-logger": "^2.0.0",
-    "axios": "^0.27.2",
-    "craco-less": "^1.20.0",
+    "axios": "^1.2.3",
     "dinero.js": "^1.9.1",
-    "dotenv": "^16.0.1",
     "enquire-js": "^0.2.1",
     "env-cmd": "^10.1.0",
     "exifr": "^7.1.3",
     "firebase": "^9.9.1",
     "graphql": "^16.5.0",
-    "i18next": "^21.8.14",
-    "i18next-browser-languagedetector": "^6.1.4",
-    "jsoneditor": "^9.9.0",
+    "i18next": "^22.4.6",
+    "i18next-browser-languagedetector": "^7.0.1",
     "jsreport-browser-client-dist": "^1.3.0",
     "libphonenumber-js": "^1.10.9",
     "logrocket": "^3.0.1",
     "markerjs2": "^2.22.0",
     "moment-business-days": "^1.2.0",
     "moment-timezone": "^0.5.34",
-    "normalize-url": "^7.0.3",
-    "phone": "^3.1.23",
+    "normalize-url": "^8.0.0",
+    "phone": "^3.1.32",
     "preval.macro": "^5.0.0",
     "prop-types": "^15.8.1",
-    "query-string": "^7.1.1",
+    "query-string": "^8.1.0",
     "rc-queue-anim": "^2.0.0",
     "rc-scroll-anim": "^2.7.6",
-    "react": "^17.0.2",
-    "react-big-calendar": "^1.5.0",
+    "react": "^18.2.0",
+    "react-big-calendar": "^1.5.2",
     "react-color": "^2.19.3",
-    "react-cookie": "^4.1.1",
-    "react-dom": "^17.0.2",
-    "react-drag-listview": "^0.2.1",
-    "react-grid-gallery": "^0.5.5",
+    "react-dom": "^18.2.0",
+    "react-drag-listview": "^2.0.0",
+    "react-grid-gallery": "^1.0.0",
     "react-grid-layout": "^1.3.4",
-    "react-i18next": "^11.18.1",
-    "react-icons": "^4.4.0",
-    "react-number-format": "^4.9.3",
-    "react-redux": "^7.2.8",
+    "react-i18next": "^12.1.1",
+    "react-icons": "^4.7.1",
+    "react-image-lightbox": "^5.1.4",
+    "react-number-format": "^5.1.2",
+    "react-redux": "^8.0.5",
     "react-resizable": "^3.0.4",
     "react-router-dom": "^5.3.0",
-    "react-scripts": "^4.0.3",
+    "react-scripts": "^5.0.1",
     "react-sticky": "^6.0.3",
-    "react-sublime-video": "^0.2.5",
     "react-virtualized": "^9.22.3",
     "recharts": "^2.1.12",
     "redux": "^4.2.0",
@@ -70,7 +64,7 @@
     "socket.io-client": "^4.5.1",
     "styled-components": "^5.3.5",
     "subscriptions-transport-ws": "^0.11.0",
-    "web-vitals": "^2.1.4",
+    "web-vitals": "^3.1.0",
     "workbox-background-sync": "^6.5.3",
     "workbox-broadcast-update": "^6.5.3",
     "workbox-cacheable-response": "^6.5.3",
@@ -82,12 +76,12 @@
     "workbox-range-requests": "^6.5.3",
     "workbox-routing": "^6.5.3",
     "workbox-strategies": "^6.5.3",
-    "workbox-streams": "^6.5.3",
-    "yauzl": "^2.10.0"
+    "workbox-streams": "^6.5.3"
   },
   "scripts": {
     "analyze": "source-map-explorer 'build/static/js/*.js'",
     "start": "craco start",
+    "startrs": "react-scripts start",
     "build": "REACT_APP_GIT_SHA=`git rev-parse --short HEAD` craco build",
     "build:test": "env-cmd -f .env.test yarn run build",
     "build-deploy:test": "yarn run build:test && s3cmd sync build/* s3://imex-online-test && echo '🚀 TESTING Deployed!'",
@@ -119,9 +113,9 @@
     "react-error-overlay": "6.0.9"
   },
   "devDependencies": {
-    "@sentry/webpack-plugin": "^1.19.0",
-    "@testing-library/cypress": "^8.0.3",
-    "cypress": "^10.3.1",
+    "@sentry/webpack-plugin": "^1.20.0",
+    "@testing-library/cypress": "^9.0.0",
+    "cypress": "^12.3.0",
     "eslint-plugin-cypress": "^2.12.1",
     "react-error-overlay": "6.0.11",
     "redux-logger": "^3.0.6",

client/src/App/App.styles.scss

@@ -147,4 +147,9 @@
 //Update row highlighting on production board. 
 .ant-table-tbody > tr.ant-table-row:hover > td {
   background: #eaeaea !important;
-}
+}
+
+.job-line-manual{
+  color: tomato;
+  font-style: italic;
+}

client/src/components/_test/paymentMethod.jsx

@@ -1,8 +1,4 @@
-import {
-  PaymentRequestButtonElement,
-  useStripe,
-} from "@stripe/react-stripe-js";
-import React, { useEffect, useState } from "react";
+import React from "react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { logImEXEvent } from "../../firebase/firebase.utils";
@@ -19,49 +15,6 @@ const mapDispatchToProps = (dispatch) => ({
 });
 
 function Test({ bodyshop, setEmailOptions }) {
-  const stripe = useStripe();
-
-  const [paymentRequest, setPaymentRequest] = useState(null);
-  useEffect(() => {
-    if (stripe) {
-      const pr = stripe.paymentRequest({
-        country: "CA",
-        displayItems: [{ label: "Deductible", amount: 1099 }],
-        currency: "cad",
-        total: {
-          label: "Demo total",
-          amount: 1099,
-        },
-        requestPayerName: true,
-        requestPayerEmail: true,
-      });
-
-      // Check the availability of the Payment Request API.
-      pr.canMakePayment().then((result) => {
-        if (result) {
-          setPaymentRequest(pr);
-        } else {
-          // var details = {
-          //   total: { label: "", amount: { currency: "CAD", value: "0.00" } },
-          // };
-          new PaymentRequest(
-            [{ supportedMethods: ["basic-card"] }],
-            {}
-            //  details
-          ).show();
-        }
-      });
-    }
-  }, [stripe]);
-
-  if (paymentRequest) {
-    return (
-      <div style={{ height: "300px" }}>
-        <PaymentRequestButtonElement options={{ paymentRequest }} />
-      </div>
-    );
-  }
-
   return (
     <div>
       <button

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

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

client/src/components/allocations-assignment/allocations-assignment.component.jsx

@@ -61,7 +61,7 @@ export function AllocationsAssignmentComponent({
   );
 
   return (
-    <Popover content={popContent} visible={visibility}>
+    <Popover content={popContent} open={visibility}>
       <Button onClick={() => setVisibility(true)}>
         {t("allocations.actions.assign")}
       </Button>

client/src/components/allocations-bulk-assignment/allocations-bulk-assignment.component.jsx

@@ -59,7 +59,7 @@ export default connect(
   );
 
   return (
-    <Popover content={popContent} visible={visibility}>
+    <Popover content={popContent} open={visibility}>
       <Button disabled={disabled} onClick={() => setVisibility(true)}>
         {t("allocations.actions.assign")}
       </Button>

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

@@ -1,5 +1,6 @@
 import { useMutation, useQuery } from "@apollo/client";
-import { Button, Form, PageHeader, Popconfirm, Space } from "antd";
+import { PageHeader } from '@ant-design/pro-layout';
+import { Button, Form, Popconfirm, Space } from "antd";
 import moment from "moment";
 import queryString from "query-string";
 import React, { useState } from "react";
@@ -178,7 +179,7 @@ export function BillDetailEditcontainer({
                 <BillDetailEditReturn data={data} />
 
                 <Popconfirm
-                  visible={visible}
+                  open={visible}
                   onConfirm={() => form.submit()}
                   onCancel={() => setVisible(false)}
                   okButtonProps={{ loading: updateLoading }}

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

@@ -77,7 +77,7 @@ export function BillDetailEditReturn({
   return (
     <>
       <Modal
-        visible={visible}
+        open={visible}
         onCancel={() => setVisible(false)}
         destroyOnClose
         title={t("bills.actions.return")}

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

@@ -32,7 +32,7 @@ export default function BillDetailEditcontainer() {
         history.push({ search: queryString.stringify(search) });
       }}
       destroyOnClose
-      visible={search.billid}
+      open={search.billid}
     >
       <BillDetailEditComponent />
     </Drawer>

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

@@ -344,7 +344,7 @@ function BillEnterModalContainer({
     <Modal
       title={t("bills.labels.new")}
       width={"98%"}
-      visible={billEnterModal.visible}
+      open={billEnterModal.visible}
       okText={t("general.actions.save")}
       keyboard="false"
       onOk={() => form.submit()}

client/src/components/ca-bc-etf-table-modal/ca-bc-etf-table-modal.container.jsx

@@ -39,7 +39,13 @@ export function ContractsFindModalContainer({
       if (!claim || !shortclaim) return;
       const trimmedShortClaim = shortclaim.trim();
       // const trimmedClaim = claim.trim();
-      claimNumbers.push({ claim: trimmedShortClaim, amount });
+      if (amount.slice(-1) === "-") {
+      }
+
+      claimNumbers.push({
+        claim: trimmedShortClaim,
+        amount: amount.slice(-1) === "-" ? parseFloat(amount) * -1 : amount,
+      });
     });
 
     await GenerateDocument(
@@ -64,7 +70,7 @@ export function ContractsFindModalContainer({
 
   return (
     <Modal
-      visible={visible}
+      open={visible}
       width="70%"
       title={t("payments.labels.findermodal")}
       onCancel={() => toggleModalVisible()}

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

@@ -35,7 +35,7 @@ export default function CABCpvrtCalculator({ disabled, form }) {
     <Popover
       destroyTooltipOnHide
       content={popContent}
-      visible={visibility}
+      open={visibility}
       disabled={disabled}
     >
       <Button disabled={disabled} onClick={() => setVisibility(true)}>

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

@@ -6,8 +6,8 @@ import { setSelectedConversation } from "../../redux/messaging/messaging.actions
 import { selectSelectedConversation } from "../../redux/messaging/messaging.selectors";
 import { TimeAgoFormatter } from "../../utils/DateFormatter";
 import PhoneFormatter from "../../utils/PhoneFormatter";
-import "./chat-conversation-list.styles.scss";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+import "./chat-conversation-list.styles.scss";
 
 const mapStateToProps = createStructuredSelector({
   selectedConversation: selectSelectedConversation,
@@ -38,17 +38,20 @@ export function ChatConversationListComponent({
                 : null
             }`}
           >
-            {item.job_conversations.length > 0 ? (
-              <div className="chat-name">
-                {item.job_conversations.map((j, idx) => (
-                  <div key={idx}>
-                    <OwnerNameDisplay ownerObject={j.job} />
-                  </div>
-                ))}
-              </div>
-            ) : (
-              <PhoneFormatter>{item.phone_num}</PhoneFormatter>
-            )}
+            <div sryle={{ display: "inline-block" }}>
+              {item.label && <div className="chat-name">{item.label}</div>}
+              {item.job_conversations.length > 0 ? (
+                <div className="chat-name">
+                  {item.job_conversations.map((j, idx) => (
+                    <div key={idx}>
+                      <OwnerNameDisplay ownerObject={j.job} />
+                    </div>
+                  ))}
+                </div>
+              ) : (
+                <PhoneFormatter>{item.phone_num}</PhoneFormatter>
+              )}
+            </div>
             <div sryle={{ display: "inline-block" }}>
               <div>
                 {item.job_conversations.length > 0

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

@@ -3,6 +3,7 @@ import React from "react";
 import PhoneNumberFormatter from "../../utils/PhoneFormatter";
 import ChatArchiveButton from "../chat-archive-button/chat-archive-button.component";
 import ChatConversationTitleTags from "../chat-conversation-title-tags/chat-conversation-title-tags.component";
+import ChatLabelComponent from "../chat-label/chat-label.component";
 import ChatTagRoContainer from "../chat-tag-ro/chat-tag-ro.container";
 
 export default function ChatConversationTitle({ conversation }) {
@@ -11,6 +12,7 @@ export default function ChatConversationTitle({ conversation }) {
       <PhoneNumberFormatter>
         {conversation && conversation.phone_num}
       </PhoneNumberFormatter>
+      <ChatLabelComponent conversation={conversation} />
       <ChatConversationTitleTags
         jobConversations={
           (conversation && conversation.job_conversations) || []

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

@@ -0,0 +1,67 @@
+import { PlusOutlined } from "@ant-design/icons";
+import { useMutation } from "@apollo/client";
+import { Input, notification, Spin, Tag, Tooltip } from "antd";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { UPDATE_CONVERSATION_LABEL } from "../../graphql/conversations.queries";
+export default function ChatLabel({ conversation }) {
+  const [loading, setLoading] = useState(false);
+  const [editing, setEditing] = useState(false);
+  const [value, setValue] = useState(conversation.label);
+
+  const { t } = useTranslation();
+  const [updateLabel] = useMutation(UPDATE_CONVERSATION_LABEL);
+
+  const handleSave = async () => {
+    setLoading(true);
+    try {
+      const response = await updateLabel({
+        variables: { id: conversation.id, label: value },
+      });
+      if (response.errors) {
+        notification["error"]({
+          message: t("messages.errors.updatinglabel", {
+            error: JSON.stringify(response.errors),
+          }),
+        });
+      } else {
+        setEditing(false);
+      }
+    } catch (error) {
+      notification["error"]({
+        message: t("messages.errors.updatinglabel", {
+          error: JSON.stringify(error),
+        }),
+      });
+    } finally {
+      setLoading(false);
+    }
+  };
+  if (editing) {
+    return (
+      <div>
+        <Input
+          autoFocus
+          value={value}
+          onChange={(e) => setValue(e.target.value)}
+          onBlur={handleSave}
+          allowClear
+        />
+        {loading && <Spin size="small" />}
+      </div>
+    );
+  } else {
+    return conversation.label && conversation.label.trim() !== "" ? (
+      <Tag style={{ cursor: "pointer" }} onClick={() => setEditing(true)}>
+        {conversation.label}
+      </Tag>
+    ) : (
+      <Tooltip title={t("messaging.labels.addlabel")}>
+        <PlusOutlined
+          style={{ cursor: "pointer" }}
+          onClick={() => setEditing(true)}
+        />
+      </Tooltip>
+    );
+  }
+}

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

@@ -88,8 +88,8 @@ export function ChatMediaSelector({
       }
       title={t("messaging.labels.selectmedia")}
       trigger="click"
-      visible={visible}
-      onVisibleChange={handleVisibleChange}
+      open={visible}
+      onOpenChange={handleVisibleChange}
     >
       <Badge count={selectedMedia.filter((s) => s.isSelected).length}>
         <PictureFilled style={{ margin: "0 .5rem" }} />

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

@@ -1,5 +1,5 @@
 import { PlusCircleOutlined } from "@ant-design/icons";
-import { Dropdown, Menu } from "antd";
+import { Dropdown } from "antd";
 import React from "react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -16,19 +16,15 @@ const mapDispatchToProps = (dispatch) => ({
 });
 
 export function ChatPresetsComponent({ bodyshop, setMessage, className }) {
-  const menu = (
-    <Menu>
-      {bodyshop.md_messaging_presets.map((i, idx) => (
-        <Menu.Item onClick={() => setMessage(i.text)} key={idx}>
-          {i.label}
-        </Menu.Item>
-      ))}
-    </Menu>
-  );
+  const menu = bodyshop.md_messaging_presets.map((i, idx) => ({
+    label: i.label,
+    key: idx,
+    onClick: () => setMessage(i.text),
+  }));
 
   return (
     <div className={className}>
-      <Dropdown trigger={["click"]} overlay={menu}>
+      <Dropdown trigger={["click"]} menu={{ items: menu }} placement="top">
         <PlusCircleOutlined />
       </Dropdown>
     </div>

client/src/components/contract-convert-to-ro/contract-convert-to-ro.component.jsx

@@ -390,7 +390,7 @@ export function ContractConvertToRo({
 
   return (
     <div>
-      <Popover content={popContent} visible={visible}>
+      <Popover content={popContent} open={visible}>
         <Button
           onClick={() => setVisible(true)}
           loading={loading}

client/src/components/contract-license-decode-button/contract-license-decode-button.component.jsx

@@ -55,7 +55,7 @@ export default function ContractLicenseDecodeButton({ form }) {
   return (
     <div>
       <Modal
-        visible={modalVisible}
+        open={modalVisible}
         okText={t("contracts.actions.senddltoform")}
         onOk={handleInsertForm}
         okButtonProps={{ disabled: !!!decodedBarcode }}

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

@@ -59,7 +59,7 @@ export function ContractsFindModalContainer({
 
   return (
     <Modal
-      visible={visible}
+      open={visible}
       width="70%"
       title={t("contracts.labels.findermodal")}
       onCancel={() => toggleModalVisible()}

client/src/components/contracts-rates-change-button/contracts-rates-change-button.component.jsx

@@ -1,5 +1,5 @@
 import { DownOutlined } from "@ant-design/icons";
-import { Dropdown, Menu } from "antd";
+import { Dropdown } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -13,25 +13,14 @@ const mapStateToProps = createStructuredSelector({
 export function ContractsRatesChangeButton({ disabled, form, bodyshop }) {
   const { t } = useTranslation();
 
-  const handleClick = ({ item, key, keyPath }) => {
-    const { label, ...rate } = item.props.value;
-    form.setFieldsValue(rate);
-  };
-
-  const menu = (
-    <div>
-      <Menu onClick={handleClick}>
-        {bodyshop.md_ccc_rates.map((rate, idx) => (
-          <Menu.Item value={rate} key={idx}>
-            {rate.label}
-          </Menu.Item>
-        ))}
-      </Menu>
-    </div>
-  );
+  const menu = bodyshop.md_ccc_rates.map((rate, idx) => ({
+    onClick: () => form.setFieldsValue(rate),
+    key: idx,
+    label: rate.label,
+  }));
 
   return (
-    <Dropdown overlay={menu} disabled={disabled}>
+    <Dropdown menu={{ items: menu }} disabled={disabled}>
       <a
         className="ant-dropdown-link"
         href=" #"

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

@@ -1,6 +1,7 @@
 import { WarningFilled } from "@ant-design/icons";
 import { useApolloClient } from "@apollo/client";
-import { Button, Form, Input, InputNumber, PageHeader, Space } from "antd";
+import { PageHeader } from '@ant-design/pro-layout';
+import { Button, Form, Input, InputNumber, Space } from "antd";
 import moment from "moment";
 import React from "react";
 import { useTranslation } from "react-i18next";

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

@@ -64,7 +64,7 @@ export function CCReturnModalContainer({
   return (
     <Modal
       title={t("courtesycars.labels.return")}
-      visible={visible}
+      open={visible}
       onCancel={() => toggleModalVisible()}
       width={"90%"}
       okText={t("general.actions.save")}

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

@@ -1,12 +1,21 @@
 import { SyncOutlined, WarningFilled } from "@ant-design/icons";
-import { Button, Card, Input, Space, Table, Tooltip } from "antd";
+import {
+  Button,
+  Card,
+  Dropdown,
+  Input, Space,
+  Table,
+  Tooltip
+} from "antd";
+import moment from "moment";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Link } from "react-router-dom";
 import { DateTimeFormatter } from "../../utils/DateFormatter";
+import { GenerateDocument } from "../../utils/RenderTemplate";
 import { alphaSort } from "../../utils/sorters";
+import { TemplateList } from "../../utils/TemplateConstants";
 import { OwnerNameDisplayFunction } from "../owner-name-display/owner-name-display.component";
-import moment from "moment";
 export default function CourtesyCarsList({ loading, courtesycars, refetch }) {
   const [state, setState] = useState({
     sortedInfo: {},
@@ -166,6 +175,33 @@ export default function CourtesyCarsList({ loading, courtesycars, refetch }) {
           <Button onClick={() => refetch()}>
             <SyncOutlined />
           </Button>
+          <Dropdown
+            trigger="click"
+            menu={{
+              items: [
+                {
+                  label: t(
+                    "printcenter.courtesycarcontract.courtesy_car_inventory"
+                  ),
+                  key: "cc_inv",
+                  onClick: () =>
+                    GenerateDocument(
+                      {
+                        name: TemplateList("courtesycar").courtesy_car_inventory
+                          .key,
+                        variables: {
+                          //id: contract.id
+                        },
+                      },
+                      {},
+                      "p"
+                    ),
+                },
+              ],
+            }}
+          >
+            <Button>{t("general.labels.print")}</Button>
+          </Dropdown>
           <Link to={`/manage/courtesycars/new`}>
             <Button>{t("courtesycars.actions.new")}</Button>
           </Link>

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

@@ -1,6 +1,7 @@
 import Icon, { SyncOutlined } from "@ant-design/icons";
 import { gql, useMutation, useQuery } from "@apollo/client";
-import { Button, Dropdown, Menu, notification, PageHeader, Space } from "antd";
+import { PageHeader } from '@ant-design/pro-layout';
+import { Button, Dropdown, Menu, notification, Space } from "antd";
 import i18next from "i18next";
 import _ from "lodash";
 import moment from "moment";
@@ -117,17 +118,15 @@ export function DashboardGridComponent({ currentUser, bodyshop }) {
   );
   const existingLayoutKeys = state.items.map((i) => i.i);
   const addComponentOverlay = (
-    <Menu onClick={handleAddComponent}>
-      {Object.keys(componentList).map((key) => (
-        <Menu.Item
-          key={key}
-          value={key}
-          disabled={existingLayoutKeys.includes(key)}
-        >
-          {componentList[key].label}
-        </Menu.Item>
-      ))}
-    </Menu>
+    <Menu
+      onClick={handleAddComponent}
+      items={Object.keys(componentList).map((key) => ({
+        key: key,
+        value: key,
+        disabled: existingLayoutKeys.includes(key),
+        label: componentList[key].label,
+      }))}
+    ></Menu>
   );
 
   if (error) return <AlertComponent message={error.message} type="error" />;
@@ -283,8 +282,12 @@ const createDashboardQuery = (state) => {
       monthly_sales: jobs(where: {_and: [
         { voided: {_eq: false}},
         {date_invoiced: {_gte: "${moment()
-        .startOf("month").startOf('day').toISOString()}"}}, {date_invoiced: {_lte: "${moment()
-    .endOf("month").endOf('day').toISOString()}"}}]}) {
+          .startOf("month")
+          .startOf("day")
+          .toISOString()}"}}, {date_invoiced: {_lte: "${moment()
+    .endOf("month")
+    .endOf("day")
+    .toISOString()}"}}]}) {
     id
     ro_number
     date_invoiced

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

@@ -1,6 +1,5 @@
 import { SyncOutlined } from "@ant-design/icons";
 import { Button, Card, Form, Input, Table } from "antd";
-import Dinero from "dinero.js";
 import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -141,7 +140,10 @@ export function DmsAllocationsSummaryAp({ socket, bodyshop, billids, title }) {
         >
           <Input />
         </Form.Item>
-        <Button disabled={!socket.allocationsSummary} htmlType="submit">
+        <Button
+          disabled={!allocationsSummary || allocationsSummary.length === 0}
+          htmlType="submit"
+        >
           {t("jobs.actions.dms.post")}
         </Button>
       </Form>

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

@@ -1,4 +1,4 @@
-import { Button, Card, Table, Typography } from "antd";
+import { Alert, Button, Card, Table, Typography } from "antd";
 import React, { useState, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -90,6 +90,9 @@ export function DmsAllocationsSummary({ socket, bodyshop, jobId, title }) {
         </Button>
       }
     >
+      {bodyshop.pbs_configuration?.disablebillwip && (
+        <Alert type="warning" message={t("jobs.labels.dms.disablebillwip")} />
+      )}
       <Table
         pagination={{ position: "top", defaultPageSize: 50 }}
         columns={columns}

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

@@ -51,7 +51,7 @@ export function DmsCdkVehicles({ bodyshop, form, socket, job }) {
     <>
       <Modal
         width={"90%"}
-        visible={visible}
+        open={visible}
         onCancel={() => setVisible(false)}
         onOk={() => {
           form.setFieldsValue({

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

@@ -6,12 +6,10 @@ import {
   Dropdown,
   Form,
   Input,
-  InputNumber,
-  Menu,
-  Select,
+  InputNumber, Select,
   Space,
   Statistic,
-  Typography,
+  Typography
 } from "antd";
 import Dinero from "dinero.js";
 import moment from "moment";
@@ -21,6 +19,7 @@ import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { determineDmsType } from "../../pages/dms/dms.container";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import i18n from "../../translations/i18n";
 import DmsCdkMakes from "../dms-cdk-makes/dms-cdk-makes.component";
 import DmsCdkMakesRefetch from "../dms-cdk-makes/dms-cdk-makes.refetch.component";
 import FormDatePicker from "../form-date-picker/form-date-picker.component";
@@ -276,36 +275,32 @@ export function DmsPostForm({ bodyshop, socket, job, logsRef }) {
                           <div>
                             {t("jobs.fields.dms.payer.controlnumber")}{" "}
                             <Dropdown
-                              overlay={
-                                <Menu>
-                                  {bodyshop.cdk_configuration.controllist &&
-                                    bodyshop.cdk_configuration.controllist.map(
-                                      (key, idx) => (
-                                        <Menu.Item
-                                          key={idx}
-                                          onClick={() => {
-                                            form.setFieldsValue({
-                                              payers: form
-                                                .getFieldValue("payers")
-                                                .map((row, mapIndex) => {
-                                                  if (index !== mapIndex)
-                                                    return row;
+                              menu={{
+                                items:
+                                  bodyshop.cdk_configuration.controllist &&
+                                  bodyshop.cdk_configuration.controllist.map(
+                                    (key, idx) => ({
+                                      key: idx,
+                                      label: key.name,
+                                      onClick: () => {
+                                        form.setFieldsValue({
+                                          payers: form
+                                            .getFieldValue("payers")
+                                            .map((row, mapIndex) => {
+                                              if (index !== mapIndex)
+                                                return row;
 
-                                                  return {
-                                                    ...row,
-                                                    controlnumber:
-                                                      key.controlnumber,
-                                                  };
-                                                }),
-                                            });
-                                          }}
-                                        >
-                                          {key.name}
-                                        </Menu.Item>
-                                      )
-                                    )}
-                                </Menu>
-                              }
+                                              return {
+                                                ...row,
+                                                controlnumber:
+                                                  key.controlnumber,
+                                              };
+                                            }),
+                                        });
+                                      },
+                                    })
+                                  ),
+                              }}
                             >
                               <a href=" #" onClick={(e) => e.preventDefault()}>
                                 <DownOutlined />
@@ -335,13 +330,31 @@ export function DmsPostForm({ bodyshop, socket, job, logsRef }) {
                             bodyshop.cdk_configuration.payers.find(
                               (i) => i && row && i.name === row.name
                             );
-
-                          return (
-                            <div>
-                              {cdkPayer &&
-                                t(`jobs.fields.${cdkPayer.control_type}`)}
-                            </div>
-                          );
+                          if (
+                            i18n.exists(`jobs.fields.${cdkPayer?.control_type}`)
+                          )
+                            return (
+                              <div>
+                                {cdkPayer &&
+                                  t(`jobs.fields.${cdkPayer?.control_type}`)}
+                              </div>
+                            );
+                          else if (
+                            i18n.exists(
+                              `jobs.fields.dms.control_type.${cdkPayer?.control_type}`
+                            )
+                          ) {
+                            return (
+                              <div>
+                                {cdkPayer &&
+                                  t(
+                                    `jobs.fields.dms.control_type.${cdkPayer?.control_type}`
+                                  )}
+                              </div>
+                            );
+                          } else {
+                            return null;
+                          }
                         }}
                       </Form.Item>
 

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

@@ -57,20 +57,23 @@ export function EmailOverlayComponent({
 
   const menu = (
     <div>
-      <Menu onClick={handleClick}>
-        {bodyshop.employees
-          .filter((e) => e.user_email)
-          .map((e, idx) => (
-            <Menu.Item value={e.user_email} key={idx}>
-              {`${e.first_name} ${e.last_name}`}
-            </Menu.Item>
-          ))}
-        {bodyshop.md_to_emails.map((e, idx) => (
-          <Menu.Item value={e.emails} key={idx + "group"}>
-            {e.label}
-          </Menu.Item>
-        ))}
-      </Menu>
+      <Menu
+        onClick={handleClick}
+        items={[
+          ...bodyshop.employees
+            .filter((e) => e.user_email)
+            .map((e, idx) => ({
+              value: e.user_email,
+              key: idx,
+              label: `${e.first_name} ${e.last_name}`,
+            })),
+          ...bodyshop.md_to_emails.map((e, idx) => ({
+            value: e.emails,
+            key: idx + "group",
+            label: e.label,
+          })),
+        ]}
+      />
     </div>
   );
 

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

@@ -174,10 +174,11 @@ export function EmailOverlayContainer({
   return (
     <Modal
       destroyOnClose={true}
-      visible={modalVisible}
+      open={modalVisible}
       maskClosable={false}
       width={"80%"}
       onOk={() => form.submit()}
+      title={t("emails.labels.emailpreview")}
       onCancel={() => {
         toggleEmailOverlayVisible();
       }}
@@ -198,7 +199,7 @@ export function EmailOverlayContainer({
       <div>
         <div
           style={{
-            marginTop: "1rem",
+            //   marginTop: "3rem",
             display: "flex",
             justifyContent: "flex-end",
           }}

client/src/components/form-input-number-calculator/form-input-number-calculator.component.jsx

@@ -94,7 +94,7 @@ const FormInputNUmberCalculator = (
 
   return (
     <div>
-      <Popover content={popContent} visible={history.length > 0}>
+      <Popover content={popContent} open={history.length > 0}>
         <InputNumber
           ref={ref}
           value={value}

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

@@ -12,7 +12,7 @@ import Icon, {
   FileAddFilled,
   FileAddOutlined,
   FileFilled,
-  GlobalOutlined,
+  //GlobalOutlined,
   HomeFilled,
   ImportOutlined,
   LineChartOutlined,
@@ -106,302 +106,428 @@ function Header({
         selectedKeys={[selectedHeader]}
         onClick={handleMenuClick}
         subMenuCloseDelay={0.3}
-      >
-        <Menu.Item key="home" icon={<HomeFilled />}>
-          <Link to="/manage">{t("menus.header.home")}</Link>
-        </Menu.Item>
-        <Menu.Item key="schedule" icon={<Icon component={FaCalendarAlt} />}>
-          <Link to="/manage/schedule">{t("menus.header.schedule")}</Link>
-        </Menu.Item>
-        <Menu.SubMenu
-          key="jobssubmenu"
-          icon={<Icon component={FaCarCrash} />}
-          title={t("menus.header.jobs")}
-        >
-          <Menu.Item key="activejobs" icon={<FileFilled />}>
-            <Link to="/manage/jobs">{t("menus.header.activejobs")}</Link>
-          </Menu.Item>
-          <Menu.Item key="readyjobs" icon={<CheckCircleOutlined />}>
-            <Link to="/manage/jobs/ready">{t("menus.header.readyjobs")}</Link>
-          </Menu.Item>
-          <Menu.Item key="parts-queue" icon={<ToolFilled />}>
-            <Link to="/manage/partsqueue">{t("menus.header.parts-queue")}</Link>
-          </Menu.Item>
-          <Menu.Item key="availablejobs" icon={<ImportOutlined />}>
-            <Link to="/manage/available">
-              {t("menus.header.availablejobs")}
-            </Link>
-          </Menu.Item>
-          <Menu.Item key="newjob" icon={<FileAddOutlined />}>
-            <Link to="/manage/jobs/new">{t("menus.header.newjob")}</Link>
-          </Menu.Item>
-          <Menu.Divider key="div1" />
-          <Menu.Item key="alljobs" icon={<UnorderedListOutlined />}>
-            <Link to="/manage/jobs/all">{t("menus.header.alljobs")}</Link>
-          </Menu.Item>
-          <Menu.Divider key="div2" />
-          <Menu.Item key="productionlist" icon={<ScheduleOutlined />}>
-            <Link to="/manage/production/list">
-              {t("menus.header.productionlist")}
-            </Link>
-          </Menu.Item>
-          <Menu.Item key="productionboard" icon={<Icon component={BsKanban} />}>
-            <Link to="/manage/production/board">
-              {t("menus.header.productionboard")}
-            </Link>
-          </Menu.Item>
-          <Menu.Divider key="div3" />
-          <Menu.Item key="scoreboard" icon={<LineChartOutlined />}>
-            <Link to="/manage/scoreboard">{t("menus.header.scoreboard")}</Link>
-          </Menu.Item>
-        </Menu.SubMenu>
-        <Menu.SubMenu
-          key="customers"
-          icon={<UserOutlined />}
-          title={t("menus.header.customers")}
-        >
-          <Menu.Item key="owners" icon={<TeamOutlined />}>
-            <Link to="/manage/owners">{t("menus.header.owners")}</Link>
-          </Menu.Item>
-          <Menu.Item key="vehicles" icon={<CarFilled />}>
-            <Link to="/manage/vehicles">{t("menus.header.vehicles")}</Link>
-          </Menu.Item>
-        </Menu.SubMenu>
-        <Menu.SubMenu
-          key="ccs"
-          icon={<CarFilled />}
-          title={t("menus.header.courtesycars")}
-        >
-          <Menu.Item key="courtesycarsall" icon={<CarFilled />}>
-            <Link to="/manage/courtesycars">
-              {t("menus.header.courtesycars-all")}
-            </Link>
-          </Menu.Item>
-          <Menu.Item key="contracts" icon={<FileFilled />}>
-            <Link to="/manage/courtesycars/contracts">
-              {t("menus.header.courtesycars-contracts")}
-            </Link>
-          </Menu.Item>
-          <Menu.Item key="newcontract" icon={<FileAddFilled />}>
-            <Link to="/manage/courtesycars/contracts/new">
-              {t("menus.header.courtesycars-newcontract")}
-            </Link>
-          </Menu.Item>
-        </Menu.SubMenu>
-        <Menu.SubMenu
-          key="accounting"
-          icon={<DollarCircleFilled />}
-          title={t("menus.header.accounting")}
-        >
-          <Menu.Item
-            key="bills"
-            icon={<Icon component={FaFileInvoiceDollar} />}
-          >
-            <Link to="/manage/bills">{t("menus.header.bills")}</Link>
-          </Menu.Item>
-          <Menu.Item
-            key="enterbills"
-            icon={<Icon component={GiPayMoney} />}
-            onClick={() => {
-              setBillEnterContext({
-                actions: {},
-                context: {},
-              });
-            }}
-          >
-            {t("menus.header.enterbills")}
-          </Menu.Item>
-          {Simple_Inventory.treatment === "on" && (
-            <>
-              <Menu.Divider key="div4" />
-              <Menu.Item
-                key="inventory"
-                icon={<Icon component={FaFileInvoiceDollar} />}
-              >
-                <Link to="/manage/inventory">
-                  {t("menus.header.inventory")}
-                </Link>
-              </Menu.Item>
-            </>
-          )}
-          <Menu.Divider key="div7" />
-          <Menu.Item key="allpayments" icon={<BankFilled />}>
-            <Link to="/manage/payments">{t("menus.header.allpayments")}</Link>
-          </Menu.Item>
-          <Menu.Item
-            key="enterpayments"
-            onClick={() => {
-              setPaymentContext({
-                actions: {},
-                context: null,
-              });
-            }}
-            icon={<Icon component={FaCreditCard} />}
-          >
-            {t("menus.header.enterpayment")}
-          </Menu.Item>
-          <Menu.Divider key="div5" />
-          <Menu.Item key="timetickets" icon={<FieldTimeOutlined />}>
-            <Link to="/manage/timetickets">
-              {t("menus.header.timetickets")}
-            </Link>
-          </Menu.Item>
-          <Menu.Item
-            key="entertimetickets"
-            icon={<Icon component={GiPlayerTime} />}
-            onClick={() => {
-              setTimeTicketContext({
-                actions: {},
-                context: {},
-              });
-            }}
-          >
-            {t("menus.header.entertimeticket")}
-          </Menu.Item>
-          <Menu.Divider key="div6" />
-          <Menu.SubMenu
-            key="accountingexport"
-            title={t("menus.header.export")}
-            icon={<ExportOutlined />}
-          >
-            <Menu.Item key="receivables">
-              <Link to="/manage/accounting/receivables">
-                {t("menus.header.accounting-receivables")}
+        items={[
+          {
+            key: "home",
+            icon: <HomeFilled />,
+            label: <Link to="/manage">{t("menus.header.home")}</Link>,
+          },
+          {
+            key: "schedule",
+            icon: <Icon component={FaCalendarAlt} />,
+            label: (
+              <Link to="/manage/schedule">{t("menus.header.schedule")}</Link>
+            ),
+          },
+          {
+            key: "jobssubmenu",
+            icon: <Icon component={FaCarCrash} />,
+            label: t("menus.header.jobs"),
+            children: [
+              {
+                key: "activejobs",
+                icon: <FileFilled />,
+                label: (
+                  <Link to="/manage/jobs">{t("menus.header.activejobs")}</Link>
+                ),
+              },
+              {
+                key: "readyjobs",
+                icon: <CheckCircleOutlined />,
+                label: (
+                  <Link to="/manage/jobs/ready">
+                    {t("menus.header.readyjobs")}
+                  </Link>
+                ),
+              },
+              {
+                key: "parts-queue",
+                icon: <ToolFilled />,
+                label: (
+                  <Link to="/manage/partsqueue">
+                    {t("menus.header.parts-queue")}
+                  </Link>
+                ),
+              },
+              {
+                key: "availablejobs",
+                icon: <ImportOutlined />,
+                label: (
+                  <Link to="/manage/available">
+                    {t("menus.header.availablejobs")}
+                  </Link>
+                ),
+              },
+              {
+                key: "newjob",
+                icon: <FileAddOutlined />,
+                label: (
+                  <Link to="/manage/jobs/new">{t("menus.header.newjob")}</Link>
+                ),
+              },
+              { type: "divider" },
+              {
+                key: "alljobs",
+                icon: <UnorderedListOutlined />,
+                label: (
+                  <Link to="/manage/jobs/all">{t("menus.header.alljobs")}</Link>
+                ),
+              },
+              { type: "divider" },
+              {
+                key: "productionlist",
+                icon: <ScheduleOutlined />,
+                label: (
+                  <Link to="/manage/production/list">
+                    {t("menus.header.productionlist")}
+                  </Link>
+                ),
+              },
+              {
+                key: "productionboard",
+                icon: <Icon component={BsKanban} />,
+                label: (
+                  <Link to="/manage/production/board">
+                    {t("menus.header.productionboard")}
+                  </Link>
+                ),
+              },
+              {
+                type: "divider",
+              },
+              {
+                key: "scoreboard",
+                icon: <LineChartOutlined />,
+                label: (
+                  <Link to="/manage/scoreboard">
+                    {t("menus.header.scoreboard")}
+                  </Link>
+                ),
+              },
+            ],
+          },
+          {
+            key: "customers",
+            icon: <UserOutlined />,
+            label: t("menus.header.customers"),
+            children: [
+              {
+                key: "owners",
+                icon: <TeamOutlined />,
+                label: (
+                  <Link to="/manage/owners">{t("menus.header.owners")}</Link>
+                ),
+              },
+              {
+                key: "vehicles",
+                icon: <CarFilled />,
+                label: (
+                  <Link to="/manage/vehicles">
+                    {t("menus.header.vehicles")}
+                  </Link>
+                ),
+              },
+            ],
+          },
+          {
+            key: "ccs",
+            icon: <CarFilled />,
+            label: t("menus.header.courtesycars"),
+            children: [
+              {
+                key: "courtesycarsall",
+                icon: <CarFilled />,
+                label: (
+                  <Link to="/manage/courtesycars">
+                    {t("menus.header.courtesycars-all")}
+                  </Link>
+                ),
+              },
+              {
+                key: "contracts",
+                icon: <FileFilled />,
+                label: (
+                  <Link to="/manage/courtesycars/contracts">
+                    {t("menus.header.courtesycars-contracts")}
+                  </Link>
+                ),
+              },
+              {
+                key: "newcontract",
+                icon: <FileAddFilled />,
+                label: (
+                  <Link to="/manage/courtesycars/contracts/new">
+                    {t("menus.header.courtesycars-newcontract")}
+                  </Link>
+                ),
+              },
+            ],
+          },
+          {
+            key: "accounting",
+            icon: <DollarCircleFilled />,
+            label: t("menus.header.accounting"),
+            children: [
+              {
+                key: "bills",
+                icon: <Icon component={FaFileInvoiceDollar} />,
+                label: (
+                  <Link to="/manage/bills">{t("menus.header.bills")}</Link>
+                ),
+              },
+              {
+                key: "enterbills",
+                icon: <Icon component={GiPayMoney} />,
+                onClick: () => {
+                  setBillEnterContext({
+                    actions: {},
+                    context: {},
+                  });
+                },
+                label: t("menus.header.enterbills"),
+              },
+              ...(Simple_Inventory.treatment === "on"
+                ? [
+                    {
+                      type: "divider",
+                    },
+                    {
+                      key: "inventory",
+                      icon: <Icon component={FaFileInvoiceDollar} />,
+                      label: (
+                        <Link to="/manage/inventory">
+                          {t("menus.header.inventory")}
+                        </Link>
+                      ),
+                    },
+                  ]
+                : []),
+              { type: "divider" },
+              {
+                key: "allpayments",
+                icon: <BankFilled />,
+                label: (
+                  <Link to="/manage/payments">
+                    {t("menus.header.allpayments")}
+                  </Link>
+                ),
+              },
+              {
+                key: "enterpayments",
+                onClick: () => {
+                  setPaymentContext({
+                    actions: {},
+                    context: null,
+                  });
+                },
+                icon: <Icon component={FaCreditCard} />,
+                label: t("menus.header.enterpayment"),
+              },
+              { type: "divider" },
+              {
+                key: "timetickets",
+                icon: <FieldTimeOutlined />,
+                label: (
+                  <Link to="/manage/timetickets">
+                    {t("menus.header.timetickets")}
+                  </Link>
+                ),
+              },
+              {
+                key: "entertimetickets",
+                icon: <Icon component={GiPlayerTime} />,
+                onClick: () => {
+                  setTimeTicketContext({
+                    actions: {},
+                    context: {},
+                  });
+                },
+                label: t("menus.header.entertimeticket"),
+              },
+              { type: "divider" },
+              {
+                key: "accountingexport",
+                icon: <ExportOutlined />,
+
+                label: t("menus.header.export"),
+                children: [
+                  {
+                    key: "receivables",
+                    label: (
+                      <Link to="/manage/accounting/receivables">
+                        {t("menus.header.accounting-receivables")}
+                      </Link>
+                    ),
+                  },
+                  ...(!(
+                    (bodyshop && bodyshop.cdk_dealerid) ||
+                    (bodyshop && bodyshop.pbs_serialnumber)
+                  ) || DmsAp.treatment === "on"
+                    ? [
+                        {
+                          key: "payables",
+                          label: (
+                            <Link to="/manage/accounting/payables">
+                              {t("menus.header.accounting-payables")}
+                            </Link>
+                          ),
+                        },
+                      ]
+                    : []),
+
+                  ...(!(
+                    (bodyshop && bodyshop.cdk_dealerid) ||
+                    (bodyshop && bodyshop.pbs_serialnumber)
+                  )
+                    ? [
+                        {
+                          key: "payments",
+                          label: (
+                            <Link to="/manage/accounting/payments">
+                              {t("menus.header.accounting-payments")}
+                            </Link>
+                          ),
+                        },
+                      ]
+                    : []),
+                  {
+                    key: "export-logs",
+                    label: (
+                      <Link to="/manage/accounting/exportlogs">
+                        {t("menus.header.export-logs")}
+                      </Link>
+                    ),
+                  },
+                ],
+              },
+            ],
+          },
+
+          {
+            key: "phonebook",
+            icon: <PhoneOutlined />,
+            label: (
+              <Link to="/manage/phonebook">{t("menus.header.phonebook")}</Link>
+            ),
+          },
+          {
+            key: "temporarydocs",
+            icon: <PaperClipOutlined />,
+            label: (
+              <Link to="/manage/temporarydocs">
+                {t("menus.header.temporarydocs")}
               </Link>
-            </Menu.Item>
-            {(!(
-              (bodyshop && bodyshop.cdk_dealerid) ||
-              (bodyshop && bodyshop.pbs_serialnumber)
-            ) ||
-              DmsAp.treatment === "on") && (
-              <Menu.Item key="payables">
-                <Link to="/manage/accounting/payables">
-                  {t("menus.header.accounting-payables")}
-                </Link>
-              </Menu.Item>
-            )}
-            {!(
-              (bodyshop && bodyshop.cdk_dealerid) ||
-              (bodyshop && bodyshop.pbs_serialnumber)
-            ) && (
-              <Menu.Item key="payments">
-                <Link to="/manage/accounting/payments">
-                  {t("menus.header.accounting-payments")}
-                </Link>
-              </Menu.Item>
-            )}
-            <Menu.Item key="export-logs">
-              <Link to="/manage/accounting/exportlogs">
-                {t("menus.header.export-logs")}
-              </Link>
-            </Menu.Item>
-          </Menu.SubMenu>
-        </Menu.SubMenu>
-        <Menu.Item key="phonebook" icon={<PhoneOutlined />}>
-          <Link to="/manage/phonebook">{t("menus.header.phonebook")}</Link>
-        </Menu.Item>
-        <Menu.Item key="temporarydocs" icon={<PaperClipOutlined />}>
-          <Link to="/manage/temporarydocs">
-            {t("menus.header.temporarydocs")}
-          </Link>
-        </Menu.Item>
-        <Menu.SubMenu
-          key="shopsubmenu"
-          title={t("menus.header.shop")}
-          icon={<SettingOutlined />}
-        >
-          <Menu.Item key="shop" icon={<Icon component={GiSettingsKnobs} />}>
-            <Link to="/manage/shop">{t("menus.header.shop_config")}</Link>
-          </Menu.Item>
-          <Menu.Item key="dashboard" icon={<DashboardFilled />}>
-            <Link to="/manage/dashboard">{t("menus.header.dashboard")}</Link>
-          </Menu.Item>
-          <Menu.Item
-            key="reportcenter"
-            icon={<BarChartOutlined />}
-            onClick={() => {
-              setReportCenterContext({
-                actions: {},
-                context: {},
-              });
-            }}
-          >
-            {t("menus.header.reportcenter")}
-          </Menu.Item>
-          <Menu.Item
-            key="shop-vendors"
-            icon={<Icon component={IoBusinessOutline} />}
-          >
-            <Link to="/manage/shop/vendors">
-              {t("menus.header.shop_vendors")}
-            </Link>
-          </Menu.Item>
-          <Menu.Item key="shop-csi" icon={<Icon component={RiSurveyLine} />}>
-            <Link to="/manage/shop/csi">{t("menus.header.shop_csi")}</Link>
-          </Menu.Item>
-        </Menu.SubMenu>
-        <Menu.SubMenu
-          key="user"
-          title={
-            currentUser.displayName ||
-            currentUser.email ||
-            t("general.labels.unknown")
-          }
-        >
-          <Menu.Item key="signout" danger onClick={() => signOutStart()}>
-            {t("user.actions.signout")}
-          </Menu.Item>
-          <Menu.Item
-            key="help"
-            onClick={() => {
-              window.open("https://help.imex.online/", "_blank");
-            }}
-            icon={<Icon component={QuestionCircleFilled} />}
-          >
-            {t("menus.header.help")}
-          </Menu.Item>
-          <Menu.Item
-            key="rescue"
-            onClick={() => {
-              window.open("https://imexrescue.com/", "_blank");
-            }}
-          >
-            {t("menus.header.rescueme")}
-          </Menu.Item>
-          <Menu.Item key="shiftclock">
-            <Link to="/manage/shiftclock">{t("menus.header.shiftclock")}</Link>
-          </Menu.Item>
-          <Menu.Item key="profile">
-            <Link to="/manage/profile">{t("menus.currentuser.profile")}</Link>
-          </Menu.Item>
-          <Menu.SubMenu
-            key="langselecter"
-            title={
-              <span>
-                <GlobalOutlined />
-                <span>{t("menus.currentuser.languageselector")}</span>
-              </span>
-            }
-          >
-            <Menu.Item actiontype="lang-select" key="en-US">
-              {t("general.languages.english")}
-            </Menu.Item>
-            <Menu.Item actiontype="lang-select" key="fr-CA">
-              {t("general.languages.french")}
-            </Menu.Item>
-            <Menu.Item actiontype="lang-select" key="es-MX">
-              {t("general.languages.spanish")}
-            </Menu.Item>
-          </Menu.SubMenu>
-        </Menu.SubMenu>
-        <Menu.SubMenu key="recent" title={<ClockCircleFilled />}>
-          {recentItems.map((i, idx) => (
-            <Menu.Item key={idx}>
-              <Link to={i.url}>{i.label}</Link>
-            </Menu.Item>
-          ))}
-        </Menu.SubMenu>
-      </Menu>
+            ),
+          },
+
+          {
+            key: "shopsubmenu",
+            icon: <SettingOutlined />,
+            label: t("menus.header.shop"),
+            children: [
+              {
+                key: "shop",
+                icon: <Icon component={GiSettingsKnobs} />,
+                label: (
+                  <Link to="/manage/shop">{t("menus.header.shop_config")}</Link>
+                ),
+              },
+              {
+                key: "dashboard",
+                icon: <DashboardFilled />,
+                label: (
+                  <Link to="/manage/dashboard">
+                    {t("menus.header.dashboard")}
+                  </Link>
+                ),
+              },
+              {
+                key: "reportcenter",
+                icon: <BarChartOutlined />,
+                onClick: () => {
+                  setReportCenterContext({
+                    actions: {},
+                    context: {},
+                  });
+                },
+                label: t("menus.header.reportcenter"),
+              },
+              {
+                key: "shop-vendors",
+                icon: <Icon component={IoBusinessOutline} />,
+                label: (
+                  <Link to="/manage/shop/vendors">
+                    {t("menus.header.shop_vendors")}
+                  </Link>
+                ),
+              },
+              {
+                key: "shop-csi",
+                icon: <Icon component={RiSurveyLine} />,
+                label: (
+                  <Link to="/manage/shop/csi">
+                    {t("menus.header.shop_csi")}
+                  </Link>
+                ),
+              },
+            ],
+          },
+          {
+            key: "user",
+            label:
+              currentUser.displayName ||
+              currentUser.email ||
+              t("general.labels.unknown"),
+            children: [
+              {
+                key: "signout",
+                danger: true,
+                onClick: () => signOutStart(),
+                label: t("user.actions.signout"),
+              },
+              {
+                key: "help",
+                icon: <Icon component={QuestionCircleFilled} />,
+                onClick: () => {
+                  window.open("https://help.imex.online/", "_blank");
+                },
+                label: t("menus.header.help"),
+              },
+              {
+                key: "rescue",
+                onClick: () => {
+                  window.open("https://imexrescue.com/", "_blank");
+                },
+                label: t("menus.header.rescueme"),
+              },
+              {
+                key: "shiftclock",
+                label: (
+                  <Link to="/manage/shiftclock">
+                    {t("menus.header.shiftclock")}
+                  </Link>
+                ),
+              },
+              {
+                key: "profile",
+                label: (
+                  <Link to="/manage/profile">
+                    {t("menus.currentuser.profile")}
+                  </Link>
+                ),
+              },
+            ],
+          },
+          {
+            key: "recent",
+            label: <ClockCircleFilled />,
+            children: recentItems.map((i, idx) => ({
+              key: idx,
+              label: <Link to={i.url}>{i.label}</Link>,
+            })),
+          },
+        ]}
+      ></Menu>
     </Layout.Header>
   );
 }

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

@@ -103,7 +103,7 @@ export function InventoryUpsertModalContainer({
           ? t("inventory.actions.edit")
           : t("inventory.actions.new")
       }
-      visible={visible}
+      open={visible}
       okText={t("general.actions.save")}
       onOk={() => {
         form.submit();

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

@@ -96,7 +96,7 @@ export function Jobd3RdPartyModal({ bodyshop, jobId, job }) {
   return (
     <>
       <Button onClick={showModal}>{t("printcenter.jobs.3rdpartypayer")}</Button>
-      <Modal visible={isModalVisible} onOk={handleOk} onCancel={handleCancel}>
+      <Modal open={isModalVisible} onOk={handleOk} onCancel={handleCancel}>
         <Form
           onFinish={handleFinish}
           autoComplete={"off"}

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

@@ -1,11 +1,11 @@
-import React from "react";
+import { DownOutlined } from "@ant-design/icons";
 import { useMutation } from "@apollo/client";
-import { UPDATE_JOB } from "../../graphql/jobs.queries";
+import { Dropdown, notification } from "antd";
+import React from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
-import { Dropdown, Menu, notification } from "antd";
-import { DownOutlined } from "@ant-design/icons";
+import { UPDATE_JOB } from "../../graphql/jobs.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 
 const mapStateToProps = createStructuredSelector({
@@ -37,18 +37,19 @@ export function JobAltTransportChange({ bodyshop, job }) {
       });
     }
   };
-  const menu = (
-    <Menu selectedKeys={[job && job.alt_transport]} onClick={onClick}>
-      {bodyshop.appt_alt_transport &&
-        bodyshop.appt_alt_transport.map((alt) => (
-          <Menu.Item key={alt}>{alt}</Menu.Item>
-        ))}
-      <Menu.Divider />
-      <Menu.Item key={"null"}>{t("general.actions.clear")}</Menu.Item>
-    </Menu>
-  );
+  const menu = [
+    ...(bodyshop.appt_alt_transport &&
+      bodyshop.appt_alt_transport.map((alt) => ({
+        key: alt,
+        label: alt,
+        value: alt,
+        onClick,
+      }))),
+    { type: "divider" },
+    { key: "null", label: t("general.actions.clear"), onClick },
+  ];
   return (
-    <Dropdown overlay={menu}>
+    <Dropdown menu={{ items: menu }}>
       <a href=" #" onClick={(e) => e.preventDefault()}>
         <DownOutlined />
       </a>

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

@@ -1,11 +1,11 @@
-import React from "react";
+import { DownOutlined } from "@ant-design/icons";
 import { useMutation } from "@apollo/client";
-import { UPDATE_APPOINTMENT } from "../../graphql/appointments.queries";
+import { Dropdown, notification } from "antd";
+import React from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
-import { Dropdown, Menu, notification } from "antd";
-import { DownOutlined } from "@ant-design/icons";
+import { UPDATE_APPOINTMENT } from "../../graphql/appointments.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 
 const mapStateToProps = createStructuredSelector({
@@ -44,21 +44,23 @@ export function ScheduleEventColor({ bodyshop, event }) {
     bodyshop.appt_colors.filter((color) => color.color.hex === event.color)[0]
       ?.label;
 
-  const menu = (
-    <Menu selectedKeys={[event.color]} onClick={onClick}>
-      {bodyshop.appt_colors &&
-        bodyshop.appt_colors.map((color) => (
-          <Menu.Item style={{ color: color.color.hex }} key={color.color.hex}>
-            {color.label}
-          </Menu.Item>
-        ))}
-      <Menu.Divider />
-      <Menu.Item key={"null"}>{t("general.actions.clear")}</Menu.Item>
-    </Menu>
-  );
+  const menu = {
+    items: [
+      ...(bodyshop.appt_colors &&
+        bodyshop.appt_colors.map((color) => ({
+          style: { color: color.color.hex },
+          key: color.color.hex,
+          label: color.label,
+        }))),
+      { type: "divider" },
+      { key: "null", value: t("general.actions.clear") },
+    ],
+    selectedKeys: [event.color],
+    onClick: onClick,
+  };
 
   return (
-    <Dropdown overlay={menu}>
+    <Dropdown menu={menu}>
       <a href=" #" onClick={(e) => e.preventDefault()}>
         {selectedColor}
         <DownOutlined />

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

@@ -2,11 +2,9 @@ import { AlertFilled } from "@ant-design/icons";
 import {
   Button,
   Divider,
-  Dropdown,
-  Menu,
-  notification,
+  Dropdown, notification,
   Popover,
-  Space,
+  Space
 } from "antd";
 import parsePhoneNumber from "libphonenumber-js";
 import moment from "moment";
@@ -18,7 +16,7 @@ import { Link, useHistory, useLocation } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
 import {
   openChatByPhone,
-  setMessage,
+  setMessage
 } from "../../redux/messaging/messaging.actions";
 import { setModalContext } from "../../redux/modals/modals.actions";
 import { selectBodyshop } from "../../redux/user/user.selectors";
@@ -27,11 +25,11 @@ import { GenerateDocument } from "../../utils/RenderTemplate";
 import { TemplateList } from "../../utils/TemplateConstants";
 import ChatOpenButton from "../chat-open-button/chat-open-button.component";
 import DataLabel from "../data-label/data-label.component";
+import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
 import ScheduleManualEvent from "../schedule-manual-event/schedule-manual-event.component";
 import ScheduleAtChange from "./job-at-change.component";
 import ScheduleEventColor from "./schedule-event.color.component";
 import ScheduleEventNote from "./schedule-event.note.component";
-import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -149,10 +147,12 @@ export function ScheduleEventComponent({
         ) : null}
         {event.job ? (
           <Dropdown
-            overlay={
-              <Menu>
-                <Menu.Item
-                  onClick={() => {
+            menu={{
+              items: [
+                {
+                  disabled: event.arrived,
+                  label: t("general.labels.email"),
+                  onClick: () => {
                     const Template = TemplateList("job").appointment_reminder;
                     GenerateDocument(
                       {
@@ -166,13 +166,12 @@ export function ScheduleEventComponent({
                       "e",
                       event.job && event.job.id
                     );
-                  }}
-                  disabled={event.arrived}
-                >
-                  {t("general.labels.email")}
-                </Menu.Item>
-                <Menu.Item
-                  onClick={() => {
+                  },
+                },
+                {
+                  label: t("general.labels.sms"),
+                  disabled: event.arrived || !bodyshop.messagingservicesid,
+                  onClick: () => {
                     const p = parsePhoneNumber(event.job.ownr_ph1, "CA");
                     if (p && p.isValid()) {
                       openChatByPhone({
@@ -192,13 +191,10 @@ export function ScheduleEventComponent({
                         message: t("messaging.error.invalidphone"),
                       });
                     }
-                  }}
-                  disabled={event.arrived || !bodyshop.messagingservicesid}
-                >
-                  {t("general.labels.sms")}
-                </Menu.Item>
-              </Menu>
-            }
+                  },
+                },
+              ],
+            }}
           >
             <Button>{t("appointments.actions.sendreminder")}</Button>
           </Dropdown>
@@ -249,7 +245,7 @@ export function ScheduleEventComponent({
   const RegularEvent = event.isintake ? (
     <Space
       wrap
-      size='small'
+      size="small"
       style={{
         backgroundColor:
           event.color && event.color.hex ? event.color.hex : event.color,
@@ -287,8 +283,8 @@ export function ScheduleEventComponent({
 
   return (
     <Popover
-      visible={visible}
-      onVisibleChange={(vis) => !event.vacation && setVisible(vis)}
+      open={visible}
+      onOpenChange={(vis) => !event.vacation && setVisible(vis)}
       trigger="click"
       content={event.block ? blockContent : popoverContent}
       style={{

client/src/components/job-costing-modal/job-costing-modal.container.jsx

@@ -39,7 +39,7 @@ export function JobCostingModalContainer({
 
   return (
     <Modal
-      visible={visible}
+    open={visible}
       title={t("jobs.labels.jobcosting")}
       onOk={() => {
         toggleModalVisible();

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

@@ -76,7 +76,7 @@ export function JobDetailCards({ bodyshop, setPrintCenterContext }) {
 
   return (
     <Drawer
-      visible={!!selected}
+      open={!!selected}
       destroyOnClose
       width={drawerPercentage}
       placement="right"

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

@@ -59,14 +59,18 @@ export default function JobDetailCardsDatesComponent({ loading, data }) {
               <DateTimeFormatter>{data.scheduled_in}</DateTimeFormatter>
             </Timeline.Item>
           ) : null}
-
           {data.actual_in ? (
             <Timeline.Item>
               <label>{t("jobs.fields.actual_in")}: </label>
               <DateTimeFormatter>{data.actual_in}</DateTimeFormatter>
             </Timeline.Item>
           ) : null}
-
+          {data.date_repairstarted ? (
+            <Timeline.Item>
+              <label>{t("jobs.fields.date_repairstarted")}: </label>
+              <DateTimeFormatter>{data.date_repairstarted}</DateTimeFormatter>
+            </Timeline.Item>
+          ) : null}
           {data.scheduled_completion ? (
             <Timeline.Item>
               <label>{t("jobs.fields.scheduled_completion")}: </label>

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

@@ -1,24 +1,16 @@
 import {
   DeleteFilled,
+  EditFilled,
   FilterFilled,
+  HomeOutlined,
+  MinusCircleTwoTone,
+  PlusCircleTwoTone,
   SyncOutlined,
   WarningFilled,
-  EditFilled,
-  PlusCircleTwoTone,
-  MinusCircleTwoTone,
-  HomeOutlined,
 } from "@ant-design/icons";
 import { useMutation } from "@apollo/client";
-import {
-  Button,
-  Dropdown,
-  Input,
-  Menu,
-  PageHeader,
-  Space,
-  Table,
-  Tag,
-} from "antd";
+import { PageHeader } from '@ant-design/pro-layout';
+import { Button, Dropdown, Input, Space, Table, Tag } from "antd";
 import axios from "axios";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
@@ -38,13 +30,13 @@ import JobLinesBillRefernece from "../job-lines-bill-reference/job-lines-bill-re
 // import AllocationsAssignmentContainer from "../allocations-assignment/allocations-assignment.container";
 // import AllocationsBulkAssignmentContainer from "../allocations-bulk-assignment/allocations-bulk-assignment.container";
 // import AllocationsEmployeeLabelContainer from "../allocations-employee-label/allocations-employee-label.container";
-import PartsOrderModalContainer from "../parts-order-modal/parts-order-modal.container";
 import _ from "lodash";
-import JobCreateIOU from "../job-create-iou/job-create-iou.component";
-import JobLinesExpander from "./job-lines-expander.component";
-import { selectBodyshop } from "../../redux/user/user.selectors";
 import moment from "moment";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import JobCreateIOU from "../job-create-iou/job-create-iou.component";
 import JobLineConvertToLabor from "../job-line-convert-to-labor/job-line-convert-to-labor.component";
+import PartsOrderModalContainer from "../parts-order-modal/parts-order-modal.container";
+import JobLinesExpander from "./job-lines-expander.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -103,6 +95,9 @@ export function JobLinesComponent({
       fixed: "left",
       key: "line_desc",
       sorter: (a, b) => alphaSort(a.line_desc, b.line_desc),
+      onCell: (record) => ({
+        className: record.manual_line && "job-line-manual",
+      }),
       sortOrder:
         state.sortedInfo.columnKey === "line_desc" && state.sortedInfo.order,
       ellipsis: true,
@@ -404,16 +399,17 @@ export function JobLinesComponent({
     }
   };
 
-  const markMenu = (
-    <Menu onClick={handleMark}>
-      <Menu.Item key="PAA">{t("joblines.fields.part_types.PAA")}</Menu.Item>
-      <Menu.Item key="PAN">{t("joblines.fields.part_types.PAN")}</Menu.Item>
-      <Menu.Item key="PAL">{t("joblines.fields.part_types.PAL")}</Menu.Item>
-      <Menu.Item key="PAS">{t("joblines.fields.part_types.PAS")}</Menu.Item>
-      <Menu.Divider />
-      <Menu.Item key="clear">{t("general.labels.clear")}</Menu.Item>
-    </Menu>
-  );
+  const markMenu = {
+    onClick: handleMark,
+    items: [
+      { key: "PAA", label: t("joblines.fields.part_types.PAA") },
+      { key: "PAN", label: t("joblines.fields.part_types.PAN") },
+      { key: "PAL", label: t("joblines.fields.part_types.PAL") },
+      { key: "PAS", label: t("joblines.fields.part_types.PAS") },
+      { type: "divider" },
+      { key: "clear", label: t("general.labels.clear") },
+    ],
+  };
 
   return (
     <div>
@@ -543,7 +539,7 @@ export function JobLinesComponent({
             >
               <FilterFilled /> {t("jobs.actions.filterpartsonly")}
             </Button>
-            <Dropdown overlay={markMenu} trigger={["click"]}>
+            <Dropdown menu={markMenu} trigger={["click"]}>
               <Button>{t("jobs.actions.mark")}</Button>
             </Dropdown>
             <Button

client/src/components/job-employee-assignments/job-employee-assignments.component.jsx

@@ -87,7 +87,7 @@ export function JobEmployeeAssignments({
   );
 
   return (
-    <Popover destroyTooltipOnHide content={popContent} visible={visibility}>
+    <Popover destroyTooltipOnHide content={popContent} open={visibility}>
       <Spin spinning={loading}>
         <DataLabel label={t("jobs.fields.employee_body")}>
           {body ? (

client/src/components/job-line-convert-to-labor/job-line-convert-to-labor.component.jsx

@@ -225,7 +225,7 @@ export function JobLineConvertToLabor({
         <Popover
           disabled={jobline.convertedtolbr}
           content={overlay}
-          visible={visibility}
+          open={visibility}
           placement="bottom"
         >
           <Tooltip title={t("joblines.actions.converttolabor")}>

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

@@ -1,5 +1,5 @@
 import { DownOutlined } from "@ant-design/icons";
-import { Dropdown, Menu } from "antd";
+import { Dropdown } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -21,19 +21,17 @@ export function JoblinePresetButton({ bodyshop, form }) {
     form.setFieldsValue(item);
   };
 
-  const menu = (
-    <Menu>
-      {bodyshop.md_jobline_presets.map((i, idx) => (
-        <Menu.Item onClick={() => handleSelect(i)}  key={idx}>
-          {i.label}
-        </Menu.Item>
-      ))}
-    </Menu>
-  );
+  const menu = {
+    items: bodyshop.md_jobline_presets.map((i, idx) => ({
+      onClick: () => handleSelect(i),
+      key: idx,
+      label: i.label,
+    })),
+  };
 
   return (
     <div>
-      <Dropdown trigger={["click"]} overlay={menu}>
+      <Dropdown trigger={["click"]} menu={menu}>
         <a
           className="ant-dropdown-link"
           href="# "

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

@@ -49,7 +49,7 @@ export function JobLinesUpsertModalComponent({
           : t("joblines.labels.new")
       }
       forceRender
-      visible={visible}
+      open={visible}
       width="60%"
       okText={t("general.actions.save")}
       onOk={() => form.submit()}

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

@@ -25,8 +25,6 @@ const mapDispatchToProps = (dispatch) => ({
     dispatch(setModalContext({ context: context, modal: "payment" })),
 });
 
-const stripeTestEnv = process.env.REACT_APP_STRIPE_PUBLIC_KEY; //.includes("test");
-
 export function JobPayments({
   job,
   jobRO,
@@ -94,23 +92,6 @@ export function JobPayments({
         state.sortedInfo.columnKey === "transactionid" &&
         state.sortedInfo.order,
     },
-    {
-      title: t("payments.fields.stripeid"),
-      dataIndex: "stripeid",
-      key: "stripeid",
-      render: (text, record) =>
-        record.stripeid ? (
-          <a
-            href={
-              stripeTestEnv
-                ? `https://dashboard.stripe.com/${bodyshop.stripe_acct_id}/test/payments/${record.stripeid}`
-                : `https://dashboard.stripe.com/${bodyshop.stripe_acct_id}/payments/${record.stripeid}`
-            }
-          >
-            {record.stripeid}
-          </a>
-        ) : null,
-    },
     {
       title: t("general.labels.actions"),
       dataIndex: "actions",

client/src/components/job-reconciliation-modal/job-reconciliation.modal.container.jsx

@@ -42,7 +42,7 @@ function JobReconciliationModalContainer({
     <Modal
       title={t("jobs.labels.reconciliationheader")}
       width={"95%"}
-      visible={visible}
+      open={visible}
       okText={t("general.actions.close")}
       onOk={handleCancel}
       onCancel={handleCancel}

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

@@ -166,6 +166,16 @@ export default function ScoreboardAddButton({
         painthrs: 0,
       }
     );
+
+    //Add Labor Adjustments
+    v.painthrs = v.painthrs + (job.lbr_adjustments.LAR || 0);
+    v.bodyhrs =
+      v.bodyhrs +
+      Object.keys(job.lbr_adjustments)
+        .filter((key) => key !== "LAR")
+        .reduce((acc, val) => {
+          return acc + job.lbr_adjustments[val];
+        }, 0);
     form.setFieldsValue({
       date: new moment(),
       bodyhrs: Math.round(v.bodyhrs * 10) / 10,
@@ -176,7 +186,7 @@ export default function ScoreboardAddButton({
   };
 
   return (
-    <Popover content={overlay} visible={visibility} placement="bottom">
+    <Popover content={overlay} open={visibility} placement="bottom">
       <Button
         loading={loading}
         disabled={disabled}

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

@@ -43,11 +43,9 @@ const JobSearchSelect = (
         search: value,
         ...(convertedOnly || notExported
           ? {
-              variables: {
-                ...(convertedOnly ? { isConverted: true } : {}),
-                ...(notExported ? { notExported: true } : {}),
-                ...(notInvoiced ? { notInvoiced: true } : {}),
-              },
+              ...(convertedOnly ? { isConverted: true } : {}),
+              ...(notExported ? { notExported: true } : {}),
+              ...(notInvoiced ? { notInvoiced: true } : {}),
             }
           : {}),
       },
@@ -79,6 +77,7 @@ const JobSearchSelect = (
         disabled={disabled}
         showSearch
         autoFocus
+        allowClear
         style={{
           width: "100%",
         }}

client/src/components/jobs-admin-change-status/jobs-admin-change.status.component.jsx

@@ -1,6 +1,6 @@
 import { DownCircleFilled } from "@ant-design/icons";
 import { useMutation } from "@apollo/client";
-import { Button, Dropdown, Menu, notification } from "antd";
+import { Button, Dropdown, notification } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -40,20 +40,18 @@ export function JobsAdminStatus({ insertAuditTrail, bodyshop, job }) {
       });
   };
 
-  const statusmenu = (
-    <Menu
-      onClick={(e) => {
-        updateJobStatus(e.key);
-      }}
-    >
-      {bodyshop.md_ro_statuses.statuses.map((item) => (
-        <Menu.Item key={item}>{item}</Menu.Item>
-      ))}
-    </Menu>
-  );
+  const statusmenu = {
+    onClick: (e) => {
+      updateJobStatus(e.key);
+    },
+    items: bodyshop.md_ro_statuses.statuses.map((item) => ({
+      key: item,
+      label: item,
+    })),
+  };
 
   return (
-    <Dropdown overlay={statusmenu} trigger={["click"]} key="changestatus">
+    <Dropdown menu={statusmenu} trigger={["click"]} key="changestatus">
       <Button shape="round">
         <span>{job.status}</span>
 

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

@@ -126,6 +126,9 @@ export function JobsAdminDatesChange({ insertAuditTrail, job }) {
           <Form.Item label={t("jobs.fields.actual_in")} name="actual_in">
             <DateTimePicker />
           </Form.Item>
+          <Form.Item label={t("jobs.fields.date_repairstarted")} name="date_repairstarted">
+            <DateTimePicker />
+          </Form.Item>
           <Form.Item
             label={t("jobs.fields.date_last_contacted")}
             name="date_last_contacted"

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

@@ -112,12 +112,12 @@ export function JobsAvailableContainer({
     ).data;
 
     let existingVehicles;
-    if (estData.est_data.vehicle && estData.est_data.vin) {
+    if (estData.est_data.v_vin) {
       //There's vehicle data, need to double check the VIN.
       existingVehicles = await client.query({
         query: SEARCH_VEHICLE_BY_VIN,
         variables: {
-          vin: estData.est_data.vehicle.data.v_vin,
+          vin: estData.est_data.v_vin || estData.est_data.vehicle.data.v_vin,
         },
       });
     }

client/src/components/jobs-change-status/jobs-change-status.component.jsx

@@ -1,6 +1,6 @@
 import { DownCircleFilled } from "@ant-design/icons";
 import { useMutation } from "@apollo/client";
-import { Button, Dropdown, Menu, notification } from "antd";
+import { Button, Dropdown, notification } from "antd";
 import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -81,29 +81,32 @@ export function JobsChangeStatus({ job, bodyshop, jobRO, insertAuditTrail }) {
     }
   }, [job, setAvailableStatuses, bodyshop]);
 
-  const statusmenu = (
-    <Menu
-      onClick={(e) => {
-        updateJobStatus(e.key);
-      }}
-    >
-      {availableStatuses.map((item) => (
-        <Menu.Item key={item}>{item}</Menu.Item>
-      ))}
-      {job.converted && (
-        <>
-          <Menu.Divider />
-          {otherStages.map((item, idx) => (
-            <Menu.Item key={item}>{item}</Menu.Item>
-          ))}
-        </>
-      )}
-    </Menu>
-  );
+  const statusmenu = {
+    onClick: (e) => {
+      updateJobStatus(e.key);
+    },
+    items: [
+      ...availableStatuses.map((item) => ({
+        key: item,
+        label: item,
+      })),
+      ...(job.converted
+        ? [
+            {
+              type: "divider",
+            },
+            ...otherStages.map((item, idx) => ({
+              key: item,
+              label: item,
+            })),
+          ]
+        : []),
+    ],
+  };
 
   return (
     <Dropdown
-      overlay={statusmenu}
+      menu={statusmenu}
       trigger={["click"]}
       key="changestatus"
       disabled={jobRO || !job.converted}

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

@@ -1,4 +1,4 @@
-import { Button, Dropdown, Menu } from "antd";
+import { Button, Dropdown } from "antd";
 import _ from "lodash";
 import React from "react";
 import { useTranslation } from "react-i18next";
@@ -62,18 +62,17 @@ export function JobsCloseAutoAllocate({ bodyshop, joblines, form, disabled }) {
     );
   };
 
-  const overlay = (bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber) && (
-    <Menu onClick={handleMenuClick}>
-      {bodyshop.md_responsibility_centers.dms_defaults.map((mapping) => (
-        <Menu.Item disabled={disabled} key={mapping.name}>
-          {mapping.name}
-        </Menu.Item>
-      ))}
-    </Menu>
-  );
+  const overlay = {
+    onClick: handleMenuClick,
+    items: bodyshop.md_responsibility_centers.dms_defaults.map((mapping) => ({
+      label: mapping.name,
+      key: mapping.name,
+      disabled: disabled,
+    })),
+  };
 
   return bodyshop.cdk_dealerid || bodyshop.pbs_serialnumber ? (
-    <Dropdown overlay={overlay}>
+    <Dropdown menu={overlay}>
       <Button disabled={disabled}>{t("jobs.actions.dmsautoallocate")}</Button>
     </Dropdown>
   ) : (

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

@@ -9,6 +9,7 @@ import {
   Space,
   Switch,
 } from "antd";
+import axios from "axios";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -18,7 +19,6 @@ import { insertAuditTrail } from "../../redux/application/application.actions";
 import { selectJobReadOnly } from "../../redux/application/application.selectors";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import AuditTrailMapping from "../../utils/AuditTrailMappings";
-import axios from "axios";
 const mapStateToProps = createStructuredSelector({
   //currentUser: selectCurrentUser
   bodyshop: selectBodyshop,
@@ -83,7 +83,11 @@ export function JobsConvertButton({
         layout="vertical"
         form={form}
         onFinish={handleConvert}
-        initialValues={{ driveable: true, towin: false }}
+        initialValues={{
+          driveable: true,
+          towin: false,
+          employee_csr: job.employee_csr,
+        }}
       >
         <Form.Item
           name={["ins_co_nm"]}
@@ -151,6 +155,41 @@ export function JobsConvertButton({
             </Form.Item>
           </>
         )}
+        {bodyshop.enforce_conversion_csr && (
+          <Form.Item
+            name={"employee_csr"}
+            label={t("jobs.fields.employee_csr")}
+            rules={[
+              {
+                required: bodyshop.enforce_conversion_csr,
+                //message: t("general.validation.required"),
+              },
+            ]}
+          >
+            <Select
+              showSearch
+              style={{ width: 200 }}
+              optionFilterProp="children"
+              filterOption={(input, option) =>
+                option.props.children
+                  .toLowerCase()
+                  .indexOf(input.toLowerCase()) >= 0
+              }
+            >
+              {bodyshop.employees
+                .filter((emp) => emp.active)
+                .map((emp) => (
+                  <Select.Option
+                    value={emp.id}
+                    key={emp.id}
+                    name={`${emp.first_name} ${emp.last_name}`}
+                  >
+                    {`${emp.first_name} ${emp.last_name}`}
+                  </Select.Option>
+                ))}
+            </Select>
+          </Form.Item>
+        )}
         <Form.Item
           label={t("jobs.fields.ca_gst_registrant")}
           name="ca_gst_registrant"
@@ -187,14 +226,21 @@ export function JobsConvertButton({
   if (job.converted) return <></>;
 
   return (
-    <Popover visible={visible} content={popMenu}>
+    <Popover open={visible} content={popMenu}>
       <Button
         key="convert"
         type="danger"
         // style={{ display: job.converted ? "none" : "" }}
         disabled={job.converted || jobRO}
         loading={loading}
-        onClick={() => setVisible(true)}
+        onClick={() => {
+          setVisible(true);
+          form.setFieldsValue({
+            driveable: true,
+            towin: false,
+            employee_csr: job.employee_csr,
+          });
+        }}
       >
         {t("jobs.actions.convert")}
       </Button>

client/src/components/jobs-detail-change-estimator/jobs-detail-change-estimator.component.jsx

@@ -1,5 +1,5 @@
 import { DownOutlined } from "@ant-design/icons";
-import { Dropdown, Menu } from "antd";
+import { Dropdown } from "antd";
 import React from "react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -15,20 +15,17 @@ export function JobsDetailChangeEstimator({ disabled, form, bodyshop }) {
     form.setFieldsValue(est);
   };
 
-  const menu = (
-    <div>
-      <Menu onClick={handleClick}>
-        {bodyshop.md_estimators.map((est, idx) => (
-          <Menu.Item value={est} key={idx}>
-            {`${est.est_ct_fn} ${est.est_ct_ln}`}
-          </Menu.Item>
-        ))}
-      </Menu>
-    </div>
-  );
+  const menu = {
+    onClick: handleClick,
+    items: bodyshop.md_estimators.map((est, idx) => ({
+      value: est,
+      key: idx,
+      label: `${est.est_ct_fn || ""} ${est.est_ct_ln || ""}`.trim(),
+    })),
+  };
 
   return (
-    <Dropdown overlay={menu} disabled={disabled}>
+    <Dropdown menu={menu} disabled={disabled}>
       <a
         className="ant-dropdown-link"
         href=" #"

client/src/components/jobs-detail-change-filehandler/jobs-detail-change-filehandler.component.jsx

@@ -1,5 +1,5 @@
 import { DownOutlined } from "@ant-design/icons";
-import { Dropdown, Menu } from "antd";
+import { Dropdown } from "antd";
 import React from "react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -15,23 +15,21 @@ export function JobsDetailChangeFilehandler({ disabled, form, bodyshop }) {
     form.setFieldsValue(est);
   };
 
-  const menu = (
-    <Menu
-      onClick={handleClick}
-      style={{
-        columnCount: Math.floor(bodyshop.md_filehandlers.length / 10) + 1,
-      }}
-    >
-      {bodyshop.md_filehandlers.map((est, idx) => (
-        <Menu.Item value={est} key={idx} style={{ breakInside: "avoid" }}>
-          {`${est.ins_ct_fn} ${est.ins_ct_ln}`}
-        </Menu.Item>
-      ))}
-    </Menu>
-  );
+  const menu = {
+    onClick: handleClick,
+    style: {
+      columnCount: Math.floor(bodyshop.md_filehandlers.length / 10) + 1,
+    },
+    items: bodyshop.md_filehandlers.map((est, idx) => ({
+      value: est,
+      key: idx,
+      style: { breakInside: "avoid" },
+      label: `${est.ins_ct_fn || ""} ${est.ins_ct_ln || ""}`.trim(),
+    })),
+  };
 
   return (
-    <Dropdown overlay={menu} disabled={disabled}>
+    <Dropdown menu={menu} disabled={disabled}>
       <a
         className="ant-dropdown-link"
         href=" #"

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

@@ -42,7 +42,10 @@ export function JobsDetailDatesComponent({ jobRO, job, bodyshop }) {
         <Form.Item label={t("jobs.fields.date_towin")} name="date_towin">
           <DateTimePicker disabled={jobRO} />
         </Form.Item>
-        <Form.Item label={t("jobs.fields.date_rentalresp")} name="date_rentalresp">
+        <Form.Item
+          label={t("jobs.fields.date_rentalresp")}
+          name="date_rentalresp"
+        >
           <DateTimePicker disabled={jobRO} />
         </Form.Item>
       </FormRow>
@@ -73,6 +76,12 @@ export function JobsDetailDatesComponent({ jobRO, job, bodyshop }) {
             title={t("jobs.labels.calc_repair_days")}
           />
         </Tooltip>
+        <Form.Item
+          label={t("jobs.fields.date_repairstarted")}
+          name="date_repairstarted"
+        >
+          <DateTimePicker disabled={jobRO} />
+        </Form.Item>
       </FormRow>
       <FormRow header={t("jobs.forms.repairdates")}>
         <Form.Item

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

@@ -4,7 +4,6 @@ import {
   Card,
   Form,
   Input,
-  Menu,
   notification,
   Popover,
   Select,
@@ -13,25 +12,11 @@ import {
 import moment from "moment";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
-import { connect } from "react-redux";
-import { createStructuredSelector } from "reselect";
 import { logImEXEvent } from "../../firebase/firebase.utils";
 import { INSERT_MANUAL_APPT } from "../../graphql/appointments.queries";
-import { selectBodyshop } from "../../redux/user/user.selectors";
 import FormDateTimePickerComponent from "../form-date-time-picker/form-date-time-picker.component";
 
-const mapStateToProps = createStructuredSelector({
-  bodyshop: selectBodyshop,
-});
-const mapDispatchToProps = (dispatch) => ({
-  //setUserLanguage: language => dispatch(setUserLanguage(language))
-});
-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(JobsDetailHeaderAddEvent);
-
-export function JobsDetailHeaderAddEvent({ bodyshop, jobid, ...props }) {
+export default function JobsDetailHeaderAddEvent({ bodyshop, jobid }) {
   const { t } = useTranslation();
   const [insertAppointment] = useMutation(INSERT_MANUAL_APPT);
 
@@ -153,11 +138,12 @@ export function JobsDetailHeaderAddEvent({ bodyshop, jobid, ...props }) {
     setVisibility(true);
   };
 
-  return (
-    <Popover content={overlay} visible={visibility}>
-      <Menu.Item {...props} onClick={handleClick}>
+  return {
+    key: "addmanualevent",
+    label: (
+      <Popover content={overlay} open={visibility} onClick={handleClick}>
         {t("appointments.labels.manualevent")}
-      </Menu.Item>
-    </Popover>
-  );
+      </Popover>
+    ),
+  };
 }

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

@@ -1,6 +1,6 @@
 import { DownCircleFilled } from "@ant-design/icons";
 import { useApolloClient, useMutation } from "@apollo/client";
-import { Button, Dropdown, Menu, notification, Popconfirm } from "antd";
+import { Button, Dropdown, notification, Popconfirm } from "antd";
 import React, { useMemo } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -13,7 +13,7 @@ import { selectJobReadOnly } from "../../redux/application/application.selectors
 import { setModalContext } from "../../redux/modals/modals.actions";
 import {
   selectBodyshop,
-  selectCurrentUser,
+  selectCurrentUser
 } from "../../redux/user/user.selectors";
 import JobsDetailHeaderActionsAddevent from "./jobs-detail-header-actions.addevent";
 import AddToProduction from "./jobs-detail-header-actions.addtoproduction.util";
@@ -105,13 +105,14 @@ export function JobsDetailHeaderActions({
     });
   };
 
-  const statusmenu = (
-    <Menu key="popovermenu">
-      <Menu.Item
-        disabled={!jobInPreProduction || !job.converted || jobRO}
-        onClick={() => {
+  const statusmenu = {
+    items: [
+      {
+        key: "schedule",
+        disabled: !jobInPreProduction || !job.converted || jobRO,
+        label: t("jobs.actions.schedule"),
+        onClick: () => {
           logImEXEvent("job_header_schedule");
-
           setScheduleContext({
             actions: { refetch: refetch },
             context: {
@@ -120,200 +121,228 @@ export function JobsDetailHeaderActions({
               alt_transport: job.alt_transport,
             },
           });
-        }}
-      >
-        {t("jobs.actions.schedule")}
-      </Menu.Item>
-      <Menu.Item
-        disabled={job.status !== bodyshop.md_ro_statuses.default_scheduled}
-      >
-        <Popconfirm
-          title={t("general.labels.areyousure")}
-          okText="Yes"
-          cancelText="No"
-          onClick={(e) => e.stopPropagation()}
-          disabled={job.status !== bodyshop.md_ro_statuses.default_scheduled}
-          onConfirm={async () => {
-            const jobUpdate = await cancelAllAppointments({
-              variables: {
-                jobid: job.id,
-                job: {
-                  date_scheduled: null,
-                  scheduled_in: null,
-                  scheduled_completion: null,
-                  status: bodyshop.md_ro_statuses.default_imported,
+        },
+      },
+      {
+        key: "cancelappts",
+        disabled: job.status !== bodyshop.md_ro_statuses.default_scheduled,
+        label: (
+          <Popconfirm
+            title={t("general.labels.areyousure")}
+            okText="Yes"
+            cancelText="No"
+            onClick={(e) => e.stopPropagation()}
+            disabled={job.status !== bodyshop.md_ro_statuses.default_scheduled}
+            onConfirm={async () => {
+              const jobUpdate = await cancelAllAppointments({
+                variables: {
+                  jobid: job.id,
+                  job: {
+                    date_scheduled: null,
+                    scheduled_in: null,
+                    scheduled_completion: null,
+                    status: bodyshop.md_ro_statuses.default_imported,
+                  },
                 },
-              },
-            });
-            if (!jobUpdate.errors) {
-              notification["success"]({
-                message: t("appointments.successes.canceled"),
               });
-              return;
-            }
-          }}
-          getPopupContainer={(trigger) => trigger.parentNode}
-        >
-          {t("menus.jobsactions.cancelallappointments")}
-        </Popconfirm>
-      </Menu.Item>
-      <Menu.Item
-        disabled={
+              if (!jobUpdate.errors) {
+                notification["success"]({
+                  message: t("appointments.successes.canceled"),
+                });
+                return;
+              }
+            }}
+            getPopupContainer={(trigger) => trigger.parentNode}
+          >
+            {t("menus.jobsactions.cancelallappointments")}
+          </Popconfirm>
+        ),
+      },
+      {
+        key: "intake",
+        disabled:
           !!job.intakechecklist ||
           !jobInPreProduction ||
           !job.converted ||
-          jobRO
-        }
-      >
-        {!!job.intakechecklist ||
-        !jobInPreProduction ||
-        !job.converted ||
-        jobRO ? (
-          t("jobs.actions.intake")
-        ) : (
-          <Link to={`/manage/jobs/${job.id}/intake`}>
-            {t("jobs.actions.intake")}
-          </Link>
-        )}
-      </Menu.Item>
-      <Menu.Item disabled={!jobInProduction || jobRO}>
-        {!jobInProduction ? (
+          jobRO,
+        label:
+          !!job.intakechecklist ||
+          !jobInPreProduction ||
+          !job.converted ||
+          jobRO ? (
+            t("jobs.actions.intake")
+          ) : (
+            <Link to={`/manage/jobs/${job.id}/intake`}>
+              {t("jobs.actions.intake")}
+            </Link>
+          ),
+      },
+      {
+        disabled: !jobInProduction || jobRO,
+        key: "deliver",
+        label: !jobInProduction ? (
           t("jobs.actions.deliver")
         ) : (
           <Link to={`/manage/jobs/${job.id}/deliver`}>
             {t("jobs.actions.deliver")}
           </Link>
-        )}
-      </Menu.Item>
-      <Menu.Item disabled={!job.converted}>
-        <Link to={`/manage/jobs/${job.id}/checklist`}>
-          {t("jobs.actions.viewchecklist")}
-        </Link>
-      </Menu.Item>
-      <Menu.Item
-        key="entertimetickets"
-        disabled={
+        ),
+      },
+      {
+        key: "viewchecklist",
+        disabled: !job.converted,
+        label: (
+          <Link to={`/manage/jobs/${job.id}/checklist`}>
+            {t("jobs.actions.viewchecklist")}
+          </Link>
+        ),
+      },
+      {
+        key: "entertimetickets",
+        disabled:
           !job.converted ||
-          (!bodyshop.tt_allow_post_to_invoiced && job.date_invoiced)
-        }
-        onClick={() => {
+          (!bodyshop.tt_allow_post_to_invoiced && job.date_invoiced),
+        onClick: () => {
           logImEXEvent("job_header_enter_time_ticekts");
 
           setTimeTicketContext({
             actions: {},
             context: { jobId: job.id },
           });
-        }}
-      >
-        {t("timetickets.actions.enter")}
-      </Menu.Item>
-      <Menu.Item
-        key="enterpayments"
-        disabled={!job.converted}
-        onClick={() => {
+        },
+        label: t("timetickets.actions.enter"),
+      },
+      {
+        key: "enterpayments",
+        disabled: !job.converted,
+        label: t("menus.header.enterpayment"),
+        onClick: () => {
           logImEXEvent("job_header_enter_payment");
 
           setPaymentContext({
             actions: {},
             context: { jobid: job.id },
           });
-        }}
-      >
-        {t("menus.header.enterpayment")}
-      </Menu.Item>
-      <Menu.Item key="cccontract" disabled={jobRO || !job.converted}>
-        <Link
-          to={{
-            pathname: "/manage/courtesycars/contracts/new",
-            state: { jobId: job.id },
-          }}
-        >
-          {t("menus.jobsactions.newcccontract")}
-        </Link>
-      </Menu.Item>
-      {job.inproduction ? (
-        <Menu.Item
-          key="addtoproduction"
-          disabled={!job.converted}
-          onClick={() => AddToProduction(client, job.id, refetch, true)}
-        >
-          {t("jobs.actions.removefromproduction")}
-        </Menu.Item>
-      ) : (
-        <Menu.Item
-          key="addtoproduction"
-          disabled={!job.converted}
-          onClick={() => AddToProduction(client, job.id, refetch)}
-        >
-          {t("jobs.actions.addtoproduction")}
-        </Menu.Item>
-      )}
-      <Menu.Item key="togglesuspend" onClick={handleSuspend}>
-        {job.suspended
+        },
+      },
+      {
+        key: "cccontract",
+        disabled: jobRO || !job.converted,
+        label: (
+          <Link
+            to={{
+              pathname: "/manage/courtesycars/contracts/new",
+              state: { jobId: job.id },
+            }}
+          >
+            {t("menus.jobsactions.newcccontract")}
+          </Link>
+        ),
+      },
+      ...(job.inproduction
+        ? [
+            {
+              key: "removetoproduction",
+              disabled: !job.converted,
+              onClick: () => AddToProduction(client, job.id, refetch, true),
+              label: t("jobs.actions.removefromproduction"),
+            },
+          ]
+        : [
+            {
+              key: "addtoproduction",
+              disabled: !job.converted,
+              onClick: () => AddToProduction(client, job.id, refetch),
+              label: t("jobs.actions.addtoproduction"),
+            },
+          ]),
+      {
+        key: "togglesuspend",
+        onClick: handleSuspend,
+        label: job.suspended
           ? t("production.actions.unsuspend")
-          : t("production.actions.suspend")}
-      </Menu.Item>
-      <Menu.Item key="toggleAlert" onClick={handleAlertToggle}>
-        {job.production_vars && job.production_vars.alert
-          ? t("production.labels.alertoff")
-          : t("production.labels.alerton")}
-      </Menu.Item>
-      <Menu.SubMenu key="dupe" title={t("menus.jobsactions.duplicate")}>
-        <Menu.Item>
-          <Popconfirm
-            title={t("jobs.labels.duplicateconfirm")}
-            okText="Yes"
-            cancelText="No"
-            onClick={(e) => e.stopPropagation()}
-            onConfirm={() =>
-              DuplicateJob(
-                client,
-                job.id,
-                { defaultOpenStatus: bodyshop.md_ro_statuses.default_imported },
-                (newJobId) => {
-                  history.push(`/manage/jobs/${newJobId}`);
-                  notification["success"]({
-                    message: t("jobs.successes.duplicated"),
-                  });
-                },
-                true
-              )
-            }
-            getPopupContainer={(trigger) => trigger.parentNode}
-          >
-            {t("menus.jobsactions.duplicate")}
-          </Popconfirm>
-        </Menu.Item>
-        <Menu.Item>
-          <Popconfirm
-            title={t("jobs.labels.duplicateconfirm")}
-            okText="Yes"
-            cancelText="No"
-            onClick={(e) => e.stopPropagation()}
-            onConfirm={() =>
-              DuplicateJob(
-                client,
-                job.id,
-                { defaultOpenStatus: bodyshop.md_ro_statuses.default_imported },
-                (newJobId) => {
-                  history.push(`/manage/jobs/${newJobId}`);
-                  notification["success"]({
-                    message: t("jobs.successes.duplicated"),
-                  });
+          : t("production.actions.suspend"),
+      },
+      {
+        key: "toggleAlert",
+        onClick: handleAlertToggle,
+        label:
+          job.production_vars && job.production_vars.alert
+            ? t("production.labels.alertoff")
+            : t("production.labels.alerton"),
+      },
+      {
+        key: "dupe",
+        label: t("menus.jobsactions.duplicate"),
+        children: [
+          {
+            key: "dupewithlines",
+            label: (
+              <Popconfirm
+                title={t("jobs.labels.duplicateconfirm")}
+                okText="Yes"
+                cancelText="No"
+                onClick={(e) => e.stopPropagation()}
+                onConfirm={() =>
+                  DuplicateJob(
+                    client,
+                    job.id,
+                    {
+                      defaultOpenStatus:
+                        bodyshop.md_ro_statuses.default_imported,
+                    },
+                    (newJobId) => {
+                      history.push(`/manage/jobs/${newJobId}`);
+                      notification["success"]({
+                        message: t("jobs.successes.duplicated"),
+                      });
+                    },
+                    true
+                  )
                 }
-              )
-            }
-            getPopupContainer={(trigger) => trigger.parentNode}
-          >
-            {t("menus.jobsactions.duplicatenolines")}
-          </Popconfirm>
-        </Menu.Item>
-      </Menu.SubMenu>
-
-      <Menu.Item
-        key="postbills"
-        disabled={!job.converted}
-        onClick={() => {
+                getPopupContainer={(trigger) => trigger.parentNode}
+              >
+                {t("menus.jobsactions.duplicate")}
+              </Popconfirm>
+            ),
+          },
+          {
+            key: "dupewithoutlines",
+            label: (
+              <Popconfirm
+                title={t("jobs.labels.duplicateconfirm")}
+                okText="Yes"
+                cancelText="No"
+                onClick={(e) => e.stopPropagation()}
+                onConfirm={() =>
+                  DuplicateJob(
+                    client,
+                    job.id,
+                    {
+                      defaultOpenStatus:
+                        bodyshop.md_ro_statuses.default_imported,
+                    },
+                    (newJobId) => {
+                      history.push(`/manage/jobs/${newJobId}`);
+                      notification["success"]({
+                        message: t("jobs.successes.duplicated"),
+                      });
+                    }
+                  )
+                }
+                getPopupContainer={(trigger) => trigger.parentNode}
+              >
+                {t("menus.jobsactions.duplicatenolines")}
+              </Popconfirm>
+            ),
+          },
+        ],
+      },
+      {
+        key: "postbills",
+        disabled: !job.converted,
+        label: t("jobs.actions.postbills"),
+        onClick: () => {
           logImEXEvent("job_header_enter_bills");
 
           setBillEnterContext({
@@ -322,14 +351,13 @@ export function JobsDetailHeaderActions({
               job: job,
             },
           });
-        }}
-      >
-        {t("jobs.actions.postbills")}
-      </Menu.Item>
-      <Menu.Item
-        key="addtopartsqueue"
-        disabled={!job.converted || !jobInProduction || jobRO}
-        onClick={async () => {
+        },
+      },
+      {
+        key: "addtopartsqueue",
+        disabled: !job.converted || !jobInProduction || jobRO,
+        label: t("jobs.actions.addtopartsqueue"),
+        onClick: async () => {
           const result = await updateJob({
             variables: {
               jobId: job.id,
@@ -348,12 +376,12 @@ export function JobsDetailHeaderActions({
               }),
             });
           }
-        }}
-      >
-        {t("jobs.actions.addtopartsqueue")}
-      </Menu.Item>
-      <Menu.Item disabled={!jobInPostProduction} key="closejob">
-        {!jobInPostProduction ? (
+        },
+      },
+      {
+        disabled: !jobInPostProduction,
+        key: "closejob",
+        label: !jobInPostProduction ? (
           t("menus.jobsactions.closejob")
         ) : (
           <Link
@@ -363,23 +391,27 @@ export function JobsDetailHeaderActions({
           >
             {t("menus.jobsactions.closejob")}
           </Link>
-        )}
-      </Menu.Item>
-      <Menu.Item key="admin">
-        <Link
-          to={{
-            pathname: `/manage/jobs/${job.id}/admin`,
-          }}
-        >
-          {t("menus.jobsactions.admin")}
-        </Link>
-      </Menu.Item>
-      <JobsDetailHeaderActionsExportcustdataComponent job={job} />
-      <JobsDetaiLheaderCsi job={job} />
-      <Menu.Item
-        key="jobcosting"
-        disabled={!job.converted}
-        onClick={() => {
+        ),
+      },
+      {
+        key: "admin",
+        label: (
+          <Link
+            to={{
+              pathname: `/manage/jobs/${job.id}/admin`,
+            }}
+          >
+            {t("menus.jobsactions.admin")}
+          </Link>
+        ),
+      },
+      JobsDetailHeaderActionsExportcustdataComponent({ bodyshop, job }),
+      JobsDetaiLheaderCsi({ job, bodyshop }),
+      {
+        key: "jobcosting",
+        label: t("jobs.labels.jobcosting"),
+        disabled: !job.converted,
+        onClick: () => {
           logImEXEvent("job_header_job_costing");
           setJobCostingContext({
             actions: { refetch: refetch },
@@ -387,96 +419,108 @@ export function JobsDetailHeaderActions({
               jobId: job.id,
             },
           });
-        }}
-      >
-        {t("jobs.labels.jobcosting")}
-      </Menu.Item>
-      {job && !job.converted && (
-        <Menu.Item>
-          <Popconfirm
-            title={t("jobs.labels.deleteconfirm")}
-            okText={t("general.labels.yes")}
-            cancelText={t("general.labels.no")}
-            onClick={(e) => e.stopPropagation()}
-            onConfirm={async () => {
-              //delete the job.
-              const result = await deleteJob({ variables: { id: job.id } });
+        },
+      },
+      ...(job && !job.converted
+        ? [
+            {
+              key: "deletejob",
+              label: (
+                <Popconfirm
+                  title={t("jobs.labels.deleteconfirm")}
+                  okText={t("general.labels.yes")}
+                  cancelText={t("general.labels.no")}
+                  onClick={(e) => e.stopPropagation()}
+                  onConfirm={async () => {
+                    //delete the job.
+                    const result = await deleteJob({
+                      variables: { id: job.id },
+                    });
 
-              if (!!!result.errors) {
-                notification["success"]({
-                  message: t("jobs.successes.delete"),
-                });
-                //go back to jobs list.
-                history.push(`/manage/`);
-              } else {
-                notification["error"]({
-                  message: t("jobs.errors.deleted", {
-                    error: JSON.stringify(result.errors),
-                  }),
-                });
-              }
-            }}
-            getPopupContainer={(trigger) => trigger.parentNode}
-          >
-            {t("menus.jobsactions.deletejob")}
-          </Popconfirm>
-        </Menu.Item>
-      )}
-      <JobsDetailHeaderActionsAddevent jobid={job.id} />
-      {!jobRO && job.converted && (
-        <Menu.Item>
-          <Popconfirm
-            title={t("jobs.labels.voidjob")}
-            okText="Yes"
-            cancelText="No"
-            onClick={(e) => e.stopPropagation()}
-            onConfirm={async () => {
-              //delete the job.
-              const result = await voidJob({
-                variables: {
-                  jobId: job.id,
-                  job: {
-                    status: bodyshop.md_ro_statuses.default_void,
-                    voided: true,
-                    scheduled_in: null,
-                    scheduled_completion: null,
-                    inproduction: false,
-                  },
-                  note: [
-                    {
-                      jobid: job.id,
-                      created_by: currentUser.email,
-                      audit: true,
-                      text: t("jobs.labels.voidnote"),
-                    },
-                  ],
-                },
-              });
+                    if (!!!result.errors) {
+                      notification["success"]({
+                        message: t("jobs.successes.delete"),
+                      });
+                      //go back to jobs list.
+                      history.push(`/manage/`);
+                    } else {
+                      notification["error"]({
+                        message: t("jobs.errors.deleted", {
+                          error: JSON.stringify(result.errors),
+                        }),
+                      });
+                    }
+                  }}
+                  getPopupContainer={(trigger) => trigger.parentNode}
+                >
+                  {t("menus.jobsactions.deletejob")}
+                </Popconfirm>
+              ),
+            },
+          ]
+        : []),
+      ///////HEADER ADD EVENT ITEM
+      JobsDetailHeaderActionsAddevent({ jobid: job.id, bodyshop }),
+      ...(!jobRO && job.converted
+        ? [
+            {
+              key: "voidjob",
+              label: (
+                <Popconfirm
+                  title={t("jobs.labels.voidjob")}
+                  okText="Yes"
+                  cancelText="No"
+                  onClick={(e) => e.stopPropagation()}
+                  onConfirm={async () => {
+                    //delete the job.
+                    const result = await voidJob({
+                      variables: {
+                        jobId: job.id,
+                        job: {
+                          status: bodyshop.md_ro_statuses.default_void,
+                          voided: true,
+                          scheduled_in: null,
+                          scheduled_completion: null,
+                          inproduction: false,
+                        },
+                        note: [
+                          {
+                            jobid: job.id,
+                            created_by: currentUser.email,
+                            audit: true,
+                            text: t("jobs.labels.voidnote"),
+                          },
+                        ],
+                      },
+                    });
+
+                    if (!!!result.errors) {
+                      notification["success"]({
+                        message: t("jobs.successes.voided"),
+                      });
+                      //go back to jobs list.
+                      history.push(`/manage/`);
+                    } else {
+                      notification["error"]({
+                        message: t("jobs.errors.voiding", {
+                          error: JSON.stringify(result.errors),
+                        }),
+                      });
+                    }
+                  }}
+                  getPopupContainer={(trigger) => trigger.parentNode}
+                >
+                  {t("menus.jobsactions.void")}
+                </Popconfirm>
+              ),
+            },
+          ]
+        : []),
+    ],
+  };
 
-              if (!!!result.errors) {
-                notification["success"]({
-                  message: t("jobs.successes.voided"),
-                });
-                //go back to jobs list.
-                history.push(`/manage/`);
-              } else {
-                notification["error"]({
-                  message: t("jobs.errors.voiding", {
-                    error: JSON.stringify(result.errors),
-                  }),
-                });
-              }
-            }}
-            getPopupContainer={(trigger) => trigger.parentNode}
-          >
-            {t("menus.jobsactions.void")}
-          </Popconfirm>
-        </Menu.Item>
-      )}
-    </Menu>
-  );
   return (
-    <Dropdown overlay={statusmenu} trigger={["click"]} key="changestatus">
+    <Dropdown menu={statusmenu} trigger={["click"]} key="changestatus">
       <Button>
         <span>{t("general.labels.actions")}</span>
 

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

@@ -1,11 +1,8 @@
 import { useApolloClient, useMutation } from "@apollo/client";
-import { Menu, notification } from "antd";
+import { notification } from "antd";
 import parsePhoneNumber from "libphonenumber-js";
 import React from "react";
-import { useTranslation } from "react-i18next";
-import { connect } from "react-redux";
 import { Link } from "react-router-dom";
-import { createStructuredSelector } from "reselect";
 import { logImEXEvent } from "../../firebase/firebase.utils";
 import {
   GET_CURRENT_QUESTIONSET_ID,
@@ -16,30 +13,14 @@ import {
   openChatByPhone,
   setMessage,
 } from "../../redux/messaging/messaging.actions";
-import { selectBodyshop } from "../../redux/user/user.selectors";
+import { store } from "../../redux/store";
+import i18n from "../../translations/i18n";
 import { DateTimeFormatter } from "../../utils/DateFormatter";
 import { TemplateList } from "../../utils/TemplateConstants";
 import { HasFeatureAccess } from "../feature-wrapper/feature-wrapper.component";
 
-const mapStateToProps = createStructuredSelector({
-  //currentUser: selectCurrentUser'
-  bodyshop: selectBodyshop,
-});
-const mapDispatchToProps = (dispatch) => ({
-  setEmailOptions: (e) => dispatch(setEmailOptions(e)),
-  openChatByPhone: (phone) => dispatch(openChatByPhone(phone)),
-  setMessage: (text) => dispatch(setMessage(text)),
-});
-
-export function JobsDetailHeaderCsi({
-  setEmailOptions,
-  bodyshop,
-  job,
-  openChatByPhone,
-  setMessage,
-  ...props
-}) {
-  const { t } = useTranslation();
+export default function JobsDetailHeaderCsi({ bodyshop, job }) {
+  const { t } = i18n;
   const [insertCsi] = useMutation(INSERT_CSI);
   const client = useApolloClient();
 
@@ -97,29 +78,35 @@ export function JobsDetailHeaderCsi({
           return;
         }
         if (e.key === "email")
-          setEmailOptions({
-            jobid: job.id,
-            messageOptions: {
-              to: [job.ownr_ea],
-              replyTo: bodyshop.email,
-            },
-            template: {
-              name: TemplateList("job_special").csi_invitation_action.key,
-              variables: {
-                id: result.data.insert_csi.returning[0].id,
+          store.dispatch(
+            setEmailOptions({
+              jobid: job.id,
+              messageOptions: {
+                to: [job.ownr_ea],
+                replyTo: bodyshop.email,
               },
-            },
-          });
+              template: {
+                name: TemplateList("job_special").csi_invitation_action.key,
+                variables: {
+                  id: result.data.insert_csi.returning[0].id,
+                },
+              },
+            })
+          );
 
         if (e.key === "text") {
           const p = parsePhoneNumber(job.ownr_ph1, "CA");
           if (p && p.isValid()) {
-            openChatByPhone({
-              phone_num: p.formatInternational(),
-              jobid: job.id,
-            });
-            setMessage(
-              `${window.location.protocol}//${window.location.host}/csi/${result.data.insert_csi.returning[0].id}`
+            store.dispatch(
+              openChatByPhone({
+                phone_num: p.formatInternational(),
+                jobid: job.id,
+              })
+            );
+            store.dispatch(
+              setMessage(
+                `${window.location.protocol}//${window.location.host}/csi/${result.data.insert_csi.returning[0].id}`
+              )
             );
           } else {
             notification["error"]({
@@ -140,29 +127,35 @@ export function JobsDetailHeaderCsi({
       }
     } else {
       if (e.key === "email")
-        setEmailOptions({
-          jobid: job.id,
-          messageOptions: {
-            to: [job.ownr_ea],
-            replyTo: bodyshop.email,
-          },
-          template: {
-            name: TemplateList("job_special").csi_invitation_action.key,
-            variables: {
-              id: job.csiinvites[0].id,
+        store.dispatch(
+          setEmailOptions({
+            jobid: job.id,
+            messageOptions: {
+              to: [job.ownr_ea],
+              replyTo: bodyshop.email,
             },
-          },
-        });
+            template: {
+              name: TemplateList("job_special").csi_invitation_action.key,
+              variables: {
+                id: job.csiinvites[0].id,
+              },
+            },
+          })
+        );
 
       if (e.key === "text") {
         const p = parsePhoneNumber(job.ownr_ph1, "CA");
         if (p && p.isValid()) {
-          openChatByPhone({
-            phone_num: p.formatInternational(),
-            jobid: job.id,
-          });
-          setMessage(
-            `${window.location.protocol}//${window.location.host}/csi/${job.csiinvites[0].id}`
+          store.dispatch(
+            openChatByPhone({
+              phone_num: p.formatInternational(),
+              jobid: job.id,
+            })
+          );
+          store.dispatch(
+            setMessage(
+              `${window.location.protocol}//${window.location.host}/csi/${job.csiinvites[0].id}`
+            )
           );
         } else {
           notification["error"]({
@@ -180,61 +173,51 @@ export function JobsDetailHeaderCsi({
     }
   };
 
-  if (!HasFeatureAccess({ featureName: "csi", bodyshop })) return <></>;
+  if (!HasFeatureAccess({ featureName: "csi", bodyshop })) return {};
 
-  return (
-    <Menu.SubMenu
-      key="sendcsi"
-      title={t("jobs.actions.sendcsi")}
-      disabled={!job.converted}
-      {...props}
-    >
-      <Menu.Item
-        onClick={handleCreateCsi}
-        key="email"
-        disabled={!!!job.ownr_ea}
-      >
-        {t("general.labels.email")}
-      </Menu.Item>
-      <Menu.Item
-        onClick={handleCreateCsi}
-        key="text"
-        disabled={!!!job.ownr_ph1}
-      >
-        {t("general.labels.text")}
-      </Menu.Item>
-      <Menu.Item
-        onClick={handleCreateCsi}
-        key="generate"
-        disabled={job.csiinvites && job.csiinvites.length > 0}
-      >
-        {t("jobs.actions.generatecsi")}
-      </Menu.Item>
-      <Menu.Divider />
-      {job.csiinvites.map((item, idx) => {
-        return item.completedon ? (
-          <Menu.Item key={idx}>
-            <Link to={`/manage/shop/csi?responseid=${item.id}`}>
-              <DateTimeFormatter>{item.completedon}</DateTimeFormatter>
-            </Link>
-          </Menu.Item>
-        ) : (
-          <Menu.Item
-            key={idx}
-            onClick={() => {
-              navigator.clipboard.writeText(
-                `${window.location.protocol}//${window.location.host}/csi/${item.id}`
-              );
-            }}
-          >
-            {t("general.actions.copylink")}
-          </Menu.Item>
-        );
-      })}
-    </Menu.SubMenu>
-  );
+  return {
+    key: "sendcsi",
+    label: t("jobs.actions.sendcsi"),
+    children: [
+      {
+        key: "email",
+        onClick: handleCreateCsi,
+        disabled: !!!job.ownr_ea,
+        label: t("general.labels.email"),
+      },
+      {
+        onClick: handleCreateCsi,
+        key: "text",
+        disabled: !!!job.ownr_ph1,
+        label: t("general.labels.text"),
+      },
+      {
+        key: "generate",
+        onClick: handleCreateCsi,
+        disabled: job.csiinvites && job.csiinvites.length > 0,
+        label: t("jobs.actions.generatecsi"),
+      },
+      { type: "divider" },
+      ...job.csiinvites.map((item, idx) => {
+        return item.completedon
+          ? {
+              key: idx,
+              label: (
+                <Link to={`/manage/shop/csi?responseid=${item.id}`}>
+                  <DateTimeFormatter>{item.completedon}</DateTimeFormatter>
+                </Link>
+              ),
+            }
+          : {
+              key: idx,
+              onClick: () => {
+                navigator.clipboard.writeText(
+                  `${window.location.protocol}//${window.location.host}/csi/${item.id}`
+                );
+              },
+              label: t("general.actions.copylink"),
+            };
+      }),
+    ],
+  };
 }
-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(JobsDetailHeaderCsi);