Reset current page after data source change (#320) (#321)

Signed-off-by: Lin Wang <[email protected]>
(cherry picked from commit 7048a0e)

Co-authored-by: Lin Wang <[email protected]>

public/components/monitoring/__tests__/use_monitoring.test.tsx

@@ -507,7 +507,7 @@ describe('useMonitoring', () => {
     });
   });
 
-  it('should reset connector filter after selected data source option change', async () => {
+  it('should reset connector filter and current page after data source change', async () => {
     const {
       renderHookResult: { result, waitFor },
       setSelectedDataSourceOption,
@@ -518,17 +518,61 @@ describe('useMonitoring', () => {
     });
     act(() => {
       result.current.searchByConnector(['connector-1']);
+      result.current.handleTableChange({
+        pagination: {
+          currentPage: 2,
+          pageSize: 50,
+        },
+      });
     });
     await waitFor(() => {
       expect(Model.prototype.search).toHaveBeenCalledTimes(2);
+      expect(result.current.params).toEqual(
+        expect.objectContaining({
+          currentPage: 2,
+          connector: ['connector-1'],
+        })
+      );
     });
     act(() => {
       setSelectedDataSourceOption({ id: 'bar' });
     });
     await waitFor(() => {
       expect(Model.prototype.search).toHaveBeenCalledTimes(3);
       expect(result.current.params.connector).toEqual([]);
+      expect(result.current.params.currentPage).toEqual(1);
+    });
+  });
+
+  it('should reset connectors, status, source and nameOrId filter after resetSearch called', async () => {
+    const {
+      renderHookResult: { result },
+    } = setup();
+    act(() => {
+      result.current.searchByNameOrId('foo');
+      result.current.searchByConnector(['connector-1']);
+      result.current.searchBySource(['local']);
+      result.current.searchByStatus(['responding']);
+    });
+    expect(result.current.params).toEqual(
+      expect.objectContaining({
+        nameOrId: 'foo',
+        connector: ['connector-1'],
+        source: ['local'],
+        status: ['responding'],
+      })
+    );
+    act(() => {
+      result.current.resetSearch();
     });
+    expect(result.current.params).toEqual(
+      expect.objectContaining({
+        nameOrId: '',
+        connector: [],
+        source: [],
+        status: undefined,
+      })
+    );
   });
 });
 

public/components/monitoring/use_monitoring.ts

@@ -217,6 +217,7 @@ export const useMonitoring = () => {
       currentPage: previousValue.currentPage,
       pageSize: previousValue.pageSize,
       sort: previousValue.sort,
+      nameOrId: '',
       source: [],
       connector: [],
       status: undefined,
@@ -280,13 +281,17 @@ export const useMonitoring = () => {
   );
 
   useEffect(() => {
+    if (!dataSourceEnabled) {
+      return;
+    }
     setParams((previousParams) => {
       const dataSourceId = getDataSourceId(dataSourceEnabled, selectedDataSourceOption);
       if (previousParams.dataSourceId === dataSourceId) {
         return previousParams;
       }
       return {
         ...previousParams,
+        currentPage: 1,
         dataSourceId,
         connector: [],
       };