Merged in feature/IO-2717-Paint-Material-from-Scale-for-CDK (pull request #1438)

IO-2717 CDK Use Scale Data for Paint Materials Cost

.circleci/config.yml

@@ -0,0 +1,162 @@
+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/node:18.18.2
+    steps:
+      - checkout
+      - eb/setup
+      - run:
+          command: |
+            eb init imex-online-production-api -r ca-central-1 -p "Node.js 18 running on 64bit Amazon Linux 2"
+            eb 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
+    resource_class: large
+    working_directory: ~/repo/client
+
+    steps:
+      - checkout:
+          path: ~/repo
+      - run:
+          name: Install Dependencies
+          command: npm i
+
+      - run: npm run build
+
+      - aws-s3/sync:
+          from: build
+          to: "s3://imex-online-production/"
+          arguments: "--exclude '*.map'"
+      - 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
+    resource_class: large
+    working_directory: ~/repo/client
+
+    steps:
+      - checkout:
+          path: ~/repo
+      - run:
+          name: Install Dependencies
+          command: npm i
+
+      - run: npm run build:test
+
+      - aws-s3/sync:
+          from: build
+          to: "s3://imex-online-test/"
+          arguments: "--exclude '*.map'"
+      - 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

@@ -0,0 +1,20 @@
+{
+  "env": {
+    "es6": true,
+    "node": true
+  },
+  "extends": "eslint:recommended",
+  "globals": {
+    "Atomics": "readonly",
+    "SharedArrayBuffer": "readonly"
+  },
+
+  "parserOptions": {
+    "ecmaVersion": 2018,
+    "sourceType": "module"
+  },
+  "rules": {
+    "no-console": "off"
+  },
+  "settings": {}
+}

.gitignore

@@ -113,3 +113,10 @@ firebase/.env
 !.elasticbeanstalk/*.cfg.yml
 !.elasticbeanstalk/*.global.yml
 logs/oAuthClient-log.log
+
+
+.node-persist/**
+
+/*.env.*
+.idea/*
+.idea

.npmrc

@@ -0,0 +1 @@
+legacy-peer-deps=true

.prettierrc.js

@@ -0,0 +1,16 @@
+exports.default = {
+  printWidth: 120,
+  useTabs: false,
+  tabWidth: 2,
+  trailingComma: "es5",
+  semi: true,
+  singleQuote: false,
+  bracketSpacing: true,
+  arrowParens: "always",
+  jsxSingleQuote: false,
+  bracketSameLine: false,
+  endOfLine: "lf",
+  importOrder: ["^@core/(.*)$", "^@server/(.*)$", "^@ui/(.*)$", "^[./]"],
+  importOrderSeparation: true,
+  importOrderSortSpecifiers: true,
+};

README.MD

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

_reference/reportFiltersAndSorters.md

@@ -0,0 +1,189 @@
+# Filters and Sorters
+
+This documentation details the schema required for `.filters` files on the report server. It is used to dynamically
+modify the graphQL query and provide the user more power over their reports.
+
+For filters and sorters, valid types include (`type` key in the schema):
+- string (default)
+- number
+- bool or boolean
+- date
+
+## Special Notes
+- When passing the data to the template server, the property filters and sorters is added to the data object and will reflect the filters and sorters the user has selected
+
+## High level Schema Overview
+
+```javascript
+const schema = {
+    "filters": [
+        {
+            "name": "jobs.joblines.mod_lb_hrs", // Name and path of the field in the graphQL query
+            "translation": "jobs.joblines.mod_lb_hrs_1", // Translation key for the label used in the GUI
+            "label": "mod_lb_hrs_1",    // Label used in the case the GUI does not contain a translation
+            "type": "number" // Type of field, can be number or string currently
+        },
+        // ... more filters
+    ],
+    "sorters": [
+        {
+            "name": "jobs.joblines.mod_lb_hrs",  // Name and path of the field in the graphQL query
+            "translation": "jobs.joblines.mod_lb_hrs_1",  // Translation key for the label used in the GUI
+            "label": "mod_lb_hrs_1", // Label used in the case the GUI does not contain a translation
+            "type": "number"  // Type of field, can be number or string currently
+        },
+        // ... more sorters
+    ],
+    "dates": {
+        // This is not yet implemented and will be added in a future release
+    }
+}
+```
+
+## Filters
+
+Filters effect the where clause of the graphQL query. They are used to filter the data returned from the server.
+A note on special notation used in the `name` field.
+
+## Reflection
+
+Filters can make use of reflection to pre-fill select boxes, the following is an example of that in the filters file.
+
+```json
+    {
+      "name": "jobs.status",
+      "translation": "jobs.fields.status",
+      "label": "Status",
+      "type": "string",
+      "reflector": {
+        "type": "internal",
+        "name": "special.job_statuses"
+      }
+    }
+```
+
+in this example, a reflector with the type 'internal' (all types at the moment require this, and it is used for future functionality), with a name of `special.job_statuses`
+
+The following cases are available
+
+- `special.job_statuses` - This will reflect the statuses of the jobs table `bodyshop.md_ro_statuses.statuses'`
+- `special.cost_centers` - This will reflect the cost centers `bodyshop.md_responsibility_centers.costs`
+- `special.categories` - This will reflect the categories `bodyshop.md_categories`
+- `special.insurance_companies` - This will reflect the insurance companies `bodyshop.md_ins_cos`'
+- `special.employee_teams` - This will reflect the employee teams `bodyshop.employee_teams`
+- `special.employees` - This will reflect the employees `bodyshop.employees`
+- `special.first_names` - This will reflect the first names `bodyshop.employees`
+- `special.last_names` - This will reflect the last names `bodyshop.employees`
+- `special.referral_sources` - This will reflect the referral sources `bodyshop.md_referral_sources`
+- `special.class`- This will reflect the class `bodyshop.md_classes`
+- `special.lost_sale_reasons` - This will reflect the lost sale reasons `bodyshop.md_lost_sale_reasons`
+- `special.alt_transports` - This will reflect the alternative transports `bodyshop.appt_alt_transport`
+- `special.payment_types` - This will reflect the payment types `bodyshop.md_payment_types`
+- `special.payment_payers` - This is a special case with a key value set of [Customer, Insurance]
+
+### Path without brackets, multi level
+
+`"name": "jobs.joblines.mod_lb_hrs",`
+This will produce a where clause at the `joblines` level of the graphQL query,
+
+```graphql
+query gendoc_hours_sold_detail_open($starttz: timestamptz!, $endtz: timestamptz!) {
+    jobs(
+        where: {date_invoiced: {_is_null: true}, date_open: {_gte: $starttz, _lte: $endtz}, ro_number: {_is_null: false}, voided: {_eq: false}}
+    ) {
+        joblines(
+            order_by: {line_no: asc}
+            where: {removed: {_eq: false}, mod_lb_hrs: {_lt: 3}}
+        ) {
+            line_no
+            mod_lbr_ty
+            mod_lb_hrs
+            convertedtolbr
+            convertedtolbr_data
+        }
+        ownr_co_nm
+        ownr_fn
+        ownr_ln
+        plate_no
+        ro_number
+        status
+        v_make_desc
+        v_model_desc
+        v_model_yr
+        v_vin
+        v_color
+    }
+}
+```
+
+### Path with brackets,top level
+
+`"name": "[jobs].joblines.mod_lb_hrs",`
+This will produce a where clause at the `jobs` level of the graphQL query.
+
+```graphql
+query gendoc_hours_sold_detail_open($starttz: timestamptz!, $endtz: timestamptz!) {
+    jobs(
+        where: {date_invoiced: {_is_null: true}, date_open: {_gte: $starttz, _lte: $endtz}, ro_number: {_is_null: false}, voided: {_eq: false}, joblines: {mod_lb_hrs: {_gt: 4}}}
+    ) {
+        joblines(
+            order_by: {line_no: asc}
+            where: {removed: {_eq: false}}
+        ) {
+            line_no
+            mod_lbr_ty
+            mod_lb_hrs
+            convertedtolbr
+            convertedtolbr_data
+        }
+        ownr_co_nm
+        ownr_fn
+        ownr_ln
+        plate_no
+        ro_number
+        status
+        v_make_desc
+        v_model_desc
+        v_model_yr
+        v_vin
+        v_color
+    }
+}
+```
+
+## Known Caveats
+
+- Will only support two level of nesting in the graphQL query `jobs.joblines.mod_lb_hrs` vs `[jobs].joblines.mod_lb_hrs`
+  is fine, but `jobs.[joblines.].some_table.mod_lb_hrs` is not.
+- The type object must be 'string' or 'number'  or 'bool' or 'boolean' or 'date' and is case-sensitive.
+- The `translation` key is used to look up the label in the GUI, if it is not found, the `label` key is used.
+- Do not add the ability to filter things that are already filtered as part of the original query, this would be
+  redundant and could cause issues.
+- Do not add the ability to filter on things like FK constraints, must like the above example.
+- *INHERITANCE CAVEAT* If you have a filters file on a parent report that has a child that you do not want the filters inherited from, you must place a blank filters file (valid json so {}) on the child report level. This will than fetch the child filters, which are empty and move along, versus inheriting the parent filters.
+
+## Sorters
+
+- Sorters follow the same schema as filters, however, they do not do square bracket wrapping to indicate level hoisting,
+  a filter added on `job.md_status` would be added at the top level, and a filter added on `jobs.joblines.mod_lb_hrs`
+  would be added at the `joblines` level.
+- Most of the reports currently do sorting on a template level, this will need to change to actually see the results
+  using the sorters.
+
+### Default Sorters
+
+- A sorter can be given a default object containing a `order` and `direction` key value. This will be used to sort the report if the user does not select any of the sorters themselves.
+- The `order` key is the order in which the sorters are applied, and the `direction` key is the direction of the sort, either `asc` or `desc`.
+
+```json
+{
+    "name": "jobs.joblines.mod_lb_hrs",
+    "translation": "jobs.joblines.mod_lb_hrs_1",
+    "label": "mod_lb_hrs_1",
+    "type": "number",
+    "default": {
+        "order": 1,
+        "direction": "asc"
+    }
+}
+```

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';

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=http://localhost:4000
+REACT_APP_REPORTS_SERVER_URL=https://reports3.test.imex.online
+REACT_APP_SPLIT_API=ts615lqgnmk84thn72uk18uu5pgce6e0l4rc

client/.env.production

@@ -0,0 +1,14 @@
+GENERATE_SOURCEMAP=true
+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/.gitignore

@@ -0,0 +1,3 @@
+
+# Sentry Config File
+.sentryclirc

client/craco.config.js

@@ -1,25 +1,25 @@
 // craco.config.js
 const TerserPlugin = require("terser-webpack-plugin");
 const CracoLessPlugin = require("craco-less");
-const SentryWebpackPlugin = require("@sentry/webpack-plugin");
+//const SentryWebpackPlugin = require("@sentry/webpack-plugin");
 
 module.exports = {
   plugins: [
-    {
-      plugin: SentryWebpackPlugin,
-      options: {
-        // sentry-cli configuration
-        authToken:
-          "6b45b028a02342db97a9a2f92c0959058665443d379d4a3a876430009e744260",
-        org: "snapt-software",
-        project: "imexonline",
-        release: process.env.REACT_APP_GIT_SHA,
+    // {
+    //   plugin: SentryWebpackPlugin,
+    //   options: {
+    //     // sentry-cli configuration
+    //     authToken:
+    //       "6b45b028a02342db97a9a2f92c0959058665443d379d4a3a876430009e744260",
+    //     org: "snapt-software",
+    //     project: "imexonline",
+    //     release: process.env.REACT_APP_GIT_SHA,
 
-        // webpack-specific configuration
-        include: ".",
-        ignore: ["node_modules", "webpack.config.js"],
-      },
-    },
+    //     // webpack-specific configuration
+    //     include: ".",
+    //     ignore: ["node_modules", "webpack.config.js"],
+    //   },
+    // },
     {
       plugin: CracoLessPlugin,
       options: {

client/package.json

@@ -3,75 +3,74 @@
   "version": "0.2.1",
   "private": true,
   "proxy": "http://localhost:4000",
-  "browser": {
-    "fs": false,
-    "path": false,
-    "os": false
-  },
   "dependencies": {
-    "@apollo/client": "^3.5.10",
+    "@apollo/client": "^3.7.9",
     "@asseinfo/react-kanban": "^2.2.0",
-    "@craco/craco": "^6.4.3",
-    "@fingerprintjs/fingerprintjs": "^3.3.3",
+    "@craco/craco": "^7.0.0",
+    "@fingerprintjs/fingerprintjs": "^3.4.2",
     "@jsreport/browser-client": "^3.1.0",
-    "@sentry/react": "^6.19.6",
-    "@sentry/tracing": "^6.19.6",
-    "@splitsoftware/splitio-react": "^1.4.0",
-    "@stripe/react-stripe-js": "^1.7.1",
-    "@stripe/stripe-js": "^1.27.0",
-    "@tanem/react-nprogress": "^5.0.0",
-    "antd": "^4.19.5",
-    "apollo-link-logger": "^2.0.0",
-    "axios": "^0.26.1",
+    "@sentry/cli": "^2.27.0",
+    "@sentry/react": "^7.99.0",
+    "@sentry/tracing": "^7.40.0",
+    "@splitsoftware/splitio-react": "^1.8.1",
+    "@tanem/react-nprogress": "^5.0.8",
+    "antd": "^4.24.8",
+    "apollo-link-logger": "^2.0.1",
+    "apollo-link-sentry": "^3.3.0",
+    "axios": "^1.3.4",
     "craco-less": "^2.0.0",
     "dinero.js": "^1.9.1",
-    "dotenv": "^16.0.0",
+    "dotenv": "^16.0.1",
     "enquire-js": "^0.2.1",
     "env-cmd": "^10.1.0",
     "exifr": "^7.1.3",
-    "firebase": "^9.6.10",
-    "graphql": "^16.3.0",
-    "i18next": "^21.6.16",
-    "i18next-browser-languagedetector": "^6.1.4",
-    "jsoneditor": "^9.7.4",
-    "libphonenumber-js": "^1.9.51",
-    "logrocket": "^2.2.1",
-    "markerjs2": "^2.21.0",
+    "firebase": "^9.17.1",
+    "graphql": "^16.6.0",
+    "i18next": "^22.4.10",
+    "i18next-browser-languagedetector": "^7.0.1",
+    "jsoneditor": "^9.9.0",
+    "jsreport-browser-client-dist": "^1.3.0",
+    "libphonenumber-js": "^1.10.21",
+    "logrocket": "^3.0.1",
+    "markerjs2": "^2.28.1",
     "moment-business-days": "^1.2.0",
-    "moment-timezone": "^0.5.34",
-    "phone": "^3.1.15",
+    "moment-timezone": "^0.5.41",
+    "normalize-url": "^8.0.0",
+    "phone": "^3.1.35",
     "preval.macro": "^5.0.0",
     "prop-types": "^15.8.1",
-    "query-string": "^7.1.1",
+    "query-string": "^7.1.3",
     "rc-queue-anim": "^2.0.0",
     "rc-scroll-anim": "^2.7.6",
-    "react": "^18.0.0",
-    "react-big-calendar": "^0.40.0",
+    "react": "^17.0.2",
+    "react-big-calendar": "^1.6.8",
     "react-color": "^2.19.3",
     "react-cookie": "^4.1.1",
-    "react-dom": "^18.0.0",
-    "react-drag-listview": "^0.1.9",
-    "react-grid-gallery": "^0.5.5",
+    "react-dom": "^17.0.2",
+    "react-drag-listview": "^0.2.1",
+    "react-grid-gallery": "^1.0.0",
     "react-grid-layout": "^1.3.4",
-    "react-i18next": "^11.16.6",
-    "react-icons": "^4.3.1",
-    "react-number-format": "^4.9.1",
-    "react-redux": "^7.2.8",
+    "react-i18next": "^12.2.0",
+    "react-icons": "^4.7.1",
+    "react-image-lightbox": "^5.1.4",
+    "react-intersection-observer": "^9.4.3",
+    "react-number-format": "^5.1.3",
+    "react-redux": "^8.0.5",
     "react-resizable": "^3.0.4",
     "react-router-dom": "^5.3.0",
-    "react-scripts": "^4.0.3",
+    "react-scripts": "^5.0.1",
     "react-sticky": "^6.0.3",
     "react-sublime-video": "^0.2.5",
     "react-virtualized": "^9.22.3",
-    "recharts": "^2.1.9",
-    "redux": "^4.1.2",
+    "recharts": "^2.4.3",
+    "redux": "^4.2.1",
     "redux-persist": "^6.0.0",
-    "redux-saga": "^1.1.3",
-    "redux-state-sync": "^3.1.2",
-    "reselect": "^4.1.5",
-    "sass": "^1.50.0",
-    "socket.io-client": "^4.4.1",
-    "styled-components": "^5.3.5",
+    "redux-saga": "^1.2.2",
+    "redux-state-sync": "^3.1.4",
+    "reselect": "^4.1.7",
+    "sass": "^1.58.3",
+    "socket.io-client": "^4.6.1",
+    "styled-components": "^5.3.6",
     "subscriptions-transport-ws": "^0.11.0",
     "web-vitals": "^2.1.4",
     "workbox-background-sync": "^6.5.3",
@@ -91,13 +90,14 @@
   "scripts": {
     "analyze": "source-map-explorer 'build/static/js/*.js'",
     "start": "craco 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!'",
+    "build": "REACT_APP_GIT_SHA=`git rev-parse --short HEAD` craco build && npm run sentry:sourcemaps",
+    "build:test": "env-cmd -f .env.test npm run build",
+    "build-deploy:test": "npm run build:test && s3cmd sync build/* s3://imex-online-test && echo '🚀 TESTING Deployed!'",
     "buildcra": "REACT_APP_GIT_SHA=`git rev-parse --short HEAD` craco build",
     "test": "cypress open",
     "eject": "react-scripts eject",
-    "madge": "madge  --image ./madge-graph.svg --extensions js,jsx,ts,tsx --circular ."
+    "madge": "madge  --image ./madge-graph.svg --extensions js,jsx,ts,tsx --circular .",
+    "sentry:sourcemaps": "sentry-cli sourcemaps inject --org imex --project imexonline ./build && sentry-cli sourcemaps upload --org imex --project imexonline ./build"
   },
   "eslintConfig": {
     "extends": [
@@ -122,9 +122,9 @@
     "react-error-overlay": "6.0.9"
   },
   "devDependencies": {
-    "@sentry/webpack-plugin": "^1.18.8",
-    "@testing-library/cypress": "^8.0.2",
-    "cypress": "^9.5.4",
+    "@sentry/webpack-plugin": "^1.20.0",
+    "@testing-library/cypress": "^8.0.3",
+    "cypress": "^10.3.1",
     "eslint-plugin-cypress": "^2.12.1",
     "react-error-overlay": "6.0.11",
     "redux-logger": "^3.0.6",

client/src/App/App.container.jsx

@@ -8,6 +8,7 @@ import { useTranslation } from "react-i18next";
 import GlobalLoadingBar from "../components/global-loading-bar/global-loading-bar.component";
 import client from "../utils/GraphQLClient";
 import App from "./App";
+import * as Sentry from "@sentry/react";
 
 moment.locale("en-US");
 
@@ -18,7 +19,7 @@ export const factory = SplitSdk({
   },
 });
 
-export default function AppContainer() {
+function AppContainer() {
   const { t } = useTranslation();
 
   return (
@@ -42,3 +43,5 @@ export default function AppContainer() {
     </ApolloProvider>
   );
 }
+
+export default Sentry.withProfiler(AppContainer);

client/src/App/App.jsx

@@ -1,4 +1,4 @@
-import { useTreatments } from "@splitsoftware/splitio-react";
+import { useClient } from "@splitsoftware/splitio-react";
 import { Button, Result } from "antd";
 import LogRocket from "logrocket";
 import React, { lazy, Suspense, useEffect } from "react";
@@ -22,6 +22,7 @@ import {
 } from "../redux/user/user.selectors";
 import PrivateRoute from "../utils/private-route";
 import "./App.styles.scss";
+import handleBeta from "../utils/handleBeta";
 
 const ResetPassword = lazy(() =>
   import("../pages/reset-password/reset-password.component")
@@ -51,17 +52,12 @@ export function App({
   online,
   setOnline,
 }) {
-  const { LogRocket_Tracking } = useTreatments(
-    ["LogRocket_Tracking"],
-    {},
-    bodyshop && bodyshop.imexshopid
-  );
+  const client = useClient();
 
   useEffect(() => {
     if (!navigator.onLine) {
       setOnline(false);
     }
-
     checkUserSession();
   }, [checkUserSession, setOnline]);
 
@@ -77,16 +73,17 @@ export function App({
   window.addEventListener("online", function (e) {
     setOnline(true);
   });
+
   useEffect(() => {
-    if (currentUser.authorized) {
-      if (
-        process.env.NODE_ENV === "production" &&
-        LogRocket_Tracking.treatment === "on"
-      ) {
+    if (currentUser.authorized && bodyshop) {
+      client.setAttribute("imexshopid", bodyshop.imexshopid);
+
+      if (client.getTreatment("LogRocket_Tracking") === "on") {
+        console.log("LR Start");
         LogRocket.init("gvfvfw/bodyshopapp");
       }
     }
-  }, [currentUser.authorized, LogRocket_Tracking.treatment]);
+  }, [bodyshop, client, currentUser.authorized]);
 
   if (currentUser.authorized === null) {
     return <LoadingSpinner message={t("general.labels.loggingin")} />;
@@ -111,6 +108,8 @@ export function App({
       />
     );
 
+  handleBeta();
+
   return (
     <Switch>
       <Suspense fallback={<LoadingSpinner message="ImEX Online" />}>

client/src/App/App.styles.scss

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

client/src/components/_test/paymentMethod.jsx

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

client/src/components/_test/payment_response.json

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

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

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

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

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

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

@@ -1,18 +1,21 @@
-import { Input, Table, Checkbox, Card, Space } from "antd";
+import { Card, Checkbox, Input, Space, Table } from "antd";
+import queryString from "query-string";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
-import { Link } from "react-router-dom";
-import CurrencyFormatter from "../../utils/CurrencyFormatter";
-import { alphaSort, dateSort } from "../../utils/sorters";
-import PayableExportButton from "../payable-export-button/payable-export-button.component";
-import PayableExportAll from "../payable-export-all-button/payable-export-all-button.component";
-import { DateFormatter } from "../../utils/DateFormatter";
-import queryString from "query-string";
-import { logImEXEvent } from "../../firebase/firebase.utils";
-import QboAuthorizeComponent from "../qbo-authorize/qbo-authorize.component";
 import { connect } from "react-redux";
+import { Link } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import CurrencyFormatter from "../../utils/CurrencyFormatter";
+import { DateFormatter } from "../../utils/DateFormatter";
+import { pageLimit } from "../../utils/config";
+import { alphaSort, dateSort } from "../../utils/sorters";
+import ExportLogsCountDisplay from "../export-logs-count-display/export-logs-count-display.component";
+import PayableExportAll from "../payable-export-all-button/payable-export-all-button.component";
+import PayableExportButton from "../payable-export-button/payable-export-button.component";
+import BillMarkSelectedExported from "../payable-mark-selected-exported/payable-mark-selected-exported.component";
+import QboAuthorizeComponent from "../qbo-authorize/qbo-authorize.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -27,7 +30,12 @@ export default connect(
   mapDispatchToProps
 )(AccountingPayablesTableComponent);
 
-export function AccountingPayablesTableComponent({ bodyshop, loading, bills }) {
+export function AccountingPayablesTableComponent({
+  bodyshop,
+  loading,
+  bills,
+  refetch,
+}) {
   const { t } = useTranslation();
   const [selectedBills, setSelectedBills] = useState([]);
   const [transInProgress, setTransInProgress] = useState(false);
@@ -130,28 +138,22 @@ export function AccountingPayablesTableComponent({ bodyshop, loading, bills }) {
       title: t("exportlogs.labels.attempts"),
       dataIndex: "attempts",
       key: "attempts",
-
-      render: (text, record) => {
-        const success = record.exportlogs.filter((e) => e.successful).length;
-        const attempts = record.exportlogs.length;
-        return `${success}/${attempts}`;
-      },
+      render: (text, record) => (
+        <ExportLogsCountDisplay logs={record.exportlogs} />
+      ),
     },
     {
       title: t("general.labels.actions"),
       dataIndex: "actions",
       key: "actions",
-      sorter: (a, b) => a.clm_total - b.clm_total,
-
       render: (text, record) => (
-        <div>
-          <PayableExportButton
-            billId={record.id}
-            disabled={transInProgress || !!record.exported}
-            loadingCallback={setTransInProgress}
-            setSelectedBills={setSelectedBills}
-          />
-        </div>
+        <PayableExportButton
+          billId={record.id}
+          disabled={transInProgress || !!record.exported}
+          loadingCallback={setTransInProgress}
+          setSelectedBills={setSelectedBills}
+          refetch={refetch}
+        />
       ),
     },
   ];
@@ -177,11 +179,19 @@ export function AccountingPayablesTableComponent({ bodyshop, loading, bills }) {
     <Card
       extra={
         <Space wrap>
+          <BillMarkSelectedExported
+            billids={selectedBills}
+            disabled={transInProgress || selectedBills.length === 0}
+            loadingCallback={setTransInProgress}
+            completedCallback={setSelectedBills}
+            refetch={refetch}
+          />
           <PayableExportAll
             billids={selectedBills}
             disabled={transInProgress || selectedBills.length === 0}
             loadingCallback={setTransInProgress}
             completedCallback={setSelectedBills}
+            refetch={refetch}
           />
           {bodyshop.accountingconfig && bodyshop.accountingconfig.qbo && (
             <QboAuthorizeComponent />
@@ -198,7 +208,7 @@ export function AccountingPayablesTableComponent({ bodyshop, loading, bills }) {
       <Table
         loading={loading}
         dataSource={dataSource}
-        pagination={{ position: "top", pageSize: 50 }}
+        pagination={{ position: "top", pageSize: pageLimit }}
         columns={columns}
         rowKey="id"
         onChange={handleTableChange}

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

@@ -1,18 +1,23 @@
 import { Card, Input, Space, Table } from "antd";
 import React, { useState } 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 { selectBodyshop } from "../../redux/user/user.selectors";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { DateFormatter, DateTimeFormatter } from "../../utils/DateFormatter";
+import { pageLimit } from "../../utils/config";
 import { alphaSort, dateSort } from "../../utils/sorters";
+import ExportLogsCountDisplay from "../export-logs-count-display/export-logs-count-display.component";
+import OwnerNameDisplay, {
+  OwnerNameDisplayFunction,
+} from "../owner-name-display/owner-name-display.component";
 import PaymentExportButton from "../payment-export-button/payment-export-button.component";
+import PaymentMarkSelectedExported from "../payment-mark-selected-exported/payment-mark-selected-exported.component";
 import PaymentsExportAllButton from "../payments-export-all-button/payments-export-all-button.component";
 import QboAuthorizeComponent from "../qbo-authorize/qbo-authorize.component";
-import { connect } from "react-redux";
-import { createStructuredSelector } from "reselect";
-import { selectBodyshop } from "../../redux/user/user.selectors";
-import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -31,6 +36,7 @@ export function AccountingPayablesTableComponent({
   bodyshop,
   loading,
   payments,
+  refetch,
 }) {
   const { t } = useTranslation();
   const [selectedPayments, setSelectedPayments] = useState([]);
@@ -71,7 +77,11 @@ export function AccountingPayablesTableComponent({
       dataIndex: "owner",
       key: "owner",
       ellipsis: true,
-      sorter: (a, b) => alphaSort(a.job.ownr_ln, b.job.ownr_ln),
+      sorter: (a, b) =>
+        alphaSort(
+          OwnerNameDisplayFunction(a.job),
+          OwnerNameDisplayFunction(b.job)
+        ),
       sortOrder:
         state.sortedInfo.columnKey === "owner" && state.sortedInfo.order,
       render: (text, record) => {
@@ -90,6 +100,9 @@ export function AccountingPayablesTableComponent({
       title: t("payments.fields.amount"),
       dataIndex: "amount",
       key: "amount",
+      sorter: (a, b) => a.amount - b.amount,
+      sortOrder:
+        state.sortedInfo.columnKey === "amount" && state.sortedInfo.order,
       render: (text, record) => (
         <CurrencyFormatter>{record.amount}</CurrencyFormatter>
       ),
@@ -104,50 +117,45 @@ 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",
       key: "created_at",
+      sorter: (a, b) => dateSort(a.created_at, b.created_at),
+      sortOrder:
+        state.sortedInfo.columnKey === "created_at" && state.sortedInfo.order,
       render: (text, record) => (
         <DateTimeFormatter>{record.created_at}</DateTimeFormatter>
       ),
     },
-    {
-      title: t("payments.fields.exportedat"),
-      dataIndex: "exportedat",
-      key: "exportedat",
-      render: (text, record) => (
-        <DateTimeFormatter>{record.exportedat}</DateTimeFormatter>
-      ),
-    },
+    // {
+    //   title: t("payments.fields.exportedat"),
+    //   dataIndex: "exportedat",
+    //   key: "exportedat",
+    //   render: (text, record) => (
+    //     <DateTimeFormatter>{record.exportedat}</DateTimeFormatter>
+    //   ),
+    // },
     {
       title: t("exportlogs.labels.attempts"),
       dataIndex: "attempts",
       key: "attempts",
 
-      render: (text, record) => {
-        const success = record.exportlogs.filter((e) => e.successful).length;
-        const attempts = record.exportlogs.length;
-        return `${success}/${attempts}`;
-      },
+      render: (text, record) => (
+        <ExportLogsCountDisplay logs={record.exportlogs} />
+      ),
     },
     {
       title: t("general.labels.actions"),
       dataIndex: "actions",
       key: "actions",
-      sorter: (a, b) => a.clm_total - b.clm_total,
-
       render: (text, record) => (
         <PaymentExportButton
           paymentId={record.id}
           disabled={transInProgress || !!record.exportedat}
           loadingCallback={setTransInProgress}
           setSelectedPayments={setSelectedPayments}
+          refetch={refetch}
         />
       ),
     },
@@ -183,11 +191,19 @@ export function AccountingPayablesTableComponent({
     <Card
       extra={
         <Space wrap>
+          <PaymentMarkSelectedExported
+            paymentIds={selectedPayments}
+            disabled={transInProgress || selectedPayments.length === 0}
+            loadingCallback={setTransInProgress}
+            completedCallback={setSelectedPayments}
+            refetch={refetch}
+          />
           <PaymentsExportAllButton
             paymentIds={selectedPayments}
             disabled={transInProgress || selectedPayments.length === 0}
             loadingCallback={setTransInProgress}
             completedCallback={setSelectedPayments}
+            refetch={refetch}
           />
           {bodyshop.accountingconfig && bodyshop.accountingconfig.qbo && (
             <QboAuthorizeComponent />
@@ -204,7 +220,7 @@ export function AccountingPayablesTableComponent({
       <Table
         loading={loading}
         dataSource={dataSource}
-        pagination={{ position: "top", pageSize: 50 }}
+        pagination={{ position: "top", pageSize: pageLimit }}
         columns={columns}
         rowKey="id"
         onChange={handleTableChange}

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

@@ -4,16 +4,19 @@ import { useTranslation } from "react-i18next";
 import { Link } from "react-router-dom";
 import { logImEXEvent } from "../../firebase/firebase.utils";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
-import { alphaSort, dateSort } from "../../utils/sorters";
+import { alphaSort, dateSort, statusSort } from "../../utils/sorters";
 import JobExportButton from "../jobs-close-export-button/jobs-close-export-button.component";
 import JobsExportAllButton from "../jobs-export-all-button/jobs-export-all-button.component";
 
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import QboAuthorizeComponent from "../qbo-authorize/qbo-authorize.component";
 import { DateFormatter } from "../../utils/DateFormatter";
-import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+import ExportLogsCountDisplay from "../export-logs-count-display/export-logs-count-display.component";
+import OwnerNameDisplay, {
+  OwnerNameDisplayFunction,
+} from "../owner-name-display/owner-name-display.component";
+import QboAuthorizeComponent from "../qbo-authorize/qbo-authorize.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -30,6 +33,7 @@ export function AccountingReceivablesTableComponent({
   bodyshop,
   loading,
   jobs,
+  refetch,
 }) {
   const { t } = useTranslation();
   const [selectedJobs, setSelectedJobs] = useState([]);
@@ -61,7 +65,7 @@ export function AccountingReceivablesTableComponent({
       title: t("jobs.fields.status"),
       dataIndex: "status",
       key: "status",
-      sorter: (a, b) => a.status - b.status,
+      sorter: (a, b) => statusSort(a, b, bodyshop.md_ro_statuses.statuses),
       sortOrder:
         state.sortedInfo.columnKey === "status" && state.sortedInfo.order,
     },
@@ -81,7 +85,8 @@ export function AccountingReceivablesTableComponent({
       title: t("jobs.fields.owner"),
       dataIndex: "owner",
       key: "owner",
-      sorter: (a, b) => alphaSort(a.ownr_ln, b.ownr_ln),
+      sorter: (a, b) =>
+        alphaSort(OwnerNameDisplayFunction(a), OwnerNameDisplayFunction(b)),
       sortOrder:
         state.sortedInfo.columnKey === "owner" && state.sortedInfo.order,
       render: (text, record) => {
@@ -101,6 +106,15 @@ export function AccountingReceivablesTableComponent({
       dataIndex: "vehicle",
       key: "vehicle",
       ellipsis: true,
+      sorter: (a, b) =>
+        alphaSort(
+          `${a.v_model_yr || ""} ${a.v_make_desc || ""} ${
+            a.v_model_desc || ""
+          }`,
+          `${b.v_model_yr || ""} ${b.v_make_desc || ""} ${b.v_model_desc || ""}`
+        ),
+      sortOrder:
+        state.sortedInfo.columnKey === "vehicle" && state.sortedInfo.order,
       render: (text, record) => {
         return record.vehicleid ? (
           <Link to={"/manage/vehicles/" + record.vehicleid}>
@@ -139,12 +153,9 @@ export function AccountingReceivablesTableComponent({
       title: t("exportlogs.labels.attempts"),
       dataIndex: "attempts",
       key: "attempts",
-
-      render: (text, record) => {
-        const success = record.exportlogs.filter((e) => e.successful).length;
-        const attempts = record.exportlogs.length;
-        return `${success}/${attempts}`;
-      },
+      render: (text, record) => (
+        <ExportLogsCountDisplay logs={record.exportlogs} />
+      ),
     },
     {
       title: t("general.labels.actions"),
@@ -157,6 +168,7 @@ export function AccountingReceivablesTableComponent({
             jobId={record.id}
             disabled={!!record.date_exported}
             setSelectedJobs={setSelectedJobs}
+            refetch={refetch}
           />
           <Link to={`/manage/jobs/${record.id}/close`}>
             <Button>{t("jobs.labels.viewallocations")}</Button>
@@ -207,6 +219,7 @@ export function AccountingReceivablesTableComponent({
               disabled={transInProgress || selectedJobs.length === 0}
               loadingCallback={setTransInProgress}
               completedCallback={setSelectedJobs}
+              refetch={refetch}
             />
           )}
           {bodyshop.accountingconfig && bodyshop.accountingconfig.qbo && (

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

@@ -4,6 +4,7 @@ import { alphaSort } from "../../utils/sorters";
 import { DateTimeFormatter } from "../../utils/DateFormatter";
 import { useTranslation } from "react-i18next";
 import AuditTrailValuesComponent from "../audit-trail-values/audit-trail-values.component";
+import {pageLimit} from "../../utils/config";
 
 export default function AuditTrailListComponent({ loading, data }) {
   const [state, setState] = useState({
@@ -74,7 +75,7 @@ export default function AuditTrailListComponent({ loading, data }) {
     <Table
       {...formItemLayout}
       loading={loading}
-      pagination={{ position: "top", defaultPageSize: 25 }}
+      pagination={{ position: "top", defaultPageSize: pageLimit }}
       columns={columns}
       rowKey="id"
       dataSource={data}

client/src/components/audit-trail-list/audit-trail-list.container.jsx

@@ -4,6 +4,8 @@ import { useQuery } from "@apollo/client";
 import { QUERY_AUDIT_TRAIL } from "../../graphql/audit_trail.queries";
 import AlertComponent from "../alert/alert.component";
 import { logImEXEvent } from "../../firebase/firebase.utils";
+import EmailAuditTrailListComponent from "./email-audit-trail-list.component";
+import { Card, Row } from "antd";
 
 export default function AuditTrailListContainer({ recordId }) {
   const { loading, error, data } = useQuery(QUERY_AUDIT_TRAIL, {
@@ -18,10 +20,20 @@ export default function AuditTrailListContainer({ recordId }) {
       {error ? (
         <AlertComponent type="error" message={error.message} />
       ) : (
-        <AuditTrailListComponent
-          loading={loading}
-          data={data ? data.audit_trail : null}
-        />
+        <Row gutter={[16, 16]}>
+          <Card>
+            <AuditTrailListComponent
+              loading={loading}
+              data={data ? data.audit_trail : []}
+            />
+          </Card>
+          <Card>
+            <EmailAuditTrailListComponent
+              loading={loading}
+              data={data ? data.audit_trail : []}
+            />
+          </Card>
+        </Row>
       )}
     </div>
   );

client/src/components/audit-trail-list/email-audit-trail-list.component.jsx

@@ -0,0 +1,64 @@
+import { Table } from "antd";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { DateTimeFormatter } from "../../utils/DateFormatter";
+import { alphaSort } from "../../utils/sorters";
+import {pageLimit} from "../../utils/config";
+
+export default function EmailAuditTrailListComponent({ loading, data }) {
+  const [state, setState] = useState({
+    sortedInfo: {},
+    filteredInfo: {},
+  });
+  const { t } = useTranslation();
+  const columns = [ 
+    {
+      title: t("audit.fields.created"),
+      dataIndex: " created",
+      key: " created",
+      width: "10%",
+      render: (text, record) => (
+        <DateTimeFormatter>{record.created}</DateTimeFormatter>
+      ),
+      sorter: (a, b) => a.created - b.created,
+      sortOrder:
+        state.sortedInfo.columnKey === "created" && state.sortedInfo.order,
+    },
+
+    {
+      title: t("audit.fields.useremail"),
+      dataIndex: "useremail",
+      key: "useremail",
+      width: "10%",
+      sorter: (a, b) => alphaSort(a.useremail, b.useremail),
+      sortOrder:
+        state.sortedInfo.columnKey === "useremail" && state.sortedInfo.order,
+    },
+  ];
+
+  const formItemLayout = {
+    labelCol: {
+      xs: { span: 12 },
+      sm: { span: 5 },
+    },
+    wrapperCol: {
+      xs: { span: 24 },
+      sm: { span: 12 },
+    },
+  };
+  const handleTableChange = (pagination, filters, sorter) => {
+    setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
+  };
+
+  return (
+    <Table
+      {...formItemLayout}
+      loading={loading}
+      pagination={{ position: "top", defaultPageSize: pageLimit }}
+      columns={columns}
+      rowKey="id"
+      dataSource={data}
+      onChange={handleTableChange}
+    />
+  );
+}

client/src/components/bill-cm-returns-table/bill-cm-returns-table.component.jsx

@@ -0,0 +1,135 @@
+import { Checkbox, Form, Skeleton, Typography } from "antd";
+import React, { useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import ReadOnlyFormItemComponent from "../form-items-formatted/read-only-form-item.component";
+import "./bill-cm-returns-table.styles.scss";
+export default function BillCmdReturnsTableComponent({
+  form,
+  returnLoading,
+  returnData,
+}) {
+  const { t } = useTranslation();
+
+  useEffect(() => {
+    if (returnData) {
+      form.setFieldsValue({
+        outstanding_returns: returnData.parts_order_lines,
+      });
+    }
+  }, [returnData, form]);
+
+  return (
+    <Form.Item
+      shouldUpdate={(prev, cur) =>
+        prev.jobid !== cur.jobid ||
+        prev.is_credit_memo !== cur.is_credit_memo ||
+        prev.vendorid !== cur.vendorid
+      }
+      noStyle
+    >
+      {() => {
+        const isReturn = form.getFieldValue("is_credit_memo");
+
+        if (!isReturn) {
+          return null;
+        }
+
+        if (returnLoading) return <Skeleton />;
+
+        return (
+          <Form.List name="outstanding_returns">
+            {(fields, { add, remove, move }) => {
+              return (
+                <>
+                  <Typography.Title level={4}>
+                    {t("bills.labels.creditsnotreceived")}
+                  </Typography.Title>
+                  <table className="bill-cm-returns-table">
+                    <thead>
+                      <tr>
+                        <th>{t("parts_orders.fields.line_desc")}</th>
+                        <th>{t("parts_orders.fields.part_type")}</th>
+                        <th>{t("parts_orders.fields.quantity")}</th>
+                        <th>{t("parts_orders.fields.act_price")}</th>
+                        <th>{t("parts_orders.fields.cost")}</th>
+                        <th>{t("parts_orders.labels.mark_as_received")}</th>
+                      </tr>
+                    </thead>
+                    <tbody>
+                      {fields.map((field, index) => (
+                        <tr key={field.key}>
+                          <td>
+                            <Form.Item
+                              //   label={t("joblines.fields.line_desc")}
+                              key={`${index}line_desc`}
+                              name={[field.name, "line_desc"]}
+                            >
+                              <ReadOnlyFormItemComponent />
+                            </Form.Item>
+                          </td>
+
+                          <td>
+                            <Form.Item
+                              span={2}
+                              //label={t("joblines.fields.mod_lb_hrs")}
+                              key={`${index}part_type`}
+                              name={[field.name, "part_type"]}
+                            >
+                              <ReadOnlyFormItemComponent />
+                            </Form.Item>
+                          </td>
+                          <td>
+                            <Form.Item
+                              span={2}
+                              //label={t("joblines.fields.mod_lb_hrs")}
+                              key={`${index}quantity`}
+                              name={[field.name, "quantity"]}
+                            >
+                              <ReadOnlyFormItemComponent />
+                            </Form.Item>
+                          </td>
+                          <td>
+                            <Form.Item
+                              span={2}
+                              //label={t("joblines.fields.mod_lb_hrs")}
+                              key={`${index}act_price`}
+                              name={[field.name, "act_price"]}
+                            >
+                              <ReadOnlyFormItemComponent type="currency" />
+                            </Form.Item>
+                          </td>
+                          <td>
+                            <Form.Item
+                              span={2}
+                              //label={t("joblines.fields.mod_lb_hrs")}
+                              key={`${index}cost`}
+                              name={[field.name, "cost"]}
+                            >
+                              <ReadOnlyFormItemComponent type="currency" />
+                            </Form.Item>
+                          </td>
+
+                          <td>
+                            <Form.Item
+                              span={2}
+                              //label={t("joblines.fields.mod_lb_hrs")}
+                              key={`${index}cm_received`}
+                              name={[field.name, "cm_received"]}
+                              valuePropName="checked"
+                            >
+                              <Checkbox />
+                            </Form.Item>
+                          </td>
+                        </tr>
+                      ))}
+                    </tbody>
+                  </table>
+                </>
+              );
+            }}
+          </Form.List>
+        );
+      }}
+    </Form.Item>
+  );
+}

client/src/components/bill-cm-returns-table/bill-cm-returns-table.styles.scss

@@ -0,0 +1,19 @@
+.bill-cm-returns-table {
+    table-layout: fixed;
+    width: 100%;
+
+    th,
+    td {
+        padding: 8px;
+        text-align: left;
+        border-bottom: 1px solid #ddd;
+
+        .ant-form-item {
+            margin-bottom: 0px !important;
+        }
+    }
+
+    tr:hover {
+        background-color: #f5f5f5;
+    }
+}

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

@@ -3,10 +3,22 @@ import { useMutation } from "@apollo/client";
 import { Button, notification, Popconfirm } from "antd";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
 import { DELETE_BILL } from "../../graphql/bills.queries";
+import { insertAuditTrail } from "../../redux/application/application.actions";
+import AuditTrailMapping from "../../utils/AuditTrailMappings";
 import RbacWrapper from "../rbac-wrapper/rbac-wrapper.component";
 
-export default function BillDeleteButton({ bill }) {
+const mapStateToProps = createStructuredSelector({});
+const mapDispatchToProps = (dispatch) => ({
+  insertAuditTrail: ({ jobid, operation, type }) =>
+    dispatch(insertAuditTrail({ jobid, operation, type })),
+});
+
+export default connect(mapStateToProps, mapDispatchToProps)(BillDeleteButton);
+
+export function BillDeleteButton({ bill, jobid, callback, insertAuditTrail }) {
   const [loading, setLoading] = useState(false);
   const { t } = useTranslation();
   const [deleteBill] = useMutation(DELETE_BILL);
@@ -15,7 +27,8 @@ export default function BillDeleteButton({ bill }) {
     setLoading(true);
     const result = await deleteBill({
       variables: { billId: bill.id },
-      update(cache) {
+      update(cache, { errors }) {
+        if (errors) return;
         cache.modify({
           fields: {
             bills(existingBills, { readField }) {
@@ -35,12 +48,30 @@ export default function BillDeleteButton({ bill }) {
 
     if (!!!result.errors) {
       notification["success"]({ message: t("bills.successes.deleted") });
-    } else {
-      notification["error"]({
-        message: t("bills.errors.deleting", {
-          error: JSON.stringify(result.errors),
-        }),
+      insertAuditTrail({
+        jobid: jobid,
+        operation: AuditTrailMapping.billdeleted(bill.invoice_number),
+        type: "billdeleted",
       });
+
+      if (callback && typeof callback === "function") callback(bill.id);
+    } else {
+      //Check if it's an fkey violation.
+      const error = JSON.stringify(result.errors);
+
+      if (error.toLowerCase().includes("inventory_billid_fkey")) {
+        notification["error"]({
+          message: t("bills.errors.deleting", {
+            error: t("bills.errors.existinginventoryline"),
+          }),
+        });
+      } else {
+        notification["error"]({
+          message: t("bills.errors.deleting", {
+            error: JSON.stringify(result.errors),
+          }),
+        });
+      }
     }
 
     setLoading(false);

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

@@ -0,0 +1,253 @@
+import { useMutation, useQuery } from "@apollo/client";
+import { Button, Divider, Form, PageHeader, Popconfirm, Space } from "antd";
+import moment from "moment";
+import queryString from "query-string";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { useLocation } from "react-router-dom";
+import { createStructuredSelector } from "reselect";
+import {
+  DELETE_BILL_LINE,
+  INSERT_NEW_BILL_LINES,
+  UPDATE_BILL_LINE,
+} from "../../graphql/bill-lines.queries";
+import { QUERY_BILL_BY_PK, UPDATE_BILL } from "../../graphql/bills.queries";
+import { insertAuditTrail } from "../../redux/application/application.actions";
+import { setModalContext } from "../../redux/modals/modals.actions";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import AuditTrailMapping from "../../utils/AuditTrailMappings";
+import AlertComponent from "../alert/alert.component";
+import BillFormContainer from "../bill-form/bill-form.container";
+import BillMarkExportedButton from "../bill-mark-exported-button/bill-mark-exported-button.component";
+import BillPrintButton from "../bill-print-button/bill-print-button.component";
+import BillReeportButtonComponent from "../bill-reexport-button/bill-reexport-button.component";
+import JobDocumentsGallery from "../jobs-documents-gallery/jobs-documents-gallery.container";
+import JobsDocumentsLocalGallery from "../jobs-documents-local-gallery/jobs-documents-local-gallery.container";
+import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
+import BillDetailEditReturn from "./bill-detail-edit-return.component";
+
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop,
+});
+const mapDispatchToProps = (dispatch) => ({
+  setPartsOrderContext: (context) =>
+    dispatch(setModalContext({ context: context, modal: "partsOrder" })),
+  insertAuditTrail: ({ jobid, operation, type }) =>
+    dispatch(insertAuditTrail({ jobid, operation, type })),
+});
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(BillDetailEditcontainer);
+
+export function BillDetailEditcontainer({
+  setPartsOrderContext,
+  insertAuditTrail,
+  bodyshop,
+}) {
+  const search = queryString.parse(useLocation().search);
+
+  const { t } = useTranslation();
+  const [form] = Form.useForm();
+  const [visible, setVisible] = useState(false);
+  const [updateLoading, setUpdateLoading] = useState(false);
+  const [update_bill] = useMutation(UPDATE_BILL);
+  const [insertBillLine] = useMutation(INSERT_NEW_BILL_LINES);
+  const [updateBillLine] = useMutation(UPDATE_BILL_LINE);
+  const [deleteBillLine] = useMutation(DELETE_BILL_LINE);
+
+  const { loading, error, data, refetch } = useQuery(QUERY_BILL_BY_PK, {
+    variables: { billid: search.billid },
+    skip: !!!search.billid,
+    fetchPolicy: "network-only",
+    nextFetchPolicy: "network-only",
+  });
+
+  const handleSave = () => {
+    //It's got a previously deducted bill line!
+    if (
+      data.bills_by_pk.billlines.filter((b) => b.deductedfromlbr).length > 0 ||
+      form.getFieldValue("billlines").filter((b) => b.deductedfromlbr).length >
+        0
+    )
+      setVisible(true);
+    else {
+      form.submit();
+    }
+  };
+
+  const handleFinish = async (values) => {
+    setUpdateLoading(true);
+    //let adjustmentsToInsert = {};
+
+    const { billlines, upload, ...bill } = values;
+    const updates = [];
+    updates.push(
+      update_bill({
+        variables: { billId: search.billid, bill: bill },
+      })
+    );
+
+    billlines.forEach((l) => {
+      delete l.selected;
+    });
+
+    //Find bill lines that were deleted.
+    const deletedJobLines = [];
+
+    data.bills_by_pk.billlines.forEach((a) => {
+      const matchingRecord = billlines.find((b) => b.id === a.id);
+      if (!matchingRecord) {
+        deletedJobLines.push(a);
+      }
+    });
+
+    deletedJobLines.forEach((d) => {
+      updates.push(deleteBillLine({ variables: { id: d.id } }));
+    });
+
+    billlines.forEach((billline) => {
+      const { deductedfromlbr, inventories, jobline, ...il } = billline;
+      delete il.__typename;
+
+      if (il.id) {
+        updates.push(
+          updateBillLine({
+            variables: {
+              billLineId: il.id,
+              billLine: {
+                ...il,
+                deductedfromlbr: deductedfromlbr,
+                joblineid: il.joblineid === "noline" ? null : il.joblineid,
+              },
+            },
+          })
+        );
+      } else {
+        //It's a new line, have to insert it.
+        updates.push(
+          insertBillLine({
+            variables: {
+              billLines: [
+                {
+                  ...il,
+                  deductedfromlbr: deductedfromlbr,
+                  billid: search.billid,
+                  joblineid: il.joblineid === "noline" ? null : il.joblineid,
+                },
+              ],
+            },
+          })
+        );
+      }
+    });
+
+    await Promise.all(updates);
+
+    insertAuditTrail({
+      jobid: bill.jobid,
+      billid: search.billid,
+      operation: AuditTrailMapping.billupdated(bill.invoice_number),
+      type: "billupdated",
+    });
+
+    await refetch();
+    form.setFieldsValue(transformData(data));
+    form.resetFields();
+    setVisible(false);
+    setUpdateLoading(false);
+  };
+
+  if (error) return <AlertComponent message={error.message} type="error" />;
+  if (!search.billid) return <></>; //<div>{t("bills.labels.noneselected")}</div>;
+
+  const exported = data && data.bills_by_pk && data.bills_by_pk.exported;
+
+  return (
+    <>
+      {loading && <LoadingSkeleton />}
+      {data && (
+        <>
+          <PageHeader
+            title={
+              data &&
+              `${data.bills_by_pk.invoice_number} - ${data.bills_by_pk.vendor.name}`
+            }
+            extra={
+              <Space>
+                <BillDetailEditReturn data={data} />
+                <BillPrintButton billid={search.billid} />
+                <Popconfirm
+                  visible={visible}
+                  onConfirm={() => form.submit()}
+                  onCancel={() => setVisible(false)}
+                  okButtonProps={{ loading: updateLoading }}
+                  title={t("bills.labels.editadjwarning")}
+                >
+                  <Button
+                    htmlType="submit"
+                    disabled={exported}
+                    onClick={handleSave}
+                    loading={updateLoading}
+                    type="primary"
+                  >
+                    {t("general.actions.save")}
+                  </Button>
+                </Popconfirm>
+                <BillReeportButtonComponent bill={data && data.bills_by_pk} />
+                <BillMarkExportedButton bill={data && data.bills_by_pk} />
+              </Space>
+            }
+          />
+          <Form
+            form={form}
+            onFinish={handleFinish}
+            initialValues={transformData(data)}
+            layout="vertical"
+          >
+            <BillFormContainer form={form} billEdit disabled={exported} />
+            <Divider orientation="left">{t("general.labels.media")}</Divider>
+            {bodyshop.uselocalmediaserver ? (
+              <JobsDocumentsLocalGallery
+                job={{ id: data ? data.bills_by_pk.jobid : null }}
+                invoice_number={data ? data.bills_by_pk.invoice_number : null}
+                vendorid={data ? data.bills_by_pk.vendorid : null}
+              />
+            ) : (
+              <JobDocumentsGallery
+                jobId={data ? data.bills_by_pk.jobid : null}
+                billId={search.billid}
+                documentsList={data ? data.bills_by_pk.documents : []}
+                billsCallback={refetch}
+              />
+            )}
+          </Form>
+        </>
+      )}
+    </>
+  );
+}
+
+const transformData = (data) => {
+  return data
+    ? {
+        ...data.bills_by_pk,
+
+        billlines: data.bills_by_pk.billlines.map((i) => {
+          return {
+            ...i,
+            joblineid: !!i.joblineid ? i.joblineid : "noline",
+            applicable_taxes: {
+              federal:
+                (i.applicable_taxes && i.applicable_taxes.federal) || false,
+              state: (i.applicable_taxes && i.applicable_taxes.state) || false,
+              local: (i.applicable_taxes && i.applicable_taxes.local) || false,
+            },
+          };
+        }),
+        date: data.bills_by_pk ? moment(data.bills_by_pk.date) : null,
+      }
+    : {};
+};

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

@@ -0,0 +1,190 @@
+import { Button, Checkbox, Form, Modal } from "antd";
+import queryString from "query-string";
+import React, { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { useHistory, useLocation } from "react-router-dom";
+import { createStructuredSelector } from "reselect";
+import { insertAuditTrail } from "../../redux/application/application.actions";
+import { setModalContext } from "../../redux/modals/modals.actions";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import ReadOnlyFormItemComponent from "../form-items-formatted/read-only-form-item.component";
+
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop,
+});
+const mapDispatchToProps = (dispatch) => ({
+  setPartsOrderContext: (context) =>
+    dispatch(setModalContext({ context: context, modal: "partsOrder" })),
+  insertAuditTrail: ({ jobid, operation, type }) =>
+    dispatch(insertAuditTrail({ jobid, operation, type })),
+});
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(BillDetailEditReturn);
+
+export function BillDetailEditReturn({
+  setPartsOrderContext,
+  insertAuditTrail,
+  bodyshop,
+  data,
+  disabled,
+}) {
+  const search = queryString.parse(useLocation().search);
+  const history = useHistory();
+  const { t } = useTranslation();
+  const [form] = Form.useForm();
+  const [visible, setVisible] = useState(false);
+
+  const handleFinish = ({ billlines }) => {
+    const selectedLines = billlines.filter((l) => l.selected).map((l) => l.id);
+
+    setPartsOrderContext({
+      actions: {},
+      context: {
+        jobId: data.bills_by_pk.jobid,
+        job: data.bills_by_pk.job,
+        vendorId: data.bills_by_pk.vendorid,
+        returnFromBill: data.bills_by_pk.id,
+        invoiceNumber: data.bills_by_pk.invoice_number,
+        linesToOrder: data.bills_by_pk.billlines
+          .filter((l) => selectedLines.includes(l.id))
+          .map((i) => {
+            return {
+              line_desc: i.line_desc,
+              //  db_price: i.actual_price,
+              act_price: i.actual_price,
+              cost: i.actual_cost,
+              quantity: i.quantity,
+              joblineid: i.joblineid,
+              oem_partno: i.jobline && i.jobline.oem_partno,
+              part_type: i.jobline && i.jobline.part_type,
+            };
+          }),
+        isReturn: true,
+      },
+    });
+    delete search.billid;
+
+    history.push({ search: queryString.stringify(search) });
+    setVisible(false);
+  };
+  useEffect(() => {
+    if (visible === false) form.resetFields();
+  }, [visible, form]);
+
+  return (
+    <>
+      <Modal
+        visible={visible}
+        onCancel={() => setVisible(false)}
+        destroyOnClose
+        title={t("bills.actions.return")}
+        onOk={() => form.submit()}
+      >
+        <Form
+          initialValues={data && data.bills_by_pk}
+          onFinish={handleFinish}
+          form={form}
+        >
+          <Form.List name={["billlines"]}>
+            {(fields, { add, remove, move }) => {
+              return (
+                <table style={{ tableLayout: "auto", width: "100%" }}>
+                  <thead>
+                    <tr>
+                      <td>
+                        <Checkbox
+                          onChange={(e) => {
+                            form.setFieldsValue({
+                              billlines: form
+                                .getFieldsValue()
+                                .billlines.map((b) => ({
+                                  ...b,
+                                  selected: e.target.checked,
+                                })),
+                            });
+                          }}
+                        />
+                      </td>
+                      <td>{t("billlines.fields.line_desc")}</td>
+                      <td>{t("billlines.fields.quantity")}</td>
+                      <td>{t("billlines.fields.actual_price")}</td>
+                      <td>{t("billlines.fields.actual_cost")}</td>
+                    </tr>
+                  </thead>
+                  <tbody>
+                    {fields.map((field, index) => (
+                      <tr key={field.key}>
+                        <td>
+                          <Form.Item
+                            //   label={t("joblines.fields.selected")}
+                            key={`${index}selected`}
+                            name={[field.name, "selected"]}
+                            valuePropName="checked"
+                          >
+                            <Checkbox />
+                          </Form.Item>
+                        </td>
+                        <td>
+                          <Form.Item
+                            //   label={t("joblines.fields.line_desc")}
+                            key={`${index}line_desc`}
+                            name={[field.name, "line_desc"]}
+                          >
+                            <ReadOnlyFormItemComponent />
+                          </Form.Item>
+                        </td>
+                        <td>
+                          <Form.Item
+                            //   label={t("joblines.fields.quantity")}
+                            key={`${index}quantity`}
+                            name={[field.name, "quantity"]}
+                          >
+                            <ReadOnlyFormItemComponent />
+                          </Form.Item>
+                        </td>
+                        <td>
+                          <Form.Item
+                            //   label={t("joblines.fields.actual_price")}
+                            key={`${index}actual_price`}
+                            name={[field.name, "actual_price"]}
+                          >
+                            <ReadOnlyFormItemComponent type="currency" />
+                          </Form.Item>
+                        </td>
+                        <td>
+                          <Form.Item
+                            //   label={t("joblines.fields.actual_cost")}
+                            key={`${index}actual_cost`}
+                            name={[field.name, "actual_cost"]}
+                          >
+                            <ReadOnlyFormItemComponent type="currency" />
+                          </Form.Item>
+                        </td>
+                      </tr>
+                    ))}
+                  </tbody>
+                </table>
+              );
+            }}
+          </Form.List>
+        </Form>
+      </Modal>
+      <Button
+        disabled={
+          data.bills_by_pk.is_credit_memo ||
+          data.bills_by_pk.isinhouse ||
+          disabled
+        }
+        onClick={() => {
+          setVisible(true);
+        }}
+      >
+        {t("bills.actions.return")}
+      </Button>
+    </>
+  );
+}

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

@@ -1,65 +1,12 @@
-import { useMutation, useQuery } from "@apollo/client";
-import {
-  Button,
-  Drawer,
-  Form,
-  Grid,
-  PageHeader,
-  Popconfirm,
-  Space,
-} from "antd";
-import moment from "moment";
+import { Drawer, Grid } from "antd";
 import queryString from "query-string";
-import React, { useEffect, useState } from "react";
-import { useTranslation } from "react-i18next";
-import { useLocation, useHistory } from "react-router-dom";
-import {
-  DELETE_BILL_LINE,
-  INSERT_NEW_BILL_LINES,
-  UPDATE_BILL_LINE,
-} from "../../graphql/bill-lines.queries";
-import { QUERY_BILL_BY_PK, UPDATE_BILL } from "../../graphql/bills.queries";
-import AlertComponent from "../alert/alert.component";
-import BillFormContainer from "../bill-form/bill-form.container";
-import JobDocumentsGallery from "../jobs-documents-gallery/jobs-documents-gallery.container";
-import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
-import BillReeportButtonComponent from "../bill-reexport-button/bill-reexport-button.component";
-import { connect } from "react-redux";
-import { createStructuredSelector } from "reselect";
-import { setModalContext } from "../../redux/modals/modals.actions";
-import { insertAuditTrail } from "../../redux/application/application.actions";
-import AuditTrailMapping from "../../utils/AuditTrailMappings";
-import BillMarkExportedButton from "../bill-mark-exported-button/bill-mark-exported-button.component";
+import React from "react";
+import { useHistory, useLocation } from "react-router-dom";
+import BillDetailEditComponent from "./bill-detail-edit-component";
 
-const mapStateToProps = createStructuredSelector({
-  //currentUser: selectCurrentUser
-});
-const mapDispatchToProps = (dispatch) => ({
-  setPartsOrderContext: (context) =>
-    dispatch(setModalContext({ context: context, modal: "partsOrder" })),
-  insertAuditTrail: ({ jobid, operation }) =>
-    dispatch(insertAuditTrail({ jobid, operation })),
-});
-
-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(BillDetailEditcontainer);
-
-export function BillDetailEditcontainer({
-  setPartsOrderContext,
-  insertAuditTrail,
-}) {
+export default function BillDetailEditcontainer() {
   const search = queryString.parse(useLocation().search);
   const history = useHistory();
-  const { t } = useTranslation();
-  const [form] = Form.useForm();
-  const [visible, setVisible] = useState(false);
-  const [updateLoading, setUpdateLoading] = useState(false);
-  const [update_bill] = useMutation(UPDATE_BILL);
-  const [insertBillLine] = useMutation(INSERT_NEW_BILL_LINES);
-  const [updateBillLine] = useMutation(UPDATE_BILL_LINE);
-  const [deleteBillLine] = useMutation(DELETE_BILL_LINE);
 
   const selectedBreakpoint = Object.entries(Grid.useBreakpoint())
     .filter((screen) => !!screen[1])
@@ -70,121 +17,13 @@ export function BillDetailEditcontainer({
     sm: "100%",
     md: "100%",
     lg: "100%",
-    xl: "80%",
-    xxl: "80%",
+    xl: "90%",
+    xxl: "90%",
   };
   const drawerPercentage = selectedBreakpoint
     ? bpoints[selectedBreakpoint[0]]
     : "100%";
 
-  const { loading, error, data, refetch } = useQuery(QUERY_BILL_BY_PK, {
-    variables: { billid: search.billid },
-    skip: !!!search.billid,
-    fetchPolicy: "network-only",
-    nextFetchPolicy: "network-only",
-  });
-
-  const handleSave = () => {
-    //It's got a previously deducted bill line!
-    if (
-      data.bills_by_pk.billlines.filter((b) => b.deductedfromlbr).length > 0 ||
-      form.getFieldValue("billlines").filter((b) => b.deductedfromlbr).length >
-        0
-    )
-      setVisible(true);
-    else {
-      form.submit();
-    }
-  };
-
-  const handleFinish = async (values) => {
-    setUpdateLoading(true);
-    //let adjustmentsToInsert = {};
-
-    const { billlines, upload, ...bill } = values;
-    const updates = [];
-    updates.push(
-      update_bill({
-        variables: { billId: search.billid, bill: bill },
-      })
-    );
-
-    //Find bill lines that were deleted.
-    const deletedJobLines = [];
-
-    data.bills_by_pk.billlines.forEach((a) => {
-      const matchingRecord = billlines.find((b) => b.id === a.id);
-      if (!matchingRecord) {
-        deletedJobLines.push(a);
-      }
-    });
-
-    deletedJobLines.forEach((d) => {
-      updates.push(deleteBillLine({ variables: { id: d.id } }));
-    });
-
-    billlines.forEach((billline) => {
-      const { deductedfromlbr, jobline, ...il } = billline;
-      delete il.__typename;
-
-      if (il.id) {
-        updates.push(
-          updateBillLine({
-            variables: {
-              billLineId: il.id,
-              billLine: {
-                ...il,
-                deductedfromlbr: deductedfromlbr,
-                joblineid: il.joblineid === "noline" ? null : il.joblineid,
-              },
-            },
-          })
-        );
-      } else {
-        //It's a new line, have to insert it.
-        updates.push(
-          insertBillLine({
-            variables: {
-              billLines: [
-                {
-                  ...il,
-                  deductedfromlbr: deductedfromlbr,
-                  billid: search.billid,
-                  joblineid: il.joblineid === "noline" ? null : il.joblineid,
-                },
-              ],
-            },
-          })
-        );
-      }
-    });
-
-    await Promise.all(updates);
-
-    insertAuditTrail({
-      jobid: bill.jobid,
-      billid: search.billid,
-      operation: AuditTrailMapping.billupdated(bill.invoice_number),
-    });
-
-    await refetch();
-    form.setFieldsValue(transformData(data));
-    form.resetFields();
-    setVisible(false);
-    setUpdateLoading(false);
-  };
-
-  useEffect(() => {
-    if (search.billid && data) {
-      form.resetFields();
-    }
-  }, [form, search.billid, data]);
-
-  if (error) return <AlertComponent message={error.message} type="error" />;
-  if (!search.billid) return <></>; //<div>{t("bills.labels.noneselected")}</div>;
-
-  const exported = data && data.bills_by_pk && data.bills_by_pk.exported;
-
   return (
     <Drawer
       width={drawerPercentage}
@@ -192,110 +31,10 @@ export function BillDetailEditcontainer({
         delete search.billid;
         history.push({ search: queryString.stringify(search) });
       }}
+      destroyOnClose
       visible={search.billid}
     >
-      {loading && <LoadingSkeleton />}
-      {!loading && (
-        <>
-          <PageHeader
-            title={
-              data &&
-              `${data.bills_by_pk.invoice_number} - ${data.bills_by_pk.vendor.name}`
-            }
-            extra={
-              <Space>
-                <Button
-                  disabled={data.bills_by_pk.is_credit_memo}
-                  onClick={() => {
-                    delete search.billid;
-                    history.push({ search: queryString.stringify(search) });
-                    setPartsOrderContext({
-                      actions: {},
-                      context: {
-                        jobId: data.bills_by_pk.jobid,
-                        vendorId: data.bills_by_pk.vendorid,
-                        returnFromBill: data.bills_by_pk.id,
-                        invoiceNumber: data.bills_by_pk.invoice_number,
-                        linesToOrder: data.bills_by_pk.billlines.map((i) => {
-                          return {
-                            line_desc: i.line_desc,
-                            //  db_price: i.actual_price,
-                            act_price: i.actual_price,
-                            cost: i.actual_cost,
-                            quantity: i.quantity,
-                            joblineid: i.joblineid,
-                            oem_partno: i.jobline && i.jobline.oem_partno,
-                            part_type: i.jobline && i.jobline.part_type,
-                          };
-                        }),
-                        isReturn: true,
-                      },
-                    });
-                  }}
-                >
-                  {t("bills.actions.return")}
-                </Button>
-
-                <Popconfirm
-                  visible={visible}
-                  onConfirm={() => form.submit()}
-                  onCancel={() => setVisible(false)}
-                  okButtonProps={{ loading: updateLoading }}
-                  title={t("bills.labels.editadjwarning")}
-                >
-                  <Button
-                    htmlType="submit"
-                    disabled={exported}
-                    onClick={handleSave}
-                    loading={updateLoading}
-                    type="primary"
-                  >
-                    {t("general.actions.save")}
-                  </Button>
-                </Popconfirm>
-                <BillReeportButtonComponent bill={data && data.bills_by_pk} />
-                <BillMarkExportedButton bill={data && data.bills_by_pk} />
-              </Space>
-            }
-          />
-          <Form
-            form={form}
-            onFinish={handleFinish}
-            initialValues={transformData(data)}
-            layout="vertical"
-          >
-            <BillFormContainer form={form} billEdit disabled={exported} />
-            <JobDocumentsGallery
-              jobId={data ? data.bills_by_pk.jobid : null}
-              billId={search.billid}
-              documentsList={data ? data.bills_by_pk.documents : []}
-              billsCallback={refetch}
-            />
-          </Form>
-        </>
-      )}
+      <BillDetailEditComponent />
     </Drawer>
   );
 }
-
-const transformData = (data) => {
-  return data
-    ? {
-        ...data.bills_by_pk,
-
-        billlines: data.bills_by_pk.billlines.map((i) => {
-          return {
-            ...i,
-            joblineid: !!i.joblineid ? i.joblineid : "noline",
-            applicable_taxes: {
-              federal:
-                (i.applicable_taxes && i.applicable_taxes.federal) || false,
-              state: (i.applicable_taxes && i.applicable_taxes.state) || false,
-              local: (i.applicable_taxes && i.applicable_taxes.local) || false,
-            },
-          };
-        }),
-        date: data.bills_by_pk ? moment(data.bills_by_pk.date) : null,
-      }
-    : {};
-};

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

@@ -1,16 +1,18 @@
 import { useApolloClient, useMutation } from "@apollo/client";
-import { Button, Form, Modal, notification, Space } from "antd";
+import { Button, Checkbox, Form, Modal, Space, notification } from "antd";
 import _ from "lodash";
-import React, { useEffect, useState, useMemo } from "react";
+import React, { useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { INSERT_NEW_BILL } from "../../graphql/bills.queries";
+import { UPDATE_INVENTORY_LINES } from "../../graphql/inventory.queries";
 import { UPDATE_JOB_LINE } from "../../graphql/jobs-lines.queries";
 import {
   QUERY_JOB_LBR_ADJUSTMENTS,
   UPDATE_JOB,
 } from "../../graphql/jobs.queries";
+import { MUTATION_MARK_RETURN_RECEIVED } from "../../graphql/parts-orders.queries";
 import { insertAuditTrail } from "../../redux/application/application.actions";
 import { toggleModalVisible } from "../../redux/modals/modals.actions";
 import { selectBillEnterModal } from "../../redux/modals/modals.selectors";
@@ -18,10 +20,14 @@ import {
   selectBodyshop,
   selectCurrentUser,
 } from "../../redux/user/user.selectors";
-import confirmDialog from "../../utils/asyncConfirm";
 import AuditTrailMapping from "../../utils/AuditTrailMappings";
+import { GenerateDocument } from "../../utils/RenderTemplate";
+import { TemplateList } from "../../utils/TemplateConstants";
+import confirmDialog from "../../utils/asyncConfirm";
+import useLocalStorage from "../../utils/useLocalStorage";
 import BillFormContainer from "../bill-form/bill-form.container";
 import { CalculateBillTotal } from "../bill-form/bill-form.totals.utility";
+import { handleUpload as handleLocalUpload } from "../documents-local-upload/documents-local-upload.utility";
 import { handleUpload } from "../documents-upload/documents-upload.utility";
 
 const mapStateToProps = createStructuredSelector({
@@ -31,10 +37,12 @@ const mapStateToProps = createStructuredSelector({
 });
 const mapDispatchToProps = (dispatch) => ({
   toggleModalVisible: () => dispatch(toggleModalVisible("billEnter")),
-  insertAuditTrail: ({ jobid, operation }) =>
-    dispatch(insertAuditTrail({ jobid, operation })),
+  insertAuditTrail: ({ jobid, billid, operation, type }) =>
+    dispatch(insertAuditTrail({ jobid, billid, operation, type })),
 });
 
+const Templates = TemplateList("job_special");
+
 function BillEnterModalContainer({
   billEnterModal,
   toggleModalVisible,
@@ -47,9 +55,14 @@ function BillEnterModalContainer({
   const [enterAgain, setEnterAgain] = useState(false);
   const [insertBill] = useMutation(INSERT_NEW_BILL);
   const [updateJobLines] = useMutation(UPDATE_JOB_LINE);
+  const [updatePartsOrderLines] = useMutation(MUTATION_MARK_RETURN_RECEIVED);
+  const [updateInventoryLines] = useMutation(UPDATE_INVENTORY_LINES);
   const [loading, setLoading] = useState(false);
   const client = useApolloClient();
-
+  const [generateLabel, setGenerateLabel] = useLocalStorage(
+    "enter_bill_generate_label",
+    false
+  );
   const formValues = useMemo(() => {
     return {
       ...billEnterModal.context.bill,
@@ -76,7 +89,14 @@ function BillEnterModalContainer({
     }
 
     setLoading(true);
-    const { upload, location, ...remainingValues } = values;
+    const {
+      upload,
+      location,
+      outstanding_returns,
+      inventory,
+      federal_tax_exempt,
+      ...remainingValues
+    } = values;
 
     let adjustmentsToInsert = {};
 
@@ -107,13 +127,24 @@ function BillEnterModalContainer({
                     deductedfromlbr: deductedfromlbr,
                     lbr_adjustment,
                     joblineid: i.joblineid === "noline" ? null : i.joblineid,
+                    applicable_taxes: {
+                      federal:
+                        (i.applicable_taxes && i.applicable_taxes.federal) ||
+                        false,
+                      state:
+                        (i.applicable_taxes && i.applicable_taxes.state) ||
+                        false,
+                      local:
+                        (i.applicable_taxes && i.applicable_taxes.local) ||
+                        false,
+                    },
                   };
                 }),
             },
           },
         ],
       },
-      refetchQueries: ["QUERY_PARTS_BILLS_BY_JOBID"],
+      refetchQueries: ["QUERY_PARTS_BILLS_BY_JOBID", "GET_JOB_BY_PK"],
     });
 
     const adjKeys = Object.keys(adjustmentsToInsert);
@@ -133,6 +164,15 @@ function BillEnterModalContainer({
       adjKeys.forEach((key) => {
         newAdjustments[key] =
           (newAdjustments[key] || 0) + adjustmentsToInsert[key];
+
+        insertAuditTrail({
+          jobid: values.jobid,
+          operation: AuditTrailMapping.jobmodifylbradj({
+            mod_lbr_ty: key,
+            hours: adjustmentsToInsert[key].toFixed(1),
+          }),
+          type: "jobmodifylbradj",
+        });
       });
 
       const jobUpdate = client.mutate({
@@ -150,10 +190,25 @@ function BillEnterModalContainer({
         });
         return;
       }
-      insertAuditTrail({
-        jobid: values.jobid,
-        operation: AuditTrailMapping.jobmodifylbradj(),
+    }
+
+    const markPolReceived =
+      outstanding_returns &&
+      outstanding_returns.filter((o) => o.cm_received === true);
+
+    if (markPolReceived && markPolReceived.length > 0) {
+      const r2 = await updatePartsOrderLines({
+        variables: { partsLineIds: markPolReceived.map((p) => p.id) },
       });
+      if (!!r2.errors) {
+        setLoading(false);
+        setEnterAgain(false);
+        notification["error"]({
+          message: t("parts_orders.errors.updating", {
+            message: JSON.stringify(r2.errors),
+          }),
+        });
+      }
     }
 
     if (!!r1.errors) {
@@ -167,52 +222,106 @@ function BillEnterModalContainer({
     }
 
     const billId = r1.data.insert_bills.returning[0].id;
+    const markInventoryConsumed =
+      inventory && inventory.filter((i) => i.consumefrominventory);
 
-    await Promise.all(
-      remainingValues.billlines
-        .filter((il) => il.joblineid !== "noline")
-        .map((li) => {
-          return updateJobLines({
-            variables: {
-              lineId: li.joblineid,
-              line: {
-                location: li.location || location,
-                status:
-                  bodyshop.md_order_statuses.default_received || "Received*",
+    if (markInventoryConsumed && markInventoryConsumed.length > 0) {
+      const r2 = await updateInventoryLines({
+        variables: {
+          InventoryIds: markInventoryConsumed.map((p) => p.id),
+          consumedbybillid: billId,
+        },
+      });
+      if (!!r2.errors) {
+        setLoading(false);
+        setEnterAgain(false);
+        notification["error"]({
+          message: t("inventory.errors.updating", {
+            message: JSON.stringify(r2.errors),
+          }),
+        });
+      }
+    }
+    //If it's not a credit memo, update the statuses.
+
+    if (!values.is_credit_memo) {
+      await Promise.all(
+        remainingValues.billlines
+          .filter((il) => il.joblineid !== "noline")
+          .map((li) => {
+            return updateJobLines({
+              variables: {
+                lineId: li.joblineid,
+                line: {
+                  location: li.location || location,
+                  status:
+                    bodyshop.md_order_statuses.default_received || "Received*",
+                },
               },
-            },
-          });
-        })
-    );
+            });
+          })
+      );
+    }
 
     /////////////////////////
     if (upload && upload.length > 0) {
       //insert Each of the documents?
-      upload.forEach((u) => {
-        handleUpload(
-          { file: u.originFileObj },
-          {
-            bodyshop: bodyshop,
-            uploaded_by: currentUser.email,
-            jobId: values.jobid,
-            billId: billId,
-            tagsArray: null,
-            callback: null,
-          }
-        );
-      });
+
+      if (bodyshop.uselocalmediaserver) {
+        upload.forEach((u) => {
+          handleLocalUpload({
+            ev: { file: u.originFileObj },
+            context: {
+              jobid: values.jobid,
+              invoice_number: remainingValues.invoice_number,
+              vendorid: remainingValues.vendorid,
+            },
+          });
+        });
+      } else {
+        upload.forEach((u) => {
+          handleUpload(
+            { file: u.originFileObj },
+            {
+              bodyshop: bodyshop,
+              uploaded_by: currentUser.email,
+              jobId: values.jobid,
+              billId: billId,
+              tagsArray: null,
+              callback: null,
+            }
+          );
+        });
+      }
     }
     ///////////////////////////
     setLoading(false);
     notification["success"]({
       message: t("bills.successes.created"),
     });
+
+    if (generateLabel) {
+      GenerateDocument(
+        {
+          name: Templates.parts_invoice_label_single.key,
+          variables: {
+            id: billId,
+          },
+        },
+        {},
+        "p"
+      );
+    }
+
     if (billEnterModal.actions.refetch) billEnterModal.actions.refetch();
 
     insertAuditTrail({
       jobid: values.jobid,
       billid: billId,
-      operation: AuditTrailMapping.billposted(remainingValues.invoice_number),
+      operation: AuditTrailMapping.billposted(
+        r1.data.insert_bills.returning[0].invoice_number
+      ),
+      type: "billposted",
     });
 
     if (enterAgain) {
@@ -262,6 +371,12 @@ function BillEnterModalContainer({
       }}
       footer={
         <Space>
+          <Checkbox
+            checked={generateLabel}
+            onChange={(e) => setGenerateLabel(e.target.checked)}
+          >
+            {t("bills.labels.generatepartslabel")}
+          </Checkbox>
           <Button onClick={handleCancel}>{t("general.actions.cancel")}</Button>
           <Button loading={loading} onClick={() => form.submit()}>
             {t("general.actions.save")}

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

@@ -1,6 +1,6 @@
 import Icon, { UploadOutlined } from "@ant-design/icons";
 import { useApolloClient } from "@apollo/client";
-import { MdOpenInNew } from "react-icons/md";
+import { useTreatments } from "@splitsoftware/splitio-react";
 import {
   Alert,
   Divider,
@@ -12,14 +12,17 @@ import {
   Switch,
   Upload,
 } from "antd";
+import moment from "moment";
 import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
+import { MdOpenInNew } from "react-icons/md";
 import { connect } from "react-redux";
 import { Link } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
 import { CHECK_BILL_INVOICE_NUMBER } from "../../graphql/bills.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import AlertComponent from "../alert/alert.component";
+import BillFormLinesExtended from "../bill-form-lines-extended/bill-form-lines-extended.component";
 import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import FormFieldsChanged from "../form-fields-changed-alert/form-fields-changed-alert.component";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
@@ -28,8 +31,6 @@ import LayoutFormRow from "../layout-form-row/layout-form-row.component";
 import VendorSearchSelect from "../vendor-search-select/vendor-search-select.component";
 import BillFormLines from "./bill-form.lines.component";
 import { CalculateBillTotal } from "./bill-form.totals.utility";
-import { useTreatments } from "@splitsoftware/splitio-react";
-import BillFormLinesExtended from "../bill-form-lines-extended/bill-form-lines-extended.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -47,6 +48,9 @@ export function BillFormComponent({
   billEdit,
   disableInvNumber,
   job,
+  loadOutstandingReturns,
+  loadInventory,
+  preferredMake,
 }) {
   const { t } = useTranslation();
   const client = useApolloClient();
@@ -56,8 +60,37 @@ export function BillFormComponent({
     {},
     bodyshop.imexshopid
   );
+  const { ClosingPeriod } = useTreatments(
+    ["ClosingPeriod"],
+    {},
+    bodyshop.imexshopid
+  );
+
   const handleVendorSelect = (props, opt) => {
     setDiscount(opt.discount);
+
+    opt &&
+      !billEdit &&
+      loadOutstandingReturns({
+        variables: {
+          jobId: form.getFieldValue("jobid"),
+          vendorId: opt.value,
+        },
+      });
+  };
+
+  const handleFederalTaxExemptSwitchToggle = (checked) => {
+    // Early gate
+    if (!checked) return;
+    const values = form.getFieldsValue("billlines");
+    // Gate bill lines
+    if (!values?.billlines?.length) return;
+
+    const billlines = values.billlines.map((b) => {
+      b.applicable_taxes.federal = false;
+      return b;
+    });
+    form.setFieldsValue({ billlines });
   };
 
   useEffect(() => {
@@ -65,8 +98,8 @@ export function BillFormComponent({
   }, [job, form]);
 
   useEffect(() => {
-    if (form.getFieldValue("vendorid") && vendorAutoCompleteOptions) {
-      const vendorId = form.getFieldValue("vendorid");
+    const vendorId = form.getFieldValue("vendorid");
+    if (vendorId && vendorAutoCompleteOptions) {
       const matchingVendors = vendorAutoCompleteOptions.filter(
         (v) => v.id === vendorId
       );
@@ -74,10 +107,32 @@ export function BillFormComponent({
         setDiscount(matchingVendors[0].discount);
       }
     }
-    if (form.getFieldValue("jobid")) {
-      loadLines({ variables: { id: form.getFieldValue("jobid") } });
+    const jobId = form.getFieldValue("jobid");
+    if (jobId) {
+      loadLines({ variables: { id: jobId } });
+      if (form.getFieldValue("is_credit_memo") && vendorId && !billEdit) {
+        loadOutstandingReturns({
+          variables: {
+            jobId: jobId,
+            vendorId: vendorId,
+          },
+        });
+      }
     }
-  }, [form, setDiscount, vendorAutoCompleteOptions, loadLines]);
+
+    if (vendorId === bodyshop.inhousevendorid && !billEdit) {
+      loadInventory();
+    }
+  }, [
+    form,
+    billEdit,
+    loadOutstandingReturns,
+    loadInventory,
+    setDiscount,
+    vendorAutoCompleteOptions,
+    loadLines,
+    bodyshop.inhousevendorid,
+  ]);
 
   return (
     <div>
@@ -107,6 +162,14 @@ export function BillFormComponent({
             onBlur={() => {
               if (form.getFieldValue("jobid") !== null) {
                 loadLines({ variables: { id: form.getFieldValue("jobid") } });
+                if (form.getFieldValue("vendorid") !== null) {
+                  loadOutstandingReturns({
+                    variables: {
+                      jobId: form.getFieldValue("jobid"),
+                      vendorId: form.getFieldValue("vendorid"),
+                    },
+                  });
+                }
               }
             }}
           />
@@ -137,6 +200,7 @@ export function BillFormComponent({
           <VendorSearchSelect
             disabled={disabled}
             options={vendorAutoCompleteOptions}
+            preferredMake={preferredMake}
             onSelect={handleVendorSelect}
           />
         </Form.Item>
@@ -217,6 +281,37 @@ export function BillFormComponent({
               required: true,
               //message: t("general.validation.required"),
             },
+            ({ getFieldValue }) => ({
+              validator(rule, value) {
+                if (
+                  ClosingPeriod.treatment === "on" &&
+                  bodyshop.accountingconfig.ClosingPeriod
+                ) {
+                  if (
+                    moment(value)
+                      .startOf("day")
+                      .isSameOrAfter(
+                        moment(
+                          bodyshop.accountingconfig.ClosingPeriod[0]
+                        ).startOf("day")
+                      ) &&
+                    moment(value)
+                      .startOf("day")
+                      .isSameOrBefore(
+                        moment(
+                          bodyshop.accountingconfig.ClosingPeriod[1]
+                        ).endOf("day")
+                      )
+                  ) {
+                    return Promise.resolve();
+                  } else {
+                    return Promise.reject(t("bills.validation.closingperiod"));
+                  }
+                } else {
+                  return Promise.resolve();
+                }
+              },
+            }),
           ]}
         >
           <FormDatePicker disabled={disabled} />
@@ -228,8 +323,23 @@ export function BillFormComponent({
           rules={[
             ({ getFieldValue }) => ({
               validator(rule, value) {
+                if (
+                  value === true &&
+                  getFieldValue("jobid") &&
+                  getFieldValue("vendorid")
+                ) {
+                  //Removed as this would cause an additional reload when validating the form on submit and clear the values.
+                  // loadOutstandingReturns({
+                  //   variables: {
+                  //     jobId: form.getFieldValue("jobid"),
+                  //     vendorId: form.getFieldValue("vendorid"),
+                  //   },
+                  // });
+                }
+
                 if (
                   !bodyshop.bill_allow_post_to_closed &&
+                  job &&
                   (job.status === bodyshop.md_ro_statuses.default_invoiced ||
                     job.status === bodyshop.md_ro_statuses.default_exported ||
                     job.status === bodyshop.md_ro_statuses.default_void) &&
@@ -257,15 +367,17 @@ export function BillFormComponent({
         >
           <CurrencyInput min={0} disabled={disabled} />
         </Form.Item>
-        <Form.Item label={t("bills.fields.allpartslocation")} name="location">
-          <Select style={{ width: "10rem" }} disabled={disabled} allowClear>
-            {bodyshop.md_parts_locations.map((loc, idx) => (
-              <Select.Option key={idx} value={loc}>
-                {loc}
-              </Select.Option>
-            ))}
-          </Select>
-        </Form.Item>
+        {!billEdit && (
+          <Form.Item label={t("bills.fields.allpartslocation")} name="location">
+            <Select style={{ width: "10rem" }} disabled={disabled} allowClear>
+              {bodyshop.md_parts_locations.map((loc, idx) => (
+                <Select.Option key={idx} value={loc}>
+                  {loc}
+                </Select.Option>
+              ))}
+            </Select>
+          </Form.Item>
+        )}
       </LayoutFormRow>
       <LayoutFormRow>
         <Form.Item
@@ -289,7 +401,16 @@ export function BillFormComponent({
         >
           <CurrencyInput min={0} />
         </Form.Item>
-        <Form.Item shouldUpdate span={15}>
+        {bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid ? (
+          <Form.Item
+            span={2}
+            label={t("bills.labels.federal_tax_exempt")}
+            name="federal_tax_exempt"
+          >
+            <Switch onChange={handleFederalTaxExemptSwitchToggle} />
+          </Form.Item>
+        ) : null}
+        <Form.Item shouldUpdate span={13}>
           {() => {
             const values = form.getFieldsValue([
               "billlines",
@@ -307,7 +428,7 @@ export function BillFormComponent({
               totals = CalculateBillTotal(values);
             if (!!totals)
               return (
-                <div>
+                <div align="right">
                   <Space wrap>
                     <Statistic
                       title={t("bills.labels.subtotal")}
@@ -380,12 +501,14 @@ export function BillFormComponent({
           form={form}
           responsibilityCenters={responsibilityCenters}
           disabled={disabled}
+          billEdit={billEdit}
         />
       )}
-
+      <Divider orientation="left" style={{ display: billEdit ? "none" : null }}>
+        {t("documents.labels.upload")}
+      </Divider>
       <Form.Item
         name="upload"
-        label="Upload"
         style={{ display: billEdit ? "none" : null }}
         valuePropName="fileList"
         getValueFromEvent={(e) => {

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

@@ -1,10 +1,15 @@
 import { useLazyQuery, useQuery } from "@apollo/client";
+import { useTreatments } from "@splitsoftware/splitio-react";
 import React from "react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
+import { QUERY_OUTSTANDING_INVENTORY } from "../../graphql/inventory.queries";
 import { GET_JOB_LINES_TO_ENTER_BILL } from "../../graphql/jobs-lines.queries";
+import { QUERY_UNRECEIVED_LINES } from "../../graphql/parts-orders.queries";
 import { SEARCH_VENDOR_AUTOCOMPLETE } from "../../graphql/vendors.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import BillCmdReturnsTableComponent from "../bill-cm-returns-table/bill-cm-returns-table.component";
+import BillInventoryTable from "../bill-inventory-table/bill-inventory-table.component";
 import BillFormComponent from "./bill-form.component";
 
 const mapStateToProps = createStructuredSelector({
@@ -18,6 +23,12 @@ export function BillFormContainer({
   disabled,
   disableInvNumber,
 }) {
+  const { Simple_Inventory } = useTreatments(
+    ["Simple_Inventory"],
+    {},
+    bodyshop && bodyshop.imexshopid
+  );
+
   const { data: VendorAutoCompleteData } = useQuery(
     SEARCH_VENDOR_AUTOCOMPLETE,
     { fetchPolicy: "network-only", nextFetchPolicy: "network-only" }
@@ -27,20 +38,45 @@ export function BillFormContainer({
     GET_JOB_LINES_TO_ENTER_BILL
   );
 
+  const [loadOutstandingReturns, { loading: returnLoading, data: returnData }] =
+    useLazyQuery(QUERY_UNRECEIVED_LINES);
+  const [loadInventory, { loading: inventoryLoading, data: inventoryData }] =
+    useLazyQuery(QUERY_OUTSTANDING_INVENTORY);
+
   return (
-    <BillFormComponent
-      disabled={disabled}
-      form={form}
-      billEdit={billEdit}
-      vendorAutoCompleteOptions={
-        VendorAutoCompleteData && VendorAutoCompleteData.vendors
-      }
-      loadLines={loadLines}
-      lineData={lineData ? lineData.joblines : []}
-      job={lineData ? lineData.jobs_by_pk : null}
-      responsibilityCenters={bodyshop.md_responsibility_centers || null}
-      disableInvNumber={disableInvNumber}
-    />
+    <>
+      <BillFormComponent
+        disabled={disabled}
+        form={form}
+        billEdit={billEdit}
+        vendorAutoCompleteOptions={
+          VendorAutoCompleteData && VendorAutoCompleteData.vendors
+        }
+        loadLines={loadLines}
+        lineData={lineData ? lineData.joblines : []}
+        job={lineData ? lineData.jobs_by_pk : null}
+        responsibilityCenters={bodyshop.md_responsibility_centers || null}
+        disableInvNumber={disableInvNumber}
+        loadOutstandingReturns={loadOutstandingReturns}
+        loadInventory={loadInventory}
+        preferredMake={lineData ? lineData.jobs_by_pk.v_make_desc : null}
+      />
+      {!billEdit && (
+        <BillCmdReturnsTableComponent
+          form={form}
+          returnLoading={returnLoading}
+          returnData={returnData}
+        />
+      )}
+      {Simple_Inventory.treatment === "on" && (
+        <BillInventoryTable
+          form={form}
+          inventoryLoading={inventoryLoading}
+          inventoryData={billEdit ? [] : inventoryData}
+          billEdit={billEdit}
+        />
+      )}
+    </>
   );
 }
 export default connect(mapStateToProps, null)(BillFormContainer);

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

@@ -1,4 +1,5 @@
 import { DeleteFilled, DollarCircleFilled } from "@ant-design/icons";
+import { useTreatments } from "@splitsoftware/splitio-react";
 import {
   Button,
   Form,
@@ -8,7 +9,7 @@ import {
   Space,
   Switch,
   Table,
-  Tooltip
+  Tooltip,
 } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
@@ -17,6 +18,7 @@ import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import CiecaSelect from "../../utils/Ciecaselect";
 import BillLineSearchSelect from "../bill-line-search-select/bill-line-search-select.component";
+import BilllineAddInventory from "../billline-add-inventory/billline-add-inventory.component";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
 
 const mapStateToProps = createStructuredSelector({
@@ -34,10 +36,16 @@ export function BillEnterModalLinesComponent({
   discount,
   form,
   responsibilityCenters,
+  billEdit,
+  billid,
 }) {
   const { t } = useTranslation();
   const { setFieldsValue, getFieldsValue, getFieldValue } = form;
-
+  const { Simple_Inventory } = useTreatments(
+    ["Simple_Inventory"],
+    {},
+    bodyshop && bodyshop.imexshopid
+  );
   const columns = (remove) => {
     return [
       {
@@ -142,11 +150,29 @@ export function BillEnterModalLinesComponent({
                 required: true,
                 //message: t("general.validation.required"),
               },
+              ({ getFieldValue }) => ({
+                validator(rule, value) {
+                  if (
+                    value &&
+                    getFieldValue("billlines")[field.fieldKey]?.inventories
+                      ?.length > value
+                  ) {
+                    return Promise.reject(
+                      t("bills.validation.inventoryquantity", {
+                        number:
+                          getFieldValue("billlines")[field.fieldKey]
+                            ?.inventories?.length,
+                      })
+                    );
+                  }
+                  return Promise.resolve();
+                },
+              }),
             ],
           };
         },
         formInput: (record, index) => (
-          <InputNumber precision={0} min={0} disabled={disabled} />
+          <InputNumber precision={0} min={1} disabled={disabled} />
         ),
       },
       {
@@ -297,28 +323,31 @@ export function BillEnterModalLinesComponent({
           </Select>
         ),
       },
-
-      {
-        title: t("billlines.fields.location"),
-        dataIndex: "location",
-        editable: true,
-        label: t("billlines.fields.location"),
-        formItemProps: (field) => {
-          return {
-            key: `${field.index}location`,
-            name: [field.name, "location"],
-          };
-        },
-        formInput: (record, index) => (
-          <Select disabled={disabled}>
-            {bodyshop.md_parts_locations.map((loc, idx) => (
-              <Select.Option key={idx} value={loc}>
-                {loc}
-              </Select.Option>
-            ))}
-          </Select>
-        ),
-      },
+      ...(billEdit
+        ? []
+        : [
+            {
+              title: t("billlines.fields.location"),
+              dataIndex: "location",
+              editable: true,
+              label: t("billlines.fields.location"),
+              formItemProps: (field) => {
+                return {
+                  key: `${field.index}location`,
+                  name: [field.name, "location"],
+                };
+              },
+              formInput: (record, index) => (
+                <Select disabled={disabled}>
+                  {bodyshop.md_parts_locations.map((loc, idx) => (
+                    <Select.Option key={idx} value={loc}>
+                      {loc}
+                    </Select.Option>
+                  ))}
+                </Select>
+              ),
+            },
+          ]),
       {
         title: t("billlines.labels.deductedfromlbr"),
         dataIndex: "deductedfromlbr",
@@ -438,7 +467,8 @@ export function BillEnterModalLinesComponent({
           return {
             key: `${field.index}fedtax`,
             valuePropName: "checked",
-            initialValue: true,
+            initialValue:
+              form.getFieldValue("federal_tax_exempt") === true ? false : true,
             name: [field.name, "applicable_taxes", "federal"],
           };
         },
@@ -477,9 +507,33 @@ export function BillEnterModalLinesComponent({
 
         dataIndex: "actions",
         render: (text, record) => (
-          <Button disabled={disabled} onClick={() => remove(record.name)}>
-            <DeleteFilled />
-          </Button>
+          <Form.Item shouldUpdate noStyle>
+            {() => (
+              <Space wrap>
+                <Button
+                  disabled={
+                    disabled ||
+                    getFieldValue("billlines")[record.fieldKey]?.inventories
+                      ?.length > 0
+                  }
+                  onClick={() => remove(record.name)}
+                >
+                  <DeleteFilled />
+                </Button>
+                {Simple_Inventory.treatment === "on" && (
+                  <BilllineAddInventory
+                    disabled={
+                      !billEdit ||
+                      form.isFieldsTouched() ||
+                      form.getFieldValue("is_credit_memo")
+                    }
+                    billline={getFieldValue("billlines")[record.fieldKey]}
+                    jobid={getFieldValue("jobid")}
+                  />
+                )}
+              </Space>
+            )}
+          </Form.Item>
         ),
       },
     ];
@@ -502,7 +556,20 @@ export function BillEnterModalLinesComponent({
     });
 
   return (
-    <Form.List name="billlines">
+    <Form.List
+      name="billlines"
+      rules={[
+        {
+          validator: async (_, billlines) => {
+            if (!billlines || billlines.length < 1) {
+              return Promise.reject(
+                new Error(t("billlines.validation.atleastone"))
+              );
+            }
+          },
+        },
+      ]}
+    >
       {(fields, { add, remove, move }) => {
         return (
           <>

client/src/components/bill-inventory-table/bill-inventory-table.component.jsx

@@ -0,0 +1,173 @@
+import { Checkbox, Form, Skeleton, Typography } from "antd";
+import React, { useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import ReadOnlyFormItemComponent from "../form-items-formatted/read-only-form-item.component";
+import "./bill-inventory-table.styles.scss";
+
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import { selectBillEnterModal } from "../../redux/modals/modals.selectors";
+
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop,
+  billEnterModal: selectBillEnterModal,
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+export default connect(mapStateToProps, mapDispatchToProps)(BillInventoryTable);
+
+export function BillInventoryTable({
+  billEnterModal,
+  bodyshop,
+  form,
+  billEdit,
+  inventoryLoading,
+  inventoryData,
+}) {
+  const { t } = useTranslation();
+
+  useEffect(() => {
+    if (inventoryData && inventoryData.inventory) {
+      form.setFieldsValue({
+        inventory: billEnterModal.context.consumeinventoryid
+          ? inventoryData.inventory.map((i) => {
+              if (i.id === billEnterModal.context.consumeinventoryid)
+                i.consumefrominventory = true;
+              return i;
+            })
+          : inventoryData.inventory,
+      });
+    }
+  }, [inventoryData, form, billEnterModal.context.consumeinventoryid]);
+
+  return (
+    <Form.Item
+      shouldUpdate={(prev, cur) => prev.vendorid !== cur.vendorid}
+      noStyle
+    >
+      {() => {
+        const is_inhouse =
+          form.getFieldValue("vendorid") === bodyshop.inhousevendorid;
+
+        if (!is_inhouse || billEdit) {
+          return null;
+        }
+
+        if (inventoryLoading) return <Skeleton />;
+
+        return (
+          <Form.List name="inventory">
+            {(fields, { add, remove, move }) => {
+              return (
+                <>
+                  <Typography.Title level={4}>
+                    {t("inventory.labels.inventory")}
+                  </Typography.Title>
+                  <table className="bill-inventory-table">
+                    <thead>
+                      <tr>
+                        <th>{t("billlines.fields.line_desc")}</th>
+                        <th>{t("vendors.fields.name")}</th>
+                        <th>{t("billlines.fields.quantity")}</th>
+                        <th>{t("billlines.fields.actual_price")}</th>
+                        <th>{t("billlines.fields.actual_cost")}</th>
+                        <th>{t("inventory.fields.comment")}</th>
+                        <th>{t("inventory.actions.consumefrominventory")}</th>
+                      </tr>
+                    </thead>
+                    <tbody>
+                      {fields.map((field, index) => (
+                        <tr key={field.key}>
+                          <td>
+                            <Form.Item
+                              //   label={t("joblines.fields.line_desc")}
+                              key={`${index}line_desc`}
+                              name={[field.name, "line_desc"]}
+                            >
+                              <ReadOnlyFormItemComponent />
+                            </Form.Item>
+                          </td>
+
+                          <td>
+                            <Form.Item
+                              span={2}
+                              //label={t("joblines.fields.mod_lb_hrs")}
+                              key={`${index}part_type`}
+                              name={[
+                                field.name,
+                                "billline",
+                                "bill",
+                                "vendor",
+                                "name",
+                              ]}
+                            >
+                              <ReadOnlyFormItemComponent />
+                            </Form.Item>
+                          </td>
+                          <td>
+                            <Form.Item
+                              span={2}
+                              //label={t("joblines.fields.mod_lb_hrs")}
+                              key={`${index}quantity`}
+                              name={[field.name, "quantity"]}
+                            >
+                              <ReadOnlyFormItemComponent />
+                            </Form.Item>
+                          </td>
+                          <td>
+                            <Form.Item
+                              span={2}
+                              //label={t("joblines.fields.mod_lb_hrs")}
+                              key={`${index}act_price`}
+                              name={[field.name, "actual_price"]}
+                            >
+                              <ReadOnlyFormItemComponent type="currency" />
+                            </Form.Item>
+                          </td>
+                          <td>
+                            <Form.Item
+                              span={2}
+                              //label={t("joblines.fields.mod_lb_hrs")}
+                              key={`${index}cost`}
+                              name={[field.name, "actual_cost"]}
+                            >
+                              <ReadOnlyFormItemComponent type="currency" />
+                            </Form.Item>
+                          </td>
+                          <td>
+                            <Form.Item
+                              span={2}
+                              //label={t("joblines.fields.mod_lb_hrs")}
+                              key={`${index}comment`}
+                              name={[field.name, "comment"]}
+                            >
+                              <ReadOnlyFormItemComponent />
+                            </Form.Item>
+                          </td>
+
+                          <td>
+                            <Form.Item
+                              span={2}
+                              //label={t("joblines.fields.mod_lb_hrs")}
+                              key={`${index}consumefrominventory`}
+                              name={[field.name, "consumefrominventory"]}
+                              valuePropName="checked"
+                            >
+                              <Checkbox />
+                            </Form.Item>
+                          </td>
+                        </tr>
+                      ))}
+                    </tbody>
+                  </table>
+                </>
+              );
+            }}
+          </Form.List>
+        );
+      }}
+    </Form.Item>
+  );
+}

client/src/components/bill-inventory-table/bill-inventory-table.styles.scss

@@ -0,0 +1,19 @@
+.bill-inventory-table {
+    table-layout: fixed;
+    width: 100%;
+
+    th,
+    td {
+        padding: 8px;
+        text-align: left;
+        border-bottom: 1px solid #ddd;
+
+        .ant-form-item {
+            margin-bottom: 0px !important;
+        }
+    }
+
+    tr:hover {
+        background-color: #f5f5f5;
+    }
+}

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

@@ -27,6 +27,10 @@ const BillLineSearchSelect = (
             option.oem_partno
               .toLowerCase()
               .includes(inputValue.toLowerCase())) ||
+          (option.alt_partno &&
+            option.alt_partno
+              .toLowerCase()
+              .includes(inputValue.toLowerCase())) ||
           (option.act_price &&
             option.act_price.toString().startsWith(inputValue.toString()))
         );
@@ -48,14 +52,17 @@ const BillLineSearchSelect = (
               line_desc={item.line_desc}
               part_qty={item.part_qty}
               oem_partno={item.oem_partno}
+              alt_partno={item.alt_partno}
               act_price={item.act_price}
               style={{
                 ...(item.removed ? { textDecoration: "line-through" } : {}),
               }}
             >
-              <span>{`${item.removed ? `(REMOVED) ` : ""}${item.line_desc}${
-                item.oem_partno ? ` - ${item.oem_partno}` : ""
-              }`}</span>
+              <span>
+                {`${item.removed ? `(REMOVED) ` : ""}${item.line_desc}${
+                  item.oem_partno ? ` - ${item.oem_partno}` : ""
+                }${item.alt_partno ? ` (${item.alt_partno})` : ""}`.trim()}
+              </span>
               <span style={{ float: "right", paddingleft: "1rem" }}>
                 {item.act_price
                   ? `$${item.act_price && item.act_price.toFixed(2)}`

client/src/components/bill-mark-exported-button/bill-mark-exported-button.component.jsx

@@ -9,11 +9,14 @@ import { createStructuredSelector } from "reselect";
 import {
   selectAuthLevel,
   selectBodyshop,
+  selectCurrentUser,
 } from "../../redux/user/user.selectors";
 import { HasRbacAccess } from "../rbac-wrapper/rbac-wrapper.component";
+import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
   authLevel: selectAuthLevel,
+  currentUser: selectCurrentUser,
 });
 const mapDispatchToProps = (dispatch) => ({
   //setUserLanguage: language => dispatch(setUserLanguage(language))
@@ -24,9 +27,15 @@ export default connect(
   mapDispatchToProps
 )(BillMarkExportedButton);
 
-export function BillMarkExportedButton({ bodyshop, authLevel, bill }) {
+export function BillMarkExportedButton({
+  currentUser,
+  bodyshop,
+  authLevel,
+  bill,
+}) {
   const { t } = useTranslation();
   const [loading, setLoading] = useState(false);
+  const [insertExportLog] = useMutation(INSERT_EXPORT_LOG);
 
   const [updateBill] = useMutation(gql`
     mutation UPDATE_BILL($billId: uuid!) {
@@ -46,6 +55,20 @@ export function BillMarkExportedButton({ bodyshop, authLevel, bill }) {
       variables: { billId: bill.id },
     });
 
+    await insertExportLog({
+      variables: {
+        logs: [
+          {
+            bodyshopid: bodyshop.id,
+            billid: bill.id,
+            successful: true,
+            message: JSON.stringify([t("general.labels.markedexported")]),
+            useremail: currentUser.email,
+          },
+        ],
+      },
+    });
+
     if (!result.errors) {
       notification["success"]({
         message: t("bills.successes.markexported"),
@@ -69,11 +92,7 @@ export function BillMarkExportedButton({ bodyshop, authLevel, bill }) {
 
   if (hasAccess)
     return (
-      <Button
-        loading={loading}
-        disabled={bill.exported}
-        onClick={handleUpdate}
-      >
+      <Button loading={loading} disabled={bill.exported} onClick={handleUpdate}>
         {t("bills.labels.markexported")}
       </Button>
     );

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

@@ -0,0 +1,38 @@
+import { Button, Space } from "antd";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { GenerateDocument } from "../../utils/RenderTemplate";
+import { TemplateList } from "../../utils/TemplateConstants";
+
+export default function BillPrintButton({ billid }) {
+  const { t } = useTranslation();
+  const [loading, setLoading] = useState(false);
+  const Templates = TemplateList("job_special");
+
+  const submitHandler = async () => {
+    setLoading(true);
+    try {
+      await GenerateDocument(
+        {
+          name: Templates.parts_invoice_label_single.key,
+          variables: {
+            id: billid,
+          },
+        },
+        {},
+        "p"
+      );
+    } catch (e) {
+      console.warn("Warning: Error generating a document.");
+    }
+    setLoading(false);
+  };
+
+  return (
+    <Space wrap>
+      <Button loading={loading} onClick={submitHandler}>
+        {t("bills.labels.printlabels")}
+      </Button>
+    </Space>
+  );
+}

client/src/components/billline-add-inventory/billline-add-inventory.component.jsx

@@ -0,0 +1,155 @@
+import { FileAddFilled } from "@ant-design/icons";
+import { useMutation } from "@apollo/client";
+import { Button, notification, Tooltip } from "antd";
+import { t } from "i18next";
+import moment from "moment";
+import React, { useState } from "react";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { INSERT_INVENTORY_AND_CREDIT } from "../../graphql/inventory.queries";
+import {
+  selectBodyshop,
+  selectCurrentUser,
+} from "../../redux/user/user.selectors";
+import { CalculateBillTotal } from "../bill-form/bill-form.totals.utility";
+import queryString from "query-string";
+import { useLocation } from "react-router-dom";
+
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop,
+  currentUser: selectCurrentUser,
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(BilllineAddInventory);
+
+export function BilllineAddInventory({
+  currentUser,
+  bodyshop,
+  billline,
+  disabled,
+  jobid,
+}) {
+  const [loading, setLoading] = useState(false);
+  const { billid } = queryString.parse(useLocation().search);
+
+  const [insertInventoryLine] = useMutation(INSERT_INVENTORY_AND_CREDIT);
+
+  const addToInventory = async () => {
+    setLoading(true);
+
+    //Check to  make sure there are no existing items already in the inventory.
+
+    const cm = {
+      vendorid: bodyshop.inhousevendorid,
+      invoice_number: "ih",
+      jobid: jobid,
+      isinhouse: true,
+      is_credit_memo: true,
+      date: moment().format("YYYY-MM-DD"),
+      federal_tax_rate: bodyshop.bill_tax_rates.federal_tax_rate,
+      state_tax_rate: bodyshop.bill_tax_rates.state_tax_rate,
+      local_tax_rate: bodyshop.bill_tax_rates.local_tax_rate,
+      total: 0,
+      billlines: [
+        {
+          actual_price: billline.actual_price,
+          actual_cost: billline.actual_cost,
+          quantity: billline.quantity,
+          line_desc: billline.line_desc,
+          cost_center: billline.cost_center,
+          deductedfromlbr: billline.deductedfromlbr,
+          applicable_taxes: {
+            local: billline.applicable_taxes.local,
+            state: billline.applicable_taxes.state,
+            federal: billline.applicable_taxes.federal,
+          },
+        },
+      ],
+    };
+
+    cm.total = CalculateBillTotal(cm).enteredTotal.getAmount() / 100;
+
+    const insertResult = await insertInventoryLine({
+      variables: {
+        joblineId:
+          billline.joblineid === "noline" ? billline.id : billline.joblineid, //This will return null as there will be no jobline that has the id of the bill line.
+        //Unfortunately, we can't send null as the GQL syntax validation fails.
+        joblineStatus: bodyshop.md_order_statuses.default_returned,
+        inv: {
+          shopid: bodyshop.id,
+          billlineid: billline.id,
+          actual_price: billline.actual_price,
+          actual_cost: billline.actual_cost,
+          quantity: billline.quantity,
+          line_desc: billline.line_desc,
+        },
+        cm: { ...cm, billlines: { data: cm.billlines } }, //Fix structure for apollo insert.
+        pol: {
+          returnfrombill: billid,
+          vendorid: bodyshop.inhousevendorid,
+          deliver_by: moment().format("YYYY-MM-DD"),
+          parts_order_lines: {
+            data: [
+              {
+                line_desc: billline.line_desc,
+
+                act_price: billline.actual_price,
+                cost: billline.actual_cost,
+                quantity: billline.quantity,
+                job_line_id:
+                  billline.joblineid === "noline" ? null : billline.joblineid,
+                part_type: billline.jobline && billline.jobline.part_type,
+                cm_received: true,
+              },
+            ],
+          },
+          order_date: "2022-06-01",
+          orderedby: currentUser.email,
+          jobid: jobid,
+          user_email: currentUser.email,
+          return: true,
+          status: "Ordered",
+        },
+      },
+      refetchQueries: ["QUERY_BILL_BY_PK"],
+    });
+
+    if (!insertResult.errors) {
+      notification.open({
+        type: "success",
+        message: t("inventory.successes.inserted"),
+      });
+    } else {
+      notification.open({
+        type: "error",
+        message: t("inventory.errors.inserting", {
+          error: JSON.stringify(insertResult.errors),
+        }),
+      });
+    }
+
+    setLoading(false);
+  };
+
+  return (
+    <Tooltip title={t("inventory.actions.addtoinventory")}>
+      <Button
+        loading={loading}
+        disabled={
+          disabled || billline?.inventories?.length >= billline.quantity
+        }
+        onClick={addToInventory}
+      >
+        <FileAddFilled />
+        {billline?.inventories?.length > 0 && (
+          <div>({billline?.inventories?.length} in inv)</div>
+        )}
+      </Button>
+    </Tooltip>
+  );
+}

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

@@ -4,17 +4,19 @@ import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
+import { selectJobReadOnly } from "../../redux/application/application.selectors";
 import { setModalContext } from "../../redux/modals/modals.actions";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { DateFormatter } from "../../utils/DateFormatter";
-import { alphaSort, dateSort } from "../../utils/sorters";
 import { TemplateList } from "../../utils/TemplateConstants";
+import { alphaSort, dateSort } from "../../utils/sorters";
 import BillDeleteButton from "../bill-delete-button/bill-delete-button.component";
+import BillDetailEditReturnComponent from "../bill-detail-edit/bill-detail-edit-return.component";
 import PrintWrapperComponent from "../print-wrapper/print-wrapper.component";
 
 const mapStateToProps = createStructuredSelector({
-  //jobRO: selectJobReadOnly,
+  jobRO: selectJobReadOnly,
   bodyshop: selectBodyshop,
 });
 
@@ -29,6 +31,7 @@ const mapDispatchToProps = (dispatch) => ({
 
 export function BillsListTableComponent({
   bodyshop,
+  jobRO,
   job,
   billsQuery,
   handleOnRowClick,
@@ -43,6 +46,8 @@ export function BillsListTableComponent({
   });
   // const search = queryString.parse(useLocation().search);
   // const selectedBill = search.billid;
+  const [searchText, setSearchText] = useState("");
+
   const Templates = TemplateList("bill");
   const bills = billsQuery.data ? billsQuery.data.bills : [];
   const { refetch } = billsQuery;
@@ -53,39 +58,16 @@ export function BillsListTableComponent({
           <EditFilled />
         </Button>
       )}
-      <BillDeleteButton bill={record} />
-      <Button
+      <BillDeleteButton bill={record} jobid={job.id} />
+      <BillDetailEditReturnComponent
+        data={{ bills_by_pk: { ...record, jobid: job.id, job: job } }}
         disabled={
-          record.is_credit_memo || record.vendorid === bodyshop.inhousevendorid
+          record.is_credit_memo ||
+          record.vendorid === bodyshop.inhousevendorid ||
+          jobRO
         }
-        onClick={() => {
-          console.log(record);
-          setPartsOrderContext({
-            actions: {},
-            context: {
-              jobId: job.id,
-              vendorId: record.vendorid,
-              returnFromBill: record.id,
-              invoiceNumber: record.invoice_number,
-              linesToOrder: record.billlines.map((i) => {
-                return {
-                  line_desc: i.line_desc,
-                  // db_price: i.actual_price,
-                  act_price: i.actual_price,
-                  cost: i.actual_cost,
-                  quantity: i.quantity,
-                  joblineid: i.joblineid,
-                  oem_partno: i.jobline && i.jobline.oem_partno,
-                  part_type: i.jobline && i.jobline.part_type,
-                };
-              }),
-              isReturn: true,
-            },
-          });
-        }}
-      >
-        {t("bills.actions.return")}
-      </Button>
+      />
+
       {record.isinhouse && (
         <PrintWrapperComponent
           templateObject={{
@@ -167,6 +149,24 @@ export function BillsListTableComponent({
     setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
   };
 
+  const filteredBills = bills
+    ? searchText === ""
+      ? bills
+      : bills.filter(
+          (b) =>
+            (b.invoice_number || "")
+              .toLowerCase()
+              .includes(searchText.toLowerCase()) ||
+            (b.vendor.name || "")
+              .toLowerCase()
+              .includes(searchText.toLowerCase()) ||
+            (b.total || "")
+              .toString()
+              .toLowerCase()
+              .includes(searchText.toLowerCase())
+        )
+    : [];
+
   return (
     <Card
       title={t("bills.labels.bills")}
@@ -207,8 +207,10 @@ export function BillsListTableComponent({
 
           <Input.Search
             placeholder={t("general.labels.search")}
+            value={searchText}
             onChange={(e) => {
               e.preventDefault();
+              setSearchText(e.target.value);
             }}
           />
         </Space>
@@ -221,7 +223,7 @@ export function BillsListTableComponent({
         }}
         columns={columns}
         rowKey="id"
-        dataSource={bills}
+        dataSource={filteredBills}
         onChange={handleTableChange}
       />
     </Card>

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

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

client/src/components/ca-bc-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(

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

@@ -1,8 +1,8 @@
-import React, { useState } from "react";
-import { Button, Form, InputNumber, Popover } from "antd";
-import { logImEXEvent } from "../../firebase/firebase.utils";
-import { useTranslation } from "react-i18next";
 import { CalculatorFilled } from "@ant-design/icons";
+import { Button, Form, InputNumber, Popover, Space } from "antd";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 export default function CABCpvrtCalculator({ disabled, form }) {
   const [visibility, setVisibility] = useState(false);
 
@@ -10,7 +10,10 @@ export default function CABCpvrtCalculator({ disabled, form }) {
 
   const handleFinish = async (values) => {
     logImEXEvent("job_ca_bc_pvrt_calculate");
-    form.setFieldsValue({ ca_bc_pvrt: (values.rate * values.days).toFixed(2) });
+    form.setFieldsValue({
+      ca_bc_pvrt: ((values.rate || 0) * (values.days || 0)).toFixed(2),
+    });
+    form.setFields([{ name: "ca_bc_pvrt", touched: true }]);
     setVisibility(false);
   };
 
@@ -23,10 +26,14 @@ export default function CABCpvrtCalculator({ disabled, form }) {
         <Form.Item name="days" label={t("jobs.labels.ca_bc_pvrt.days")}>
           <InputNumber precision={0} min={0} />
         </Form.Item>
-        <Button type="primary" htmlType="submit">
-          {t("general.actions.calculate")}
-        </Button>
-        <Button onClick={() => setVisibility(false)}>Close</Button>
+        <div style={{ display: "flex", justifyContent: "flex-end" }}>
+          <Space>
+            <Button type="primary" htmlType="submit">
+              {t("general.actions.calculate")}
+            </Button>
+            <Button onClick={() => setVisibility(false)}>Close</Button>
+          </Space>
+        </div>
       </Form>
     </div>
   );

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

@@ -0,0 +1,328 @@
+import { DeleteFilled } from "@ant-design/icons";
+import { useLazyQuery, useMutation } from "@apollo/client";
+import {
+  Button,
+  Card,
+  Col,
+  Form,
+  Input,
+  Row,
+  Space,
+  Spin,
+  Statistic,
+  notification,
+} from "antd";
+import axios from "axios";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import {
+  INSERT_PAYMENT_RESPONSE,
+  QUERY_RO_AND_OWNER_BY_JOB_PKS,
+} from "../../graphql/payment_response.queries";
+import { insertAuditTrail } from "../../redux/application/application.actions";
+import { toggleModalVisible } from "../../redux/modals/modals.actions";
+import { selectCardPayment } from "../../redux/modals/modals.selectors";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import AuditTrailMapping from "../../utils/AuditTrailMappings";
+import CurrencyFormItemComponent from "../form-items-formatted/currency-form-item.component";
+import JobSearchSelectComponent from "../job-search-select/job-search-select.component";
+
+const mapStateToProps = createStructuredSelector({
+  cardPaymentModal: selectCardPayment,
+  bodyshop: selectBodyshop,
+});
+
+const mapDispatchToProps = (dispatch) => ({
+  insertAuditTrail: ({ jobid, operation, type }) =>
+    dispatch(insertAuditTrail({ jobid, operation, type })),
+  toggleModalVisible: () => dispatch(toggleModalVisible("cardPayment")),
+});
+
+const CardPaymentModalComponent = ({
+  bodyshop,
+  cardPaymentModal,
+  toggleModalVisible,
+  insertAuditTrail,
+}) => {
+  const { context, actions } = cardPaymentModal;
+
+  const [form] = Form.useForm();
+
+  const [loading, setLoading] = useState(false);
+  // const [insertPayment] = useMutation(INSERT_NEW_PAYMENT);
+  const [insertPaymentResponse] = useMutation(INSERT_PAYMENT_RESPONSE);
+  const { t } = useTranslation();
+
+  const [, { data, refetch, queryLoading }] = useLazyQuery(
+    QUERY_RO_AND_OWNER_BY_JOB_PKS,
+    {
+      variables: { jobids: [context.jobid] },
+      skip: true,
+    }
+  );
+
+  //Initialize the intellipay window.
+  const SetIntellipayCallbackFunctions = () => {
+    console.log("*** Set IntelliPay callback functions.");
+    window.intellipay.runOnClose(() => {
+      //window.intellipay.initialize();
+    });
+
+    window.intellipay.runOnApproval(async function (response) {
+      //2024-04-25: Nothing is going to happen here anymore. We'll completely rely on the callback.
+      //Add a slight delay to allow the refetch to properly get the data.
+      setTimeout(() => {
+        if (actions && actions.refetch && typeof actions.refetch === "function")
+          actions.refetch();
+        setLoading(false);
+        toggleModalVisible();
+      }, 750);
+    });
+
+    window.intellipay.runOnNonApproval(async function (response) {
+      // Mutate unsuccessful payment
+
+      const { payments } = form.getFieldsValue();
+      await insertPaymentResponse({
+        variables: {
+          paymentResponse: payments.map((payment) => ({
+            amount: payment.amount,
+            bodyshopid: bodyshop.id,
+            jobid: payment.jobid,
+            declinereason: response.declinereason,
+            ext_paymentid: response.paymentid.toString(),
+            successful: false,
+            response,
+          })),
+        },
+      });
+
+      payments.forEach((payment) =>
+        insertAuditTrail({
+          jobid: payment.jobid,
+          operation: AuditTrailMapping.failedpayment(),
+          type: "failedpayment",
+        })
+      );
+    });
+  };
+
+
+  const handleIntelliPayCharge = async () => {
+    setLoading(true);
+    //Validate
+    try {
+      await form.validateFields();
+    } catch (error) {
+      setLoading(false);
+      return;
+    }
+
+    try {
+      const response = await axios.post("/intellipay/lightbox_credentials", {
+        bodyshop,
+        refresh: !!window.intellipay,
+        paymentSplitMeta: form.getFieldsValue(),
+      });
+
+      if (window.intellipay) {
+        // eslint-disable-next-line no-eval
+        eval(response.data);
+        SetIntellipayCallbackFunctions();
+        window.intellipay.autoOpen();
+      } else {
+        var rg = document.createRange();
+        let node = rg.createContextualFragment(response.data);
+        document.documentElement.appendChild(node);
+        SetIntellipayCallbackFunctions();
+        window.intellipay.isAutoOpen = true;
+        window.intellipay.initialize();
+      }
+    } catch (error) {
+      notification.open({
+        type: "error",
+        message: t("job_payments.notifications.error.openingip"),
+      });
+      setLoading(false);
+    }
+  };
+
+  return (
+    <Card title="Card Payment">
+      <Spin spinning={loading}>
+        <Form
+          form={form}
+          layout="vertical"
+          initialValues={{
+            payments: context.jobid ? [{ jobid: context.jobid }] : [],
+          }}
+        >
+          <Form.List name={["payments"]}>
+            {(fields, { add, remove, move }) => {
+              return (
+                <div>
+                  {fields.map((field, index) => (
+                    <Form.Item key={field.key}>
+                      <Row gutter={[16, 16]}>
+                        <Col span={16}>
+                          <Form.Item
+                            key={`${index}jobid`}
+                            label={t("jobs.fields.ro_number")}
+                            name={[field.name, "jobid"]}
+                            rules={[
+                              {
+                                required: true,
+                                //message: t("general.validation.required"),
+                              },
+                            ]}
+                          >
+                            <JobSearchSelectComponent
+                              notExported={false}
+                              clm_no
+                            />
+                          </Form.Item>
+                        </Col>
+                        <Col span={6}>
+                          <Form.Item
+                            key={`${index}amount`}
+                            label={t("payments.fields.amount")}
+                            name={[field.name, "amount"]}
+                            rules={[
+                              {
+                                required: true,
+                                //message: t("general.validation.required"),
+                              },
+                            ]}
+                          >
+                            <CurrencyFormItemComponent />
+                          </Form.Item>
+                        </Col>
+                        <Col span={2}>
+                          <DeleteFilled
+                            style={{ margin: "1rem" }}
+                            onClick={() => {
+                              remove(field.name);
+                            }}
+                          />
+                        </Col>
+                      </Row>
+                    </Form.Item>
+                  ))}
+                  <Form.Item>
+                    <Button
+                      type="dashed"
+                      onClick={() => {
+                        add();
+                      }}
+                      style={{ width: "100%" }}
+                    >
+                      {t("general.actions.add")}
+                    </Button>
+                  </Form.Item>
+                </div>
+              );
+            }}
+          </Form.List>
+
+          <Form.Item
+            shouldUpdate={(prevValues, curValues) =>
+              prevValues.payments?.map((p) => p?.jobid).join() !==
+              curValues.payments?.map((p) => p?.jobid).join()
+            }
+          >
+            {() => {
+              //If all of the job ids have been fileld in, then query and update the IP field.
+              const { payments } = form.getFieldsValue();
+              if (
+                payments?.length > 0 &&
+                payments?.filter((p) => p?.jobid).length === payments?.length
+              ) {
+                refetch({ jobids: payments.map((p) => p.jobid) });
+              }
+              return (
+                <>
+                  <Input
+                    className="ipayfield"
+                    data-ipayname="account"
+                    //type="hidden"
+                    value={
+                      payments && data && data.jobs.length > 0
+                        ? data.jobs.map((j) => j.ro_number).join(", ")
+                        : null
+                    }
+                    hidden
+                  />
+                  <Input
+                    className="ipayfield"
+                    data-ipayname="email"
+                    // type="hidden"
+                    value={
+                      payments && data && data.jobs.length > 0
+                        ? data.jobs.filter((j) => j.ownr_ea)[0]?.ownr_ea
+                        : null
+                    }
+                    hidden
+                  />
+                </>
+              );
+            }}
+          </Form.Item>
+          <Form.Item
+            shouldUpdate={(prevValues, curValues) =>
+              prevValues.payments?.map((p) => p?.amount).join() !==
+              curValues.payments?.map((p) => p?.amount).join()
+            }
+          >
+            {() => {
+              const { payments } = form.getFieldsValue();
+              const totalAmountToCharge = payments?.reduce((acc, val) => {
+                return acc + (val?.amount || 0);
+              }, 0);
+
+              return (
+                <Space style={{ float: "right" }}>
+                  <Statistic
+                    title="Amount To Charge"
+                    value={totalAmountToCharge}
+                    precision={2}
+                  />
+                  <Input
+                    className="ipayfield"
+                    data-ipayname="amount"
+                    //type="hidden"
+                    value={totalAmountToCharge?.toFixed(2)}
+                    hidden
+                  />
+                  <Input
+                    className="ipayfield"
+                    data-ipayname="comment"
+                    //type="hidden"
+                    value={btoa(JSON.stringify(payments))}
+                    hidden
+                  />
+                  <Button
+                    type="primary"
+                    //  data-ipayname="submit"
+                    className="ipayfield"
+                    loading={queryLoading || loading}
+                    disabled={!(totalAmountToCharge > 0)}
+                    onClick={handleIntelliPayCharge}
+                  >
+                    {t("job_payments.buttons.proceedtopayment")}
+                  </Button>
+                </Space>
+              );
+            }}
+          </Form.Item>
+        </Form>
+      </Spin>
+    </Card>
+  );
+};
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(CardPaymentModalComponent);

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

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

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

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

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

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

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

@@ -3,6 +3,8 @@ 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 ChatPrintButton from "../chat-print-button/chat-print-button.component";
 import ChatTagRoContainer from "../chat-tag-ro/chat-tag-ro.container";
 
 export default function ChatConversationTitle({ conversation }) {
@@ -11,6 +13,8 @@ export default function ChatConversationTitle({ conversation }) {
       <PhoneNumberFormatter>
         {conversation && conversation.phone_num}
       </PhoneNumberFormatter>
+      <ChatLabelComponent conversation={conversation} />
+      <ChatPrintButton conversation={conversation} />
       <ChatConversationTitleTags
         jobConversations={
           (conversation && conversation.job_conversations) || []

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

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

client/src/components/chat-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

@@ -6,12 +6,14 @@ import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { GET_DOCUMENTS_BY_JOB } from "../../graphql/documents.queries";
+import { selectBodyshop } from "../../redux/user/user.selectors";
 import AlertComponent from "../alert/alert.component";
 import JobDocumentsGalleryExternal from "../jobs-documents-gallery/jobs-documents-gallery.external.component";
+import JobDocumentsLocalGalleryExternal from "../jobs-documents-local-gallery/jobs-documents-local-gallery.external.component";
 import LoadingSpinner from "../loading-spinner/loading-spinner.component";
 
 const mapStateToProps = createStructuredSelector({
-  //currentUser: selectCurrentUser
+  bodyshop: selectBodyshop,
 });
 const mapDispatchToProps = (dispatch) => ({
   //setUserLanguage: language => dispatch(setUserLanguage(language))
@@ -19,6 +21,7 @@ const mapDispatchToProps = (dispatch) => ({
 export default connect(mapStateToProps, mapDispatchToProps)(ChatMediaSelector);
 
 export function ChatMediaSelector({
+  bodyshop,
   selectedMedia,
   setSelectedMedia,
   conversation,
@@ -27,7 +30,6 @@ export function ChatMediaSelector({
   const [visible, setVisible] = useState(false);
 
   const { loading, error, data } = useQuery(GET_DOCUMENTS_BY_JOB, {
-
     fetchPolicy: "network-only",
     nextFetchPolicy: "network-only",
     variables: {
@@ -57,12 +59,21 @@ export function ChatMediaSelector({
       {selectedMedia.filter((s) => s.isSelected).length >= 10 ? (
         <div style={{ color: "red" }}>{t("messaging.labels.maxtenimages")}</div>
       ) : null}
-      {data && (
+      {!bodyshop.uselocalmediaserver && data && (
         <JobDocumentsGalleryExternal
           data={data ? data.documents : []}
           externalMediaState={[selectedMedia, setSelectedMedia]}
         />
       )}
+      {bodyshop.uselocalmediaserver && visible && (
+        <JobDocumentsLocalGalleryExternal
+          externalMediaState={[selectedMedia, setSelectedMedia]}
+          jobId={
+            conversation.job_conversations[0] &&
+            conversation.job_conversations[0].jobid
+          }
+        />
+      )}
     </div>
   );
 

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

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

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

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

client/src/components/chat-popup/chat-popup.styles.scss

@@ -13,6 +13,9 @@
     height: 100%;
   }
 }
+.chat-popup-info-icon {
+  margin-right: 5px;
+}
 
 @media only screen and (min-width: 992px) {
   .chat-popup {

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

@@ -19,7 +19,7 @@ export function ChatPresetsComponent({ bodyshop, setMessage, className }) {
   const menu = (
     <Menu>
       {bodyshop.md_messaging_presets.map((i, idx) => (
-        <Menu.Item onClick={() => setMessage(i.text)} onItemHover key={idx}>
+        <Menu.Item onClick={() => setMessage(i.text)} key={idx}>
           {i.label}
         </Menu.Item>
       ))}

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

@@ -0,0 +1,59 @@
+import { MailOutlined, PrinterOutlined } from "@ant-design/icons";
+import { Space, Spin } from "antd";
+import React, { useState } from "react";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { setEmailOptions } from "../../redux/email/email.actions";
+import { GenerateDocument } from "../../utils/RenderTemplate";
+import { TemplateList } from "../../utils/TemplateConstants";
+
+const mapStateToProps = createStructuredSelector({});
+
+const mapDispatchToProps = (dispatch) => ({
+  setEmailOptions: (e) => dispatch(setEmailOptions(e)),
+});
+
+export function ChatPrintButton({ conversation }) {
+  const [loading, setLoading] = useState(false);
+
+  return (
+    <Space wrap>
+      <PrinterOutlined
+        onClick={() => {
+          setLoading(true);
+          GenerateDocument(
+            {
+              name: TemplateList("messaging").conversation_list.key,
+              variables: { id: conversation.id },
+            },
+            {
+              subject: TemplateList("messaging").conversation_list.subject,
+            },
+            "p",
+            conversation.id
+          );
+          setLoading(false);
+        }}
+      />
+      <MailOutlined
+        onClick={() => {
+          setLoading(true);
+          GenerateDocument(
+            {
+              name: TemplateList("messaging").conversation_list.key,
+              variables: { id: conversation.id },
+            },
+            {
+              subject: TemplateList("messaging").conversation_list.subject,
+            },
+            "e",
+            conversation.id
+          );
+          setLoading(false);
+        }}
+      />
+      {loading && <Spin />}
+    </Space>
+  );
+}
+export default connect(mapStateToProps, mapDispatchToProps)(ChatPrintButton);

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

@@ -35,6 +35,15 @@ export default function ContractsCarsComponent({
         state.sortedInfo.columnKey === "status" && state.sortedInfo.order,
       render: (text, record) => <div>{t(record.status)}</div>,
     },
+    {
+      title: t("courtesycars.fields.readiness"),
+      dataIndex: "readiness",
+      key: "readiness",
+      sorter: (a, b) => alphaSort(a.readiness, b.readiness),
+      sortOrder:
+        state.sortedInfo.columnKey === "readiness" && state.sortedInfo.order,
+      render: (text, record) => t(record.readiness),
+    },
     {
       title: t("courtesycars.fields.year"),
       dataIndex: "year",
@@ -59,6 +68,14 @@ export default function ContractsCarsComponent({
       sortOrder:
         state.sortedInfo.columnKey === "model" && state.sortedInfo.order,
     },
+    {
+      title: t("courtesycars.fields.color"),
+      dataIndex: "color",
+      key: "color",
+      sorter: (a, b) => alphaSort(a.color, b.color),
+      sortOrder:
+        state.sortedInfo.columnKey === "color" && state.sortedInfo.order,
+    },
     {
       title: t("courtesycars.fields.plate"),
       dataIndex: "plate",
@@ -93,6 +110,9 @@ export default function ContractsCarsComponent({
             (cc.model || "")
               .toLowerCase()
               .includes(state.search.toLowerCase()) ||
+            (cc.color || "")
+              .toLowerCase()
+              .includes(state.search.toLowerCase()) ||
             (cc.plate || "").toLowerCase().includes(state.search.toLowerCase())
         );
 

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

@@ -4,7 +4,7 @@ import moment from "moment";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import { DateFormatter } from "../../utils/DateFormatter";
-import ContractLicenseDecodeButton from "../contract-license-decode-button/contract-license-decode-button.component";
+//import ContractLicenseDecodeButton from "../contract-license-decode-button/contract-license-decode-button.component";
 import ContractStatusSelector from "../contract-status-select/contract-status-select.component";
 import ContractsRatesChangeButton from "../contracts-rates-change-button/contracts-rates-change-button.component";
 import CourtesyCarFuelSlider from "../courtesy-car-fuel-select/courtesy-car-fuel-select.component";
@@ -68,6 +68,30 @@ export default function ContractFormComponent({
             <FormDateTimePicker />
           </Form.Item>
         )}
+        {create && (
+          <Form.Item
+            shouldUpdate={(p, c) => p.scheduledreturn !== c.scheduledreturn}
+          >
+            {() => {
+              const insuranceOver =
+                selectedCar &&
+                selectedCar.insuranceexpires &&
+                moment(selectedCar.insuranceexpires)
+                  .endOf("day")
+                  .isBefore(moment(form.getFieldValue("scheduledreturn")));
+              if (insuranceOver)
+                return (
+                  <Space direction="vertical" style={{ color: "tomato" }}>
+                    <span>
+                      <WarningFilled style={{ marginRight: ".3rem" }} />
+                      {t("contracts.labels.insuranceexpired")}
+                    </span>
+                  </Space>
+                );
+              return <></>;
+            }}
+          </Form.Item>
+        )}
       </LayoutFormRow>
       <LayoutFormRow grow>
         <Form.Item
@@ -90,16 +114,17 @@ export default function ContractFormComponent({
           >
             {() => {
               const mileageOver =
-                selectedCar &&
-                selectedCar.nextservicekm <= form.getFieldValue("kmstart");
-
+                selectedCar && selectedCar.nextservicekm
+                  ? selectedCar.nextservicekm <= form.getFieldValue("kmstart")
+                  : false;
               const dueForService =
                 selectedCar &&
                 selectedCar.nextservicedate &&
-                moment(selectedCar.nextservicedate).isBefore(
-                  moment(form.getFieldValue("scheduledreturn"))
-                );
-
+                moment(selectedCar.nextservicedate)
+                  .endOf("day")
+                  .isSameOrBefore(
+                    moment(form.getFieldValue("scheduledreturn"))
+                  );
               if (mileageOver || dueForService)
                 return (
                   <Space direction="vertical" style={{ color: "tomato" }}>
@@ -117,7 +142,6 @@ export default function ContractFormComponent({
                     </span>
                   </Space>
                 );
-
               return <></>;
             }}
           </Form.Item>
@@ -165,7 +189,9 @@ export default function ContractFormComponent({
               />
             </div>
           )}
-          <ContractLicenseDecodeButton form={form} />
+          {
+            //<ContractLicenseDecodeButton form={form} />
+          }
         </Space>
       </div>
       <LayoutFormRow header={t("contracts.labels.driverinformation")}>

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

@@ -4,6 +4,7 @@ import { useTranslation } from "react-i18next";
 import { alphaSort } from "../../utils/sorters";
 import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+import {pageLimit} from "../../utils/config";
 
 export default function ContractsJobsComponent({
   loading,
@@ -175,7 +176,7 @@ export default function ContractsJobsComponent({
         loading={loading}
         pagination={{
           position: "top",
-          defaultPageSize: 10,
+          defaultPageSize: pageLimit,
           defaultCurrent: defaultCurrent,
         }}
         columns={columns}

client/src/components/contract-jobs/contract-jobs.container.jsx

@@ -2,10 +2,10 @@ import { useQuery } from "@apollo/client";
 import React from "react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
+import { QUERY_ALL_ACTIVE_JOBS } from "../../graphql/jobs.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import AlertComponent from "../alert/alert.component";
 import ContractJobsComponent from "./contract-jobs.component";
-import { QUERY_ALL_ACTIVE_JOBS } from "../../graphql/jobs.queries";
 
 const mapStateToProps = createStructuredSelector({
   //currentUser: selectCurrentUser
@@ -15,6 +15,7 @@ export function ContractJobsContainer({ selectedJobState, bodyshop }) {
   const { loading, error, data } = useQuery(QUERY_ALL_ACTIVE_JOBS, {
     variables: {
       statuses: bodyshop.md_ro_statuses.active_statuses || ["Open"],
+      isConverted: true,
     },
     fetchPolicy: "network-only",
     nextFetchPolicy: "network-only",

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

@@ -4,15 +4,16 @@ import queryString from "query-string";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Link, useHistory, useLocation } from "react-router-dom";
+import { setModalContext } from "../../redux/modals/modals.actions";
 import { DateTimeFormatter } from "../../utils/DateFormatter";
 import { alphaSort } from "../../utils/sorters";
 import ContractsFindModalContainer from "../contracts-find-modal/contracts-find-modal.container";
-import { setModalContext } from "../../redux/modals/modals.actions";
 
+import moment from "moment";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
-import moment from "moment";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import {pageLimit} from "../../utils/config";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -209,7 +210,7 @@ export function ContractsList({
         }}
         pagination={{
           position: "top",
-          pageSize: 25,
+          pageSize: pageLimit,
           current: parseInt(page || 1),
           total: total,
         }}

client/src/components/courtesy-car-contract-list/courtesy-car-contract-list.component.jsx

@@ -5,6 +5,7 @@ import { useTranslation } from "react-i18next";
 import { Link, useHistory, useLocation } from "react-router-dom";
 import { DateFormatter } from "../../utils/DateFormatter";
 import { alphaSort } from "../../utils/sorters";
+import {pageLimit} from "../../utils/config";
 
 export default function CourtesyCarContractListComponent({
   contracts,
@@ -89,7 +90,7 @@ export default function CourtesyCarContractListComponent({
         scroll={{ x: true }}
         pagination={{
           position: "top",
-          pageSize: 25,
+          pageSize: pageLimit,
           current: parseInt(page || 1),
           total: totalContracts,
         }}