From 2082934cd56204ae6cec5e4a6c82b51c7abd9a0f Mon Sep 17 00:00:00 2001
From: chamikaJ <chamika@ceydigital.com>
Date: Mon, 28 Jul 2025 16:12:12 +0530
Subject: [PATCH] feat(hubspot-integration): refine HubSpot widget styling and
 add account setup skip functionality

- Enhanced CSS targeting for HubSpot widget elements to prevent interference with the Worklenz app UI.
- Introduced a new function to allow users to bypass team member validation during account setup, improving user experience.
- Updated the button click handler to utilize the new skip functionality for a smoother setup process.
---
 worklenz-frontend/public/js/hubspot.js          | 17 +++++++++++++----
 .../src/pages/account-setup/account-setup.tsx   |  7 ++++++-
 2 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/worklenz-frontend/public/js/hubspot.js b/worklenz-frontend/public/js/hubspot.js
index d1a3afee..e807976b 100644
--- a/worklenz-frontend/public/js/hubspot.js
+++ b/worklenz-frontend/public/js/hubspot.js
@@ -105,12 +105,21 @@ class HubSpotManager {
         filter: invert(1) hue-rotate(180deg) !important;
       }
       
-      /* Additional targeting for widget launcher and chat bubble */
-      div[class*="shadow-2xl"],
-      div[class*="widget-align"],
-      div[style*="position: fixed"] {
+      /* More specific targeting for HubSpot widget elements only - avoid affecting app UI */
+      div[class*="shadow-2xl"][class*="widget-align"]:not([class*="ant-"]),
+      div[style*="position: fixed"][id*="hubspot"]:not([class*="ant-"]),
+      div[style*="position: fixed"][class*="widget"]:not([class*="ant-"]) {
         filter: invert(1) hue-rotate(180deg) !important;
       }
+      
+      /* Ensure Worklenz app elements are not affected by HubSpot styles */
+      .ant-menu,
+      .ant-menu *,
+      [class*="settings"],
+      [class*="sidebar"],
+      .worklenz-app *:not([id*="hubspot"]):not([class*="widget"]) {
+        filter: none !important;
+      }
     `;
     document.head.appendChild(style);
   }
diff --git a/worklenz-frontend/src/pages/account-setup/account-setup.tsx b/worklenz-frontend/src/pages/account-setup/account-setup.tsx
index 15f13504..98c5c444 100644
--- a/worklenz-frontend/src/pages/account-setup/account-setup.tsx
+++ b/worklenz-frontend/src/pages/account-setup/account-setup.tsx
@@ -214,6 +214,11 @@ const AccountSetup: React.FC = () => {
     }
   };
 
+  const handleSkipMembers = async () => {
+    // Bypass all validation and complete setup without team members
+    await completeAccountSetup(true);
+  };
+
   const completeAccountSetupWithTemplate = async () => {
     try {
       await saveSurveyData(); // Save survey data first
@@ -592,7 +597,7 @@ const AccountSetup: React.FC = () => {
                       type="link"
                       className="p-0 font-medium"
                       style={{ color: token.colorTextTertiary }}
-                      onClick={() => completeAccountSetup(true)}
+                      onClick={handleSkipMembers}
                     >
                       {t('skipForNow')}
                     </Button>