feature/IO-3255-simplified-parts-management - Cleanup / Bug fixes

2025-08-21 14:57:55 -04:00
parent 43d5a77d60
commit 6942d6e4f9
6 changed files with 310 additions and 58 deletions
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -108,6 +108,7 @@
        "eslint-plugin-react": "^7.37.5",
        "globals": "^15.15.0",
        "jsdom": "^26.0.0",
+        "lightningcss": "^1.30.1",
        "memfs": "^4.36.3",
        "os-browserify": "^0.3.0",
        "playwright": "^1.54.2",
@@ -10209,6 +10210,255 @@
      "integrity": "sha512-aWVR6xXYYRvnK0v/uIwkf5Lthq9Jpn0N8TISW/oDTWlYB2sOimuiLn9Q26aUw4KxkJoiT8ACdiw44Y8VwKFIfQ==",
      "license": "MIT"
    },
+    "node_modules/lightningcss": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.30.1.tgz",
+      "integrity": "sha512-xi6IyHML+c9+Q3W0S4fCQJOym42pyurFiJUHEcEyHS0CeKzia4yZDEsLlqOFykxOdHpNy0NmvVO31vcSqAxJCg==",
+      "dev": true,
+      "license": "MPL-2.0",
+      "dependencies": {
+        "detect-libc": "^2.0.3"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      },
+      "optionalDependencies": {
+        "lightningcss-darwin-arm64": "1.30.1",
+        "lightningcss-darwin-x64": "1.30.1",
+        "lightningcss-freebsd-x64": "1.30.1",
+        "lightningcss-linux-arm-gnueabihf": "1.30.1",
+        "lightningcss-linux-arm64-gnu": "1.30.1",
+        "lightningcss-linux-arm64-musl": "1.30.1",
+        "lightningcss-linux-x64-gnu": "1.30.1",
+        "lightningcss-linux-x64-musl": "1.30.1",
+        "lightningcss-win32-arm64-msvc": "1.30.1",
+        "lightningcss-win32-x64-msvc": "1.30.1"
+      }
+    },
+    "node_modules/lightningcss-darwin-arm64": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.30.1.tgz",
+      "integrity": "sha512-c8JK7hyE65X1MHMN+Viq9n11RRC7hgin3HhYKhrMyaXflk5GVplZ60IxyoVtzILeKr+xAJwg6zK6sjTBJ0FKYQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-darwin-x64": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.30.1.tgz",
+      "integrity": "sha512-k1EvjakfumAQoTfcXUcHQZhSpLlkAuEkdMBsI/ivWw9hL+7FtilQc0Cy3hrx0AAQrVtQAbMI7YjCgYgvn37PzA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-freebsd-x64": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.30.1.tgz",
+      "integrity": "sha512-kmW6UGCGg2PcyUE59K5r0kWfKPAVy4SltVeut+umLCFoJ53RdCUWxcRDzO1eTaxf/7Q2H7LTquFHPL5R+Gjyig==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm-gnueabihf": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.30.1.tgz",
+      "integrity": "sha512-MjxUShl1v8pit+6D/zSPq9S9dQ2NPFSQwGvxBCYaBYLPlCWuPh9/t1MRS8iUaR8i+a6w7aps+B4N0S1TYP/R+Q==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm64-gnu": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.30.1.tgz",
+      "integrity": "sha512-gB72maP8rmrKsnKYy8XUuXi/4OctJiuQjcuqWNlJQ6jZiWqtPvqFziskH3hnajfvKB27ynbVCucKSm2rkQp4Bw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm64-musl": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.30.1.tgz",
+      "integrity": "sha512-jmUQVx4331m6LIX+0wUhBbmMX7TCfjF5FoOH6SD1CttzuYlGNVpA7QnrmLxrsub43ClTINfGSYyHe2HWeLl5CQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-x64-gnu": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.30.1.tgz",
+      "integrity": "sha512-piWx3z4wN8J8z3+O5kO74+yr6ze/dKmPnI7vLqfSqI8bccaTGY5xiSGVIJBDd5K5BHlvVLpUB3S2YCfelyJ1bw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-x64-musl": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.30.1.tgz",
+      "integrity": "sha512-rRomAK7eIkL+tHY0YPxbc5Dra2gXlI63HL+v1Pdi1a3sC+tJTcFrHX+E86sulgAXeI7rSzDYhPSeHHjqFhqfeQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-win32-arm64-msvc": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.30.1.tgz",
+      "integrity": "sha512-mSL4rqPi4iXq5YVqzSsJgMVFENoa4nGTT/GjO2c0Yl9OuQfPsIfncvLrEW6RbbB24WtZ3xP/2CCmI3tNkNV4oA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-win32-x64-msvc": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.30.1.tgz",
+      "integrity": "sha512-PVqXh48wh4T53F/1CCu8PIPCxLzWyCnn/9T5W1Jpmdy5h9Cwd+0YQS6/LwhHXSafuc61/xg9Lv5OrCby6a++jg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss/node_modules/detect-libc": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.4.tgz",
+      "integrity": "sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=8"
+      }
+    },
    "node_modules/lines-and-columns": {
      "version": "1.2.4",
      "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
--- a/client/package.json
+++ b/client/package.json
@@ -150,6 +150,7 @@
    "eslint-plugin-react": "^7.37.5",
    "globals": "^15.15.0",
    "jsdom": "^26.0.0",
+    "lightningcss": "^1.30.1",
    "memfs": "^4.36.3",
    "os-browserify": "^0.3.0",
    "playwright": "^1.54.2",
--- a/client/src/components/form-items-formatted/phone-form-item.component.jsx
+++ b/client/src/components/form-items-formatted/phone-form-item.component.jsx
@@ -4,13 +4,8 @@ import parsePhoneNumber from "libphonenumber-js";
 import { forwardRef } from "react";
 import "./phone-form-item.styles.scss";

-function FormItemPhone(props) {
-  return (
-    <Input
-      // country="ca" ref={ref} className="ant-input"
-      {...props}
-    />
-  );
+function FormItemPhone(props, ref) {
+  return <Input ref={ref} {...props} />;
 }

 export default forwardRef(FormItemPhone);
--- a/client/src/components/global-footer/global-footer.component.jsx
+++ b/client/src/components/global-footer/global-footer.component.jsx
@@ -1,6 +1,5 @@
 import { AlertOutlined, BulbOutlined } from "@ant-design/icons";
 import { Button, Layout, Space } from "antd";
-import { useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { Link } from "react-router-dom";
@@ -17,18 +16,7 @@ const mapStateToProps = createStructuredSelector({

 export function GlobalFooter({ isPartsEntry }) {
  const { t } = useTranslation();
-
-  useEffect(() => {
-    // Canny Not Required on Parts Entry
-    if (isPartsEntry) return;
-    window.Canny("initChangelog", {
-      appID: "680bd2c7ee501290377f6686",
-      position: "top",
-      align: "left",
-      theme: "light" // options: light [default], dark, auto
-    });
-  }, [isPartsEntry]);
-
+  
  if (isPartsEntry) {
    return (
      <Footer>
--- a/client/src/pages/manage/manage.page.component.jsx
+++ b/client/src/pages/manage/manage.page.component.jsx
@@ -2,7 +2,7 @@ import { FloatButton, Layout, Spin } from "antd";
 import { Route, Routes } from "react-router-dom";

 // import preval from "preval.macro";
-import { lazy, Suspense, useEffect, useState } from "react";
+import { lazy, Suspense, useEffect, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -23,6 +23,7 @@ import UpdateAlert from "../../components/update-alert/update-alert.component";
 import { selectBodyshop, selectInstanceConflict, selectPartsManagementOnly } from "../../redux/user/user.selectors";
 import InstanceRenderManager from "../../utils/instanceRenderMgr.js";
 import useAlertsNotifications from "../../hooks/useAlertsNotifications.jsx";
+import { selectDarkMode } from "../../redux/application/application.selectors.js";

 const PrintCenterModalContainer = lazy(
  () => import("../../components/print-center-modal/print-center-modal.container")
@@ -107,22 +108,26 @@ const { Content } = Layout;
 const mapStateToProps = createStructuredSelector({
  conflict: selectInstanceConflict,
  bodyshop: selectBodyshop,
-  partsManagementOnly: selectPartsManagementOnly
+  partsManagementOnly: selectPartsManagementOnly,
+  isDarkMode: selectDarkMode
 });

-export function Manage({ conflict, bodyshop, partsManagementOnly }) {
+export function Manage({ conflict, bodyshop, partsManagementOnly, isDarkMode }) {
  const { t } = useTranslation();
  const [chatVisible] = useState(false);
+  const didMount = useRef(false);

  // Centralized alerts handling (fetch + dedupe + notifications)
  useAlertsNotifications();

  useEffect(() => {
+    if (didMount.current) return; // prevents dev StrictMode double-run
+    didMount.current = true;
    window.Canny("initChangelog", {
      appID: "680bd2c7ee501290377f6686",
      position: "top",
      align: "left",
-      theme: "light" // options: light [default], dark, auto
+      theme: !isDarkMode ? "light" : "dark"
    });
  }, []);

--- a/client/vite.config.js
+++ b/client/vite.config.js
@@ -1,5 +1,4 @@
 /* eslint-disable */
-
 import { sentryVitePlugin } from "@sentry/vite-plugin";
 import react from "@vitejs/plugin-react";
 import chalk from "chalk";
@@ -10,21 +9,23 @@ import { ViteEjsPlugin } from "vite-plugin-ejs";
 import eslint from "vite-plugin-eslint";
 import { VitePWA } from "vite-plugin-pwa";
 import InstanceRenderManager from "./src/utils/instanceRenderMgr";
+import browserslist from "browserslist";
+import { browserslistToTargets } from "lightningcss";

-// Ensure your environment variables are set correctly for Vite 6
-process.env.VITE_APP_GIT_SHA_DATE = new Date().toLocaleString("en-US", {
-  timeZone: "America/Los_Angeles"
-});
+process.env.VITE_APP_GIT_SHA_DATE = new Date().toLocaleString("en-US", { timeZone: "America/Los_Angeles" });
 const commitHash = child.execSync("git rev-parse HEAD").toString().trimEnd();
 process.env.VITE_GIT_COMMIT_HASH = commitHash;

-const currentDatePST = new Date()
-  .toLocaleDateString("en-US", {
-    timeZone: "America/Los_Angeles",
-    year: "numeric",
-    month: "2-digit",
-    day: "2-digit"
+// Resolve browserslist from package.json and map to Lightning CSS targets
+const lightningCssTargets = browserslistToTargets(
+  browserslist(undefined, {
+    path: process.cwd(),
+    env: process.env.NODE_ENV === "production" ? "production" : "development"
  })
+);
+
+const currentDatePST = new Date()
+  .toLocaleDateString("en-US", { timeZone: "America/Los_Angeles", year: "numeric", month: "2-digit", day: "2-digit" })
  .split("/")
  .reverse()
  .join("-");
@@ -32,18 +33,21 @@ const currentDatePST = new Date()
 const getFormattedTimestamp = () =>
  new Date().toLocaleTimeString("en-US", { hour12: true }).replace("AM", "a.m.").replace("PM", "p.m.");

-export const logger = createLogger("info", {
-  allowClearScreen: false
-});
+export const logger = createLogger("info", { allowClearScreen: false });

 export default defineConfig({
  base: "/",
  plugins: [
-    // Ensure all plugins are Vite 6 compatible
    ViteEjsPlugin((viteConfig) => ({ env: viteConfig.env })),
+
+    // PWA only for production builds (faster dev)
    VitePWA({
+      apply: "build",
      injectRegister: "auto",
      registerType: "prompt",
+      workbox: {
+        navigateFallbackDenylist: [/^\/api\//] // prevent caching API routes
+      },
      manifest: {
        short_name: InstanceRenderManager({
          instance: process.env.VITE_APP_INSTANCE,
@@ -94,13 +98,15 @@ export default defineConfig({
        gcm_sender_id: "103953800507"
      }
    }),
+
    react(),
    eslint(),
+
+    // Sentry only for production builds (no dev overhead)
    sentryVitePlugin({
+      apply: "build",
      org: "imex",
-      reactComponentAnnotation: {
-        enabled: true
-      },
+      reactComponentAnnotation: { enabled: true },
      release: {
        name: `${process.env.VITE_APP_IS_TEST ? "test" : "production"}-${currentDatePST}-${commitHash}`.trim()
      },
@@ -111,10 +117,12 @@ export default defineConfig({
      })
    })
  ],
+
  define: {
    APP_VERSION: JSON.stringify(process.env.npm_package_version),
    __COMMIT_HASH__: JSON.stringify(commitHash)
  },
+
  server: {
    host: true,
    port: 3000,
@@ -122,13 +130,11 @@ export default defineConfig({
    proxy: {
      "/ws": {
        target: "ws://localhost:4000",
-        rewriteWsOrigin: true,
        secure: false,
        ws: true
      },
      "/wss": {
        target: "ws://localhost:4000",
-        rewriteWsOrigin: true,
        secure: false,
        ws: true
      },
@@ -148,18 +154,17 @@ export default defineConfig({
    },
    https: {
      key: await fsPromises.readFile("../certs/key.pem"),
-      cert: await fsPromises.readFile("../certs/cert.pem"),
-      allowHTTP1: false // Force HTTP/2
+      cert: await fsPromises.readFile("../certs/cert.pem")
    }
  },
+
  preview: {
    port: 6000,
    host: true,
    open: true,
    https: {
      key: await fsPromises.readFile("../certs/key.pem"),
-      cert: await fsPromises.readFile("../certs/cert.pem"),
-      allowHTTP1: false // Force HTTP/2
+      cert: await fsPromises.readFile("../certs/cert.pem")
    },
    proxy: {
      "/ws": {
@@ -182,7 +187,11 @@ export default defineConfig({
      }
    }
  },
+
  build: {
+    // Hide source maps from browsers; Sentry plugin will upload them
+    sourcemap: "hidden",
+
    rollupOptions: {
      output: {
        manualChunks: {
@@ -207,8 +216,14 @@ export default defineConfig({
      }
    },

-    sourcemap: true
+    cssMinify: "lightningcss"
  },
+
+  // Strip console/debugger in prod to shrink bundles
+  esbuild: {
+    drop: ["console", "debugger"]
+  },
+
  optimizeDeps: {
    include: [
      "react",
@@ -231,19 +246,17 @@ export default defineConfig({
      "@firebase/util"
    ],
    esbuildOptions: {
-      // Update for Vite 6: Use proper file extensions
-      loader: {
-        ".jsx": "jsx",
-        ".tsx": "tsx"
-      }
+      loader: { ".jsx": "jsx", ".tsx": "tsx" }
    }
  },
+
  css: {
+    transformer: "lightningcss",
+    lightningcss: {
+      targets: lightningCssTargets
+    },
    preprocessorOptions: {
-      scss: {
-        api: "modern-compiler",
-        quietDeps: true // Quite Deprecation Warnings, should be disabled occasionally before major upgrades
-      }
+      scss: { quietDeps: true }
    }
  }
 });