IO-2626 Adjust Image Prop on customer page

IO-2626 Prevent crisp from loading on anon CSI page.
Merge branch 'feature/IO-2626-CSI-Pages' of bitbucket.org:snaptsoft/bodyshop into feature/IO-2626-CSI-Pages
2024-02-08 09:57:39 -08:00 · 2024-02-06 10:04:59 -08:00 · 2024-02-06 09:36:16 -08:00 · 2024-02-06 09:29:22 -08:00 · 2024-02-06 09:10:32 -08:00 · 2024-02-06 08:52:51 -08:00
30 changed files with 1001 additions and 587 deletions
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -42,31 +42,22 @@ jobs:
  app-build:
    docker:
      - image: cimg/node:16.15.0
-
+    resource_class: large
    working_directory: ~/repo/client

    steps:
      - checkout:
          path: ~/repo
-
-      - restore_cache:
-          name: Restore Yarn Package Cache
-          keys:
-            - yarn-packages-{{ checksum "yarn.lock" }}
      - run:
          name: Install Dependencies
-          command: yarn install --frozen-lockfile --cache-folder ~/.cache/yarn
-      - save_cache:
-          name: Save Yarn Package Cache
-          key: yarn-packages-{{ checksum "yarn.lock" }}
-          paths:
-            - ~/.cache/yarn
+          command: npm i

-      - run: yarn run build
+      - run: npm run build

      - aws-s3/sync:
          from: build
          to: "s3://imex-online-production/"
+          arguments: "--exclude '*.map'"
      - jira/notify

  test-hasura-migrate:
@@ -92,31 +83,22 @@ jobs:
  test-app-build:
    docker:
      - image: cimg/node:16.15.0
-
+    resource_class: large
    working_directory: ~/repo/client

    steps:
      - checkout:
          path: ~/repo
-
-      - restore_cache:
-          name: Restore Yarn Package Cache
-          keys:
-            - yarn-packages-{{ checksum "yarn.lock" }}
      - run:
          name: Install Dependencies
-          command: yarn install --frozen-lockfile --cache-folder ~/.cache/yarn
-      - save_cache:
-          name: Save Yarn Package Cache
-          key: yarn-packages-{{ checksum "yarn.lock" }}
-          paths:
-            - ~/.cache/yarn
+          command: npm i

-      - run: yarn run build:test
+      - run: npm run build:test

      - aws-s3/sync:
          from: build
          to: "s3://imex-online-test/"
+          arguments: "--exclude '*.map'"
      - jira/notify

  admin-app-build:
@@ -177,4 +159,4 @@ workflows:
      #- admin-app-build:
      #filters:
      #branches:
-      #only: master
+      #only: master
--- a/client/.env.production
+++ b/client/.env.production
@@ -1,4 +1,4 @@
-GENERATE_SOURCEMAP=false
+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
--- a/client/.gitignore
+++ b/client/.gitignore
@@ -0,0 +1,3 @@
+
+# Sentry Config File
+.sentryclirc
--- a/client/craco.config.js
+++ b/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: {
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -13,12 +13,14 @@
        "@craco/craco": "^7.0.0",
        "@fingerprintjs/fingerprintjs": "^3.4.2",
        "@jsreport/browser-client": "^3.1.0",
-        "@sentry/react": "^7.40.0",
+        "@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",
@@ -4214,40 +4216,195 @@
      "integrity": "sha512-sXo/qW2/pAcmT43VoRKOJbDOfV3cYpq3szSVfIThQXNt+E4DfKj361vaAt3c88U5tPUxzEswam7GW48PJqtKAg==",
      "license": "MIT"
    },
