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

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

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>

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"
     });
   }, []);