From 0c974edd13c33fe7aaa835c7f6eacb674e6bf541 Mon Sep 17 00:00:00 2001
From: Shailesh Parmar <shailesh.parmar.webdev@gmail.com>
Date: Tue, 28 May 2024 14:12:16 +0530
Subject: [PATCH] Minor: address ui feedback on data observability (#16427)

* Minor: address ui feedback on data observability

* fixed failing unit test
---
 .../IncidentManager/Severity/Severity.component.tsx | 10 ++++++----
 .../TestCaseIncidentManagerStatus.component.tsx     | 13 +++++++------
 .../TestSuiteList/TestSuites.component.tsx          |  2 +-
 .../pages/IncidentManager/IncidentManagerPage.tsx   |  2 +-
 4 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/Severity/Severity.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/Severity/Severity.component.tsx
index 627ef0ac755..19a86ac6c31 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/Severity/Severity.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/Severity/Severity.component.tsx
@@ -11,7 +11,8 @@
  *  limitations under the License.
  */
 
-import { Button, Space, Tooltip } from 'antd';
+import Icon from '@ant-design/icons/lib/components/Icon';
+import { Space, Tooltip } from 'antd';
 import classNames from 'classnames';
 import { startCase, toLower } from 'lodash';
 import React, { useCallback, useMemo, useState } from 'react';
@@ -70,10 +71,11 @@ const Severity = ({ severity, onSubmit }: SeverityProps) => {
             title={t('label.edit-entity', {
               entity: t('label.severity'),
             })}>
-            <Button
+            <Icon
+              {...ICON_DIMENSION}
+              component={EditIcon}
               data-testid="edit-severity-icon"
-              icon={<EditIcon {...ICON_DIMENSION} color={DE_ACTIVE_COLOR} />}
-              type="text"
+              style={{ color: DE_ACTIVE_COLOR }}
               onClick={onEditSeverity}
             />
           </Tooltip>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/TestCaseIncidentManagerStatus.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/TestCaseIncidentManagerStatus.component.tsx
index b5b5a6771ba..11677985027 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/TestCaseIncidentManagerStatus.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/TestCaseIncidentManagerStatus.component.tsx
@@ -11,12 +11,14 @@
  *  limitations under the License.
  */
 
-import { Button, Space, Tooltip, Typography } from 'antd';
+import Icon from '@ant-design/icons/lib/components/Icon';
+import { Space, Tooltip, Typography } from 'antd';
 import classNames from 'classnames';
 import React, { useCallback, useMemo, useState } from 'react';
 import { ReactComponent as EditIcon } from '../../../../assets/svg/edit-new.svg';
 import {
   DE_ACTIVE_COLOR,
+  ICON_DIMENSION,
   NO_DATA_PLACEHOLDER,
 } from '../../../../constants/constants';
 import { usePermissionProvider } from '../../../../context/PermissionProvider/PermissionProvider';
@@ -70,12 +72,11 @@ const TestCaseIncidentManagerStatus = ({
             label={statusType}
           />
           {hasEditPermission && (
-            <Button
-              className="flex-center p-0"
+            <Icon
+              {...ICON_DIMENSION}
+              component={EditIcon}
               data-testid="edit-resolution-icon"
-              icon={<EditIcon color={DE_ACTIVE_COLOR} width="14px" />}
-              size="small"
-              type="text"
+              style={{ color: DE_ACTIVE_COLOR }}
               onClick={onEditStatus}
             />
           )}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/TestSuite/TestSuiteList/TestSuites.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/TestSuite/TestSuiteList/TestSuites.component.tsx
index 96476fac279..f328da38fbe 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/TestSuite/TestSuiteList/TestSuites.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/TestSuite/TestSuiteList/TestSuites.component.tsx
@@ -279,7 +279,7 @@ export const TestSuites = ({ summaryPanel }: { summaryPanel: ReactNode }) => {
                   />
                 </Form.Item>
                 <Form.Item
-                  className="m-0 w-52"
+                  className="m-0"
                   label={t('label.owner')}
                   name="owner">
                   <UserTeamSelectableList
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/IncidentManager/IncidentManagerPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/IncidentManager/IncidentManagerPage.tsx
index f7d36f8266d..dee42c94c43 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/IncidentManager/IncidentManagerPage.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/IncidentManager/IncidentManagerPage.tsx
@@ -443,7 +443,7 @@ const IncidentManagerPage = () => {
 
   return (
     <PageLayoutV1 pageTitle="Incident Manager">
-      <Row className="p-x-lg p-t-md" gutter={[0, 16]}>
+      <Row className="p-x-lg p-b-lg p-t-md" gutter={[0, 16]}>
         <Col span={24}>
           <Typography.Title
             className="m-b-md"