-    "node_modules/@sentry/browser": {
-      "version": "7.40.0",
-      "resolved": "https://registry.npmjs.org/@sentry/browser/-/browser-7.40.0.tgz",
-      "integrity": "sha512-07rZ+cTcpmYB1r84/oZtmSPJJvLCxW8yIh/5s4MdKRyZpqIDKhOz6cCS/4j+l1V+MeLcNLZBjFtNdKA2eocTpg==",
-      "license": "MIT",
+    "node_modules/@sentry-internal/feedback": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry-internal/feedback/-/feedback-7.99.0.tgz",
+      "integrity": "sha512-exIO1o+bE0MW4z30FxC0cYzJ4ZHSMlDPMHCBDPzU+MWGQc/fb8s58QUrx5Dnm6HTh9G3H+YlroCxIo9u0GSwGQ==",
      "dependencies": {
-        "@sentry/core": "7.40.0",
-        "@sentry/replay": "7.40.0",
-        "@sentry/types": "7.40.0",
-        "@sentry/utils": "7.40.0",
-        "tslib": "^1.9.3"
+        "@sentry/core": "7.99.0",
+        "@sentry/types": "7.99.0",
+        "@sentry/utils": "7.99.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@sentry-internal/feedback/node_modules/@sentry/core": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/core/-/core-7.99.0.tgz",
+      "integrity": "sha512-vOAtzcAXEUtS/oW7wi3wMkZ3hsb5Ch96gKyrrj/mXdOp2zrcwdNV6N9/pawq2E9P/7Pw8AXw4CeDZztZrjQLuA==",
+      "dependencies": {
+        "@sentry/types": "7.99.0",
+        "@sentry/utils": "7.99.0"
      },
      "engines": {
        "node": ">=8"
      }
    },
-    "node_modules/@sentry/browser/node_modules/tslib": {
-      "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
-      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
-      "license": "0BSD"
+    "node_modules/@sentry-internal/feedback/node_modules/@sentry/types": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/types/-/types-7.99.0.tgz",
+      "integrity": "sha512-94qwOw4w40sAs5mCmzcGyj8ZUu/KhnWnuMZARRq96k+SjRW/tHFAOlIdnFSrt3BLPvSOK7R3bVAskZQ0N4FTmA==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry-internal/feedback/node_modules/@sentry/utils": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-7.99.0.tgz",
+      "integrity": "sha512-cYZy5WNTkWs5GgggGnjfGqC44CWir0pAv4GVVSx0fsup4D4pMKBJPrtub15f9uC+QkUf3vVkqwpBqeFxtmJQTQ==",
+      "dependencies": {
+        "@sentry/types": "7.99.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry-internal/replay-canvas": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry-internal/replay-canvas/-/replay-canvas-7.99.0.tgz",
+      "integrity": "sha512-PoIkfusToDq0snfl2M6HJx/1KJYtXxYhQplrn11kYadO04SdG0XGXf4h7wBTMEQ7LDEAtQyvsOu4nEQtTO3YjQ==",
+      "dependencies": {
+        "@sentry/core": "7.99.0",
+        "@sentry/replay": "7.99.0",
+        "@sentry/types": "7.99.0",
+        "@sentry/utils": "7.99.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@sentry-internal/replay-canvas/node_modules/@sentry/core": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/core/-/core-7.99.0.tgz",
+      "integrity": "sha512-vOAtzcAXEUtS/oW7wi3wMkZ3hsb5Ch96gKyrrj/mXdOp2zrcwdNV6N9/pawq2E9P/7Pw8AXw4CeDZztZrjQLuA==",
+      "dependencies": {
+        "@sentry/types": "7.99.0",
+        "@sentry/utils": "7.99.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry-internal/replay-canvas/node_modules/@sentry/types": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/types/-/types-7.99.0.tgz",
+      "integrity": "sha512-94qwOw4w40sAs5mCmzcGyj8ZUu/KhnWnuMZARRq96k+SjRW/tHFAOlIdnFSrt3BLPvSOK7R3bVAskZQ0N4FTmA==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry-internal/replay-canvas/node_modules/@sentry/utils": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-7.99.0.tgz",
+      "integrity": "sha512-cYZy5WNTkWs5GgggGnjfGqC44CWir0pAv4GVVSx0fsup4D4pMKBJPrtub15f9uC+QkUf3vVkqwpBqeFxtmJQTQ==",
+      "dependencies": {
+        "@sentry/types": "7.99.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry-internal/tracing": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry-internal/tracing/-/tracing-7.99.0.tgz",
+      "integrity": "sha512-z3JQhHjoM1KdM20qrHwRClKJrNLr2CcKtCluq7xevLtXHJWNAQQbafnWD+Aoj85EWXBzKt9yJMv2ltcXJ+at+w==",
+      "dependencies": {
+        "@sentry/core": "7.99.0",
+        "@sentry/types": "7.99.0",
+        "@sentry/utils": "7.99.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry-internal/tracing/node_modules/@sentry/core": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/core/-/core-7.99.0.tgz",
+      "integrity": "sha512-vOAtzcAXEUtS/oW7wi3wMkZ3hsb5Ch96gKyrrj/mXdOp2zrcwdNV6N9/pawq2E9P/7Pw8AXw4CeDZztZrjQLuA==",
+      "dependencies": {
+        "@sentry/types": "7.99.0",
+        "@sentry/utils": "7.99.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry-internal/tracing/node_modules/@sentry/types": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/types/-/types-7.99.0.tgz",
+      "integrity": "sha512-94qwOw4w40sAs5mCmzcGyj8ZUu/KhnWnuMZARRq96k+SjRW/tHFAOlIdnFSrt3BLPvSOK7R3bVAskZQ0N4FTmA==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry-internal/tracing/node_modules/@sentry/utils": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-7.99.0.tgz",
+      "integrity": "sha512-cYZy5WNTkWs5GgggGnjfGqC44CWir0pAv4GVVSx0fsup4D4pMKBJPrtub15f9uC+QkUf3vVkqwpBqeFxtmJQTQ==",
+      "dependencies": {
+        "@sentry/types": "7.99.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry/browser": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/browser/-/browser-7.99.0.tgz",
+      "integrity": "sha512-bgfoUv3wkwwLgN5YUOe0ibB3y268ZCnamZh6nLFqnY/UBKC1+FXWFdvzVON/XKUm62LF8wlpCybOf08ebNj2yg==",
+      "dependencies": {
+        "@sentry-internal/feedback": "7.99.0",
+        "@sentry-internal/replay-canvas": "7.99.0",
+        "@sentry-internal/tracing": "7.99.0",
+        "@sentry/core": "7.99.0",
+        "@sentry/replay": "7.99.0",
+        "@sentry/types": "7.99.0",
+        "@sentry/utils": "7.99.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry/browser/node_modules/@sentry/core": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/core/-/core-7.99.0.tgz",
+      "integrity": "sha512-vOAtzcAXEUtS/oW7wi3wMkZ3hsb5Ch96gKyrrj/mXdOp2zrcwdNV6N9/pawq2E9P/7Pw8AXw4CeDZztZrjQLuA==",
+      "dependencies": {
+        "@sentry/types": "7.99.0",
+        "@sentry/utils": "7.99.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry/browser/node_modules/@sentry/types": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/types/-/types-7.99.0.tgz",
+      "integrity": "sha512-94qwOw4w40sAs5mCmzcGyj8ZUu/KhnWnuMZARRq96k+SjRW/tHFAOlIdnFSrt3BLPvSOK7R3bVAskZQ0N4FTmA==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry/browser/node_modules/@sentry/utils": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-7.99.0.tgz",
+      "integrity": "sha512-cYZy5WNTkWs5GgggGnjfGqC44CWir0pAv4GVVSx0fsup4D4pMKBJPrtub15f9uC+QkUf3vVkqwpBqeFxtmJQTQ==",
+      "dependencies": {
+        "@sentry/types": "7.99.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
    },
    "node_modules/@sentry/cli": {
-      "version": "1.74.6",
-      "resolved": "https://registry.npmjs.org/@sentry/cli/-/cli-1.74.6.tgz",
-      "integrity": "sha512-pJ7JJgozyjKZSTjOGi86chIngZMLUlYt2HOog+OJn+WGvqEkVymu8m462j1DiXAnex9NspB4zLLNuZ/R6rTQHg==",
-      "dev": true,
+      "version": "2.27.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli/-/cli-2.27.0.tgz",
+      "integrity": "sha512-pc0opd71W8lGhYvmB1keQtJkarxzCS9f9ErKYv6TfXOOX6drvwkyA6vD/6xEnpzyvqGAuGRU4T4sEeLD3irwUQ==",
      "hasInstallScript": true,
-      "license": "BSD-3-Clause",
      "dependencies": {
        "https-proxy-agent": "^5.0.0",
-        "mkdirp": "^0.5.5",
        "node-fetch": "^2.6.7",
-        "npmlog": "^4.1.2",
        "progress": "^2.0.3",
        "proxy-from-env": "^1.1.0",
        "which": "^2.0.2"
@@ -4256,7 +4413,124 @@
        "sentry-cli": "bin/sentry-cli"
      },
      "engines": {
-        "node": ">= 8"
+        "node": ">= 10"
+      },
+      "optionalDependencies": {
+        "@sentry/cli-darwin": "2.27.0",
+        "@sentry/cli-linux-arm": "2.27.0",
+        "@sentry/cli-linux-arm64": "2.27.0",
+        "@sentry/cli-linux-i686": "2.27.0",
+        "@sentry/cli-linux-x64": "2.27.0",
+        "@sentry/cli-win32-i686": "2.27.0",
+        "@sentry/cli-win32-x64": "2.27.0"
+      }
+    },
+    "node_modules/@sentry/cli-darwin": {
+      "version": "2.27.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli-darwin/-/cli-darwin-2.27.0.tgz",
+      "integrity": "sha512-/DOZlN5rK19g7YP2OaVNauQhUrRfJ88RDr6qURFiqdxYHDc3isPFGHZJmeZBTwOnDDepyZb4XLaOyfwvAOxHig==",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@sentry/cli-linux-arm": {
+      "version": "2.27.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli-linux-arm/-/cli-linux-arm-2.27.0.tgz",
+      "integrity": "sha512-JmMQ9zgFhkZUEN5WIYuJisu4Jif/ThRHDjbsbXBRbUkkgRn88hgUfg299djMvlZZxjpl3K9AEua+1TIUeQd0Sg==",
+      "cpu": [
+        "arm"
+      ],
+      "optional": true,
+      "os": [
+        "linux",
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@sentry/cli-linux-arm64": {
+      "version": "2.27.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli-linux-arm64/-/cli-linux-arm64-2.27.0.tgz",
+      "integrity": "sha512-f+zuB9XGfB8pNamNgSDhqsavuLuzi6saZxbr3uQf30bA5AESI5hspOd1zPcidOORCVZxiPzQe3+T7avBI1XLuw==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "linux",
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@sentry/cli-linux-i686": {
+      "version": "2.27.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli-linux-i686/-/cli-linux-i686-2.27.0.tgz",
+      "integrity": "sha512-/4eyz7jnYp20mZqNtpvCEBkxFW0nEjEZRo2BiASQ5/7K8CmoJRe1vhpDA0WOfzi1zTFIfpdE1/RZm2CjHS6DHQ==",
+      "cpu": [
+        "x86",
+        "ia32"
+      ],
+      "optional": true,
+      "os": [
+        "linux",
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@sentry/cli-linux-x64": {
+      "version": "2.27.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli-linux-x64/-/cli-linux-x64-2.27.0.tgz",
+      "integrity": "sha512-ptu7wXecnYssihzHlxEOaqbFHWmNEfbepBKGXTdWK2kC+D51+7yHsR9xRdThwVID1bisFgjAveKmBQjmKuXjHQ==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "linux",
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@sentry/cli-win32-i686": {
+      "version": "2.27.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli-win32-i686/-/cli-win32-i686-2.27.0.tgz",
+      "integrity": "sha512-Db4/xmdE5qV4Aq7Yc8vRw22Y46JJdGMdsMsl5jIf0GVSQPgO23O/2uTiDGpPOdeq91K9EtvpH1zQfDLIfLMaXw==",
+      "cpu": [
+        "x86",
+        "ia32"
+      ],
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@sentry/cli-win32-x64": {
+      "version": "2.27.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli-win32-x64/-/cli-win32-x64-2.27.0.tgz",
+      "integrity": "sha512-q7y/BH4iGfs0TD5PXh2Q8oqnTbOIufoT1NWJcKqvZcOiqCLK3PNUiq7xUeX1PMTrFYAh3Bm6EekOnMavqvbGmg==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=10"
      }
    },
    "node_modules/@sentry/core": {
@@ -4280,16 +4554,15 @@
      "license": "0BSD"
    },
    "node_modules/@sentry/react": {
-      "version": "7.40.0",
-      "resolved": "https://registry.npmjs.org/@sentry/react/-/react-7.40.0.tgz",
-      "integrity": "sha512-7yYagpOCdsXnVTtLL8Y7wAf2xXgsk2ncuju3O/G4kEckkLewZWmQeoknOSGFlAgVdGNhTaXc2WGzgOiBMOkhug==",
-      "license": "MIT",
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/react/-/react-7.99.0.tgz",
+      "integrity": "sha512-RtHwgzMHJhzJfSQpVG0SDPQYMTGDX3Q37/YWI59S4ALMbSW4/F6n/eQAvGVYZKbh2UCSqgFuRWaXOYkSZT17wA==",
      "dependencies": {
-        "@sentry/browser": "7.40.0",
-        "@sentry/types": "7.40.0",
-        "@sentry/utils": "7.40.0",
-        "hoist-non-react-statics": "^3.3.2",
-        "tslib": "^1.9.3"
+        "@sentry/browser": "7.99.0",
+        "@sentry/core": "7.99.0",
+        "@sentry/types": "7.99.0",
+        "@sentry/utils": "7.99.0",
+        "hoist-non-react-statics": "^3.3.2"
      },
      "engines": {
        "node": ">=8"
@@ -4298,26 +4571,82 @@
        "react": "15.x || 16.x || 17.x || 18.x"
      }
    },
-    "node_modules/@sentry/react/node_modules/tslib": {
-      "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
-      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
-      "license": "0BSD"
+    "node_modules/@sentry/react/node_modules/@sentry/core": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/core/-/core-7.99.0.tgz",
+      "integrity": "sha512-vOAtzcAXEUtS/oW7wi3wMkZ3hsb5Ch96gKyrrj/mXdOp2zrcwdNV6N9/pawq2E9P/7Pw8AXw4CeDZztZrjQLuA==",
+      "dependencies": {
+        "@sentry/types": "7.99.0",
+        "@sentry/utils": "7.99.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry/react/node_modules/@sentry/types": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/types/-/types-7.99.0.tgz",
+      "integrity": "sha512-94qwOw4w40sAs5mCmzcGyj8ZUu/KhnWnuMZARRq96k+SjRW/tHFAOlIdnFSrt3BLPvSOK7R3bVAskZQ0N4FTmA==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry/react/node_modules/@sentry/utils": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-7.99.0.tgz",
+      "integrity": "sha512-cYZy5WNTkWs5GgggGnjfGqC44CWir0pAv4GVVSx0fsup4D4pMKBJPrtub15f9uC+QkUf3vVkqwpBqeFxtmJQTQ==",
+      "dependencies": {
+        "@sentry/types": "7.99.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
    },
    "node_modules/@sentry/replay": {
-      "version": "7.40.0",
-      "resolved": "https://registry.npmjs.org/@sentry/replay/-/replay-7.40.0.tgz",
-      "integrity": "sha512-Y9Kvo9jKouUdrHQhHVv5SmWZClF5o7BFI6oVpLlv4zXORPQlyoZONM/9sxiMvvH73alDSpxzCoxyhlypAOH4ww==",
-      "license": "MIT",
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/replay/-/replay-7.99.0.tgz",
+      "integrity": "sha512-gyN/I2WpQrLAZDT+rScB/0jnFL2knEVBo8U8/OVt8gNP20Pq8T/rDZKO/TG0cBfvULDUbJj2P4CJryn2p/O2rA==",
      "dependencies": {
-        "@sentry/core": "7.40.0",
-        "@sentry/types": "7.40.0",
-        "@sentry/utils": "7.40.0"
+        "@sentry-internal/tracing": "7.99.0",
+        "@sentry/core": "7.99.0",
+        "@sentry/types": "7.99.0",
+        "@sentry/utils": "7.99.0"
      },
      "engines": {
        "node": ">=12"
      }
    },
+    "node_modules/@sentry/replay/node_modules/@sentry/core": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/core/-/core-7.99.0.tgz",
+      "integrity": "sha512-vOAtzcAXEUtS/oW7wi3wMkZ3hsb5Ch96gKyrrj/mXdOp2zrcwdNV6N9/pawq2E9P/7Pw8AXw4CeDZztZrjQLuA==",
+      "dependencies": {
+        "@sentry/types": "7.99.0",
+        "@sentry/utils": "7.99.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry/replay/node_modules/@sentry/types": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/types/-/types-7.99.0.tgz",
+      "integrity": "sha512-94qwOw4w40sAs5mCmzcGyj8ZUu/KhnWnuMZARRq96k+SjRW/tHFAOlIdnFSrt3BLPvSOK7R3bVAskZQ0N4FTmA==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@sentry/replay/node_modules/@sentry/utils": {
+      "version": "7.99.0",
+      "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-7.99.0.tgz",
+      "integrity": "sha512-cYZy5WNTkWs5GgggGnjfGqC44CWir0pAv4GVVSx0fsup4D4pMKBJPrtub15f9uC+QkUf3vVkqwpBqeFxtmJQTQ==",
+      "dependencies": {
+        "@sentry/types": "7.99.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
    "node_modules/@sentry/tracing": {
      "version": "7.40.0",
      "resolved": "https://registry.npmjs.org/@sentry/tracing/-/tracing-7.40.0.tgz",
@@ -4381,6 +4710,27 @@
        "node": ">= 8"
      }
    },
+    "node_modules/@sentry/webpack-plugin/node_modules/@sentry/cli": {
+      "version": "1.77.3",
+      "resolved": "https://registry.npmjs.org/@sentry/cli/-/cli-1.77.3.tgz",
+      "integrity": "sha512-c3eDqcDRmy4TFz2bFU5Y6QatlpoBPPa8cxBooaS4aMQpnIdLYPF1xhyyiW0LQlDUNc3rRjNF7oN5qKoaRoMTQQ==",
+      "dev": true,
+      "hasInstallScript": true,
+      "dependencies": {
+        "https-proxy-agent": "^5.0.0",
+        "mkdirp": "^0.5.5",
+        "node-fetch": "^2.6.7",
+        "progress": "^2.0.3",
+        "proxy-from-env": "^1.1.0",
+        "which": "^2.0.2"
+      },
+      "bin": {
+        "sentry-cli": "bin/sentry-cli"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
    "node_modules/@sinclair/typebox": {
      "version": "0.24.51",
      "resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.24.51.tgz",
@@ -6112,12 +6462,21 @@
        "@apollo/client": "^3.0.0"
      }
    },
-    "node_modules/aproba": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz",
-      "integrity": "sha512-Y9J6ZjXtoYh8RnXVCMOU/ttDmk1aBjunq9vO0ta5x85WDQiQfUF9sIPBITdbiiIVcBo03Hi3jMxigBtsddlXRw==",
-      "dev": true,
-      "license": "ISC"
+    "node_modules/apollo-link-sentry": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/apollo-link-sentry/-/apollo-link-sentry-3.3.0.tgz",
+      "integrity": "sha512-wLffWmo5sRw3rHN1Ck6azM0oxObvtaBBf3AC8cLX4SxhyjmkRIagGDji6CFkyAhxupPz0b9/H1u4Ocx+63lNug==",
+      "dependencies": {
+        "deepmerge": "^4.2.2",
+        "dot-prop": "^6.0.0",
+        "tslib": "^2.0.3",
+        "zen-observable-ts": "^1.2.5"
+      },
+      "peerDependencies": {
+        "@apollo/client": "^3.2.3",
+        "@sentry/browser": "^7.41.0",
+        "graphql": "15 - 16"
+      }
    },
    "node_modules/arch": {
      "version": "2.2.0",
@@ -6140,17 +6499,6 @@
      ],
      "license": "MIT"
    },
-    "node_modules/are-we-there-yet": {
-      "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.7.tgz",
-      "integrity": "sha512-nxwy40TuMiUGqMyRHgCSWZ9FM4VAoRP4xUYSTv5ImRog+h9yISPbVH7H8fASCIzYn9wlEv4zvFL7uKDMCFQm3g==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "delegates": "^1.0.0",
-        "readable-stream": "^2.0.6"
-      }
-    },
    "node_modules/arg": {
      "version": "5.0.2",
      "resolved": "https://registry.npmjs.org/arg/-/arg-5.0.2.tgz",
@@ -7571,16 +7919,6 @@
        "node": ">=4"
      }
    },
-    "node_modules/code-point-at": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
-      "integrity": "sha512-RpAVKQA5T63xEj6/giIbUEtZwJ4UFIc3ZtvEkiaUERylqe8xb5IvqcgOurZLahv93CLKfxcw5YI+DZcUBRyLXA==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
    "node_modules/collect-v8-coverage": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/collect-v8-coverage/-/collect-v8-coverage-1.0.1.tgz",
@@ -7743,13 +8081,6 @@
        "node": ">=0.8"
      }
    },
-    "node_modules/console-control-strings": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
-      "integrity": "sha512-ty/fTekppD2fIwRvnZAVdeOiGd1c7YXEixbgJTNzqcxJWKQnjJ/V1bNEEE6hygpM3WjwHFUVK6HTjWSzV4a8sQ==",
-      "dev": true,
-      "license": "ISC"
-    },
    "node_modules/content-disposition": {
      "version": "0.5.4",
      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.4.tgz",
@@ -8911,13 +9242,6 @@
        "node": ">=0.4.0"
      }
    },
-    "node_modules/delegates": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
-      "integrity": "sha512-bd2L678uiWATM6m5Z1VzNCErI3jiGzt6HGY8OVICs40JQq/HALfbyNJmp0UDakEY4pMMaN0Ly5om/B1VI/+xfQ==",
-      "dev": true,
-      "license": "MIT"
-    },
    "node_modules/denque": {
      "version": "1.5.1",
      "resolved": "https://registry.npmjs.org/denque/-/denque-1.5.1.tgz",
@@ -9218,6 +9542,28 @@
        "tslib": "^2.0.3"
      }
    },
+    "node_modules/dot-prop": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-6.0.1.tgz",
+      "integrity": "sha512-tE7ztYzXHIeyvc7N+hR3oi7FIbf/NIjVP9hmAt3yMXzrQ072/fpjGLx2GxNxGxUl5V73MEqYzioOMoVhGMJ5cA==",
+      "dependencies": {
+        "is-obj": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/dot-prop/node_modules/is-obj": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-2.0.0.tgz",
+      "integrity": "sha512-drqDG3cbczxxEJRoOXcOjtdp1J/lyp1mNn0xaznRs8+muBhgQcrnbspox5X5fOw0HnMnbfDzvnEMEtqDEJEo8w==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
    "node_modules/dotenv": {
      "version": "16.0.1",
      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.0.1.tgz",
@@ -10464,6 +10810,8 @@
    },
    "node_modules/eventemitter2": {
      "version": "6.4.7",
+      "resolved": "https://registry.npmjs.org/eventemitter2/-/eventemitter2-6.4.7.tgz",
+      "integrity": "sha512-tYUSVOGeQPKt/eC1ABfhHy5Xd96N3oIijJvN3O9+TsC28T5V9yX9oEfEK5faP0EFSNVOG97qtAS68GBrQB2hDg==",
      "dev": true,
      "license": "MIT"
    },
@@ -11283,74 +11631,6 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
-    "node_modules/gauge": {
-      "version": "2.7.4",
-      "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
-      "integrity": "sha512-14x4kjc6lkD3ltw589k0NrPD6cCNTD6CWoVUNpB85+DrtONoZn+Rug6xZU5RvSC4+TZPxA5AnBibQYAvZn41Hg==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "aproba": "^1.0.3",
-        "console-control-strings": "^1.0.0",
-        "has-unicode": "^2.0.0",
-        "object-assign": "^4.1.0",
-        "signal-exit": "^3.0.0",
-        "string-width": "^1.0.1",
-        "strip-ansi": "^3.0.1",
-        "wide-align": "^1.1.0"
-      }
-    },
-    "node_modules/gauge/node_modules/ansi-regex": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-      "integrity": "sha512-TIGnTpdo+E3+pCyAluZvtED5p5wCqLdezCyhPZzKPcxvFplEt4i+W7OONCKgeZFT3+y5NZZfOOS/Bdcanm1MYA==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/gauge/node_modules/is-fullwidth-code-point": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-      "integrity": "sha512-1pqUqRjkhPJ9miNq9SwMfdvi6lBJcd6eFxvfaivQhaH3SgisfiuudvFntdKOmxuee/77l+FPjKrQjWvmPjWrRw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "number-is-nan": "^1.0.0"
-      },
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/gauge/node_modules/string-width": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-      "integrity": "sha512-0XsVpQLnVCXHJfyEs8tC0zpTVIr5PKKsQtkT29IwupnPTjtPmQ3xT/4yCREF9hYkV/3M3kzcUTSAZT6a6h81tw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "code-point-at": "^1.0.0",
-        "is-fullwidth-code-point": "^1.0.0",
-        "strip-ansi": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/gauge/node_modules/strip-ansi": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-      "integrity": "sha512-VhumSSbBqDTP8p2ZLKj40UjBCV4+v8bUSEpUb4KjRgWk9pbqGF4REFj6KEagidb2f/M6AzC0EmFyDNGaw9OCzg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "ansi-regex": "^2.0.0"
-      },
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
    "node_modules/gensync": {
      "version": "1.0.0-beta.2",
      "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
@@ -11753,13 +12033,6 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
-    "node_modules/has-unicode": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
-      "integrity": "sha512-8Rf9Y83NBReMnx0gFzA8JImQACstCYWUplepDa9xprwwtmgEZUF0h/i5xSA625zB/I37EtrswSST6OXxwaaIJQ==",
-      "dev": true,
-      "license": "ISC"
-    },
    "node_modules/he": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz",
@@ -15744,19 +16017,6 @@
        "node": ">=8"
      }
    },
-    "node_modules/npmlog": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz",
-      "integrity": "sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "are-we-there-yet": "~1.1.2",
-        "console-control-strings": "~1.1.0",
-        "gauge": "~2.7.3",
-        "set-blocking": "~2.0.0"
-      }
-    },
    "node_modules/nth-check": {
      "version": "2.1.1",
      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.1.1.tgz",
@@ -15769,16 +16029,6 @@
        "url": "https://github.com/fb55/nth-check?sponsor=1"
      }
    },
