From 7cd5369a8ee18806bbb0ec720360edb228a29d22 Mon Sep 17 00:00:00 2001
From: Harshit Shah <dinkushah169@gmail.com>
Date: Thu, 7 May 2026 19:52:22 +0530
Subject: [PATCH 1/9] refactor(DimensionalityTab): migrate table to core-ui
 Table component

Replace Ant Design Table with react-aria-based Table from
@openmetadata/ui-core-components. Removes antd ColumnsType,
HelpCircle icon, and Tooltip imports in favour of Table.Head
tooltip prop. Impact-score tooltip now rendered natively by
Table.Head. Trans type error fixed via ComponentType cast.
Select dimension dropdown styled to match date picker height
(h-8/32px) and font-size xs.

Refs: https://github.com/open-metadata/openmetadata-collate/issues/3837
---
 .../DimensionalityTab/DimensionalityTab.tsx   | 169 +++++++++---------
 1 file changed, 80 insertions(+), 89 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx
index 93d4d9889d24..cc540b4e48e4 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx
@@ -10,13 +10,11 @@
  *  See the License for the specific language governing permissions and
  *  limitations under the License.
  */
-import { Select, Skeleton, Tooltip } from '@openmetadata/ui-core-components';
-import { HelpCircle } from '@untitledui/icons';
-import { ColumnsType } from 'antd/lib/table';
+import { Select, Skeleton, Table } from '@openmetadata/ui-core-components';
 import { format } from 'date-fns';
 import { isEmpty, split, toLower } from 'lodash';
 import { DateRangeObject } from 'Models';
-import { useEffect, useMemo, useState } from 'react';
+import { type ComponentType, useEffect, useMemo, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { Link } from 'react-router-dom';
 import {
@@ -43,11 +41,15 @@ import NoDataPlaceholderNew from '../../../common/ErrorWithPlaceholder/NoDataPla
 import MuiDatePickerMenu from '../../../common/MuiDatePickerMenu/MuiDatePickerMenu';
 import StatusBadge from '../../../common/StatusBadge/StatusBadge.component';
 import { StatusType } from '../../../common/StatusBadge/StatusBadge.interface';
-import Table from '../../../common/Table/Table';
 import { ProfilerTabPath } from '../../../Database/Profiler/ProfilerDashboard/profilerDashboard.interface';
 import DimensionalityHeatmap from './DimensionalityHeatmap/DimensionalityHeatmap.component';
 import { DimensionResultWithTimestamp } from './DimensionalityHeatmap/DimensionalityHeatmap.interface';
 
+const TransComponent = Trans as ComponentType<{
+  i18nKey: string;
+  components: Record<number, JSX.Element>;
+}>;
+
 const DimensionalityTab = () => {
   const { t } = useTranslation();
   const { dimensionKey } = useRequiredParams<{ dimensionKey?: string }>();
@@ -176,83 +178,15 @@ const DimensionalityTab = () => {
       });
   }, [dimensionData]);
 
