From 2177bc2e0341e9e6f672d705f680ab91918d20b4 Mon Sep 17 00:00:00 2001
From: Dhruv Parmar <83108871+dhruvjsx@users.noreply.github.com>
Date: Tue, 8 Jul 2025 12:10:18 +0530
Subject: [PATCH] fixed unaligned charts (#22165)

Co-authored-by: Chirag Madlani <12962843+chirag-madlani@users.noreply.github.com>
---
 .../ui/src/components/DataInsight/DataInsightSummary.tsx      | 1 +
 .../ui/src/components/DataInsight/data-insight-detail.less    | 3 +++
 .../components/common/SummaryCard/SummaryCard.component.tsx   | 4 ++--
 3 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataInsight/DataInsightSummary.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataInsight/DataInsightSummary.tsx
index af426ebe42f..12d3bdfb9ec 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataInsight/DataInsightSummary.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataInsight/DataInsightSummary.tsx
@@ -233,6 +233,7 @@ const DataInsightSummary: FC<Props> = ({ chartFilter, onScrollToChart }) => {
             {/* summary of most active user */}
             {mostActiveUser?.userName && (
               <Col
+                className="data-insight-active-user"
                 data-testid={`summary-item-${DataInsightChartType.MostActiveUsers}`}
                 key={DataInsightChartType.MostActiveUsers}
                 span={6}>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataInsight/data-insight-detail.less b/openmetadata-ui/src/main/resources/ui/src/components/DataInsight/data-insight-detail.less
index 4655410c200..aa10b73755f 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataInsight/data-insight-detail.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataInsight/data-insight-detail.less
@@ -40,6 +40,9 @@
   }
 }
 
+.data-insight-active-user .summary-card .ant-space-item {
+  max-width: 100%;
+}
 .ant-typography.data-insight-label-text {
   color: @label-color;
 }
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/SummaryCard/SummaryCard.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/SummaryCard/SummaryCard.component.tsx
index 030f6d3cd97..56c6f62ddd5 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/SummaryCard/SummaryCard.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/SummaryCard/SummaryCard.component.tsx
@@ -50,7 +50,7 @@ export const SummaryCard = ({
   }
 
   return (
-    <div
+    <Space
       className={classNames('summary-card', cardBackgroundClass, className)}
       data-testid="summary-card-container">
       <div
@@ -81,6 +81,6 @@ export const SummaryCard = ({
           width={65}
         />
       )}
-    </div>
+    </Space>
   );
 };