-    "node_modules/number-is-nan": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
-      "integrity": "sha512-4jbtZXNAsfZbAHiiqjLPBiCl16dES1zI4Hpzzxw61Tk+loF+sBDBKx1ICKKKwIqQ7M0mFn1TmkN7euSncWgHiQ==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
    "node_modules/nwsapi": {
      "version": "2.2.1",
      "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.1.tgz",
@@ -17794,7 +18044,6 @@
      "version": "2.0.3",
      "resolved": "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz",
      "integrity": "sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==",
-      "dev": true,
      "license": "MIT",
      "engines": {
        "node": ">=0.4.0"
@@ -20526,13 +20775,6 @@
        "node": ">= 0.8.0"
      }
    },
-    "node_modules/set-blocking": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
-      "integrity": "sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==",
-      "dev": true,
-      "license": "ISC"
-    },
    "node_modules/setprototypeof": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz",
@@ -23067,16 +23309,6 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
-    "node_modules/wide-align": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.5.tgz",
-      "integrity": "sha512-eDMORYaPNZ4sQIuuYPDHdQvf4gyCF9rEEV/yPxGfwPkRodwEgiMUUXTx/dex+Me0wxx53S+NgUHaP7y3MGlDmg==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "string-width": "^1.0.2 || 2 || 3 || 4"
-      }
-    },
    "node_modules/wildcard": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/wildcard/-/wildcard-2.0.0.tgz",
