[APM/Infra] Display entity detail views for logs-only signals when EE…

…M is enabled (#196387) ## Summary Closes #196084. We want to show Service, Host and Container views instead of onboarging when EEM is enabled, entityCentricExperience advanced setting is enabled and the entity has logs. >[!NOTE] The visibility of the noDataConfig is evaluated at a generic template level for all 3 entity types. To manage visibility based on entity-specific information (checking for logs), we had to add checks within these templates. While this isn’t an ideal solution, it’s temporary, as we expect upcoming generic entity views will eventually allow us to remove this logic. ## Implementation details There's no need to check if EEM is enabled, as the used `dataStreams` information won’t return any results if EEM is disabled. This makes the extra check unnecessary. |Entity|Before|After| |-|-|-| |Service|![logs_only_service_before](https://github.com/user-attachments/assets/b92e7801-058d-4dc7-8cc8-eea128f19e4c)|![logs_only_service_after](https://github.com/user-attachments/assets/52eaa3cd-9cb9-427d-b9c2-d87ae6440dac)| |Host/Container|![logs_only_host_before](https://github.com/user-attachments/assets/211b2f37-0cba-42e7-bb14-ad3f44fa1a51)|![logs_only_host_after](https://github.com/user-attachments/assets/32cab468-f3d0-49f9-8835-deb016189a14)| --------- Co-authored-by: kibanamachine <[email protected]> Co-authored-by: Cauê Marcondes <[email protected]>
elastic · Oct 18, 2024 · 586330b · 586330b
1 parent 1429979
commit 586330b
Show file tree

Hide file tree

Showing 10 changed files with 71 additions and 26 deletions.
diff --git a/...bservability_solution/apm/public/components/routing/templates/apm_main_template/index.tsx b/...bservability_solution/apm/public/components/routing/templates/apm_main_template/index.tsx
@@ -7,12 +7,13 @@
 
 import { EuiFlexGroup, EuiPageHeaderProps } from '@elastic/eui';
 import { useKibana } from '@kbn/kibana-react-plugin/public';
-import { entityCentricExperience } from '@kbn/observability-plugin/common';
 import { ObservabilityPageTemplateProps } from '@kbn/observability-shared-plugin/public';
 import type { KibanaPageTemplateProps } from '@kbn/shared-ux-page-kibana-template';
 import React, { useContext } from 'react';
 import { useLocation } from 'react-router-dom';
 import { FeatureFeedbackButton } from '@kbn/observability-shared-plugin/public';
+import { useApmServiceContext } from '../../../../context/apm_service/use_apm_service_context';
+import { isLogsSignal } from '../../../../utils/get_signal_type';
 import { useLocalStorage } from '../../../../hooks/use_local_storage';
 import { useDefaultAiAssistantStarterPromptsForAPM } from '../../../../hooks/use_default_ai_assistant_starter_prompts_for_apm';
 import { KibanaEnvironmentContext } from '../../../../context/kibana_environment_context/kibana_environment_context';
@@ -71,12 +72,8 @@ export function ApmMainTemplate({
   const { http, docLinks, observabilityShared, application } = services;
   const { kibanaVersion, isCloudEnv, isServerlessEnv } = kibanaEnvironment;
   const basePath = http?.basePath.get();
-  const { config, core } = useApmPluginContext();
-  const isEntityCentricExperienceSettingEnabled = core.uiSettings.get<boolean>(
-    entityCentricExperience,
-    true
-  );
-
+  const { config } = useApmPluginContext();
+  const { serviceEntitySummary } = useApmServiceContext();
   const { isEntityCentricExperienceEnabled } = useEntityCentricExperienceSetting();
 
   const ObservabilityPageTemplate = observabilityShared.navigation.PageTemplate;
@@ -97,9 +94,14 @@ export function ApmMainTemplate({
     [application?.capabilities.savedObjectsManagement.edit]
   );
 
-  const shouldBypassNoDataScreen = bypassNoDataScreenPaths.some((path) =>
-    location.pathname.includes(path)
-  );
+  const hasLogsData = serviceEntitySummary?.dataStreamTypes
+    ? serviceEntitySummary?.dataStreamTypes?.length > 0 &&
+      isLogsSignal(serviceEntitySummary.dataStreamTypes)
+    : false;
+
+  const shouldBypassNoDataScreen =
+    bypassNoDataScreenPaths.some((path) => location.pathname.includes(path)) ||
+    (isEntityCentricExperienceEnabled && hasLogsData);
 
   const { data: fleetApmPoliciesData, status: fleetApmPoliciesStatus } = useFetcher(
     (callApmApi) => {
@@ -158,7 +160,7 @@ export function ApmMainTemplate({
 
   const showEntitiesInventoryCallout =
     !dismissedEntitiesInventoryCallout &&
-    isEntityCentricExperienceSettingEnabled &&
+    isEntityCentricExperienceEnabled &&
     selectedNavButton !== undefined;
 
   return (

diff --git a/...ck/plugins/observability_solution/infra/public/components/asset_details/template/page.tsx b/...ck/plugins/observability_solution/infra/public/components/asset_details/template/page.tsx
@@ -8,6 +8,8 @@
 import React, { useEffect } from 'react';
 import type { InventoryItemType } from '@kbn/metrics-data-access-plugin/common';
 import { EuiLoadingSpinner } from '@elastic/eui';
+import { useEntityCentricExperienceSetting } from '../../../hooks/use_entity_centric_experience_setting';
+import { isPending } from '../../../hooks/use_fetcher';
 import { SYSTEM_INTEGRATION } from '../../../../common/constants';
 import { useMetricsBreadcrumbs } from '../../../hooks/use_metrics_breadcrumbs';
 import { useParentBreadcrumbResolver } from '../../../hooks/use_parent_breadcrumb_resolver';
@@ -24,7 +26,7 @@ import { InfraPageTemplate } from '../../shared/templates/infra_page_template';
 import { OnboardingFlow } from '../../shared/templates/no_data_config';
 import { PageTitleWithPopover } from '../header/page_title_with_popover';
 import { useEntitySummary } from '../hooks/use_entity_summary';
-import { isMetricsSignal } from '../utils/get_data_stream_types';
+import { isLogsSignal, isMetricsSignal } from '../utils/get_data_stream_types';
 
 const DATA_AVAILABILITY_PER_TYPE: Partial<Record<InventoryItemType, string[]>> = {
   host: [SYSTEM_INTEGRATION],
@@ -36,10 +38,11 @@ export const Page = ({ tabs = [], links = [] }: ContentTemplateProps) => {
   const { rightSideItems, tabEntries, breadcrumbs: headerBreadcrumbs } = usePageHeader(tabs, links);
   const { asset } = useAssetDetailsRenderPropsContext();
   const trackOnlyOnce = React.useRef(false);
-  const { dataStreams } = useEntitySummary({
+  const { dataStreams, status: entitySummaryStatus } = useEntitySummary({
     entityType: asset.type,
     entityId: asset.id,
   });
+  const { isEntityCentricExperienceEnabled } = useEntityCentricExperienceSetting();
   const { activeTabId } = useTabSwitcherContext();
   const {
     services: { telemetry },
@@ -85,10 +88,18 @@ export const Page = ({ tabs = [], links = [] }: ContentTemplateProps) => {
   }, [activeTabId, asset.type, metadata, metadataLoading, telemetry]);
 
   const showPageTitleWithPopover = asset.type === 'host' && !isMetricsSignal(dataStreams);
+  const shouldBypassOnboarding =
+    isEntityCentricExperienceEnabled && (isLogsSignal(dataStreams) || isMetricsSignal(dataStreams));
 
   return (
     <InfraPageTemplate
-      onboardingFlow={asset.type === 'host' ? OnboardingFlow.Hosts : OnboardingFlow.Infra}
+      onboardingFlow={
+        isPending(entitySummaryStatus) || shouldBypassOnboarding
+          ? undefined
+          : asset.type === 'host'
+          ? OnboardingFlow.Hosts
+          : OnboardingFlow.Infra
+      }
       dataAvailabilityModules={DATA_AVAILABILITY_PER_TYPE[asset.type] || undefined}
       pageHeader={{
         pageTitle: loading ? (

diff --git a/...servability_solution/infra/public/components/asset_details/utils/get_data_stream_types.ts b/...servability_solution/infra/public/components/asset_details/utils/get_data_stream_types.ts
@@ -10,3 +10,7 @@ import { EntityDataStreamType } from '@kbn/observability-shared-plugin/common';
 export function isMetricsSignal(dataStreamTypes: EntityDataStreamType[] = []) {
   return dataStreamTypes?.includes(EntityDataStreamType.METRICS);
 }
+
+export function isLogsSignal(dataStreamTypes: EntityDataStreamType[] = []) {
+  return dataStreamTypes?.includes(EntityDataStreamType.LOGS);
+}
diff --git a/...s/observability_solution/infra/public/components/shared/templates/infra_page_template.tsx b/...s/observability_solution/infra/public/components/shared/templates/infra_page_template.tsx
@@ -20,7 +20,7 @@ import { OnboardingFlow, getNoDataConfig } from './no_data_config';
 export const InfraPageTemplate = ({
   'data-test-subj': _dataTestSubj,
   dataAvailabilityModules,
-  onboardingFlow = OnboardingFlow.Infra,
+  onboardingFlow,
   ...pageTemplateProps
 }: Omit<LazyObservabilityPageTemplateProps, 'noDataConfig'> & {
   dataAvailabilityModules?: string[];
@@ -41,14 +41,18 @@ export const InfraPageTemplate = ({
   const { error: dataViewLoadError, refetch: loadDataView } = useMetricsDataViewContext();
   const { remoteClustersExist } = source?.status ?? {};
 
-  const { data, status } = useFetcher(async (callApi) => {
-    return await callApi<GetHasDataResponse>('/api/metrics/source/hasData', {
-      method: 'GET',
-      query: {
-        modules: dataAvailabilityModules,
-      },
-    });
-  });
+  const { data, status } = useFetcher(
+    async (callApi) => {
+      if (!onboardingFlow) return;
+      return await callApi<GetHasDataResponse>('/api/metrics/source/hasData', {
+        method: 'GET',
+        query: {
+          modules: dataAvailabilityModules,
+        },
+      });
+    },
+    [onboardingFlow, dataAvailabilityModules]
+  );
 
   const hasData = !!data?.hasData;
   const noDataConfig = getNoDataConfig({

diff --git a/...plugins/observability_solution/infra/public/components/shared/templates/no_data_config.ts b/...plugins/observability_solution/infra/public/components/shared/templates/no_data_config.ts
@@ -108,11 +108,11 @@ export const getNoDataConfig = ({
 }: {
   hasData: boolean;
   loading: boolean;
-  onboardingFlow: OnboardingFlow;
+  onboardingFlow?: OnboardingFlow;
   locators: LocatorClient;
   docsLink?: string;
 }): NoDataConfig | undefined => {
-  if (hasData || loading) {
+  if (!onboardingFlow || hasData || loading) {
     return;
   }
 

diff --git a/...ugins/observability_solution/infra/public/hooks/use_entity_centric_experience_setting.tsx b/...ugins/observability_solution/infra/public/hooks/use_entity_centric_experience_setting.tsx
@@ -0,0 +1,17 @@
+/*
+ * 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 { entityCentricExperience } from '@kbn/observability-plugin/common';
+import { useKibanaContextForPlugin } from './use_kibana';
+
+export function useEntityCentricExperienceSetting() {
+  const { uiSettings } = useKibanaContextForPlugin().services;
+
+  const isEntityCentricExperienceEnabled = uiSettings.get<boolean>(entityCentricExperience, true);
+
+  return { isEntityCentricExperienceEnabled };
+}
diff --git a/x-pack/plugins/observability_solution/infra/public/pages/metrics/inventory_view/index.tsx b/x-pack/plugins/observability_solution/infra/public/pages/metrics/inventory_view/index.tsx
@@ -10,6 +10,7 @@ import React from 'react';
 import { useTrackPageview } from '@kbn/observability-shared-plugin/public';
 import { APP_WRAPPER_CLASS } from '@kbn/core/public';
 import { css } from '@emotion/react';
+import { OnboardingFlow } from '../../../components/shared/templates/no_data_config';
 import { InfraPageTemplate } from '../../../components/shared/templates/infra_page_template';
 import { useMetricsBreadcrumbs } from '../../../hooks/use_metrics_breadcrumbs';
 import { inventoryTitle } from '../../../translations';
@@ -38,6 +39,7 @@ export const SnapshotPage = () => {
           <WaffleFiltersProvider>
             <div className={APP_WRAPPER_CLASS}>
               <InfraPageTemplate
+                onboardingFlow={OnboardingFlow.Infra}
                 pageHeader={{
                   pageTitle: inventoryTitle,
                   rightSideItems: [<SavedViews />, <SurveySection />],

diff --git a/...bility_solution/infra/public/pages/metrics/metric_detail/components/node_details_page.tsx b/...bility_solution/infra/public/pages/metrics/metric_detail/components/node_details_page.tsx
@@ -11,6 +11,7 @@ import moment from 'moment';
 import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
 import { InventoryMetric, InventoryItemType } from '@kbn/metrics-data-access-plugin/common';
 import { decodeOrThrow } from '@kbn/io-ts-utils';
+import { OnboardingFlow } from '../../../../components/shared/templates/no_data_config';
 import { InfraPageTemplate } from '../../../../components/shared/templates/infra_page_template';
 import { NodeDetailsMetricDataResponseRT } from '../../../../../common/http_api/node_details_api';
 import { isPending, useFetcher } from '../../../../hooks/use_fetcher';
@@ -91,6 +92,7 @@ export const NodeDetailsPage = (props: Props) => {
 
   return (
     <InfraPageTemplate
+      onboardingFlow={OnboardingFlow.Infra}
       pageHeader={{
         pageTitle: props.name,
         rightSideItems: [

diff --git a/...ns/observability_solution/infra/public/pages/metrics/metric_detail/metric_detail_page.tsx b/...ns/observability_solution/infra/public/pages/metrics/metric_detail/metric_detail_page.tsx
@@ -10,6 +10,7 @@ import React, { useState } from 'react';
 import { useRouteMatch } from 'react-router-dom';
 import { findInventoryModel } from '@kbn/metrics-data-access-plugin/common';
 import type { InventoryItemType } from '@kbn/metrics-data-access-plugin/common';
+import { OnboardingFlow } from '../../../components/shared/templates/no_data_config';
 import { InfraPageTemplate } from '../../../components/shared/templates/infra_page_template';
 import { useMetricsBreadcrumbs } from '../../../hooks/use_metrics_breadcrumbs';
 import { useParentBreadcrumbResolver } from '../../../hooks/use_parent_breadcrumb_resolver';
@@ -79,7 +80,7 @@ export const MetricDetailPage = () => {
 
   if (metadataLoading && !filteredRequiredMetrics.length) {
     return (
-      <InfraPageTemplate>
+      <InfraPageTemplate onboardingFlow={OnboardingFlow.Infra}>
         <InfraLoadingPanel
           height="100vh"
           width="100%"

diff --git a/x-pack/plugins/observability_solution/infra/public/pages/metrics/metrics_explorer/index.tsx b/x-pack/plugins/observability_solution/infra/public/pages/metrics/metrics_explorer/index.tsx
@@ -8,6 +8,7 @@
 import { i18n } from '@kbn/i18n';
 import React, { useEffect, useState } from 'react';
 import { useTrackPageview, FeatureFeedbackButton } from '@kbn/observability-shared-plugin/public';
+import { OnboardingFlow } from '../../../components/shared/templates/no_data_config';
 import { InfraPageTemplate } from '../../../components/shared/templates/infra_page_template';
 import { WithMetricsExplorerOptionsUrlState } from '../../../containers/metrics_explorer/with_metrics_explorer_options_url_state';
 import { useKibanaEnvironmentContext } from '../../../hooks/use_kibana';
@@ -94,6 +95,7 @@ const MetricsExplorerContent = () => {
 
   return (
     <InfraPageTemplate
+      onboardingFlow={OnboardingFlow.Infra}
       pageHeader={{
         pageTitle: metricsExplorerTitle,
         rightSideItems: [