-  const tableColumns: ColumnsType<{
-    key: string;
-    dimensionValue: string;
-    result: DimensionResultWithTimestamp;
-  }> = [
-    {
-      title: t('label.status'),
-      dataIndex: 'result',
-      key: 'status',
-      width: 120,
-      render: (result: DimensionResultWithTimestamp) => {
-        return result?.testCaseStatus ? (
-          <StatusBadge
-            dataTestId="status-badge"
-            label={TEST_CASE_STATUS_LABELS[result.testCaseStatus]}
-            status={toLower(result.testCaseStatus) as StatusType}
-          />
-        ) : (
-          <span className="tw:text-sm">--</span>
-        );
-      },
-    },
+  const dimensionTableColumns = [
+    { id: 'status', label: t('label.status') },
     {
-      title: (
-        <div className="tw:flex tw:items-center tw:gap-2">
-          {t('label.impact-score')}
-          <Tooltip
-            placement="top"
-            title={
-              <span className="tw:text-xs">
-                {t('message.impact-score-helper')}
-              </span>
-            }>
-            <HelpCircle height={16} width={16} />
-          </Tooltip>
-        </div>
-      ),
-      dataIndex: 'result',
-      key: 'impactScore',
-      width: 120,
-      render: (result: DimensionResultWithTimestamp) => {
-        return (
-          <span className="tw:text-sm">{result?.impactScore ?? '--'}</span>
-        );
-      },
-    },
-    {
-      title: t('label.dimension'),
-      dataIndex: 'dimensionValue',
-      key: 'dimensionValue',
-      width: 200,
-      render: (dimensionValue: string, record) => {
-        return (
-          <Link
-            className="tw:text-text-brand-secondary"
-            to={getTestCaseDimensionsDetailPagePath(
-              testCase?.fullyQualifiedName || '',
-              record.result.dimensionKey || ''
-            )}>
-            {dimensionValue}
-          </Link>
-        );
-      },
-    },
-    {
-      title: t('label.last-run'),
-      dataIndex: 'result',
-      key: 'lastRun',
-      width: 200,
-      render: (result: DimensionResultWithTimestamp) => {
-        return result?.timestamp ? (
-          <DateTimeDisplay timestamp={result.timestamp} />
-        ) : (
-          <span className="tw:text-sm">--</span>
-        );
-      },
+      id: 'impactScore',
+      label: t('label.impact-score'),
+      tooltip: t('message.impact-score-helper'),
     },
+    { id: 'dimensionValue', label: t('label.dimension') },
+    { id: 'lastRun', label: t('label.last-run') },
   ];
 
   const noDataPlaceholder = useMemo(() => {
@@ -267,7 +201,7 @@ const DimensionalityTab = () => {
 
     return (
       <NoDataPlaceholderNew size={SIZE.LARGE}>
-        <Trans
+        <TransComponent
           components={{
             0: <span className="tw:text-sm" />,
             1: <span className="tw:text-sm" />,
@@ -287,8 +221,9 @@ const DimensionalityTab = () => {
             {`${t('label.select-dimension')}:`}
           </p>
           <Select
-            className="tw:min-w-37.5"
+            className="tw:min-w-37.5 tw:h-8"
             data-testid="dimension-select"
+            fontSize="xs"
             items={dimensionColumnsOptions}
             size="sm"
             value={selectedDimension ?? null}
@@ -329,13 +264,69 @@ const DimensionalityTab = () => {
                 entityText: selectedDimension || '',
               })}
             </p>
-            <Table
-              bordered
-              columns={tableColumns}
-              dataSource={getLatestResultPerDimension}
-              loading={isLoading}
-              pagination={false}
-            />
+            <Table aria-label={selectedDimension ?? ''}>
+              <Table.Header columns={dimensionTableColumns}>
+                {(col) => (
+                  <Table.Head
+                    id={col.id}
+                    key={col.id}
+                    label={col.label}
+                    tooltip={col.tooltip}
+                  />
+                )}
+              </Table.Header>
+              <Table.Body items={getLatestResultPerDimension}>
+                {(row) => (
+                  <Table.Row
+                    columns={dimensionTableColumns}
+                    id={row.key}
+                    key={row.key}>
+                    {(col) => (
+                      <Table.Cell key={col.id}>
+                        {col.id === 'status' ? (
+                          row.result?.testCaseStatus ? (
+                            <StatusBadge
+                              dataTestId="status-badge"
+                              label={
+                                TEST_CASE_STATUS_LABELS[
+                                  row.result.testCaseStatus
+                                ]
+                              }
+                              status={
+                                toLower(
+                                  row.result.testCaseStatus
+                                ) as StatusType
+                              }
+                            />
+                          ) : (
+                            <span className="tw:text-sm">--</span>
+                          )
+                        ) : col.id === 'impactScore' ? (
+                          <span className="tw:text-sm">
+                            {row.result?.impactScore ?? '--'}
+                          </span>
+                        ) : col.id === 'dimensionValue' ? (
+                          <Link
+                            className="tw:text-text-brand-secondary"
+                            to={getTestCaseDimensionsDetailPagePath(
+                              testCase?.fullyQualifiedName || '',
+                              row.result.dimensionKey || ''
+                            )}>
+                            {row.dimensionValue}
+                          </Link>
+                        ) : col.id === 'lastRun' ? (
+                          row.result?.timestamp ? (
+                            <DateTimeDisplay timestamp={row.result.timestamp} />
+                          ) : (
+                            <span className="tw:text-sm">--</span>
+                          )
+                        ) : null}
+                      </Table.Cell>
+                    )}
+                  </Table.Row>
+                )}
+              </Table.Body>
+            </Table>
           </div>
         </>
       )}

From 15f8f976981ae13dd18680f3b30265de5d2dfc82 Mon Sep 17 00:00:00 2001
From: Harshit Shah <dinkushah169@gmail.com>
Date: Thu, 7 May 2026 20:07:27 +0530
Subject: [PATCH 2/9] refactor(DimensionalityTab): flatten cell renderer and
 memoize columns

Extract nested ternary cell renderer into a switch-based renderCell
function. Wrap dimensionTableColumns in useMemo([t]) to stabilize
the array reference across renders.
---
 .../DimensionalityTab/DimensionalityTab.tsx   | 103 ++++++++++--------
 1 file changed, 55 insertions(+), 48 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx
index cc540b4e48e4..ae5fd89755e6 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx
@@ -178,16 +178,60 @@ const DimensionalityTab = () => {
       });
   }, [dimensionData]);
 
-  const dimensionTableColumns = [
-    { id: 'status', label: t('label.status') },
-    {
-      id: 'impactScore',
-      label: t('label.impact-score'),
-      tooltip: t('message.impact-score-helper'),
-    },
-    { id: 'dimensionValue', label: t('label.dimension') },
-    { id: 'lastRun', label: t('label.last-run') },
-  ];
+  const dimensionTableColumns = useMemo(
+    () => [
+      { id: 'status', label: t('label.status') },
+      {
+        id: 'impactScore',
+        label: t('label.impact-score'),
+        tooltip: t('message.impact-score-helper'),
+      },
+      { id: 'dimensionValue', label: t('label.dimension') },
+      { id: 'lastRun', label: t('label.last-run') },
+    ],
+    [t]
+  );
+
+  const renderCell = (
+    col: { id: string },
+    row: (typeof getLatestResultPerDimension)[number]
+  ) => {
+    switch (col.id) {
+      case 'status':
+        return row.result?.testCaseStatus ? (
+          <StatusBadge
+            dataTestId="status-badge"
+            label={TEST_CASE_STATUS_LABELS[row.result.testCaseStatus]}
+            status={toLower(row.result.testCaseStatus) as StatusType}
+          />
+        ) : (
+          <span className="tw:text-sm">--</span>
+        );
+      case 'impactScore':
+        return (
+          <span className="tw:text-sm">{row.result?.impactScore ?? '--'}</span>
+        );
+      case 'dimensionValue':
+        return (
+          <Link
+            className="tw:text-text-brand-secondary"
+            to={getTestCaseDimensionsDetailPagePath(
+              testCase?.fullyQualifiedName || '',
+              row.result.dimensionKey || ''
+            )}>
+            {row.dimensionValue}
+          </Link>
+        );
+      case 'lastRun':
+        return row.result?.timestamp ? (
+          <DateTimeDisplay timestamp={row.result.timestamp} />
+        ) : (
+          <span className="tw:text-sm">--</span>
+        );
+      default:
+        return null;
+    }
+  };
 
   const noDataPlaceholder = useMemo(() => {
     if (isLoading) {
@@ -283,44 +327,7 @@ const DimensionalityTab = () => {
                     key={row.key}>
                     {(col) => (
                       <Table.Cell key={col.id}>
-                        {col.id === 'status' ? (
-                          row.result?.testCaseStatus ? (
-                            <StatusBadge
-                              dataTestId="status-badge"
-                              label={
-                                TEST_CASE_STATUS_LABELS[
-                                  row.result.testCaseStatus
-                                ]
-                              }
-                              status={
-                                toLower(
-                                  row.result.testCaseStatus
-                                ) as StatusType
-                              }
-                            />
-                          ) : (
-                            <span className="tw:text-sm">--</span>
-                          )
-                        ) : col.id === 'impactScore' ? (
-                          <span className="tw:text-sm">
-                            {row.result?.impactScore ?? '--'}
-                          </span>
-                        ) : col.id === 'dimensionValue' ? (
-                          <Link
-                            className="tw:text-text-brand-secondary"
-                            to={getTestCaseDimensionsDetailPagePath(
-                              testCase?.fullyQualifiedName || '',
-                              row.result.dimensionKey || ''
-                            )}>
-                            {row.dimensionValue}
-                          </Link>
-                        ) : col.id === 'lastRun' ? (
-                          row.result?.timestamp ? (
-                            <DateTimeDisplay timestamp={row.result.timestamp} />
-                          ) : (
-                            <span className="tw:text-sm">--</span>
-                          )
-                        ) : null}
+                        {renderCell(col, row)}
                       </Table.Cell>
                     )}
                   </Table.Row>

From 284c732112c5de094bb3273b790651c07d2b4047 Mon Sep 17 00:00:00 2001
From: Harshit Shah <dinkushah169@gmail.com>
Date: Thu, 7 May 2026 20:21:38 +0530
Subject: [PATCH 3/9] fix checkstyle

---
 .../IncidentManager/DimensionalityTab/DimensionalityTab.tsx     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx
index ae5fd89755e6..9adf2c1b1d5c 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx
@@ -14,7 +14,7 @@ import { Select, Skeleton, Table } from '@openmetadata/ui-core-components';
 import { format } from 'date-fns';
 import { isEmpty, split, toLower } from 'lodash';
 import { DateRangeObject } from 'Models';
-import { type ComponentType, useEffect, useMemo, useState } from 'react';
+import { useEffect, useMemo, useState, type ComponentType } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { Link } from 'react-router-dom';
 import {

From ec3b931b77ce8aabceb9ea0f5beeafc150ccb1ac Mon Sep 17 00:00:00 2001
From: Harshit Shah <dinkushah169@gmail.com>
Date: Thu, 7 May 2026 21:05:58 +0530
Subject: [PATCH 4/9] minor ui fix

---
 .../Database/Profiler/DataQualityTab/DataQualityTab.tsx         | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataQualityTab/DataQualityTab.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataQualityTab/DataQualityTab.tsx
index a402d1165c99..f0009ee2ce5f 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataQualityTab/DataQualityTab.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/DataQualityTab/DataQualityTab.tsx
@@ -513,7 +513,7 @@ const DataQualityTab: React.FC<DataQualityTabProps> = ({
                 TestCasePageTabs.DIMENSIONALITY
               )}>
               <div
-                className="tw:flex tw:items-center tw:gap-2 tw:rounded-md tw:bg-blue-50 tw:p-2 tw:text-primary"
+                className="tw:flex tw:min-w-13 tw:items-center tw:gap-2 tw:rounded-md tw:bg-blue-50 tw:p-2 tw:text-primary"
                 data-testid={`dimension-count-${record.name}`}>
                 <DimensionIcon height={12} width={12} />
                 <span className="tw:text-xs tw:font-medium">

From ad502914acaa2df924010f506d015aa9889f086a Mon Sep 17 00:00:00 2001
From: Harshit Shah <dinkushah169@gmail.com>
Date: Thu, 7 May 2026 22:04:05 +0530
Subject: [PATCH 5/9] refactor(IncidentManager): migrate table to core-ui Table
 component

- Replace Ant Design Table with core-ui Table (react-aria-components)
- Use plain renderRow function (matching DataQualityTab pattern) with
  static Table.Cell children and Table.Body dependencies to fix status/
  severity/assignee columns stuck at loading skeleton
- Fix popover max-height distortion by adding popoverClassName prop to
  IncidentStatusPopoverShell and applying tw:!max-h-none via react-aria
  className override
- Update unit test mock for @openmetadata/ui-core-components to include
  Table component
- Update e2e selector from Ant Design .ant-table-tbody to
  data-testid based tbody tr selector

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../e2e/Features/IncidentManager.spec.ts      |   2 +-
 .../IncidentStatusPopoverShell.component.tsx  |   7 +-
 ...InlineTestCaseIncidentStatus.component.tsx |   6 +-
 .../IncidentManager.component.tsx             | 259 ++++++++----------
 .../IncidentManager/IncidentManager.test.tsx  |  59 +++-
 5 files changed, 182 insertions(+), 151 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/IncidentManager.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/IncidentManager.spec.ts
index 2d99c240ec9f..1ff8591313ae 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/IncidentManager.spec.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/IncidentManager.spec.ts
@@ -145,7 +145,7 @@ const isVisible = async (locator: Locator) =>
 
 const expectIncidentTableRowsToContain = async (page: Page, text: string) => {
   const rows = page.locator(
-    '.ant-table-tbody tr:not(.ant-table-measure-row):not(.ant-table-placeholder)'
+    '[data-testid="test-case-incident-manager-table"] tbody tr'
   );
   const rowCount = await rows.count();
 
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineIncidentStatus/IncidentStatusPopoverShell.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineIncidentStatus/IncidentStatusPopoverShell.component.tsx
index 12cb8cfbb02b..cb30c4ca98c0 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineIncidentStatus/IncidentStatusPopoverShell.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineIncidentStatus/IncidentStatusPopoverShell.component.tsx
@@ -21,6 +21,7 @@ export type IncidentStatusPopoverShellProps = {
   dataTestid: string;
   trigger: ReactNode;
   children: ReactNode;
+  popoverClassName?: string;
 };
 
 export const IncidentStatusPopoverShell = ({
@@ -30,10 +31,14 @@ export const IncidentStatusPopoverShell = ({
   dataTestid,
   trigger,
   children,
+  popoverClassName,
 }: IncidentStatusPopoverShellProps) => (
   <PopoverTrigger isOpen={isOpen} onOpenChange={onOpenChange}>
     {trigger}
-    <Popover containerClassName={containerClassName} data-testid={dataTestid}>
+    <Popover
+      className={popoverClassName}
+      containerClassName={containerClassName}
+      data-testid={dataTestid}>
       {children}
     </Popover>
   </PopoverTrigger>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineTestCaseIncidentStatus.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineTestCaseIncidentStatus.component.tsx
index 84cbdc70cc9d..320822a76ee0 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineTestCaseIncidentStatus.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineTestCaseIncidentStatus.component.tsx
@@ -569,6 +569,7 @@ const InlineTestCaseIncidentStatus = ({
           containerClassName="tw:max-h-[500px] tw:min-w-0 tw:w-[320px] tw:border tw:border-border-secondary"
           dataTestid={`${data.testCaseReference?.name}-assignee-popover`}
           isOpen={showAssigneePopover}
+          popoverClassName="tw:!max-h-none"
           trigger={renderStatusChipButton()}
           onOpenChange={(open) => {
             if (open) {
@@ -586,9 +587,10 @@ const InlineTestCaseIncidentStatus = ({
     if (showResolvedPopover) {
       return (
         <IncidentStatusPopoverShell
-          containerClassName="tw:min-w-0 tw:w-[320px] tw:border tw:border-border-secondary"
+          containerClassName="tw:min-w-0 tw:w-80 tw:overflow-y-auto tw:border tw:border-border-secondary"
           dataTestid={`${data.testCaseReference?.name}-resolved-popover`}
           isOpen={showResolvedPopover}
+          popoverClassName="tw:!max-h-none"
           trigger={renderStatusChipButton()}
           onOpenChange={(open) => {
             if (!open) {
@@ -611,7 +613,7 @@ const InlineTestCaseIncidentStatus = ({
         onOpenChange={handleStatusMenuOpenChange}>
         {renderStatusChipButton()}
         <Dropdown.Popover
-          className="tw:min-w-[100px] tw:w-max tw:overflow-auto"
+          className="tw:min-w-25 tw:w-max tw:overflow-auto"
           placement="top">
           {statusMenuItems}
         </Dropdown.Popover>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.component.tsx
index 5f2cd7cdf6b7..f9d6ee9e3f03 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.component.tsx
@@ -10,9 +10,13 @@
  *  See the License for the specific language governing permissions and
  *  limitations under the License.
  */
-import { Button, Dropdown, Skeleton } from '@openmetadata/ui-core-components';
+import {
+  Button,
+  Dropdown,
+  Skeleton,
+  Table,
+} from '@openmetadata/ui-core-components';
 import { Form, Select } from 'antd';
-import { ColumnsType } from 'antd/lib/table';
 import { AxiosError } from 'axios';
 import { compare } from 'fast-json-patch';
 import { isEqual, isString, isUndefined, omit, parseInt, pick } from 'lodash';
@@ -75,9 +79,9 @@ import DateTimeDisplay from '../common/DateTimeDisplay/DateTimeDisplay';
 import ErrorPlaceHolder from '../common/ErrorWithPlaceholder/ErrorPlaceHolder';
 import FilterTablePlaceHolder from '../common/ErrorWithPlaceholder/FilterTablePlaceHolder';
 import MuiDatePickerMenu from '../common/MuiDatePickerMenu/MuiDatePickerMenu';
+import NextPrevious from '../common/NextPrevious/NextPrevious';
 import { PagingHandlerParams } from '../common/NextPrevious/NextPrevious.interface';
 import { OwnerLabel } from '../common/OwnerLabel/OwnerLabel.component';
-import Table from '../common/Table/Table';
 import {
   ProfilerTabPath,
   TestCasePermission,
@@ -594,140 +598,93 @@ const IncidentManager = ({
     );
   };
 
-  const columns: ColumnsType<TestCaseResolutionStatus> = useMemo(
+  const columns = useMemo(
     () => [
-      {
-        title: t('label.test-case-name'),
-        dataIndex: 'name',
-        key: 'name',
-        width: 300,
-        fixed: 'left',
-        render: (_, record) => {
-          return (
-            <Link
-              className="m-0 break-all text-primary"
-              data-testid={`test-case-${record.testCaseReference?.name}`}
-              to={getTestCaseDetailPagePath(
-                record.testCaseReference?.fullyQualifiedName ?? ''
-              )}>
-              {getEntityName(record.testCaseReference)}
-            </Link>
-          );
-        },
-      },
+      { id: 'name', label: t('label.test-case-name') },
       ...(isIncidentPage
-        ? [
-            {
-              title: t('label.table'),
-              dataIndex: 'testCaseReference',
-              key: 'testCaseReference',
-              width: 150,
-              render: (value: EntityReference) => {
-                const tableFqn = getPartialNameFromTableFQN(
-                  value.fullyQualifiedName ?? '',
-                  [
-                    FqnPart.Service,
-                    FqnPart.Database,
-                    FqnPart.Schema,
-                    FqnPart.Table,
-                  ],
-                  '.'
-                );
-
-                return (
-                  <Link
-                    data-testid="table-link"
-                    to={getEntityDetailsPath(
-                      EntityType.TABLE,
-                      tableFqn,
-                      EntityTabs.PROFILER,
-                      ProfilerTabPath.DATA_QUALITY
-                    )}
-                    onClick={(e) => e.stopPropagation()}>
-                    {getNameFromFQN(tableFqn) ?? value.fullyQualifiedName}
-                  </Link>
-                );
-              },
-            },
-          ]
+        ? [{ id: 'testCaseReference', label: t('label.table') }]
         : []),
-      {
-        title: t('label.last-updated'),
-        dataIndex: 'timestamp',
-        key: 'timestamp',
-        width: 150,
-        render: (value: number) => {
-          return <DateTimeDisplay timestamp={value} />;
-        },
-      },
-      {
-        title: t('label.status'),
-        dataIndex: 'testCaseResolutionStatusType',
-        key: 'testCaseResolutionStatusType',
-        width: 100,
-        render: (_, record: TestCaseResolutionStatus) => {
-          if (isPermissionLoading) {
-            return <Skeleton height={24} variant="rectangular" width={100} />;
-          }
-          const hasPermission = testCasePermissions.find(
-            (item) =>
-              item.fullyQualifiedName ===
-              record.testCaseReference?.fullyQualifiedName
-          );
+      { id: 'timestamp', label: t('label.last-updated') },
+      { id: 'testCaseResolutionStatusType', label: t('label.status') },
+      { id: 'severity', label: t('label.severity') },
+      { id: 'testCaseResolutionStatusDetails', label: t('label.assignee') },
+    ],
+    [isIncidentPage, t]
+  );
 
-          return (
+  const renderRow = (record: TestCaseResolutionStatus) => {
+    const ref = record.testCaseReference;
+    const tableFqn = getPartialNameFromTableFQN(
+      ref?.fullyQualifiedName ?? '',
+      [FqnPart.Service, FqnPart.Database, FqnPart.Schema, FqnPart.Table],
+      '.'
+    );
+    const hasPermission = testCasePermissions.find(
+      (item) =>
+        item.fullyQualifiedName === ref?.fullyQualifiedName
+    );
+
+    return (
+      <Table.Row id={record.id ?? ''} key={record.id}>
+        <Table.Cell>
+          <Link
+            className="m-0 break-all text-primary"
+            data-testid={`test-case-${ref?.name}`}
+            to={getTestCaseDetailPagePath(ref?.fullyQualifiedName ?? '')}>
+            {getEntityName(ref)}
+          </Link>
+        </Table.Cell>
+        {isIncidentPage && (
+          <Table.Cell>
+            <Link
+              data-testid="table-link"
+              to={getEntityDetailsPath(
+                EntityType.TABLE,
+                tableFqn,
+                EntityTabs.PROFILER,
+                ProfilerTabPath.DATA_QUALITY
+              )}
+              onClick={(e) => e.stopPropagation()}>
+              {getNameFromFQN(tableFqn) ?? ref?.fullyQualifiedName}
+            </Link>
+          </Table.Cell>
+        )}
+        <Table.Cell>
+          <DateTimeDisplay timestamp={record.timestamp as number} />
+        </Table.Cell>
+        <Table.Cell>
+          {isPermissionLoading ? (
+            <Skeleton height={24} variant="rectangular" width={100} />
+          ) : (
             <TestCaseIncidentManagerStatus
               isInline
               data={record}
               hasPermission={hasPermission?.EditAll && !tableDetails?.deleted}
               onSubmit={handleStatusSubmit}
             />
-          );
-        },
-      },
-      {
-        title: t('label.severity'),
-        dataIndex: 'severity',
-        key: 'severity',
-        width: 100,
-        render: (value: Severities, record: TestCaseResolutionStatus) => {
-          if (isPermissionLoading) {
-            return <Skeleton height={24} variant="rectangular" width={100} />;
-          }
-
-          const hasPermission = testCasePermissions.find(
-            (item) =>
-              item.fullyQualifiedName ===
-              record.testCaseReference?.fullyQualifiedName
-          );
-
-          return (
+          )}
+        </Table.Cell>
+        <Table.Cell>
+          {isPermissionLoading ? (
+            <Skeleton height={24} variant="rectangular" width={100} />
+          ) : (
             <Severity
               isInline
               hasPermission={hasPermission?.EditAll && !tableDetails?.deleted}
-              severity={value}
+              severity={record.severity}
               onSubmit={(severity) => handleSeveritySubmit(record, severity)}
             />
-          );
-        },
-      },
-      {
-        title: t('label.assignee'),
-        dataIndex: 'testCaseResolutionStatusDetails',
-        key: 'testCaseResolutionStatusDetails',
-        width: 200,
-        render: testCaseResolutionStatusDetailsRender,
-      },
-    ],
-    [
-      tableDetails?.deleted,
-      testCaseListData.data,
-      testCasePermissions,
-      isPermissionLoading,
-      handleAssigneeUpdate,
-      handleStatusSubmit,
-    ]
-  );
+          )}
+        </Table.Cell>
+        <Table.Cell>
+          {testCaseResolutionStatusDetailsRender(
+            record.testCaseResolutionStatusDetails as Assigned | undefined,
+            record
+          )}
+        </Table.Cell>
+      </Table.Row>
+    );
+  };
 
   if (
     !commonTestCasePermission?.ViewAll &&
@@ -846,31 +803,41 @@ const IncidentManager = ({
       </div>
 
       <Table
-        columns={columns}
-        containerClassName="test-case-table-container custom-card-with-table"
+        aria-label={t('label.incident-manager')}
         data-testid="test-case-incident-manager-table"
-        dataSource={testCaseListData.data}
-        loading={testCaseListData.isLoading}
-        {...(pagingData && showPagination
-          ? {
-              customPaginationProps: {
-                ...pagingData,
-                showPagination,
-              },
-            }
-          : {})}
-        locale={{
-          emptyText: (
-            <FilterTablePlaceHolder
-              placeholderText={t('message.no-incident-found')}
-            />
-          ),
-        }}
-        pagination={false}
-        rowKey="id"
-        scroll={testCaseListData.data.length > 0 ? { x: '100%' } : undefined}
-        size="small"
-      />
+        size="sm">
+        <Table.Header columns={columns}>
+          {(col) => <Table.Head id={col.id} key={col.id} label={col.label} />}
+        </Table.Header>
+        <Table.Body
+          dependencies={[
+            isPermissionLoading,
+            testCasePermissions,
+            testCaseListData.data,
+          ]}
+          items={testCaseListData.isLoading ? [] : testCaseListData.data}
+          renderEmptyState={() =>
+            testCaseListData.isLoading ? (
+              <div className="tw:p-4">
+                {Array.from({ length: 5 }).map((_, i) => (
+                  <Skeleton
+                    className="tw:mb-2"
+                    height={40}
+                    key={i}
+                    width="100%"
+                  />
+                ))}
+              </div>
+            ) : (
+              <FilterTablePlaceHolder
+                placeholderText={t('message.no-incident-found')}
+              />
+            )
+          }>
+          {(record) => renderRow(record)}
+        </Table.Body>
+      </Table>
+      {pagingData && showPagination && <NextPrevious {...pagingData} />}
     </div>
   );
 };
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.test.tsx
index 3aa04fae13c4..9f014123feed 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.test.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.test.tsx
@@ -12,7 +12,7 @@
  */
 import { fireEvent, render, screen } from '@testing-library/react';
 import QueryString from 'qs';
-import { act } from 'react';
+import React, { act } from 'react';
 import { Table } from '../../generated/entity/data/table';
 import { getListTestCaseIncidentStatusFromSearch } from '../../rest/incidentManagerAPI';
 import '../../test/unit/mocks/mui.mock';
@@ -146,6 +146,62 @@ jest.mock('@openmetadata/ui-core-components', () => {
     );
   };
 
+  const TableMock = Object.assign(
+    ({
+      children,
+      'data-testid': testId,
+      'aria-label': ariaLabel,
+    }: {
+      children?: React.ReactNode;
+      'data-testid'?: string;
+      'aria-label'?: string;
+    }) => (
+      <table aria-label={ariaLabel} data-testid={testId}>
+        {children}
+      </table>
+    ),
+    {
+      Header: ({
+        columns,
+        children,
+      }: {
+        columns?: { id: string; label: string }[];
+        children: (col: { id: string; label: string }) => React.ReactNode;
+      }) => (
+        <thead>
+          <tr>{columns?.map((col) => <th key={col.id}>{children(col)}</th>)}</tr>
+        </thead>
+      ),
+      Head: ({ label }: { label?: string }) => <span>{label}</span>,
+      Body: ({
+        items,
+        children,
+        renderEmptyState,
+      }: {
+        items?: unknown[];
+        children: (item: unknown) => React.ReactNode;
+        renderEmptyState?: () => React.ReactNode;
+        dependencies?: unknown[];
+      }) => (
+        <tbody>
+          {!items || items.length === 0
+            ? renderEmptyState?.()
+            : items.map((item) => children(item))}
+        </tbody>
+      ),
+      Row: ({
+        children,
+        id,
+      }: {
+        children?: React.ReactNode;
+        id?: string;
+      }) => <tr data-rowid={id}>{children}</tr>,
+      Cell: ({ children }: { children?: React.ReactNode }) => (
+        <td>{children}</td>
+      ),
+    }
+  );
+
   return {
     Dropdown: {
       Root: DropdownRoot,
@@ -169,6 +225,7 @@ jest.mock('@openmetadata/ui-core-components', () => {
       .mockImplementation(({ children, className }) => (
         <button className={className}>{children}</button>
       )),
+    Table: TableMock,
   };
 });
 

From 35a89e55a333187104b231d0f54afc820e40defb Mon Sep 17 00:00:00 2001
From: Harshit Shah <dinkushah169@gmail.com>
Date: Thu, 7 May 2026 22:07:55 +0530
Subject: [PATCH 6/9] Revert "refactor(IncidentManager): migrate table to
 core-ui Table component"

This reverts commit ad502914acaa2df924010f506d015aa9889f086a.
---
 .../e2e/Features/IncidentManager.spec.ts      |   2 +-
 .../IncidentStatusPopoverShell.component.tsx  |   7 +-
 ...InlineTestCaseIncidentStatus.component.tsx |   6 +-
 .../IncidentManager.component.tsx             | 259 ++++++++++--------
 .../IncidentManager/IncidentManager.test.tsx  |  59 +---
 5 files changed, 151 insertions(+), 182 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/IncidentManager.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/IncidentManager.spec.ts
index 1ff8591313ae..2d99c240ec9f 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/IncidentManager.spec.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/IncidentManager.spec.ts
@@ -145,7 +145,7 @@ const isVisible = async (locator: Locator) =>
 
 const expectIncidentTableRowsToContain = async (page: Page, text: string) => {
   const rows = page.locator(
-    '[data-testid="test-case-incident-manager-table"] tbody tr'
+    '.ant-table-tbody tr:not(.ant-table-measure-row):not(.ant-table-placeholder)'
   );
   const rowCount = await rows.count();
 
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineIncidentStatus/IncidentStatusPopoverShell.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineIncidentStatus/IncidentStatusPopoverShell.component.tsx
index cb30c4ca98c0..12cb8cfbb02b 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineIncidentStatus/IncidentStatusPopoverShell.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineIncidentStatus/IncidentStatusPopoverShell.component.tsx
@@ -21,7 +21,6 @@ export type IncidentStatusPopoverShellProps = {
   dataTestid: string;
   trigger: ReactNode;
   children: ReactNode;
-  popoverClassName?: string;
 };
 
 export const IncidentStatusPopoverShell = ({
@@ -31,14 +30,10 @@ export const IncidentStatusPopoverShell = ({
   dataTestid,
   trigger,
   children,
-  popoverClassName,
 }: IncidentStatusPopoverShellProps) => (
   <PopoverTrigger isOpen={isOpen} onOpenChange={onOpenChange}>
     {trigger}
-    <Popover
-      className={popoverClassName}
-      containerClassName={containerClassName}
-      data-testid={dataTestid}>
+    <Popover containerClassName={containerClassName} data-testid={dataTestid}>
       {children}
     </Popover>
   </PopoverTrigger>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineTestCaseIncidentStatus.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineTestCaseIncidentStatus.component.tsx
index 320822a76ee0..84cbdc70cc9d 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineTestCaseIncidentStatus.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/TestCaseStatus/InlineTestCaseIncidentStatus.component.tsx
@@ -569,7 +569,6 @@ const InlineTestCaseIncidentStatus = ({
           containerClassName="tw:max-h-[500px] tw:min-w-0 tw:w-[320px] tw:border tw:border-border-secondary"
           dataTestid={`${data.testCaseReference?.name}-assignee-popover`}
           isOpen={showAssigneePopover}
-          popoverClassName="tw:!max-h-none"
           trigger={renderStatusChipButton()}
           onOpenChange={(open) => {
             if (open) {
@@ -587,10 +586,9 @@ const InlineTestCaseIncidentStatus = ({
     if (showResolvedPopover) {
       return (
         <IncidentStatusPopoverShell
-          containerClassName="tw:min-w-0 tw:w-80 tw:overflow-y-auto tw:border tw:border-border-secondary"
+          containerClassName="tw:min-w-0 tw:w-[320px] tw:border tw:border-border-secondary"
           dataTestid={`${data.testCaseReference?.name}-resolved-popover`}
           isOpen={showResolvedPopover}
-          popoverClassName="tw:!max-h-none"
           trigger={renderStatusChipButton()}
           onOpenChange={(open) => {
             if (!open) {
@@ -613,7 +611,7 @@ const InlineTestCaseIncidentStatus = ({
         onOpenChange={handleStatusMenuOpenChange}>
         {renderStatusChipButton()}
         <Dropdown.Popover
-          className="tw:min-w-25 tw:w-max tw:overflow-auto"
+          className="tw:min-w-[100px] tw:w-max tw:overflow-auto"
           placement="top">
           {statusMenuItems}
         </Dropdown.Popover>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.component.tsx
index f9d6ee9e3f03..5f2cd7cdf6b7 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.component.tsx
@@ -10,13 +10,9 @@
  *  See the License for the specific language governing permissions and
  *  limitations under the License.
  */
-import {
-  Button,
-  Dropdown,
-  Skeleton,
-  Table,
-} from '@openmetadata/ui-core-components';
+import { Button, Dropdown, Skeleton } from '@openmetadata/ui-core-components';
 import { Form, Select } from 'antd';
+import { ColumnsType } from 'antd/lib/table';
 import { AxiosError } from 'axios';
 import { compare } from 'fast-json-patch';
 import { isEqual, isString, isUndefined, omit, parseInt, pick } from 'lodash';
@@ -79,9 +75,9 @@ import DateTimeDisplay from '../common/DateTimeDisplay/DateTimeDisplay';
 import ErrorPlaceHolder from '../common/ErrorWithPlaceholder/ErrorPlaceHolder';
 import FilterTablePlaceHolder from '../common/ErrorWithPlaceholder/FilterTablePlaceHolder';
 import MuiDatePickerMenu from '../common/MuiDatePickerMenu/MuiDatePickerMenu';
-import NextPrevious from '../common/NextPrevious/NextPrevious';
 import { PagingHandlerParams } from '../common/NextPrevious/NextPrevious.interface';
 import { OwnerLabel } from '../common/OwnerLabel/OwnerLabel.component';
+import Table from '../common/Table/Table';
 import {
   ProfilerTabPath,
   TestCasePermission,
@@ -598,93 +594,140 @@ const IncidentManager = ({
     );
   };
 
-  const columns = useMemo(
+  const columns: ColumnsType<TestCaseResolutionStatus> = useMemo(
     () => [
-      { id: 'name', label: t('label.test-case-name') },
+      {
+        title: t('label.test-case-name'),
+        dataIndex: 'name',
+        key: 'name',
+        width: 300,
+        fixed: 'left',
+        render: (_, record) => {
+          return (
+            <Link
+              className="m-0 break-all text-primary"
+              data-testid={`test-case-${record.testCaseReference?.name}`}
+              to={getTestCaseDetailPagePath(
+                record.testCaseReference?.fullyQualifiedName ?? ''
+              )}>
+              {getEntityName(record.testCaseReference)}
+            </Link>
+          );
+        },
+      },
       ...(isIncidentPage
-        ? [{ id: 'testCaseReference', label: t('label.table') }]
+        ? [
+            {
+              title: t('label.table'),
+              dataIndex: 'testCaseReference',
+              key: 'testCaseReference',
+              width: 150,
+              render: (value: EntityReference) => {
+                const tableFqn = getPartialNameFromTableFQN(
+                  value.fullyQualifiedName ?? '',
+                  [
+                    FqnPart.Service,
+                    FqnPart.Database,
+                    FqnPart.Schema,
+                    FqnPart.Table,
+                  ],
+                  '.'
+                );
+
+                return (
+                  <Link
+                    data-testid="table-link"
+                    to={getEntityDetailsPath(
+                      EntityType.TABLE,
+                      tableFqn,
+                      EntityTabs.PROFILER,
+                      ProfilerTabPath.DATA_QUALITY
+                    )}
+                    onClick={(e) => e.stopPropagation()}>
+                    {getNameFromFQN(tableFqn) ?? value.fullyQualifiedName}
+                  </Link>
+                );
+              },
+            },
+          ]
         : []),
-      { id: 'timestamp', label: t('label.last-updated') },
-      { id: 'testCaseResolutionStatusType', label: t('label.status') },
-      { id: 'severity', label: t('label.severity') },
-      { id: 'testCaseResolutionStatusDetails', label: t('label.assignee') },
-    ],
-    [isIncidentPage, t]
-  );
-
-  const renderRow = (record: TestCaseResolutionStatus) => {
-    const ref = record.testCaseReference;
-    const tableFqn = getPartialNameFromTableFQN(
-      ref?.fullyQualifiedName ?? '',
-      [FqnPart.Service, FqnPart.Database, FqnPart.Schema, FqnPart.Table],
-      '.'
-    );
-    const hasPermission = testCasePermissions.find(
-      (item) =>
-        item.fullyQualifiedName === ref?.fullyQualifiedName
-    );
+      {
+        title: t('label.last-updated'),
+        dataIndex: 'timestamp',
+        key: 'timestamp',
+        width: 150,
+        render: (value: number) => {
+          return <DateTimeDisplay timestamp={value} />;
+        },
+      },
+      {
+        title: t('label.status'),
+        dataIndex: 'testCaseResolutionStatusType',
+        key: 'testCaseResolutionStatusType',
+        width: 100,
+        render: (_, record: TestCaseResolutionStatus) => {
+          if (isPermissionLoading) {
+            return <Skeleton height={24} variant="rectangular" width={100} />;
+          }
+          const hasPermission = testCasePermissions.find(
+            (item) =>
+              item.fullyQualifiedName ===
+              record.testCaseReference?.fullyQualifiedName
+          );
 
-    return (
-      <Table.Row id={record.id ?? ''} key={record.id}>
-        <Table.Cell>
-          <Link
-            className="m-0 break-all text-primary"
-            data-testid={`test-case-${ref?.name}`}
-            to={getTestCaseDetailPagePath(ref?.fullyQualifiedName ?? '')}>
-            {getEntityName(ref)}
-          </Link>
-        </Table.Cell>
-        {isIncidentPage && (
-          <Table.Cell>
-            <Link
-              data-testid="table-link"
-              to={getEntityDetailsPath(
-                EntityType.TABLE,
-                tableFqn,
-                EntityTabs.PROFILER,
-                ProfilerTabPath.DATA_QUALITY
-              )}
-              onClick={(e) => e.stopPropagation()}>
-              {getNameFromFQN(tableFqn) ?? ref?.fullyQualifiedName}
-            </Link>
-          </Table.Cell>
-        )}
-        <Table.Cell>
-          <DateTimeDisplay timestamp={record.timestamp as number} />
-        </Table.Cell>
-        <Table.Cell>
-          {isPermissionLoading ? (
-            <Skeleton height={24} variant="rectangular" width={100} />
-          ) : (
+          return (
             <TestCaseIncidentManagerStatus
               isInline
               data={record}
               hasPermission={hasPermission?.EditAll && !tableDetails?.deleted}
               onSubmit={handleStatusSubmit}
             />
-          )}
-        </Table.Cell>
-        <Table.Cell>
-          {isPermissionLoading ? (
-            <Skeleton height={24} variant="rectangular" width={100} />
-          ) : (
+          );
+        },
+      },
+      {
+        title: t('label.severity'),
+        dataIndex: 'severity',
+        key: 'severity',
+        width: 100,
+        render: (value: Severities, record: TestCaseResolutionStatus) => {
+          if (isPermissionLoading) {
+            return <Skeleton height={24} variant="rectangular" width={100} />;
+          }
+
+          const hasPermission = testCasePermissions.find(
+            (item) =>
+              item.fullyQualifiedName ===
+              record.testCaseReference?.fullyQualifiedName
+          );
+
+          return (
             <Severity
               isInline
               hasPermission={hasPermission?.EditAll && !tableDetails?.deleted}
-              severity={record.severity}
+              severity={value}
               onSubmit={(severity) => handleSeveritySubmit(record, severity)}
             />
-          )}
-        </Table.Cell>
-        <Table.Cell>
-          {testCaseResolutionStatusDetailsRender(
-            record.testCaseResolutionStatusDetails as Assigned | undefined,
-            record
-          )}
-        </Table.Cell>
-      </Table.Row>
-    );
-  };
+          );
+        },
+      },
+      {
+        title: t('label.assignee'),
+        dataIndex: 'testCaseResolutionStatusDetails',
+        key: 'testCaseResolutionStatusDetails',
+        width: 200,
+        render: testCaseResolutionStatusDetailsRender,
+      },
+    ],
+    [
+      tableDetails?.deleted,
+      testCaseListData.data,
+      testCasePermissions,
+      isPermissionLoading,
+      handleAssigneeUpdate,
+      handleStatusSubmit,
+    ]
+  );
 
   if (
     !commonTestCasePermission?.ViewAll &&
@@ -803,41 +846,31 @@ const IncidentManager = ({
       </div>
 
       <Table
-        aria-label={t('label.incident-manager')}
+        columns={columns}
+        containerClassName="test-case-table-container custom-card-with-table"
         data-testid="test-case-incident-manager-table"
-        size="sm">
-        <Table.Header columns={columns}>
-          {(col) => <Table.Head id={col.id} key={col.id} label={col.label} />}
-        </Table.Header>
-        <Table.Body
-          dependencies={[
-            isPermissionLoading,
-            testCasePermissions,
-            testCaseListData.data,
-          ]}
-          items={testCaseListData.isLoading ? [] : testCaseListData.data}
-          renderEmptyState={() =>
-            testCaseListData.isLoading ? (
-              <div className="tw:p-4">
-                {Array.from({ length: 5 }).map((_, i) => (
-                  <Skeleton
-                    className="tw:mb-2"
-                    height={40}
-                    key={i}
-                    width="100%"
-                  />
-                ))}
-              </div>
-            ) : (
-              <FilterTablePlaceHolder
-                placeholderText={t('message.no-incident-found')}
-              />
-            )
-          }>
-          {(record) => renderRow(record)}
-        </Table.Body>
-      </Table>
-      {pagingData && showPagination && <NextPrevious {...pagingData} />}
+        dataSource={testCaseListData.data}
+        loading={testCaseListData.isLoading}
+        {...(pagingData && showPagination
+          ? {
+              customPaginationProps: {
+                ...pagingData,
+                showPagination,
+              },
+            }
+          : {})}
+        locale={{
+          emptyText: (
+            <FilterTablePlaceHolder
+              placeholderText={t('message.no-incident-found')}
+            />
+          ),
+        }}
+        pagination={false}
+        rowKey="id"
+        scroll={testCaseListData.data.length > 0 ? { x: '100%' } : undefined}
+        size="small"
+      />
     </div>
   );
 };
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.test.tsx
index 9f014123feed..3aa04fae13c4 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.test.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/IncidentManager/IncidentManager.test.tsx
@@ -12,7 +12,7 @@
  */
 import { fireEvent, render, screen } from '@testing-library/react';
 import QueryString from 'qs';
-import React, { act } from 'react';
+import { act } from 'react';
 import { Table } from '../../generated/entity/data/table';
 import { getListTestCaseIncidentStatusFromSearch } from '../../rest/incidentManagerAPI';
 import '../../test/unit/mocks/mui.mock';
@@ -146,62 +146,6 @@ jest.mock('@openmetadata/ui-core-components', () => {
     );
   };
 
-  const TableMock = Object.assign(
-    ({
-      children,
-      'data-testid': testId,
-      'aria-label': ariaLabel,
-    }: {
-      children?: React.ReactNode;
-      'data-testid'?: string;
-      'aria-label'?: string;
-    }) => (
-      <table aria-label={ariaLabel} data-testid={testId}>
-        {children}
-      </table>
-    ),
-    {
-      Header: ({
-        columns,
-        children,
-      }: {
-        columns?: { id: string; label: string }[];
-        children: (col: { id: string; label: string }) => React.ReactNode;
-      }) => (
-        <thead>
-          <tr>{columns?.map((col) => <th key={col.id}>{children(col)}</th>)}</tr>
-        </thead>
-      ),
-      Head: ({ label }: { label?: string }) => <span>{label}</span>,
-      Body: ({
-        items,
-        children,
-        renderEmptyState,
-      }: {
-        items?: unknown[];
-        children: (item: unknown) => React.ReactNode;
-        renderEmptyState?: () => React.ReactNode;
-        dependencies?: unknown[];
-      }) => (
-        <tbody>
-          {!items || items.length === 0
-            ? renderEmptyState?.()
-            : items.map((item) => children(item))}
-        </tbody>
-      ),
-      Row: ({
-        children,
-        id,
-      }: {
-        children?: React.ReactNode;
-        id?: string;
-      }) => <tr data-rowid={id}>{children}</tr>,
-      Cell: ({ children }: { children?: React.ReactNode }) => (
-        <td>{children}</td>
-      ),
-    }
-  );
-
   return {
     Dropdown: {
       Root: DropdownRoot,
@@ -225,7 +169,6 @@ jest.mock('@openmetadata/ui-core-components', () => {
       .mockImplementation(({ children, className }) => (
         <button className={className}>{children}</button>
       )),
-    Table: TableMock,
   };
 });
 

From ba81bf09742df13c128c55a775d041415d3587d8 Mon Sep 17 00:00:00 2001
From: Harshit Shah <dinkushah169@gmail.com>
Date: Fri, 8 May 2026 13:36:33 +0530
Subject: [PATCH 7/9] add border

---
 .../DimensionalityTab/DimensionalityTab.tsx   | 54 ++++++++++---------
 1 file changed, 28 insertions(+), 26 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx
index 9adf2c1b1d5c..e5a285d0197a 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx
@@ -308,32 +308,34 @@ const DimensionalityTab = () => {
                 entityText: selectedDimension || '',
               })}
             </p>
-            <Table aria-label={selectedDimension ?? ''}>
-              <Table.Header columns={dimensionTableColumns}>
-                {(col) => (
-                  <Table.Head
-                    id={col.id}
-                    key={col.id}
-                    label={col.label}
-                    tooltip={col.tooltip}
-                  />
-                )}
-              </Table.Header>
-              <Table.Body items={getLatestResultPerDimension}>
-                {(row) => (
-                  <Table.Row
-                    columns={dimensionTableColumns}
-                    id={row.key}
-                    key={row.key}>
-                    {(col) => (
-                      <Table.Cell key={col.id}>
-                        {renderCell(col, row)}
-                      </Table.Cell>
-                    )}
-                  </Table.Row>
-                )}
-              </Table.Body>
-            </Table>
+            <div className="tw:overflow-hidden tw:rounded-xl tw:shadow-xs tw:ring-1 tw:ring-secondary">
+              <Table aria-label={selectedDimension ?? ''}>
+                <Table.Header columns={dimensionTableColumns}>
+                  {(col) => (
+                    <Table.Head
+                      id={col.id}
+                      key={col.id}
+                      label={col.label}
+                      tooltip={col.tooltip}
+                    />
+                  )}
+                </Table.Header>
+                <Table.Body items={getLatestResultPerDimension}>
+                  {(row) => (
+                    <Table.Row
+                      columns={dimensionTableColumns}
+                      id={row.key}
+                      key={row.key}>
+                      {(col) => (
+                        <Table.Cell key={col.id}>
+                          {renderCell(col, row)}
+                        </Table.Cell>
+                      )}
+                    </Table.Row>
+                  )}
+                </Table.Body>
+              </Table>
+            </div>
           </div>
         </>
       )}

From 29a006d7a271495340b9cd8ebb9a4982e0c03226 Mon Sep 17 00:00:00 2001
From: Harshit Shah <dinkushah169@gmail.com>
Date: Fri, 8 May 2026 16:19:48 +0530
Subject: [PATCH 8/9] fix failing test case

---
 .../ui/playwright/e2e/Features/IncidentManager.spec.ts      | 4 ++--
 .../main/resources/ui/playwright/utils/incidentManager.ts   | 6 ++----
 2 files changed, 4 insertions(+), 6 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/IncidentManager.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/IncidentManager.spec.ts
index 2d99c240ec9f..2253d9709635 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/IncidentManager.spec.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/IncidentManager.spec.ts
@@ -145,7 +145,7 @@ const isVisible = async (locator: Locator) =>
 
 const expectIncidentTableRowsToContain = async (page: Page, text: string) => {
   const rows = page.locator(
-    '.ant-table-tbody tr:not(.ant-table-measure-row):not(.ant-table-placeholder)'
+    '[data-testid="test-case-incident-manager-table"] tbody tr'
   );
   const rowCount = await rows.count();
 
@@ -182,7 +182,7 @@ const openIncidentReassignModal = async (page: Page, testCaseName?: string) => {
     .last();
   const incidentListRowAction = testCaseName
     ? page
-        .locator('.ant-table-tbody tr')
+        .locator('[data-testid="test-case-incident-manager-table"] tbody tr')
         .filter({ hasText: testCaseName })
         .first()
         .locator('button')
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/incidentManager.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/incidentManager.ts
index 7337475ed6d6..5c4c1a469e5e 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/utils/incidentManager.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/incidentManager.ts
@@ -73,9 +73,7 @@ export const addAssigneeFromPopoverWidget = async (data: {
   const taskTabEditAssigneesButton = page.getByTestId('edit-assignees').last();
 
   if (testCaseName) {
-    const incidentRow = page
-      .getByRole('row', { name: new RegExp(testCaseName, 'i') })
-      .first();
+    const incidentRow = page.getByTestId(`test-case-${testCaseName}`).first();
     const editOwnerButton = incidentRow.getByTestId('edit-owner');
 
     if (await editOwnerButton.isVisible().catch(() => false)) {
@@ -184,7 +182,7 @@ export const assignIncident = async (data: {
     .poll(
       async () => {
         const incidentRow = page
-          .getByRole('row', { name: new RegExp(testCaseName, 'i') })
+          .getByTestId(`test-case-${testCaseName}`)
           .first();
         const incidentLink = page
           .getByRole('link', { name: testCaseName })

From c2c35abe6b1bf582106978548ad2a333454e42c7 Mon Sep 17 00:00:00 2001
From: Harshit Shah <dinkushah169@gmail.com>
Date: Fri, 8 May 2026 17:18:34 +0530
Subject: [PATCH 9/9] address gitar-bot comments

---
 .../DimensionalityTab/DimensionalityTab.tsx   | 94 +++++++++----------
 1 file changed, 47 insertions(+), 47 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx
index e5a285d0197a..31260c8b3ea7 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/DimensionalityTab/DimensionalityTab.tsx
@@ -14,7 +14,7 @@ import { Select, Skeleton, Table } from '@openmetadata/ui-core-components';
 import { format } from 'date-fns';
 import { isEmpty, split, toLower } from 'lodash';
 import { DateRangeObject } from 'Models';
-import { useEffect, useMemo, useState, type ComponentType } from 'react';
+import { useCallback, useEffect, useMemo, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { Link } from 'react-router-dom';
 import {
@@ -45,11 +45,6 @@ import { ProfilerTabPath } from '../../../Database/Profiler/ProfilerDashboard/pr
 import DimensionalityHeatmap from './DimensionalityHeatmap/DimensionalityHeatmap.component';
 import { DimensionResultWithTimestamp } from './DimensionalityHeatmap/DimensionalityHeatmap.interface';
 
-const TransComponent = Trans as ComponentType<{
-  i18nKey: string;
-  components: Record<number, JSX.Element>;
-}>;
-
 const DimensionalityTab = () => {
   const { t } = useTranslation();
   const { dimensionKey } = useRequiredParams<{ dimensionKey?: string }>();
@@ -192,46 +187,51 @@ const DimensionalityTab = () => {
     [t]
   );
 
-  const renderCell = (
-    col: { id: string },
-    row: (typeof getLatestResultPerDimension)[number]
-  ) => {
-    switch (col.id) {
-      case 'status':
-        return row.result?.testCaseStatus ? (
-          <StatusBadge
-            dataTestId="status-badge"
-            label={TEST_CASE_STATUS_LABELS[row.result.testCaseStatus]}
-            status={toLower(row.result.testCaseStatus) as StatusType}
-          />
-        ) : (
-          <span className="tw:text-sm">--</span>
-        );
-      case 'impactScore':
-        return (
-          <span className="tw:text-sm">{row.result?.impactScore ?? '--'}</span>
-        );
-      case 'dimensionValue':
-        return (
-          <Link
-            className="tw:text-text-brand-secondary"
-            to={getTestCaseDimensionsDetailPagePath(
-              testCase?.fullyQualifiedName || '',
-              row.result.dimensionKey || ''
-            )}>
-            {row.dimensionValue}
-          </Link>
-        );
-      case 'lastRun':
-        return row.result?.timestamp ? (
-          <DateTimeDisplay timestamp={row.result.timestamp} />
-        ) : (
-          <span className="tw:text-sm">--</span>
-        );
-      default:
-        return null;
-    }
-  };
+  const renderCell = useCallback(
+    (
+      col: { id: string },
+      row: (typeof getLatestResultPerDimension)[number]
+    ) => {
+      switch (col.id) {
+        case 'status':
+          return row.result?.testCaseStatus ? (
+            <StatusBadge
+              dataTestId="status-badge"
+              label={TEST_CASE_STATUS_LABELS[row.result.testCaseStatus]}
+              status={toLower(row.result.testCaseStatus) as StatusType}
+            />
+          ) : (
+            <span className="tw:text-sm">--</span>
+          );
+        case 'impactScore':
+          return (
+            <span className="tw:text-sm">
+              {row.result?.impactScore ?? '--'}
+            </span>
+          );
+        case 'dimensionValue':
+          return (
+            <Link
+              className="tw:text-text-brand-secondary"
+              to={getTestCaseDimensionsDetailPagePath(
+                testCase?.fullyQualifiedName || '',
+                row.result.dimensionKey || ''
+              )}>
+              {row.dimensionValue}
+            </Link>
+          );
+        case 'lastRun':
+          return row.result?.timestamp ? (
+            <DateTimeDisplay timestamp={row.result.timestamp} />
+          ) : (
+            <span className="tw:text-sm">--</span>
+          );
+        default:
+          return null;
+      }
+    },
+    [testCase?.fullyQualifiedName]
+  );
 
   const noDataPlaceholder = useMemo(() => {
     if (isLoading) {
@@ -245,7 +245,7 @@ const DimensionalityTab = () => {
 
     return (
       <NoDataPlaceholderNew size={SIZE.LARGE}>
-        <TransComponent
+        <Trans
           components={{
             0: <span className="tw:text-sm" />,
             1: <span className="tw:text-sm" />,