--- a/client/package.json
+++ b/client/package.json
@@ -9,12 +9,14 @@
    "@craco/craco": "^7.0.0",
    "@fingerprintjs/fingerprintjs": "^3.4.2",
    "@jsreport/browser-client": "^3.1.0",
-    "@sentry/react": "^7.40.0",
+    "@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",
@@ -88,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": "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": [
--- a/client/src/App/App.container.jsx
+++ b/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);
--- a/client/src/components/csi-response-form/csi-response-form.container.jsx
+++ b/client/src/components/csi-response-form/csi-response-form.container.jsx
@@ -5,6 +5,7 @@ import React, { useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { useLocation } from "react-router-dom";
 import { QUERY_CSI_RESPONSE_BY_PK } from "../../graphql/csi.queries";
+import { DateFormatter } from "../../utils/DateFormatter";
 import AlertComponent from "../alert/alert.component";
 import ConfigFormComponents from "../config-form-components/config-form-components.component";
 import LoadingSpinner from "../loading-spinner/loading-spinner.component";
@@ -44,6 +45,13 @@ export default function CsiResponseFormContainer() {
          readOnly
          componentList={data.csi_by_pk.csiquestion.config}
        />
+        {data.csi_by_pk.validuntil ? (
+          <>
+            {t("csi.fields.validuntil")}
+            {": "}
+            <DateFormatter>{data.csi_by_pk.validuntil}</DateFormatter>
+          </>
+        ) : null}
      </Form>
    </Card>
  );
--- a/client/src/components/csi-response-list-paginated/csi-response-list-paginated.component.jsx
+++ b/client/src/components/csi-response-list-paginated/csi-response-list-paginated.component.jsx
@@ -5,9 +5,11 @@ import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Link, useHistory, useLocation } from "react-router-dom";
 import { DateFormatter } from "../../utils/DateFormatter";
