[8.x] [Cloud Security] Fix for issue where date is not retained when …

…opening new tab (elastic#205128) (elastic#205538) # Backport This will backport the following commits from `main` to `8.x`: - [[Cloud Security] Fix for issue where date is not retained when opening new tab (elastic#205128)](elastic#205128)  ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sqren/backport)  Co-authored-by: Rickyanto Ang <[email protected]>
jbudz · Jan 3, 2025 · 2c63bdb · 2c63bdb
1 parent 4994699
commit 2c63bdb
Show file tree

Hide file tree

Showing 3 changed files with 81 additions and 5 deletions.
diff --git a/...on/public/cloud_security_posture/components/csp_details/alerts_findings_details_table.tsx b/...on/public/cloud_security_posture/components/csp_details/alerts_findings_details_table.tsx
@@ -6,6 +6,7 @@
  */
 
 import React, { memo, useCallback, useEffect, useState } from 'react';
+import { encode } from '@kbn/rison';
 import { capitalize } from 'lodash';
 import type { Criteria, EuiBasicTableColumn, EuiTableSortingType } from '@elastic/eui';
 import { EuiSpacer, EuiPanel, EuiText, EuiBasicTable, EuiIcon, EuiLink } from '@elastic/eui';
@@ -26,6 +27,7 @@ import {
   OPEN_IN_ALERTS_TITLE_STATUS,
   OPEN_IN_ALERTS_TITLE_USERNAME,
 } from '../../../overview/components/detection_response/translations';
+import { URL_PARAM_KEY } from '../../../common/hooks/use_url_state';
 import { useNavigateToAlertsPageWithFilters } from '../../../common/hooks/use_navigate_to_alerts_page_with_filters';
 import { DocumentDetailsPreviewPanelKey } from '../../../flyout/document_details/shared/constants/panel_keys';
 import { useGlobalTime } from '../../../common/containers/use_global_time';
@@ -114,6 +116,16 @@ export const AlertsDetailsTable = memo(
     };
 
     const { to, from } = useGlobalTime();
+    const timerange = encode({
+      global: {
+        [URL_PARAM_KEY.timerange]: {
+          kind: 'absolute',
+          from,
+          to,
+        },
+      },
+    });
+
     const { signalIndexName } = useSignalIndex();
     const { data, setQuery } = useQueryAlerts({
       query: buildEntityAlertsQuery({
@@ -327,9 +339,10 @@ export const AlertsDetailsTable = memo(
               fieldName: 'kibana.alert.workflow_status',
             },
           ],
-          true
+          true,
+          timerange
         ),
-      [field, openAlertsPageWithFilters, value]
+      [field, openAlertsPageWithFilters, timerange, value]
     );
 
     return (

diff --git a/...ns/security_solution/public/common/hooks/use_navigate_to_alerts_page_with_filters.test.ts b/...ns/security_solution/public/common/hooks/use_navigate_to_alerts_page_with_filters.test.ts
@@ -80,4 +80,54 @@ describe('useNavigateToAlertsPageWithFilters', () => {
       expect.objectContaining({ deepLinkId: SecurityPageName.alerts })
     );
   });
+
+  it('navigates to alerts page in new tab', () => {
+    const filter = {
+      title: 'test filter',
+      selectedOptions: ['test value'],
+      fieldName: 'test field',
+      exclude: false,
+      existsSelected: false,
+    };
+    const openInNewTab = true;
+
+    const {
+      result: { current: navigateToAlertsPageWithFilters },
+    } = renderHook(() => useNavigateToAlertsPageWithFilters());
+
+    navigateToAlertsPageWithFilters(filter, openInNewTab);
+
+    expect(mockNavigateTo).toHaveBeenCalledWith({
+      deepLinkId: SecurityPageName.alerts,
+      path: "?pageFilters=!((exclude:!f,existsSelected:!f,fieldName:'test field',hideActionBar:!f,selectedOptions:!('test value'),title:'test filter'))",
+      openInNewTab: true,
+    });
+  });
+
+  it('navigates to alerts page with timerange', () => {
+    const filter = {
+      title: 'test filter',
+      selectedOptions: ['test value'],
+      fieldName: 'test field',
+      exclude: false,
+      existsSelected: false,
+    };
+
+    const timerange =
+      '(global:(timerange:(from:"2024-12-12T17:03:23.481Z",kind:absolute,to:"2025-01-04T07:59:59.999Z")))';
+
+    const openInNewTab = true;
+
+    const {
+      result: { current: navigateToAlertsPageWithFilters },
+    } = renderHook(() => useNavigateToAlertsPageWithFilters());
+
+    navigateToAlertsPageWithFilters(filter, openInNewTab, timerange);
+
+    expect(mockNavigateTo).toHaveBeenCalledWith({
+      deepLinkId: SecurityPageName.alerts,
+      path: `?pageFilters=!((exclude:!f,existsSelected:!f,fieldName:'test field',hideActionBar:!f,selectedOptions:!('test value'),title:'test filter'))&timerange=(global:(timerange:(from:"2024-12-12T17:03:23.481Z",kind:absolute,to:"2025-01-04T07:59:59.999Z")))`,
+      openInNewTab: true,
+    });
+  });
 });
diff --git a/...plugins/security_solution/public/common/hooks/use_navigate_to_alerts_page_with_filters.ts b/...plugins/security_solution/public/common/hooks/use_navigate_to_alerts_page_with_filters.ts
@@ -16,14 +16,27 @@ import { URL_PARAM_KEY } from './use_url_state';
 export const useNavigateToAlertsPageWithFilters = () => {
   const { navigateTo } = useNavigation();
 
-  return (filterItems: FilterControlConfig | FilterControlConfig[], openInNewTab = false) => {
+  return (
+    /**
+     * Pass one or more filter control configurations to be applied to the alerts page filters
+     */
+    filterItems: FilterControlConfig | FilterControlConfig[],
+    /**
+     * If true, the alerts page will be opened in a new tab
+     */
+    openInNewTab = false,
+    /**
+     * Allows to customize the timerange url parameter. Should only be used in combination with the openInNewTab=true parameter
+     */
+    timerange?: string
+  ) => {
     const urlFilterParams = encode(
       formatPageFilterSearchParam(Array.isArray(filterItems) ? filterItems : [filterItems])
     );
-
+    const timerangePath = timerange ? `&timerange=${timerange}` : '';
     navigateTo({
       deepLinkId: SecurityPageName.alerts,
-      path: `?${URL_PARAM_KEY.pageFilter}=${urlFilterParams}`,
+      path: `?${URL_PARAM_KEY.pageFilter}=${urlFilterParams}${timerangePath}`,
       openInNewTab,
     });
   };