From 88239cec4d437de78153592b18be7affb4966a43 Mon Sep 17 00:00:00 2001
From: Shaheer Kochai <ashaheerki@gmail.com>
Date: Tue, 20 May 2025 08:18:11 +0430
Subject: [PATCH] fix: AWS integration bugfixes (#7886)

* fix(AccountSettingsModal): add region deselect functionality to region selector

* fix(AWS integration): redirect help button to aws integration documentation

* style(Header): update button color on hover for improved visibility
---
 .../Header/Header.styles.scss                 |  7 ++++--
 .../CloudIntegrationPage/Header/Header.tsx    |  9 ++++++--
 .../components/AccountSettingsModal.tsx       | 23 +++++++++++++++++--
 3 files changed, 33 insertions(+), 6 deletions(-)

diff --git a/frontend/src/container/CloudIntegrationPage/Header/Header.styles.scss b/frontend/src/container/CloudIntegrationPage/Header/Header.styles.scss
index 2fe4696212..79a6e26815 100644
--- a/frontend/src/container/CloudIntegrationPage/Header/Header.styles.scss
+++ b/frontend/src/container/CloudIntegrationPage/Header/Header.styles.scss
@@ -33,13 +33,16 @@
 		border: 1px solid var(--bg-slate-400);
 		background: var(--bg-ink-300);
 		border-radius: 2px;
-		color: var(--bg-vanilla-400);
 		font-size: 12px;
-		line-height: 10px; /* 83.333% */
+		line-height: 10px;
 		letter-spacing: 0.12px;
 		width: 113px;
 		height: 32px;
 		cursor: pointer;
+		&,
+		&:hover {
+			color: var(--bg-vanilla-400);
+		}
 	}
 }
 
diff --git a/frontend/src/container/CloudIntegrationPage/Header/Header.tsx b/frontend/src/container/CloudIntegrationPage/Header/Header.tsx
index d37ba5742a..429a2a60ce 100644
--- a/frontend/src/container/CloudIntegrationPage/Header/Header.tsx
+++ b/frontend/src/container/CloudIntegrationPage/Header/Header.tsx
@@ -33,10 +33,15 @@ function Header(): JSX.Element {
 				/>
 			</div>
 			<div className="cloud-header__actions">
-				<button className="cloud-header__help" type="button">
+				<a
+					href="https://signoz.io/blog/native-aws-integrations-with-autodiscovery/"
+					target="_blank"
+					rel="noopener noreferrer"
+					className="cloud-header__help"
+				>
 					<LifeBuoy size={12} />
 					Get Help
-				</button>
+				</a>
 			</div>
 		</div>
 	);
diff --git a/frontend/src/container/CloudIntegrationPage/HeroSection/components/AccountSettingsModal.tsx b/frontend/src/container/CloudIntegrationPage/HeroSection/components/AccountSettingsModal.tsx
index 65396a90f4..f1dfde62a6 100644
--- a/frontend/src/container/CloudIntegrationPage/HeroSection/components/AccountSettingsModal.tsx
+++ b/frontend/src/container/CloudIntegrationPage/HeroSection/components/AccountSettingsModal.tsx
@@ -58,6 +58,23 @@ function AccountSettingsModal({
 		});
 	};
 
+	const handleRegionDeselect = useCallback(
+		(item: string): void => {
+			if (selectedRegions.includes(item)) {
+				setSelectedRegions(selectedRegions.filter((region) => region !== item));
+				if (includeAllRegions) {
+					setIncludeAllRegions(false);
+				}
+			}
+		},
+		[
+			selectedRegions,
+			includeAllRegions,
+			setSelectedRegions,
+			setIncludeAllRegions,
+		],
+	);
+
 	const renderRegionSelector = useCallback(() => {
 		if (isRegionSelectOpen) {
 			return (
@@ -93,17 +110,19 @@ function AccountSettingsModal({
 					maxTagCount={3}
 					value={getRegionPreviewText(selectedRegions)}
 					open={false}
+					onDeselect={handleRegionDeselect}
 				/>
 			</>
 		);
 	}, [
 		isRegionSelectOpen,
-		selectedRegions,
 		includeAllRegions,
 		handleIncludeAllRegionsChange,
-		setIsRegionSelectOpen,
+		selectedRegions,
+		handleRegionDeselect,
 		setSelectedRegions,
 		setIncludeAllRegions,
+		setIsRegionSelectOpen,
 	]);
 
 	const renderAccountDetails = useCallback(