From 567a6de97796739c068461e5487f3ea0d8685060 Mon Sep 17 00:00:00 2001
From: jennypavlova <dzheni.pavlova@elastic.co>
Date: Fri, 29 Sep 2023 16:26:23 +0200
Subject: [PATCH] [Infra UI] Add options to the alerts link in the asset
 details flyout (#167616)

Closes #167524
## Summary

This PR adds the possibility of overriding the alerts flyout options.
This is used to change the metric value during the alert creation when
it is changed in the menu on inventory.

## Testing
- Go to Inventory
   - Change the metric in the drop-down menu
   - The metric should be changed in the alerts flyout
- Go to hosts view flyout (alert rule should remain the same)
- Go to asset details page view (alert rule should remain the same)



https://github.com/elastic/kibana/assets/14139027/2bb31be0-04c8-4611-a8d2-b91a465a09b8
---
 .../asset_details/tabs/overview/alerts.tsx          |  3 +++
 .../infra/public/components/asset_details/types.ts  |  2 ++
 .../inventory_view/components/nodes_overview.tsx    |  1 +
 .../components/waffle/asset_details_flyout.tsx      | 13 ++++++++++++-
 4 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/x-pack/plugins/infra/public/components/asset_details/tabs/overview/alerts.tsx b/x-pack/plugins/infra/public/components/asset_details/tabs/overview/alerts.tsx
index 43c71f190e004..2fa09451118cb 100644
--- a/x-pack/plugins/infra/public/components/asset_details/tabs/overview/alerts.tsx
+++ b/x-pack/plugins/infra/public/components/asset_details/tabs/overview/alerts.tsx
@@ -21,6 +21,7 @@ import { AlertFlyout } from '../../../../alerting/inventory/components/alert_fly
 import { useBoolean } from '../../../../hooks/use_boolean';
 import { ALERT_STATUS_ALL } from '../../../../common/alerts/constants';
 import { AlertsSectionTitle } from '../../components/section_titles';
+import { useAssetDetailsRenderPropsContext } from '../../hooks/use_asset_details_render_props';
 
 export const AlertsSummaryContent = ({
   assetName,
@@ -32,6 +33,7 @@ export const AlertsSummaryContent = ({
   dateRange: TimeRange;
 }) => {
   const [isAlertFlyoutVisible, { toggle: toggleAlertFlyout }] = useBoolean(false);
+  const { overrides } = useAssetDetailsRenderPropsContext();
 
   const alertsEsQueryByStatus = useMemo(
     () =>
@@ -67,6 +69,7 @@ export const AlertsSummaryContent = ({
         nodeType={assetType}
         setVisible={toggleAlertFlyout}
         visible={isAlertFlyoutVisible}
+        options={overrides?.alertRule?.options}
       />
     </>
   );
diff --git a/x-pack/plugins/infra/public/components/asset_details/types.ts b/x-pack/plugins/infra/public/components/asset_details/types.ts
index 9bb33c6d6c304..cc985f8d782bd 100644
--- a/x-pack/plugins/infra/public/components/asset_details/types.ts
+++ b/x-pack/plugins/infra/public/components/asset_details/types.ts
@@ -8,6 +8,7 @@
 import { TimeRange } from '@kbn/es-query';
 import { Search } from 'history';
 import type { InventoryItemType } from '../../../common/inventory_models/types';
+import type { InfraWaffleMapOptions } from '../../lib/lib';
 
 export type { AssetDetailsUrlState } from './hooks/use_asset_details_url_state';
 
@@ -37,6 +38,7 @@ export interface OverridableTabState {
   };
   alertRule?: {
     onCreateRuleClick?: () => void;
+    options?: Partial<InfraWaffleMapOptions>;
   };
 }
 
diff --git a/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/nodes_overview.tsx b/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/nodes_overview.tsx
index a0ffd01ceee4f..858b68a4b646d 100644
--- a/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/nodes_overview.tsx
+++ b/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/nodes_overview.tsx
@@ -147,6 +147,7 @@ export const NodesOverview = ({
           assetName={detailsItemId}
           assetType={nodeType}
           currentTime={currentTime}
+          options={options}
         />
       )}
       <Legend
diff --git a/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/waffle/asset_details_flyout.tsx b/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/waffle/asset_details_flyout.tsx
index 03ed87cb0b016..89a00783beeed 100644
--- a/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/waffle/asset_details_flyout.tsx
+++ b/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/waffle/asset_details_flyout.tsx
@@ -7,6 +7,7 @@
 
 import { i18n } from '@kbn/i18n';
 import React from 'react';
+import type { InfraWaffleMapOptions } from '../../../../../lib/lib';
 import { ContentTabIds } from '../../../../../components/asset_details/types';
 import { InventoryItemType } from '../../../../../../common/inventory_models/types';
 import AssetDetails from '../../../../../components/asset_details/asset_details';
@@ -18,6 +19,7 @@ interface Props {
   assetType: InventoryItemType;
   closeFlyout: () => void;
   currentTime: number;
+  options?: InfraWaffleMapOptions;
 }
 
 const ONE_HOUR = 60 * 60 * 1000;
@@ -32,7 +34,13 @@ const flyoutTabs = [
   },
 ];
 
-export const AssetDetailsFlyout = ({ assetName, assetType, closeFlyout, currentTime }: Props) => {
+export const AssetDetailsFlyout = ({
+  assetName,
+  assetType,
+  closeFlyout,
+  currentTime,
+  options,
+}: Props) => {
   const { source } = useSourceContext();
 
   return source ? (
@@ -43,6 +51,9 @@ export const AssetDetailsFlyout = ({ assetName, assetType, closeFlyout, currentT
         metadata: {
           showActionsColumn: false,
         },
+        alertRule: {
+          options,
+        },
       }}
       tabs={flyoutTabs}
       links={['nodeDetails']}