fix: adding missing response writer in error

* fix: resolve UX regressions across dashboards, metrics and alerts pages after component migration

- NewSelect: make the @signozhq checkbox label fill the row (min-width: 0)
  so long option text truncates with an ellipsis; size Only/Toggle buttons to
  the resting row height so hover no longer grows the row
- PlannedDowntime: reset field-label styles bleeding into the migrated
  RadioGroup option labels and add spacing between options
- Page-level contrast, spacing, alignment and icon-size fixes across
  dashboard settings, metrics explorer, alert rules, routing policies,
  auto-refresh and the time picker

* fix(multiselect): surface clear icon and remove dropdown double-scroll

- add .ant-select-clear color override so the multiselect clear (x) icon is
  visible on the dark selector (the single-select had it, multiselect didn't)
- raise the dropdown max-height so the react-virtuoso list (<=300px) plus the
  header/footer fits, leaving the list as the single scroller instead of the
  list and the container both scrolling
- StatsCard: drop the unnecessary !important on .count-label color

* fix: success colors

docs/api/openapi.yml

@@ -8028,6 +8028,64 @@ paths:
       summary: Update account
       tags:
       - cloudintegration
+  /api/v1/cloud_integrations/{cloud_provider}/accounts/{id}/services:
+    get:
+      deprecated: false
+      description: This endpoint lists the services metadata for the specified account
+        and cloud provider
+      operationId: ListAccountServicesMetadata
+      parameters:
+      - in: path
+        name: cloud_provider
+        required: true
+        schema:
+          type: string
+      - in: path
+        name: id
+        required: true
+        schema:
+          type: string
+      responses:
+        "200":
+          content:
+            application/json:
+              schema:
+                properties:
+                  data:
+                    $ref: '#/components/schemas/CloudintegrationtypesGettableServicesMetadata'
+                  status:
+                    type: string
+                required:
+                - status
+                - data
+                type: object
+          description: OK
+        "401":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Unauthorized
+        "403":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Forbidden
+        "500":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Internal Server Error
+      security:
+      - api_key:
+        - ADMIN
+      - tokenizer:
+        - ADMIN
+      summary: List account services metadata
+      tags:
+      - cloudintegration
   /api/v1/cloud_integrations/{cloud_provider}/accounts/{id}/services/{service_id}:
     put:
       deprecated: false

frontend/src/components/CustomTimePicker/CustomTimePickerPopoverContent.tsx

@@ -359,8 +359,7 @@ function CustomTimePickerPopoverContent({
 						<Clock
 							color={Color.BG_ROBIN_400}
 							className="timezone-container__clock-icon"
-							height={12}
-							width={12}
+							size={14}
 						/>
 
 						<span className="timezone__name">{timezone.name}</span>

frontend/src/components/NewSelect/styles.scss

@@ -109,6 +109,16 @@ $custom-border-color: #2c3044;
 		color: color-mix(in srgb, var(--l2-foreground) 45%, transparent);
 	}
 
+	.ant-select-clear {
+		background-color: var(--l2-background);
+		color: var(--l2-foreground);
+		font-size: 12px;
+
+		&:hover {
+			color: var(--l1-foreground);
+		}
+	}
+
 	// Customize tags in multiselect (dark mode by default)
 	.ant-select-selection-item {
 		background-color: var(--l1-border);
@@ -392,7 +402,9 @@ $custom-border-color: #2c3044;
 // Custom dropdown styles for multi-select
 .custom-multiselect-dropdown {
 	padding: 8px 0 0 0;
-	max-height: 350px;
+	// Tall enough to hold the react-virtuoso list (<=300px) + header/footer
+	// so only the list scrolls (avoids a second scrollbar on this container).
+	max-height: 410px;
 	overflow-y: auto;
 	overflow-x: hidden;
 	scrollbar-width: thin;
@@ -483,8 +495,12 @@ $custom-border-color: #2c3044;
 		.option-checkbox {
 			width: 100%;
 
-			> span:not(.ant-checkbox) {
-				width: 100%;
+			// @signozhq/ui Checkbox renders children inside a <label> that is
+			// content-sized by default. Make it fill the row (min-width: 0 lets it
+			// shrink) so the option text below can truncate instead of overflowing.
+			> label {
+				flex: 1 1 auto;
+				min-width: 0;
 			}
 
 			.all-option-text {
@@ -501,7 +517,12 @@ $custom-border-color: #2c3044;
 				width: 100%;
 
 				.option-label-text {
+					flex: 1 1 auto;
+					min-width: 0;
 					margin-bottom: 0;
+					overflow: hidden;
+					white-space: nowrap;
+					text-overflow: ellipsis;
 				}
 
 				.option-badge {
@@ -514,26 +535,30 @@ $custom-border-color: #2c3044;
 				}
 			}
 
-			.only-btn {
-				display: none;
-			}
+			// Size the buttons to the row's resting content height (20px) and fully
+			// override antd's default 32px Button box, so revealing them on hover
+			// never changes the row height.
+			.only-btn,
 			.toggle-btn {
 				display: none;
-			}
+				align-items: center;
+				justify-content: center;
+				height: 18px;
+				min-height: 0;
+				padding: 0 6px;
+				font-size: 12px;
+				line-height: 1;
+				border: none;
+				box-shadow: none;
 
-			.only-btn:hover {
-				background-color: unset;
-			}
-			.toggle-btn:hover {
-				background-color: unset;
+				&:hover {
+					background-color: unset;
+				}
 			}
 
 			.option-content:hover {
 				.only-btn {
 					display: flex;
-					align-items: center;
-					justify-content: center;
-					height: 21px;
 				}
 				.toggle-btn {
 					display: none;
@@ -548,9 +573,6 @@ $custom-border-color: #2c3044;
 		.option-checkbox:hover {
 			.toggle-btn {
 				display: flex;
-				align-items: center;
-				justify-content: center;
-				height: 21px;
 			}
 			.option-badge {
 				display: none;

frontend/src/container/AlertHistory/Statistics/StatsCard/StatsCard.styles.scss

@@ -67,8 +67,8 @@
 	gap: 4px;
 
 	&--success {
-		background: color-mix(in srgb, var(--success-background) 10%, transparent);
-		color: var(--success-foreground);
+		background: color-mix(in srgb, var(--text-forest-500) 10%, transparent);
+		color: var(--text-forest-400);
 	}
 
 	&--error {

frontend/src/container/CreateAlertV2/NotificationSettings/styles.scss

@@ -153,6 +153,7 @@
 				font-size: 10px;
 				color: var(--l2-foreground);
 				margin-top: 4px;
+				display: block;
 			}
 		}
 

frontend/src/container/DashboardContainer/DashboardSettings/DashboardSettingsContent.styles.scss

@@ -47,18 +47,10 @@
 		}
 
 		.ant-tabs-tab-active {
-			.overview-btn {
-				border-radius: 2px 0px 0px 2px;
-				background: var(--l1-border);
-			}
-
-			.variables-btn {
-				border-radius: 2px 0px 0px 2px;
-				background: var(--l1-border);
-			}
-
+			.overview-btn,
+			.variables-btn,
 			.public-dashboard-btn {
-				border-radius: 2px 0px 0px 2px;
+				color: var(--primary-background);
 				background: var(--l1-border);
 			}
 		}

frontend/src/container/DashboardContainer/DashboardSettings/DashboardVariableSettings/VariableItem/VariableItem.styles.scss

@@ -127,6 +127,15 @@
 					align-items: center;
 					justify-content: center;
 					gap: 4px;
+
+					.sidenav-beta-tag {
+						margin-left: 4px;
+					}
+
+					div {
+						display: flex;
+						align-items: center;
+					}
 				}
 
 				.variable-type-btn + .variable-type-btn {
@@ -177,6 +186,7 @@
 
 		.multiple-values-section {
 			justify-content: space-between;
+			align-items: flex-start;
 			margin-bottom: 0;
 
 			.typography-variables {
@@ -193,6 +203,7 @@
 
 		.all-option-section {
 			justify-content: space-between;
+			align-items: flex-start;
 			margin-bottom: 0;
 
 			.typography-variables {

frontend/src/container/DashboardContainer/DashboardSettings/DashboardVariableSettings/VariableItem/VariableItem.tsx

@@ -518,7 +518,6 @@ function VariableItem({
 										size={14}
 										style={{
 											color: isDarkMode ? Color.BG_VANILLA_100 : Color.BG_INK_500,
-											marginTop: 1,
 										}}
 									/>
 								}
@@ -614,7 +613,6 @@ function VariableItem({
 												size={14}
 												style={{
 													color: isDarkMode ? Color.BG_VANILLA_100 : Color.BG_INK_500,
-													marginTop: 1,
 												}}
 											/>
 										}

frontend/src/container/FormAlertRules/QuerySection.styles.scss

@@ -19,6 +19,7 @@
 		}
 		.ant-btn-default {
 			border-color: transparent;
+			box-shadow: none;
 		}
 	}
 	.ant-tabs-tab-active {

frontend/src/container/PlannedDowntime/PlannedDowntime.styles.scss

@@ -72,8 +72,20 @@
 	.alert-rule-scope {
 		margin-bottom: 12px;
 
-		.ant-radio-wrapper {
-			color: var(--l1-foreground);
+		// `.createForm label` styles field labels (font-weight 500, 14px,
+		// 6px bottom padding). Those bleed into the @signozhq/ui RadioGroup
+		// option labels, making them bold and vertically misaligned with the
+		// radio control. Reset them back to plain option-text styling.
+		label {
+			padding: 0;
+			font-weight: 400;
+			line-height: normal;
+		}
+
+		// Loosen the design-system default (grid gap 0.5rem) between options.
+		.silence-alerts-radio-group {
+			margin-top: 8px;
+			gap: 12px;
 		}
 	}
 
@@ -144,10 +156,7 @@
 			display: flex;
 			align-items: center;
 			gap: 8px;
-
-			.ant-btn {
-				margin-top: 8px;
-			}
+			margin-top: 12px;
 		}
 
 		.schedule-created-at {

frontend/src/container/PlannedDowntime/PlannedDowntimeForm.tsx

@@ -54,8 +54,7 @@ import {
 } from './PlannedDowntimeutils';
 
 import './PlannedDowntime.styles.scss';
-import { RadioGroupItem } from '@signozhq/ui/radio-group';
-import { RadioGroup } from '@signozhq/ui/radio-group';
+import { RadioGroupItem, RadioGroup } from '@signozhq/ui/radio-group';
 
 dayjs.locale('en');
 dayjs.extend(utc);
@@ -471,7 +470,7 @@ export function PlannedDowntimeForm(
 						initialValue="specific"
 						className="alert-rule-scope"
 					>
-						<RadioGroup>
+						<RadioGroup className="silence-alerts-radio-group">
 							<RadioGroupItem value="all">All alert rules</RadioGroupItem>
 							<RadioGroupItem value="specific">Specific alert rules</RadioGroupItem>
 						</RadioGroup>

frontend/src/container/RoutingPolicies/styles.scss

@@ -35,10 +35,7 @@
 			display: flex;
 			align-items: center;
 			gap: 8px;
-
-			.ant-btn {
-				margin-top: 8px;
-			}
+			margin-top: 12px;
 		}
 
 		.routing-policies-table {

frontend/src/container/TopNav/AutoRefreshV2/AutoRefreshV2.styles.scss

@@ -8,7 +8,7 @@
 			139deg,
 			color-mix(in srgb, var(--card) 80%, transparent) 0%,
 			color-mix(in srgb, var(--card) 90%, transparent) 98.68%
-		);
+		) !important;
 		box-shadow: 4px 10px 16px 2px rgba(0, 0, 0, 0.2);
 		backdrop-filter: blur(20px);
 		padding: 0;
@@ -34,9 +34,9 @@
 }
 
 .refresh-interval-text {
-	padding: 12px 14px 8px 14px;
+	padding: 12px 14px 8px 14px !important;
 	color: var(--muted-foreground);
-	font-size: 11px;
+	font-size: 13px;
 	font-style: normal;
 	font-weight: 500;
 	line-height: 18px; /* 163.636% */

frontend/src/pages/MetricsExplorer/MetricsExplorerPage.styles.scss

@@ -9,7 +9,7 @@
 	}
 
 	.ant-tabs-nav {
-		padding: 0 8px;
+		padding-left: 16px;
 		margin-bottom: 0px;
 
 		&::before {

pkg/apiserver/signozapiserver/cloudintegration.go

@@ -151,6 +151,26 @@ func (provider *provider) addCloudIntegrationRoutes(router *mux.Router) error {
 		return err
 	}
 
+	if err := router.Handle("/api/v1/cloud_integrations/{cloud_provider}/accounts/{id}/services", handler.New(
+		provider.authzMiddleware.AdminAccess(provider.cloudIntegrationHandler.ListAccountServicesMetadata),
+		handler.OpenAPIDef{
+			ID:                  "ListAccountServicesMetadata",
+			Tags:                []string{"cloudintegration"},
+			Summary:             "List account services metadata",
+			Description:         "This endpoint lists the services metadata for the specified account and cloud provider",
+			Request:             nil,
+			RequestContentType:  "",
+			Response:            new(citypes.GettableServicesMetadata),
+			ResponseContentType: "application/json",
+			SuccessStatusCode:   http.StatusOK,
+			ErrorStatusCodes:    []int{},
+			Deprecated:          false,
+			SecuritySchemes:     newSecuritySchemes(types.RoleAdmin),
+		},
+	)).Methods(http.MethodGet).GetError(); err != nil {
+		return err
+	}
+
 	if err := router.Handle("/api/v1/cloud_integrations/{cloud_provider}/services/{service_id}", handler.New(
 		provider.authzMiddleware.AdminAccess(provider.cloudIntegrationHandler.GetService),
 		handler.OpenAPIDef{

pkg/modules/cloudintegration/cloudintegration.go

@@ -75,6 +75,7 @@ type Handler interface {
 	UpdateAccount(http.ResponseWriter, *http.Request)
 	DisconnectAccount(http.ResponseWriter, *http.Request)
 	ListServicesMetadata(http.ResponseWriter, *http.Request)
+	ListAccountServicesMetadata(http.ResponseWriter, *http.Request)
 	GetService(http.ResponseWriter, *http.Request)
 	UpdateService(http.ResponseWriter, *http.Request)
 	AgentCheckIn(http.ResponseWriter, *http.Request)

pkg/modules/cloudintegration/implcloudintegration/handler.go

@@ -276,6 +276,44 @@ func (handler *handler) ListServicesMetadata(rw http.ResponseWriter, r *http.Req
 	render.Success(rw, http.StatusOK, cloudintegrationtypes.NewGettableServicesMetadata(services))
 }
 
+func (handler *handler) ListAccountServicesMetadata(rw http.ResponseWriter, r *http.Request) {
+	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
+	defer cancel()
+
+	claims, err := authtypes.ClaimsFromContext(ctx)
+	if err != nil {
+		render.Error(rw, err)
+		return
+	}
+
+	provider, err := cloudintegrationtypes.NewCloudProvider(mux.Vars(r)["cloud_provider"])
+	if err != nil {
+		render.Error(rw, err)
+		return
+	}
+
+	accountID, err := valuer.NewUUID(mux.Vars(r)["id"])
+	if err != nil {
+		render.Error(rw, err)
+		return
+	}
+
+	// check if integration account exists and is not removed.
+	_, err = handler.module.GetConnectedAccount(ctx, valuer.MustNewUUID(claims.OrgID), accountID, provider)
+	if err != nil {
+		render.Error(rw, err)
+		return
+	}
+
+	services, err := handler.module.ListServicesMetadata(ctx, valuer.MustNewUUID(claims.OrgID), provider, accountID)
+	if err != nil {
+		render.Error(rw, err)
+		return
+	}
+
+	render.Success(rw, http.StatusOK, cloudintegrationtypes.NewGettableServicesMetadata(services))
+}
+
 func (handler *handler) GetService(rw http.ResponseWriter, r *http.Request) {
 	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
 	defer cancel()
@@ -440,4 +478,3 @@ func (handler *handler) AgentCheckIn(rw http.ResponseWriter, r *http.Request) {
 
 	render.Success(rw, http.StatusOK, cloudintegrationtypes.NewGettableAgentCheckIn(provider, resp))
 }
-

tests/integration/tests/cloudintegrations/05_services.py

@@ -86,6 +86,49 @@ def test_list_services_with_account(
         assert svc["enabled"] is False, f"Service {svc['id']} should be disabled before any config is set"
 
 
+EC2_SERVICE_ID = "ec2"
+
+
+def test_list_account_services(
+    signoz: types.SigNoz,
+    create_user_admin: types.Operation,  # pylint: disable=unused-argument
+    get_token: Callable[[str, str], str],
+    create_cloud_integration_account: Callable,
+) -> None:
+    """ListAccountServicesMetadata reflects enabled state after enabling a service."""
+    admin_token = get_token(USER_ADMIN_EMAIL, USER_ADMIN_PASSWORD)
+
+    account = create_cloud_integration_account(admin_token, CLOUD_PROVIDER)
+    account_id = account["id"]
+
+    checkin = simulate_agent_checkin(signoz, admin_token, CLOUD_PROVIDER, account_id, str(uuid.uuid4()))
+    assert checkin.status_code == HTTPStatus.OK, f"Check-in failed: {checkin.text}"
+
+    put_response = requests.put(
+        signoz.self.host_configs["8080"].get(f"/api/v1/cloud_integrations/{CLOUD_PROVIDER}/accounts/{account_id}/services/{EC2_SERVICE_ID}"),
+        headers={"Authorization": f"Bearer {admin_token}"},
+        json={"config": {"aws": {"metrics": {"enabled": True}, "logs": {"enabled": True}}}},
+        timeout=10,
+    )
+    assert put_response.status_code == HTTPStatus.NO_CONTENT, f"Enable ec2 failed: {put_response.status_code}: {put_response.text}"
+
+    list_response = requests.get(
+        signoz.self.host_configs["8080"].get(f"/api/v1/cloud_integrations/{CLOUD_PROVIDER}/accounts/{account_id}/services"),
+        headers={"Authorization": f"Bearer {admin_token}"},
+        timeout=10,
+    )
+    assert list_response.status_code == HTTPStatus.OK, f"Expected 200, got {list_response.status_code}"
+
+    data = list_response.json()["data"]
+    assert "services" in data, "Response should contain 'services' field"
+    assert isinstance(data["services"], list), "services should be a list"
+    assert len(data["services"]) > 0, "services list should be non-empty"
+
+    ec2_service = next((s for s in data["services"] if s["id"] == EC2_SERVICE_ID), None)
+    assert ec2_service is not None, f"EC2 service '{EC2_SERVICE_ID}' not found in services list"
+    assert ec2_service["enabled"] is True, f"EC2 service should be enabled, got: {ec2_service['enabled']}"
+
+
 def test_get_service_details_without_account(
     signoz: types.SigNoz,
     create_user_admin: types.Operation,  # pylint: disable=unused-argument