-import { alphaSort } from "../../utils/sorters";
-import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
-import {pageLimit} from "../../utils/config";
+import { pageLimit } from "../../utils/config";
+import { alphaSort, dateSort } from "../../utils/sorters";
+import OwnerNameDisplay, {
+  OwnerNameDisplayFunction,
+} from "../owner-name-display/owner-name-display.component";

 export default function CsiResponseListPaginated({
  refetch,
@@ -16,23 +18,23 @@ export default function CsiResponseListPaginated({
  total,
 }) {
  const search = queryString.parse(useLocation().search);
-  const { responseid, page, sortcolumn, sortorder } = search;
+  const { responseid } = search;
  const history = useHistory();
+  const { t } = useTranslation();
  const [state, setState] = useState({
    sortedInfo: {},
    filteredInfo: { text: "" },
+    page: "",
  });

-  const { t } = useTranslation();
  const columns = [
    {
      title: t("jobs.fields.ro_number"),
      dataIndex: "ro_number",
      key: "ro_number",
-      width: "8%",
      sorter: (a, b) => alphaSort(a.job.ro_number, b.job.ro_number),
-      sortOrder: sortcolumn === "ro_number" && sortorder,
-
+      sortOrder:
+        state.sortedInfo.columnKey === "ro_number" && state.sortedInfo.order,
      render: (text, record) => (
        <Link to={"/manage/jobs/" + record.job.id}>
          {record.job.ro_number || t("general.labels.na")}
@@ -41,15 +43,18 @@ export default function CsiResponseListPaginated({
    },
    {
      title: t("jobs.fields.owner"),
-      dataIndex: "owner",
-      key: "owner",
-      ellipsis: true,
-      sorter: (a, b) => alphaSort(a.job.ownr_ln, b.job.ownr_ln),
-      width: "25%",
-      sortOrder: sortcolumn === "owner" && sortorder,
+      dataIndex: "owner_name",
+      key: "owner_name",
+      sorter: (a, b) =>
+        alphaSort(
+          OwnerNameDisplayFunction(a.job),
+          OwnerNameDisplayFunction(b.job)
+        ),
+      sortOrder:
+        state.sortedInfo.columnKey === "owner_name" && state.sortedInfo.order,
      render: (text, record) => {
-        return record.job.owner ? (
-          <Link to={"/manage/owners/" + record.job.owner.id}>
+        return record.job.ownerid ? (
+          <Link to={"/manage/owners/" + record.job.ownerid}>
            <OwnerNameDisplay ownerObject={record.job} />
          </Link>
        ) : (
@@ -64,9 +69,9 @@ export default function CsiResponseListPaginated({
      dataIndex: "completedon",
      key: "completedon",
      ellipsis: true,
-      sorter: (a, b) => a.completedon - b.completedon,
-      width: "25%",
-      sortOrder: sortcolumn === "completedon" && sortorder,
+      sorter: (a, b) => dateSort(a.completedon, b.completedon),
+      sortOrder:
+        state.sortedInfo.columnKey === "completedon" && state.sortedInfo.order,
      render: (text, record) => {
        return record.completedon ? (
          <DateFormatter>{record.completedon}</DateFormatter>
@@ -76,11 +81,12 @@ export default function CsiResponseListPaginated({
  ];

  const handleTableChange = (pagination, filters, sorter) => {
-    setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
-    search.page = pagination.current;
-    search.sortcolumn = sorter.columnKey;
-    search.sortorder = sorter.order;
-    history.push({ search: queryString.stringify(search) });
+    setState({
+      ...state,
+      filteredInfo: filters,
+      sortedInfo: sorter,
+      page: pagination.current,
+    });
  };

  const handleOnRowClick = (record) => {
@@ -108,7 +114,7 @@ export default function CsiResponseListPaginated({
        pagination={{
          position: "top",
          pageSize: pageLimit,
-          current: parseInt(page || 1),
+          current: parseInt(state.page || 1),
          total: total,
        }}
        columns={columns}
@@ -122,13 +128,6 @@ export default function CsiResponseListPaginated({
          selectedRowKeys: [responseid],
          type: "radio",
        }}
-        onRow={(record, rowIndex) => {
-          return {
-            onClick: (event) => {
-              handleOnRowClick(record);
-            }, // click row
-          };
-        }}
      />
    </Card>
  );
--- a/client/src/components/error-boundary/error-boundary.component.jsx
+++ b/client/src/components/error-boundary/error-boundary.component.jsx
@@ -2,7 +2,7 @@ import { Button, Col, Collapse, Result, Row, Space } from "antd";
 import React from "react";
 import { withTranslation } from "react-i18next";
 import { logImEXEvent } from "../../firebase/firebase.utils";
-
+import * as Sentry from "@sentry/react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import {
@@ -138,7 +138,6 @@ class ErrorBoundary extends React.Component {
  }
 }

-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(withTranslation()(ErrorBoundary));
+export default Sentry.withErrorBoundary(
+  connect(mapStateToProps, mapDispatchToProps)(withTranslation()(ErrorBoundary))
+);
--- a/client/src/components/jobs-list/jobs-list.component.jsx
+++ b/client/src/components/jobs-list/jobs-list.component.jsx
@@ -1,8 +1,8 @@
 import {
-    BranchesOutlined,
-    ExclamationCircleFilled,
-    PauseCircleOutlined,
-    SyncOutlined,
+  BranchesOutlined,
+  ExclamationCircleFilled,
+  PauseCircleOutlined,
+  SyncOutlined,
 } from "@ant-design/icons";
 import { useQuery } from "@apollo/client";
 import { Button, Card, Grid, Input, Space, Table, Tooltip } from "antd";
--- a/client/src/components/production-board-kanban/production-board-kanban.component.jsx
+++ b/client/src/components/production-board-kanban/production-board-kanban.component.jsx
@@ -115,7 +115,7 @@ export function ProductionBoardKanbanComponent({
      // console.log("==> New Card is somewhere in the middle");
      movedCardNewKanbanParent = newChildCard.kanbanparent;
    } else {
-      throw new Error("==> !!!!!!Couldn't find a parent.!!!! <==");
+      console.log("==> !!!!!!Couldn't find a parent.!!!! <==");
    }
    const newChildCardNewParent = newChildCard ? card.id : null;
    const update = await client.mutate({
@@ -153,7 +153,7 @@ export function ProductionBoardKanbanComponent({
      0
    )
    .toFixed(1);
-    const totalLAB = data
+  const totalLAB = data
    .reduce(
      (acc, val) => acc + (val.labhrs?.aggregate?.sum?.mod_lb_hrs || 0),
      0
--- a/client/src/components/shop-csi-config-form/shop-csi-config-form.component.jsx
+++ b/client/src/components/shop-csi-config-form/shop-csi-config-form.component.jsx
@@ -1,5 +1,5 @@
-import React from "react";
 import { Form } from "antd";
+import React from "react";
 import ConfigFormComponents from "../config-form-components/config-form-components.component";

 export default function ShopCsiConfigForm({ selectedCsi }) {
@@ -9,7 +9,7 @@ export default function ShopCsiConfigForm({ selectedCsi }) {

  return (
    <div>
-      The Config Form {readOnly}
+      {readOnly}
      {selectedCsi && (
        <Form form={form} onFinish={handleFinish}>
          <ConfigFormComponents
--- a/client/src/components/shop-csi-config/shop-csi-config.component.jsx
+++ b/client/src/components/shop-csi-config/shop-csi-config.component.jsx
@@ -1,7 +1,7 @@
 import { CheckCircleFilled } from "@ant-design/icons";
+import { useQuery } from "@apollo/client";
 import { Button, Col, List, Row } from "antd";
 import React, { useState } from "react";
-import { useQuery } from "@apollo/client";
 import { useTranslation } from "react-i18next";
 import { GET_ALL_QUESTION_SETS } from "../../graphql/csi.queries";
 import { DateFormatter } from "../../utils/DateFormatter";
@@ -21,7 +21,6 @@ export default function ShopCsiConfig() {
  if (error) return <AlertComponent message={error.message} type="error" />;
  return (
    <div>
-      The Config Form
      <Row>
        <Col span={3}>
          <List
@@ -42,7 +41,8 @@ export default function ShopCsiConfig() {
            )}
          />
        </Col>
-        <Col span={21}>
+        <Col span={1} />
+        <Col span={20}>
          <ShopCsiConfigForm selectedCsi={selectedCsi} />
        </Col>
      </Row>
--- a/client/src/graphql/apollo-error-handling.js
+++ b/client/src/graphql/apollo-error-handling.js
@@ -1,17 +1,21 @@
 import { onError } from "@apollo/client/link/error";
 //https://stackoverflow.com/questions/57163454/refreshing-a-token-with-apollo-client-firebase-auth
+import * as Sentry from "@sentry/react";

 const errorLink = onError(
  ({ graphQLErrors, networkError, operation, forward }) => {
-    if (graphQLErrors)
-      graphQLErrors.forEach(({ message, locations, path }) =>
+    if (graphQLErrors) {
+      graphQLErrors.forEach(({ message, locations, path }) => {
        console.log(
          `[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`
-        )
-      );
+        );
+        Sentry.captureException({ message, locations, path });
+      });
+    }
    if (networkError)
      console.log(`[Network error]: ${JSON.stringify(networkError)}`);
    console.log(operation.getContext());
+    return forward(operation);
  }
 );

--- a/client/src/graphql/csi.queries.js
+++ b/client/src/graphql/csi.queries.js
@@ -57,19 +57,15 @@ export const INSERT_CSI = gql`
 `;

 export const QUERY_CSI_RESPONSE_PAGINATED = gql`
-  query QUERY_CSI_RESPONSE_PAGINATED(
-    $offset: Int
-    $limit: Int
-    $order: [csi_order_by!]!
-  ) {
-    csi(offset: $offset, limit: $limit, order_by: $order) {
+  query QUERY_CSI_RESPONSE_PAGINATED {
+    csi(order_by: { completedon: desc_nulls_last }) {
      id
      completedon
      job {
        ownr_fn
        ownr_ln
+        ownerid
        ro_number
-
        id
      }
    }
@@ -83,6 +79,7 @@ export const QUERY_CSI_RESPONSE_PAGINATED = gql`
 export const QUERY_CSI_RESPONSE_BY_PK = gql`
  query QUERY_CSI_RESPONSE_BY_PK($id: uuid!) {
    csi_by_pk(id: $id) {
+      completedon
      relateddata
      valid
      validuntil
--- a/client/src/index.js
+++ b/client/src/index.js
@@ -14,38 +14,38 @@ import { persistor, store } from "./redux/store";
 import reportWebVitals from "./reportWebVitals";
 import "./translations/i18n";
 import "./utils/CleanAxios";
+
 //import { BrowserTracing } from "@sentry/tracing";

 // Dinero.defaultCurrency = "CAD";
 // Dinero.globalLocale = "en-CA";
 Dinero.globalRoundingMode = "HALF_EVEN";

-if (process.env.NODE_ENV !== "development") {
-  Sentry.init({
-    dsn: "https://fd7e89369b6b4bdc9c6c4c9f22fa4ee4@o492140.ingest.sentry.io/5651027",
-    ignoreErrors: [
-      "ResizeObserver loop",
-      "Module specifier, 'fs' does not start",
-      "Module specifier, 'zlib' does not start with",
-    ],
-    integrations: [
-      // new BrowserTracing(),
-      // new Sentry.Integrations.Breadcrumbs({ console: true }),
-      //  new Sentry.Replay(),
-    ],
-    // This sets the sample rate to be 10%. You may want this to be 100% while
-    // in development and sample at a lower rate in production
-    // replaysSessionSampleRate: 0.1,
-    // // If the entire session is not sampled, use the below sample rate to sample
-    // // sessions when an error occurs.
-    // replaysOnErrorSampleRate: 1.0,
-    environment: process.env.NODE_ENV,
-    // tracesSampleRate: 0.2,
-    // We recommend adjusting this value in production, or using tracesSampler
-    // for finer control
-    //  tracesSampleRate: 0.5,
-  });
-}
+//if (process.env.NODE_ENV !== "development") {
+Sentry.init({
+  dsn: "https://fd7e89369b6b4bdc9c6c4c9f22fa4ee4@o492140.ingest.sentry.io/5651027",
+  ignoreErrors: [
+    "ResizeObserver loop",
+    "Module specifier, 'fs' does not start",
+    "Module specifier, 'zlib' does not start with",
+  ],
+  integrations: [
+    Sentry.replayIntegration({
+      maskAllText: false,
+      blockAllMedia: true,
+    }),
+    new Sentry.BrowserTracing({}),
+  ],
+  tracePropagationTargets: [
+    "api.imex.online",
+    "api.test.imex.online",
+    "db.imex.online",
+  ],
+  tracesSampleRate: 1.0,
+  replaysOnErrorSampleRate: 1.0,
+  environment: process.env.NODE_ENV,
+});
+//}

 ReactDOM.render(
  <Provider store={store}>
--- a/client/src/pages/csi/csi.container.page.jsx
+++ b/client/src/pages/csi/csi.container.page.jsx
@@ -1,88 +1,67 @@
-import { useQuery, useMutation } from "@apollo/client";
-import { Form, Layout, Typography, Button, Result } from "antd";
-import React, { useState } from "react";
+// import { useMutation, useQuery } from "@apollo/client";
+import { Button, Form, Layout, Result, Typography } from "antd";
+import axios from "axios";
+import React, { useCallback, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
 import { useParams } from "react-router-dom";
+import { createStructuredSelector } from "reselect";
 import AlertComponent from "../../components/alert/alert.component";
 import ConfigFormComponents from "../../components/config-form-components/config-form-components.component";
 import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
-import { QUERY_SURVEY, COMPLETE_SURVEY } from "../../graphql/csi.queries";
-import { connect } from "react-redux";
-import { createStructuredSelector } from "reselect";
 import { selectCurrentUser } from "../../redux/user/user.selectors";
+import { DateTimeFormat } from "./../../utils/DateFormatter";

 const mapStateToProps = createStructuredSelector({
  currentUser: selectCurrentUser,
 });
-const mapDispatchToProps = (dispatch) => ({
-  //setUserLanguage: language => dispatch(setUserLanguage(language))
-});
+const mapDispatchToProps = (dispatch) => ({});
+
 export default connect(mapStateToProps, mapDispatchToProps)(CsiContainerPage);

 export function CsiContainerPage({ currentUser }) {
  const { surveyId } = useParams();
  const [form] = Form.useForm();
+  const [axiosResponse, setAxiosResponse] = useState(null);
  const [submitting, setSubmitting] = useState({
    loading: false,
    submitted: false,
  });
-
-  const { loading, error, data } = useQuery(QUERY_SURVEY, {
-    variables: { surveyId },
-    fetchPolicy: "network-only",
-    nextFetchPolicy: "network-only",
-  });
-
  const { t } = useTranslation();
-  const [completeSurvey] = useMutation(COMPLETE_SURVEY);
-  if (loading) return <LoadingSpinner />;

-  if (error || !!!data.csi_by_pk)
-    return (
-      <div>
-        <Result
-          status="error"
-          title={t("csi.errors.notfoundtitle")}
-          subTitle={t("csi.errors.notfoundsubtitle")}
-        >
-          {error ? (
-            <div>ERROR: {error.graphQLErrors.map((e) => e.message)}</div>
-          ) : null}
-        </Result>
-      </div>
-    );
-
-  const handleFinish = async (values) => {
-    setSubmitting({ ...submitting, loading: true });
-
-    const result = await completeSurvey({
-      variables: {
-        surveyId,
-        survey: {
-          response: values,
-          valid: false,
-          completedon: new Date(),
-        },
-      },
-    });
-
-    if (!!!result.errors) {
-      setSubmitting({ ...submitting, loading: false, submitted: true });
-    } else {
-      setSubmitting({
-        ...submitting,
+  const getAxiosData = useCallback(async () => {
+    try {
+      try {
+        window.$crisp.push(["do", "chat:hide"]);
+      } catch {
+        console.log("Unable to attach to crisp instance. ");
+      }
+      setSubmitting((prevSubmitting) => ({ ...prevSubmitting, loading: true }));
+      const response = await axios.post("/csi/lookup", { surveyId });
+      setSubmitting((prevSubmitting) => ({
+        ...prevSubmitting,
        loading: false,
-        error: JSON.stringify(result.errors),
+      }));
+      setAxiosResponse(response.data);
+    } catch (error) {
+      console.error(`Something went wrong...: ${error.message}`);
+      console.dir({
+        stack: error?.stack,
+        message: error?.message,
      });
    }
-  };
+  }, [setAxiosResponse, surveyId]);

-  const {
-    relateddata: { bodyshop, job },
-    csiquestion: { config: csiquestions },
-  } = data.csi_by_pk;
+  useEffect(() => {
+    getAxiosData().catch((err) =>
+      console.error(
+        `Something went wrong fetching axios data: ${err.message || ""}`
+      )
+    );
+  }, [getAxiosData]);

-  if (currentUser && currentUser.authorized)
+  // Return if authorized
+  if (currentUser && currentUser.authorized) {
    return (
      <Layout
        style={{ height: "100vh", display: "flex", flexDirection: "column" }}
@@ -94,85 +73,176 @@ export function CsiContainerPage({ currentUser }) {
        />
      </Layout>
    );
+  }

-  return (
-    <Layout
-      style={{ height: "100vh", display: "flex", flexDirection: "column" }}
-    >
-      <div
-        style={{
-          display: "flex",
-          flexDirection: "column",
-          alignItems: "center",
-        }}
-      >
-        <div style={{ display: "flex", alignItems: "center", margin: "2em" }}>
-          {bodyshop.logo_img_path && bodyshop.logo_img_path.src ? (
-            <img src={bodyshop.logo_img_path.src} alt="Logo" />
-          ) : null}
-          <div style={{ margin: "2em" }}>
-            <strong>{bodyshop.shopname || ""}</strong>
-            <div>{`${bodyshop.address1 || ""}`}</div>
-            <div>{`${bodyshop.address2 || ""}`}</div>
-            <div>{`${bodyshop.city || ""} ${bodyshop.state || ""} ${
-              bodyshop.zip_post || ""
-            }`}</div>
+  if (submitting.loading) return <LoadingSpinner />;
+
+  const handleFinish = async (values) => {
+    try {
+      setSubmitting({ ...submitting, loading: true, submitting: true });
+      const result = await axios.post("/csi/submit", { surveyId, values });
+      console.log("result", result);
+      if (!!!result.errors && result.data.update_csi.affected_rows > 0) {
+        setSubmitting({ ...submitting, loading: false, submitted: true });
+      }
+    } catch (error) {
+      console.error(`Something went wrong...: ${error.message}`);
+      console.dir({
+        stack: error?.stack,
+        message: error?.message,
+      });
+    }
+  };
+
+  if (!axiosResponse || axiosResponse.csi_by_pk === null) {
+    // Do something here , this is where you would return a loading box or something
+    return (
+      <>
+        <Layout style={{ display: "flex", flexDirection: "column" }}>
+          <Layout.Content
+            style={{
+              backgroundColor: "#fff",
+              margin: "2em 4em",
+              padding: "2em",
+              overflowY: "auto",
+              textAlign: "center",
+              display: "flex",
+              justifyContent: "center",
+              alignItems: "center",
+            }}
+          >
+            <Form>
+              <Result
+                status="error"
+                title={t("csi.errors.notfoundtitle")}
+                subTitle={t("csi.errors.notfoundsubtitle")}
+              />
+            </Form>
+          </Layout.Content>
+          <Layout.Footer>
+            {t("csi.labels.copyright")}{" "}
+            {t("csi.fields.surveyid", { surveyId: surveyId })}
+          </Layout.Footer>
+        </Layout>
+      </>
+    );
+  } else {
+    const {
+      relateddata: { bodyshop, job },
+      csiquestion: { config: csiquestions },
+    } = axiosResponse.csi_by_pk;
+
+    return (
+      <Layout style={{ display: "flex", flexDirection: "column" }}>
+        <div
+          style={{
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "center",
+          }}
+        >
+          <div style={{ display: "flex", alignItems: "center", margin: "2em" }}>
+            {bodyshop.logo_img_path && bodyshop.logo_img_path.src ? (
+              <img
+                src={bodyshop.logo_img_path.src}
+                alt={bodyshop.shopname.concat(" Logo")}
+                height={bodyshop.logo_img_path.height}
+                width={bodyshop.logo_img_path.width}
+              />
+            ) : null}
+            <div style={{ margin: "2em", verticalAlign: "middle" }}>
+              <Typography.Title level={4} style={{ margin: 0 }}>
+                {bodyshop.shopname || ""}
+              </Typography.Title>
+              <Typography.Paragraph style={{ margin: 0 }}>
+                {`${bodyshop.address1 || ""}${bodyshop.address2 ? ", " : ""}${
+                  bodyshop.address2 || ""
+                }`.trim()}
+              </Typography.Paragraph>
+              <Typography.Paragraph style={{ margin: 0 }}>
+                {`${bodyshop.city || ""}${
+                  bodyshop.city && bodyshop.state ? ", " : ""
+                }${bodyshop.state || ""} ${bodyshop.zip_post || ""}`.trim()}
+              </Typography.Paragraph>
+            </div>
          </div>
+          <Typography.Title>{t("csi.labels.title")}</Typography.Title>
+          <strong>
+            {t("csi.labels.greeting", {
+              name: job.ownr_co_nm || job.ownr_fn || "",
+            })}
+          </strong>
+          <Typography.Paragraph>
+            {t("csi.labels.intro", { shopname: bodyshop.shopname || "" })}
+          </Typography.Paragraph>
        </div>
-        <Typography.Title>{t("csi.labels.title")}</Typography.Title>
-        <strong>{`Hi ${job.ownr_co_nm || job.ownr_fn || ""}!`}</strong>
-        <Typography.Paragraph>
-          {`At ${
-            bodyshop.shopname || ""
-          }, we value your feedback. We would love to
-          hear what you have to say. Please fill out the form below.`}
-        </Typography.Paragraph>
-      </div>

-      {submitting.error ? (
-        <AlertComponent message={submitting.error} type="error" />
-      ) : null}
+        {submitting.error ? (
+          <AlertComponent message={submitting.error} type="error" />
+        ) : null}

-      {submitting.submitted ? (
-        <Layout.Content
-          style={{
-            backgroundColor: "#fff",
-            margin: "2em 4em",
-            padding: "2em",
-            overflowY: "auto",
-          }}
-        >
-          <Result
-            status="success"
-            title={t("csi.successes.submitted")}
-            subTitle={t("csi.successes.submittedsub")}
-          />
-        </Layout.Content>
-      ) : (
-        <Layout.Content
-          style={{
-            backgroundColor: "#fff",
-            margin: "2em 4em",
-            padding: "2em",
-            overflowY: "auto",
-          }}
-        >
-          <Form form={form} onFinish={handleFinish}>
-            <ConfigFormComponents componentList={csiquestions} />
-            <Button
-              loading={submitting.loading}
-              type="primary"
-              htmlType="submit"
-            >
-              {t("general.actions.submit")}
-            </Button>
-          </Form>
-        </Layout.Content>
-      )}
-
-      <Layout.Footer>
-        {`Copyright ImEX.Online. Survey ID: ${surveyId}`}
-      </Layout.Footer>
-    </Layout>
-  );
+        {submitting.submitted ? (
+          <Layout.Content
+            style={{
+              backgroundColor: "#fff",
+              margin: "2em 4em",
+              padding: "2em",
+              overflowY: "auto",
+            }}
+          >
+            <Result
+              status="success"
+              title={t("csi.successes.submitted")}
+              subTitle={t("csi.successes.submittedsub")}
+            />
+          </Layout.Content>
+        ) : (
+          <Layout.Content
+            style={{
+              backgroundColor: "#fff",
+              margin: "2em 4em",
+              padding: "2em",
+              overflowY: "auto",
+            }}
+          >
+            <Form form={form} onFinish={handleFinish}>
+              {axiosResponse.csi_by_pk.valid ? (
+                <>
+                  <ConfigFormComponents componentList={csiquestions} />
+                  <Button
+                    loading={submitting.loading}
+                    type="primary"
+                    htmlType="submit"
+                    style={{ float: "right" }}
+                  >
+                    {t("general.actions.submit")}
+                  </Button>
+                </>
+              ) : (
+                <>
+                  <Result
+                    title={t("csi.errors.surveycompletetitle")}
+                    status="warning"
+                    subTitle={t("csi.errors.surveycompletesubtitle", {
+                      date: DateTimeFormat(axiosResponse.csi_by_pk.completedon),
+                    })}
+                  />
+                  <Typography.Paragraph
+                    type="secondary"
+                    style={{ textAlign: "center" }}
+                  >
+                    {t("csi.successes.submittedsub")}
+                  </Typography.Paragraph>
+                </>
+              )}
+            </Form>
+          </Layout.Content>
+        )}
+        <Layout.Footer>
+          {t("csi.labels.copyright")}{" "}
+          {t("csi.fields.surveyid", { surveyId: surveyId })}
+        </Layout.Footer>
+      </Layout>
+    );
+  }
 }
--- a/client/src/pages/shop-csi/shop-csi.container.page.jsx
+++ b/client/src/pages/shop-csi/shop-csi.container.page.jsx
@@ -1,22 +1,20 @@
-import { Row, Col } from "antd";
 import { useQuery } from "@apollo/client";
-import queryString from "query-string";
+import { Col, Row } from "antd";
 import React, { useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
-import { useLocation } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
 import AlertComponent from "../../components/alert/alert.component";
 import CsiResponseFormContainer from "../../components/csi-response-form/csi-response-form.container";
 import CsiResponseListPaginated from "../../components/csi-response-list-paginated/csi-response-list-paginated.component";
+import RbacWrapper from "../../components/rbac-wrapper/rbac-wrapper.component";
 import { QUERY_CSI_RESPONSE_PAGINATED } from "../../graphql/csi.queries";
 import {
  setBreadcrumbs,
  setSelectedHeader,
 } from "../../redux/application/application.actions";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import RbacWrapper from "../../components/rbac-wrapper/rbac-wrapper.component";
-import {pageLimit} from "../../utils/config";
+
 const mapStateToProps = createStructuredSelector({
  bodyshop: selectBodyshop,
 });
@@ -33,28 +31,11 @@ export function ShopCsiContainer({
 }) {
  const { t } = useTranslation();

-  const searchParams = queryString.parse(useLocation().search);
-  const { page, sortcolumn, sortorder } = searchParams;
-
  const { loading, error, data, refetch } = useQuery(
    QUERY_CSI_RESPONSE_PAGINATED,
    {
      fetchPolicy: "network-only",
      nextFetchPolicy: "network-only",
-      variables: {
-        //search: search || "",
-        offset: page ? (page - 1) * pageLimit : 0,
-        limit: pageLimit,
-        order: [
-          {
-            [sortcolumn || "completedon"]: sortorder
-              ? sortorder === "descend"
-                ? "desc_nulls_last"
-                : "asc"
-              : "desc_nulls_last",
-          },
-        ],
-      },
    }
  );

@@ -73,12 +54,7 @@ export function ShopCsiContainer({
  if (error) return <AlertComponent message={error.message} type="error" />;

  return (
-    <RbacWrapper
-      action="csi:page"
-      // noauth={
-      //   <AlertComponent message="You don't have acess to see this screen." />
-      // }
-    >
+    <RbacWrapper action="csi:page">
      <Row gutter={16}>
        <Col span={10}>
          <CsiResponseListPaginated
--- a/client/src/translations/en_us/common.json
+++ b/client/src/translations/en_us/common.json
@@ -838,20 +838,27 @@
 				"creating": "Error creating survey {{message}}",
 				"notconfigured": "You do not have any current CSI Question Sets configured.",
 				"notfoundsubtitle": "We were unable to find a survey using the link you provided. Please ensure the URL is correct or reach out to your shop for more help.",
-				"notfoundtitle": "No survey found."
+				"notfoundtitle": "No survey found.",
+				"surveycompletetitle": "Survey previously completed",
+				"surveycompletesubtitle": "This survey was already completed on {{date}}."
 			},
 			"fields": {
 				"completedon": "Completed On",
-				"created_at": "Created At"
+				"created_at": "Created At",
+				"surveyid": "Survey ID {{surveyId}}",
+				"validuntil": "Valid Until"
 			},
 			"labels": {
-				"nologgedinuser": "Please log out of ImEX Online",
-				"nologgedinuser_sub": "Users of ImEX Online cannot complete CSI surveys while logged in. Please log out and try again.",
+				"nologgedinuser": "Please log out of $t(titles.app)",
+				"nologgedinuser_sub": "Users of $t(titles.app) cannot complete CSI surveys while logged in. Please log out and try again.",
 				"noneselected": "No response selected.",
-				"title": "Customer Satisfaction Survey"
+				"title": "Customer Satisfaction Survey",
+				"greeting": "Hi {{name}}!",
+				"intro": "At {{shopname}}, we value your feedback. We would love to hear what you have to say. Please fill out the form below.",
+				"copyright": "Copyright © $t(titles.app). All Rights Reserved."
 			},
 			"successes": {
-				"created": "CSI created successfully. ",
+				"created": "CSI created successfully.",
 				"submitted": "Your responses have been submitted successfully.",
 				"submittedsub": "Your input is highly appreciated."
 			}
--- a/client/src/translations/es/common.json
+++ b/client/src/translations/es/common.json
@@ -838,17 +838,24 @@
 				"creating": "",
 				"notconfigured": "",
 				"notfoundsubtitle": "",
-				"notfoundtitle": ""
+				"notfoundtitle": "",
+				"surveycompletetitle": "",
+				"surveycompletesubtitle": ""
 			},
 			"fields": {
 				"completedon": "",
-				"created_at": ""
+				"created_at": "",
+				"surveyid": "",
+				"validuntil": ""
 			},
 			"labels": {
 				"nologgedinuser": "",
 				"nologgedinuser_sub": "",
 				"noneselected": "",
-				"title": ""
+				"title": "",
+				"greeting": "",
+				"intro": "",
+				"copyright": ""
 			},
 			"successes": {
 				"created": "",
--- a/client/src/translations/fr/common.json
+++ b/client/src/translations/fr/common.json
@@ -838,17 +838,24 @@
 				"creating": "",
 				"notconfigured": "",
 				"notfoundsubtitle": "",
-				"notfoundtitle": ""
+				"notfoundtitle": "",
+				"surveycompletetitle": "",
+				"surveycompletesubtitle": ""
 			},
 			"fields": {
 				"completedon": "",
-				"created_at": ""
+				"created_at": "",
+				"surveyid": "",
+				"validuntil": ""
 			},
 			"labels": {
 				"nologgedinuser": "",
 				"nologgedinuser_sub": "",
 				"noneselected": "",
-				"title": ""
+				"title": "",
+				"greeting": "",
+				"intro": "",
+				"copyright": ""
 			},
 			"successes": {
 				"created": "",
--- a/client/src/utils/GraphQLClient.js
+++ b/client/src/utils/GraphQLClient.js
@@ -12,6 +12,8 @@ import apolloLogger from "apollo-link-logger";
 //import axios from "axios";
 import { auth } from "../firebase/firebase.utils";
 import errorLink from "../graphql/apollo-error-handling";
+import { SentryLink } from "apollo-link-sentry";
+
 //import { store } from "../redux/store";
 const httpLink = new HttpLink({
  uri: process.env.REACT_APP_GRAPHQL_ENDPOINT,
@@ -105,18 +107,30 @@ const link = split(
 const authLink = setContext((_, { headers }) => {
  return (
    auth.currentUser &&
-    auth.currentUser.getIdToken().then((token) => {
-      if (token) {
-        return {
-          headers: {
-            ...headers,
-            authorization: token ? `Bearer ${token}` : "",
-          },
-        };
-      } else {
+    auth.currentUser
+      .getIdToken()
+      .then((token) => {
+        if (token) {
+          return {
+            headers: {
+              ...headers,
+              authorization: token ? `Bearer ${token}` : "",
+            },
+          };
+        } else {
+          console.error(
+            "Authentication error. Unable to add authorization token because it was empty."
+          );
+          return { headers };
+        }
+      })
+      .catch((error) => {
+        console.error(
+          "Authentication error. Unable to add authorization token.",
+          error.message
+        );
        return { headers };
-      }
-    })
+      })
  );
 });

@@ -138,8 +152,10 @@ if (process.env.NODE_ENV === "development") {
 }

 middlewares.push(
-  roundTripLink.concat(
-    retryLink.concat(errorLink.concat(authLink.concat(link)))
+  new SentryLink().concat(
+    roundTripLink.concat(
+      retryLink.concat(errorLink.concat(authLink.concat(link)))
+    )
  )
 );

--- a/server.js
+++ b/server.js
@@ -74,6 +74,7 @@ app.use('/adm', require("./server/routes/adminRoutes"));
 app.use('/tech', require("./server/routes/techRoutes"));
 app.use('/intellipay', require("./server/routes/intellipayRoutes"));
 app.use('/cdk', require("./server/routes/cdkRoutes"));
+app.use('/csi', require("./server/routes/csiRoutes"));

 // Default route for forbidden access
 app.get("/", (req, res) => {
--- a/server/csi/csi.js
+++ b/server/csi/csi.js
@@ -0,0 +1,2 @@
+exports.lookup = require("./lookup").default;
+exports.submit = require("./submit").default;
--- a/server/csi/lookup.js
+++ b/server/csi/lookup.js
@@ -0,0 +1,24 @@
+const path = require("path");
+const queries = require("../graphql-client/queries");
+const logger = require("../utils/logger");
+require("dotenv").config({
+  path: path.resolve(
+    process.cwd(),
+    `.env.${process.env.NODE_ENV || "development"}`
+  ),
+});
+
+const client = require("../graphql-client/graphql-client").client;
+
+exports.default = async (req, res) => {
+  try {
+    logger.log("csi-surveyID-lookup", "DEBUG", "csi", req.body.surveyId, null);
+    const gql_response = await client.request(queries.QUERY_SURVEY, {
+      surveyId: req.body.surveyId,
+    });
+    res.status(200).json(gql_response);
+  } catch (error) {
+    logger.log("csi-surveyID-lookup", "ERROR", "csi", req.body.surveyId, error);
+    res.status(400).json(error);
+  }
+};
--- a/server/csi/submit.js
+++ b/server/csi/submit.js
@@ -0,0 +1,29 @@
+const path = require("path");
+const queries = require("../graphql-client/queries");
+const logger = require("../utils/logger");
+require("dotenv").config({
+  path: path.resolve(
+    process.cwd(),
+    `.env.${process.env.NODE_ENV || "development"}`
+  ),
+});
+
+const client = require("../graphql-client/graphql-client").client;
+
+exports.default = async (req, res) => {
+  try {
+    logger.log("csi-surveyID-submit", "DEBUG", "csi", req.body.surveyId, null);
+    const gql_response = await client.request(queries.COMPLETE_SURVEY, {
+      surveyId: req.body.surveyId,
+      survey: {
+        response: req.body.values,
+        valid: false,
+        completedon: new Date(),
+      },
+    });
+    res.status(200).json(gql_response);
+  } catch (error) {
+    logger.log("csi-surveyID-submit", "ERROR", "csi", req.body.surveyId, error);
+    res.status(400).json(error);
+  }
+};
--- a/server/graphql-client/queries.js
+++ b/server/graphql-client/queries.js
@@ -1989,12 +1989,20 @@ exports.UPDATE_OLD_TRANSITION = `mutation UPDATE_OLD_TRANSITION($jobid: uuid!, $
  }
 }`;

-exports.INSERT_NEW_TRANSITION = `mutation INSERT_NEW_TRANSITION($newTransition: transitions_insert_input!, $oldTransitionId: uuid, $duration: numeric) {
+exports.INSERT_NEW_TRANSITION = (
+  includeOldTransition
+) => `mutation INSERT_NEW_TRANSITION($newTransition: transitions_insert_input!, ${
+  includeOldTransition ? `$oldTransitionId: uuid!, $duration: numeric` : ""
+}) {
  insert_transitions_one(object: $newTransition) {
    id
  }
-  update_transitions(where: {id: {_eq: $oldTransitionId}}, _set: {duration: $duration}) {
+  ${
+    includeOldTransition
+      ? `update_transitions(where: {id: {_eq: $oldTransitionId}}, _set: {duration: $duration}) {
    affected_rows
+  }`
+      : ""
  }
 }`;

@@ -2148,3 +2156,23 @@ exports.ACTIVE_SHOP_BY_USER = `query ACTIVE_SHOP_BY_USER($user: String) {
    shopid
  }
 }`;
+
+exports.QUERY_SURVEY = `query QUERY_SURVEY($surveyId: uuid!) {
+  csi_by_pk(id: $surveyId) {
+    completedon
+    csiquestion {
+      id
+      config
+    }
+    id
+    relateddata
+    valid
+    validuntil
+  }
+}`;
+
+exports.COMPLETE_SURVEY = `mutation COMPLETE_SURVEY($surveyId: uuid!, $survey: csi_set_input) {
+    update_csi(where: { id: { _eq: $surveyId } }, _set: $survey) {
+      affected_rows
+    }
+  }`;
--- a/server/job/job-status-transition.js
+++ b/server/job/job-status-transition.js
@@ -11,82 +11,91 @@ const path = require("path");
 const client = require("../graphql-client/graphql-client").client;

 require("dotenv").config({
-    path: path.resolve(
-        process.cwd(),
-        `.env.${process.env.NODE_ENV || "development"}`
-    ),
+  path: path.resolve(
+    process.cwd(),
+    `.env.${process.env.NODE_ENV || "development"}`
+  ),
 });

 async function StatusTransition(req, res) {
-    const {
-        id: jobid,
-        status: value,
-        shopid: bodyshopid,
-    } = req.body.event.data.new;
+  const {
+    id: jobid,
+    status: value,
+    shopid: bodyshopid,
+  } = req.body.event.data.new;

-    // Create record OPEN on new item, enter state
-    // If change to SCHEDULE, update the last record and create a new record (update status and end time on old record, create a new record saying we came from previous status going to previous status
-    // (Timeline)
-    // Final status is exported, there is no end date as there is no further transition (has no end date)
-    try {
-        const {update_transitions} = await client.request(
-            queries.UPDATE_OLD_TRANSITION,
-            {
-                jobid: jobid,
-                existingTransition: {
-                    end: new Date(),
-                    next_value: value,
+  // Create record OPEN on new item, enter state
+  // If change to SCHEDULE, update the last record and create a new record (update status and end time on old record, create a new record saying we came from previous status going to previous status
+  // (Timeline)
+  // Final status is exported, there is no end date as there is no further transition (has no end date)
+  try {
+    const { update_transitions } = await client.request(
+      queries.UPDATE_OLD_TRANSITION,
+      {
+        jobid: jobid,
+        existingTransition: {
+          end: new Date(),
+          next_value: value,

-                    //duration
-                },
-            }
-        );
+          //duration
+        },
+      }
+    );

-        let duration =
-            update_transitions.affected_rows === 0
-                ? 0
-                : new Date(update_transitions.returning[0].end) -
-                new Date(update_transitions.returning[0].start);
+    let duration =
+      update_transitions.affected_rows === 0
+        ? 0
+        : new Date(update_transitions.returning[0].end) -
+          new Date(update_transitions.returning[0].start);

-        const resp2 = await client.request(queries.INSERT_NEW_TRANSITION, {
-            oldTransitionId:
+    const resp2 = await client.request(
+      queries.INSERT_NEW_TRANSITION(update_transitions.affected_rows > 0),
+      {
+        ...(update_transitions.affected_rows > 0
+          ? {
+              oldTransitionId:
                update_transitions.affected_rows === 0
-                    ? null
-                    : update_transitions.returning[0].id,
-            duration,
-            newTransition: {
-                bodyshopid: bodyshopid,
-                jobid: jobid,
-                start:
-                    update_transitions.affected_rows === 0
-                        ? new Date()
-                        : update_transitions.returning[0].end,
-                prev_value:
-                    update_transitions.affected_rows === 0
-                        ? null
-                        : update_transitions.returning[0].value,
-                value: value,
-                type: "status",
-            },
-        });
+                  ? null
+                  : update_transitions.returning[0].id,
+              duration,
+            }
+          : {}),
+        newTransition: {
+          bodyshopid: bodyshopid,
+          jobid: jobid,
+          start:
+            update_transitions.affected_rows === 0
+              ? new Date()
+              : update_transitions.returning[0].end,
+          prev_value:
+            update_transitions.affected_rows === 0
+              ? null
+              : update_transitions.returning[0].value,
+          value: value,
+          type: "status",
+        },
+      }
+    );

-        //Check to see if there is an existing status transition record.
-        //Query using Job ID, start is not null, end is null.
+    logger.log("job-transition-update-result", "DEBUG", null, jobid, resp2);

-        //If there is no existing record, this is the start of the transition life cycle.
-        // Create the initial transition record.
+    //Check to see if there is an existing status transition record.
+    //Query using Job ID, start is not null, end is null.

-        //If there is a current status transition record, update it with the end date, duration, and next value.
+    //If there is no existing record, this is the start of the transition life cycle.
+    // Create the initial transition record.

-        res.sendStatus(200); //.json(ret);
-    } catch (error) {
-        logger.log("job-status-transition-error", "ERROR", req.user?.email, jobid, {
-            message: error.message,
-            stack: error.stack,
-        });
+    //If there is a current status transition record, update it with the end date, duration, and next value.

-        res.status(400).send(JSON.stringify(error));
-    }
+    res.sendStatus(200); //.json(ret);
+  } catch (error) {
+    logger.log("job-status-transition-error", "ERROR", req.user?.email, jobid, {
+      message: error.message,
+      stack: error.stack,
+    });
+
+    res.status(400).send(JSON.stringify(error));
+  }
 }

 exports.statustransition = StatusTransition;
--- a/server/routes/csiRoutes.js
+++ b/server/routes/csiRoutes.js
@@ -0,0 +1,8 @@
+const express = require("express");
+const router = express.Router();
+const { lookup, submit } = require("../csi/csi");
+
+router.post("/lookup", lookup);
+router.post("/submit", submit);
+
+module.exports = router;
Author	SHA1	Message	Date
Allan Carr	67008c35b8	IO-2626 Adjust Image Prop on customer page	2024-02-08 09:57:39 -08:00
Patrick Fic	3c7ede0155	IO-2626 Prevent crisp from loading on anon CSI page.	2024-02-06 10:04:59 -08:00
Allan Carr	4ccd912363	Merge branch 'feature/IO-2626-CSI-Pages' of bitbucket.org:snaptsoft/bodyshop into feature/IO-2626-CSI-Pages	2024-02-06 09:36:16 -08:00
Patrick Fic	dd5ca5d233	Add resource class to test build as well.	2024-02-06 09:29:22 -08:00
Allan Carr	616a4b04a0	IO-2626 Resource Class for Test	2024-02-06 09:10:32 -08:00
Allan Carr	3110be4703	IO-2626 CICD Resource Size Change	2024-02-06 08:52:51 -08:00
Allan Carr	7c303a5154	IO-2626 Change Server Variable Name for response	2024-02-05 20:06:28 -08:00
Allan Carr	9383b37a41	IO-2626 Modify seachparm and fix linking	2024-02-05 20:03:17 -08:00
Allan Carr	205d507097	IO-2626 Update Translations	2024-02-02 22:50:40 -08:00
Allan Carr	97a1bd66d1	IO-2626 Correct Sorting, Linking, Pagination and Update Response Container	2024-02-02 22:45:06 -08:00
Allan Carr	0d1ff6390c	IO-2626 Correct Error Page footer	2024-02-02 12:35:18 -08:00
Allan Carr	830d2c87d2	IO-2626 CSI Pages Move to Server side initial commit	2024-02-02 11:55:57 -08:00
Patrick Fic	c8fc1b0f68	Merged in feature/Sentry-Improvements (pull request #1246 ) Change tracing targets.	2024-01-31 01:08:37 +00:00
Patrick Fic	da1ddb874f	Change tracing targets.	2024-01-30 16:58:11 -08:00
Patrick Fic	771f9ceaa8	Merged in feature/Sentry-Improvements (pull request #1242 ) Feature/Sentry Improvements	2024-01-30 21:45:22 +00:00
Patrick Fic	7daf7540b3	Resolve Typo in CI.	2024-01-30 13:32:58 -08:00
Patrick Fic	ce6940629d	Exclude source map upload in CI.	2024-01-30 13:25:48 -08:00
Patrick Fic	b706b96d32	Remove sentry test button.	2024-01-30 13:14:27 -08:00
Patrick Fic	2427bc72f2	Updated CI.	2024-01-30 12:53:07 -08:00
Patrick Fic	8bc1a9d9ee	Initial sentry improvements to deploy and verify against test.	2024-01-30 12:47:12 -08:00
Patrick Fic	ba30225ba1	Merged in release/2024-01-29 (pull request #1230 ) IO-1532 resolve update logic issue for status timings.	2024-01-29 17:06:31 +00:00
Patrick Fic	cb4a6e8774	IO-1532 resolve update logic issue for status timings.	2024-01-29 09:05:46 -08:00
Dave Richer	23f640028d	Merged in release/2024-01-26 (pull request #1227 ) Release/2024 01 26	2024-01-27 02:25:22 +00:00