#15507 Date filtering not working for Incident manager and ui feedbacks (#15515)

openmetadata-ui/src/main/resources/ui/src/components/DataQuality/IncidentManager/Severity/Severity.component.tsx

@@ -27,6 +27,7 @@ import { ResourceEntity } from '../../../../context/PermissionProvider/Permissio
 import { Operation } from '../../../../generated/entity/policies/policy';
 import { checkPermission } from '../../../../utils/PermissionsUtils';
 import AppBadge from '../../../common/Badge/Badge.component';
+import '../incident-manager.style.less';
 import { SeverityProps } from './Severity.interface';
 import SeverityModal from './SeverityModal.component';
 

openmetadata-ui/src/main/resources/ui/src/components/Database/Profiler/TestSummary/TestSummary.tsx

@@ -22,7 +22,6 @@ import {
   omitBy,
   pick,
   round,
-  uniqueId,
 } from 'lodash';
 import { DateRangeObject } from 'Models';
 import React, {
@@ -343,7 +342,7 @@ const TestSummary: React.FC<TestSummaryProps> = ({ data }) => {
             <Line
               dataKey={info.label}
               dot={updatedDot}
-              key={uniqueId(info.label)}
+              key={info.label}
               stroke={info.color}
               type="monotone"
             />

openmetadata-ui/src/main/resources/ui/src/pages/IncidentManager/IncidentManagerPage.test.tsx

@@ -10,8 +10,9 @@
  *  See the License for the specific language governing permissions and
  *  limitations under the License.
  */
-import { render, screen } from '@testing-library/react';
+import { act, fireEvent, render, screen } from '@testing-library/react';
 import React from 'react';
+import { getListTestCaseIncidentStatus } from '../../rest/incidentManagerAPI';
 import IncidentManagerPage from './IncidentManagerPage';
 
 jest.mock('../../components/common/NextPrevious/NextPrevious', () => {
@@ -20,9 +21,21 @@ jest.mock('../../components/common/NextPrevious/NextPrevious', () => {
 jest.mock(
   '../../components/common/DatePickerMenu/DatePickerMenu.component',
   () => {
-    return jest
-      .fn()
-      .mockImplementation(() => <div>DatePickerMenu.component</div>);
+    return jest.fn().mockImplementation(({ handleDateRangeChange }) => (
+      <div>
+        <p>DatePickerMenu.component</p>
+        <button
+          data-testid="time-filter"
+          onClick={() =>
+            handleDateRangeChange({
+              startTs: 1709556624254,
+              endTs: 1710161424255,
+            })
+          }>
+          time filter
+        </button>
+      </div>
+    ));
   }
 );
 jest.mock('../../components/PageLayoutV1/PageLayoutV1', () => {
@@ -98,4 +111,23 @@ describe('IncidentManagerPage', () => {
       await screen.findByText('NextPrevious.component')
     ).toBeInTheDocument();
   });
+
+  it('Incident should be fetch with updated time', async () => {
+    const mockGetListTestCaseIncidentStatus =
+      getListTestCaseIncidentStatus as jest.Mock;
+    render(<IncidentManagerPage />);
+
+    const timeFilterButton = await screen.findByTestId('time-filter');
+
+    act(() => {
+      fireEvent.click(timeFilterButton);
+    });
+
+    expect(mockGetListTestCaseIncidentStatus).toHaveBeenCalledWith({
+      endTs: 1710161424255,
+      latest: true,
+      limit: 10,
+      startTs: 1709556624254,
+    });
+  });
 });

openmetadata-ui/src/main/resources/ui/src/pages/IncidentManager/IncidentManagerPage.tsx

@@ -15,7 +15,7 @@ import { DefaultOptionType } from 'antd/lib/select';
 import { ColumnsType } from 'antd/lib/table';
 import { AxiosError } from 'axios';
 import { compare } from 'fast-json-patch';
-import { isEqual, startCase } from 'lodash';
+import { isEqual, pick, startCase } from 'lodash';
 import { DateRangeObject } from 'Models';
 import QueryString from 'qs';
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
@@ -242,13 +242,11 @@ const IncidentManagerPage = () => {
   };
 
   const handleDateRangeChange = (value: DateRangeObject) => {
-    const dateRangeObject = {
-      startTs: filters.startTs,
-      endTs: filters.endTs,
-    };
+    const updatedFilter = pick(value, ['startTs', 'endTs']);
+    const existingFilters = pick(filters, ['startTs', 'endTs']);
 
-    if (!isEqual(value, dateRangeObject)) {
-      setFilters((pre) => ({ ...pre, ...dateRangeObject }));
+    if (!isEqual(existingFilters, updatedFilter)) {
+      setFilters((pre) => ({ ...pre, ...updatedFilter }));
     }
   };