🌊 Streams: Add nudge to stack management data stream page to go to streams (#215126)

<img width="486" alt="Screenshot 2025-03-19 at 11 39 47"
src="https://github.com/user-attachments/assets/77f4fda2-89a5-4250-a944-699eb2bf8957"
/>

If streams is enabled and the data stream is not hidden, a promotional
component is shown in the flyout that tells people to go there.

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>

x-pack/platform/plugins/shared/index_management/kibana.jsonc

@@ -26,6 +26,7 @@
       "fleet",
       "cloud",
       "ml",
+      "streams",
       "console",
       "licensing"
     ],

x-pack/platform/plugins/shared/index_management/public/application/app_context.tsx

@@ -26,6 +26,7 @@ import type { SharePluginStart } from '@kbn/share-plugin/public';
 import type { SettingsStart } from '@kbn/core-ui-settings-browser';
 import type { CloudSetup } from '@kbn/cloud-plugin/public';
 import type { ConsolePluginStart } from '@kbn/console-plugin/public';
+import type { StreamsPluginStart } from '@kbn/streams-plugin/public';
 
 import { EuiBreadcrumb } from '@elastic/eui';
 import { LicensingPluginStart } from '@kbn/licensing-plugin/public';
@@ -55,6 +56,7 @@ export interface AppDependencies {
     console?: ConsolePluginStart;
     licensing?: LicensingPluginStart;
     ml?: MlPluginStart;
+    streams?: StreamsPluginStart;
   };
   services: {
     uiMetricService: UiMetricService;

x-pack/platform/plugins/shared/index_management/public/application/mount_management_section.ts

@@ -89,6 +89,7 @@ export function getIndexManagementDependencies({
       cloud,
       console: startDependencies.console,
       ml: startDependencies.ml,
+      streams: startDependencies.streams,
       licensing: startDependencies.licensing,
     },
     services: {

x-pack/platform/plugins/shared/index_management/public/application/sections/home/data_stream_list/data_stream_detail_panel/data_stream_detail_panel.tsx

@@ -52,6 +52,7 @@ import {
 import { useAppContext } from '../../../../app_context';
 import { DataStreamsBadges } from '../data_stream_badges';
 import { useIlmLocator } from '../../../../services/use_ilm_locator';
+import { StreamsPromotion } from './streams_promotion';
 import { INDEX_MANAGEMENT_LOCATOR_ID } from '../../../../..';
 
 interface Detail {
@@ -171,6 +172,7 @@ export const DataStreamDetailPanel: React.FunctionComponent<Props> = ({
       meteringDocsCount,
       lifecycle,
       indexMode,
+      hidden,
     } = dataStream;
 
     const getManagementDetails = () => {
@@ -468,6 +470,7 @@ export const DataStreamDetailPanel: React.FunctionComponent<Props> = ({
         )}
 
         <DetailsList details={details} />
+        {!hidden && <StreamsPromotion dataStreamName={dataStreamName} />}
       </>
     );
   }

x-pack/platform/plugins/shared/index_management/public/application/sections/home/data_stream_list/data_stream_detail_panel/streams_promotion.tsx

@@ -0,0 +1,54 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import useObservable from 'react-use/lib/useObservable';
+import { EMPTY } from 'rxjs';
+import React from 'react';
+import { EuiButton, EuiCallOut, EuiFlexGroup, EuiSpacer, EuiText } from '@elastic/eui';
+import { StreamsAppLocatorParams } from '@kbn/streams-app-plugin/public';
+import { i18n } from '@kbn/i18n';
+import { useAppContext } from '../../../../app_context';
+
+export function StreamsPromotion({ dataStreamName }: { dataStreamName: string }) {
+  const {
+    url,
+    plugins: { streams },
+  } = useAppContext();
+  const streamsEnabled = useObservable(streams?.status$ || EMPTY)?.status === 'enabled';
+  const streamsLocator = url.locators.get<StreamsAppLocatorParams>('STREAMS_APP_LOCATOR');
+
+  if (!streamsEnabled || !streamsLocator) {
+    return null;
+  }
+
+  return (
+    <>
+      <EuiSpacer />
+      <EuiCallOut
+        size="s"
+        title={i18n.translate('xpack.idxMgmt.streamsPromotion.title', {
+          defaultMessage: 'Explore the New Streams UI in Technical Preview',
+        })}
+        color="primary"
+      >
+        <EuiFlexGroup direction="column" gutterSize="s" alignItems="flexStart">
+          <EuiText size="s">
+            {i18n.translate('xpack.idxMgmt.streamsPromotion.description', {
+              defaultMessage:
+                'A better way to manage your data streams is here! The new Streams UI provides a streamlined experience with improved insights and management tools.',
+            })}
+          </EuiText>
+          <EuiButton onClick={() => streamsLocator.navigate({ name: dataStreamName })}>
+            {i18n.translate('xpack.idxMgmt.streamsPromotion.button', {
+              defaultMessage: 'Go to Streams',
+            })}
+          </EuiButton>
+        </EuiFlexGroup>
+      </EuiCallOut>
+    </>
+  );
+}

x-pack/platform/plugins/shared/index_management/public/types.ts

@@ -19,6 +19,7 @@ import { MlPluginStart } from '@kbn/ml-plugin/public';
 import { SharePluginSetup, SharePluginStart } from '@kbn/share-plugin/public';
 import { UsageCollectionSetup } from '@kbn/usage-collection-plugin/public';
 import { LicensingPluginStart } from '@kbn/licensing-plugin/public';
+import { StreamsPluginStart } from '@kbn/streams-plugin/public';
 
 export interface IndexManagementStartServices {
   analytics: Pick<AnalyticsServiceStart, 'reportEvent'>;
@@ -45,6 +46,7 @@ export interface StartDependencies {
   management: ManagementSetup;
   licensing?: LicensingPluginStart;
   ml?: MlPluginStart;
+  streams?: StreamsPluginStart;
 }
 
 export interface ClientConfigType {

x-pack/platform/plugins/shared/index_management/tsconfig.json

@@ -56,6 +56,8 @@
     "@kbn/core-application-browser",
     "@kbn/delete-managed-asset-callout",
     "@kbn/inference-endpoint-ui-common",
+    "@kbn/streams-plugin",
+    "@kbn/streams-app-plugin",
     "@kbn/shared-ux-link-redirect-app",
   ],
   "exclude": ["target/**/*"]

x-pack/platform/plugins/shared/streams_app/public/index.ts

@@ -16,12 +16,14 @@ import type {
   StreamsApplicationComponentType,
   StreamsApplicationProps,
 } from './types';
+import { StreamsAppLocatorParams } from './app_locator';
 
 export type {
   StreamsAppPublicSetup,
   StreamsAppPublicStart,
   StreamsApplicationComponentType,
   StreamsApplicationProps,
+  StreamsAppLocatorParams,
 };
 
 export const plugin: PluginInitializer<