[Dataset quality] Redirect to Logs explorer or Discover (elastic#184535)

Relates to elastic#183406. ## 📝 Summary This PR takes care of the redirection from dataset quality plugin by inspecting whether Observability Logs explorer app is enabled or not. ## 🎥 Demo #### When Logs explorer is enabled https://github.com/elastic/kibana/assets/1313018/86d5b7e2-16a5-471e-9dd6-d15b29b5dd71 #### When Logs explorer is not enabled https://github.com/elastic/kibana/assets/1313018/49a40414-9945-4d7f-a99d-893070972669 --------- Co-authored-by: kibanamachine <[email protected]>
mbondyra · May 31, 2024 · c129d3e · c129d3e
1 parent 749c5a6
commit c129d3e
Show file tree

Hide file tree

Showing 11 changed files with 243 additions and 101 deletions.
diff --git a/x-pack/plugins/observability_solution/dataset_quality/common/translations.ts b/x-pack/plugins/observability_solution/dataset_quality/common/translations.ts
@@ -46,6 +46,13 @@ export const flyoutOpenInLogsExplorerText = i18n.translate(
   }
 );
 
+export const flyoutOpenInDiscoverText = i18n.translate(
+  'xpack.datasetQuality.flyoutOpenInDiscoverText',
+  {
+    defaultMessage: 'Open in Discover',
+  }
+);
+
 export const flyoutDatasetDetailsText = i18n.translate(
   'xpack.datasetQuality.flyoutDatasetDetailsText',
   {

diff --git a/x-pack/plugins/observability_solution/dataset_quality/kibana.jsonc b/x-pack/plugins/observability_solution/dataset_quality/kibana.jsonc
@@ -25,7 +25,7 @@
       "lens"
     ],
     "optionalPlugins": [],
-    "requiredBundles": ["unifiedHistogram"],
+    "requiredBundles": ["unifiedHistogram", "discover"],
     "extraPublicDirs": [
       "common"
     ]

diff --git a/...bservability_solution/dataset_quality/public/components/dataset_quality/table/columns.tsx b/...bservability_solution/dataset_quality/public/components/dataset_quality/table/columns.tsx
@@ -33,7 +33,7 @@ import {
 import { DataStreamStat } from '../../../../common/data_streams_stats/data_stream_stat';
 import { DatasetQualityIndicator, QualityIndicator } from '../../quality_indicator';
 import { IntegrationIcon } from '../../common';
-import { useLinkToLogsExplorer } from '../../../hooks';
+import { useRedirectLink } from '../../../hooks';
 import { FlyoutDataset } from '../../../state_machines/dataset_quality_controller';
 import { DegradedDocsPercentageLink } from './degraded_docs_percentage_link';
 
@@ -320,24 +320,24 @@ export const getDatasetQualityTableColumns = ({
     {
       name: actionsColumnName,
       render: (dataStreamStat: DataStreamStat) => (
-        <LogsExplorerLink dataStreamStat={dataStreamStat} title={openActionName} />
+        <RedirectLink dataStreamStat={dataStreamStat} title={openActionName} />
       ),
       width: '100px',
     },
   ];
 };
 
-const LogsExplorerLink = ({
+const RedirectLink = ({
   dataStreamStat,
   title,
 }: {
   dataStreamStat: DataStreamStat;
   title: string;
 }) => {
-  const logsExplorerLinkProps = useLinkToLogsExplorer({ dataStreamStat });
+  const redirectLinkProps = useRedirectLink({ dataStreamStat });
 
   return (
-    <EuiLink data-test-subj="datasetQualityLogsExplorerLinkLink" {...logsExplorerLinkProps}>
+    <EuiLink data-test-subj="datasetQualityLogsExplorerLinkLink" {...redirectLinkProps}>
       {title}
     </EuiLink>
   );

diff --git a/...dataset_quality/public/components/dataset_quality/table/degraded_docs_percentage_link.tsx b/...dataset_quality/public/components/dataset_quality/table/degraded_docs_percentage_link.tsx
@@ -8,7 +8,7 @@
 import { EuiSkeletonRectangle, EuiFlexGroup, EuiLink } from '@elastic/eui';
 import React from 'react';
 import { _IGNORED } from '../../../../common/es_fields';
-import { useLinkToLogsExplorer } from '../../../hooks';
+import { useRedirectLink } from '../../../hooks';
 import { QualityPercentageIndicator } from '../../quality_indicator';
 import { DataStreamStat } from '../../../../common/data_streams_stats/data_stream_stat';
 
@@ -23,7 +23,7 @@ export const DegradedDocsPercentageLink = ({
     degradedDocs: { percentage, count },
   } = dataStreamStat;
 
-  const logsExplorerLinkProps = useLinkToLogsExplorer({
+  const redirectLinkProps = useRedirectLink({
     dataStreamStat,
     query: { language: 'kuery', query: `${_IGNORED}: *` },
   });
@@ -32,10 +32,7 @@ export const DegradedDocsPercentageLink = ({
     <EuiSkeletonRectangle width="50px" height="20px" borderRadius="m" isLoading={isLoading}>
       <EuiFlexGroup alignItems="center" gutterSize="s">
         {percentage ? (
-          <EuiLink
-            data-test-subj="datasetQualityDegradedDocsPercentageLink"
-            {...logsExplorerLinkProps}
-          >
+          <EuiLink data-test-subj="datasetQualityDegradedDocsPercentageLink" {...redirectLinkProps}>
             <QualityPercentageIndicator percentage={percentage} degradedDocsCount={count} />
           </EuiLink>
         ) : (

diff --git a/..._solution/dataset_quality/public/components/flyout/flyout_summary/flyout_summary_kpis.tsx b/..._solution/dataset_quality/public/components/flyout/flyout_summary/flyout_summary_kpis.tsx
@@ -12,7 +12,7 @@ import { _IGNORED } from '../../../../common/es_fields';
 
 import { DataStreamDetails } from '../../../../common/api_types';
 import { useKibanaContextForPlugin } from '../../../utils';
-import { useLinkToLogsExplorer } from '../../../hooks';
+import { useRedirectLink } from '../../../hooks';
 import { FlyoutDataset, TimeRangeConfig } from '../../../state_machines/dataset_quality_controller';
 import { FlyoutSummaryKpiItem, FlyoutSummaryKpiItemLoading } from './flyout_summary_kpi_item';
 import { getSummaryKpis } from './get_summary_kpis';
@@ -33,7 +33,7 @@ export function FlyoutSummaryKpis({
   } = useKibanaContextForPlugin();
   const hostsLocator = observabilityShared.locators.infra.hostsLocator;
 
-  const logsExplorerLinkProps = useLinkToLogsExplorer({
+  const redirectLinkProps = useRedirectLink({
     dataStreamStat,
     query: { language: 'kuery', query: `${_IGNORED}: *` },
     timeRangeConfig: timeRange,
@@ -44,10 +44,10 @@ export function FlyoutSummaryKpis({
       getSummaryKpis({
         dataStreamDetails,
         timeRange,
-        degradedDocsHref: logsExplorerLinkProps.href,
+        degradedDocsHref: redirectLinkProps.href,
         hostsLocator,
       }),
-    [dataStreamDetails, logsExplorerLinkProps, hostsLocator, timeRange]
+    [dataStreamDetails, redirectLinkProps, hostsLocator, timeRange]
   );
 
   return (

diff --git a/x-pack/plugins/observability_solution/dataset_quality/public/components/flyout/header.tsx b/x-pack/plugins/observability_solution/dataset_quality/public/components/flyout/header.tsx
@@ -16,16 +16,19 @@ import {
 } from '@elastic/eui';
 import { css } from '@emotion/react';
 import React from 'react';
-import { flyoutOpenInLogsExplorerText } from '../../../common/translations';
-import { useLinkToLogsExplorer } from '../../hooks';
+import {
+  flyoutOpenInDiscoverText,
+  flyoutOpenInLogsExplorerText,
+} from '../../../common/translations';
+import { useRedirectLink } from '../../hooks';
 import { FlyoutDataset } from '../../state_machines/dataset_quality_controller';
 import { IntegrationIcon } from '../common';
 
 export function Header({ dataStreamStat }: { dataStreamStat: FlyoutDataset }) {
   const { integration, title } = dataStreamStat;
   const euiShadow = useEuiShadow('s');
   const { euiTheme } = useEuiTheme();
-  const logsExplorerLinkProps = useLinkToLogsExplorer({ dataStreamStat });
+  const redirectLinkProps = useRedirectLink({ dataStreamStat });
 
   return (
     <EuiFlyoutHeader hasBorder>
@@ -58,10 +61,14 @@ export function Header({ dataStreamStat }: { dataStreamStat: FlyoutDataset }) {
             <EuiButton
               data-test-subj="datasetQualityHeaderButton"
               size="s"
-              {...logsExplorerLinkProps}
-              iconType="logoObservability"
+              {...redirectLinkProps}
+              iconType={
+                redirectLinkProps.isLogsExplorerAvailable ? 'logoObservability' : 'discoverApp'
+              }
             >
-              {flyoutOpenInLogsExplorerText}
+              {redirectLinkProps.isLogsExplorerAvailable
+                ? flyoutOpenInLogsExplorerText
+                : flyoutOpenInDiscoverText}
             </EuiButton>
           </EuiFlexGroup>
         </EuiFlexItem>

diff --git a/x-pack/plugins/observability_solution/dataset_quality/public/hooks/index.ts b/x-pack/plugins/observability_solution/dataset_quality/public/hooks/index.ts
@@ -8,7 +8,7 @@
 export * from './use_dataset_quality_table';
 export * from './use_dataset_quality_flyout';
 export * from './use_degraded_docs_chart';
-export * from './use_link_to_logs_explorer';
+export * from './use_redirect_link';
 export * from './use_summary_panel';
 export * from './use_create_dataview';
 export * from './use_dataset_quality_degraded_field';
diff --git a/...k/plugins/observability_solution/dataset_quality/public/hooks/use_degraded_docs_chart.tsx b/...k/plugins/observability_solution/dataset_quality/public/hooks/use_degraded_docs_chart.tsx
@@ -17,7 +17,7 @@ import { DEFAULT_LOGS_DATA_VIEW } from '../../common/constants';
 import { indexNameToDataStreamParts } from '../../common/utils';
 import { getLensAttributes } from '../components/flyout/degraded_docs_trend/lens_attributes';
 import { useCreateDataView } from './use_create_dataview';
-import { useLinkToLogsExplorer } from './use_link_to_logs_explorer';
+import { useRedirectLink } from './use_redirect_link';
 import { useDatasetQualityFlyout } from './use_dataset_quality_flyout';
 import { useKibanaContextForPlugin } from '../utils';
 
@@ -28,6 +28,13 @@ const exploreDataInLogsExplorerText = i18n.translate(
   }
 );
 
+const exploreDataInDiscoverText = i18n.translate(
+  'xpack.datasetQuality.flyoutChartExploreDataInDiscoverText',
+  {
+    defaultMessage: 'Explore data in Discover',
+  }
+);
+
 const openInLensText = i18n.translate('xpack.datasetQuality.flyoutChartOpenInLensText', {
   defaultMessage: 'Open in Lens',
 });
@@ -125,7 +132,7 @@ export const useDegradedDocsChart = ({ dataStream }: DegradedDocsChartDeps) => {
     };
   }, [openInLensCallback]);
 
-  const logsExplorerLinkProps = useLinkToLogsExplorer({
+  const redirectLinkProps = useRedirectLink({
     dataStreamStat: dataStreamStat!,
     query: { language: 'kuery', query: '_ignored:*' },
     timeRangeConfig: timeRange,
@@ -137,10 +144,12 @@ export const useDegradedDocsChart = ({ dataStream }: DegradedDocsChartDeps) => {
       id: ACTION_EXPLORE_IN_LOGS_EXPLORER,
       type: 'link',
       getDisplayName(): string {
-        return exploreDataInLogsExplorerText;
+        return redirectLinkProps?.isLogsExplorerAvailable
+          ? exploreDataInLogsExplorerText
+          : exploreDataInDiscoverText;
       },
       getHref: async () => {
-        return logsExplorerLinkProps.href;
+        return redirectLinkProps.href;
       },
       getIconType(): string | undefined {
         return 'popout';
@@ -149,11 +158,11 @@ export const useDegradedDocsChart = ({ dataStream }: DegradedDocsChartDeps) => {
         return true;
       },
       async execute(): Promise<void> {
-        return logsExplorerLinkProps.navigate();
+        return redirectLinkProps.navigate();
       },
       order: 18,
     };
-  }, [logsExplorerLinkProps]);
+  }, [redirectLinkProps]);
 
   const extraActions: Action[] = [getOpenInLensAction, getOpenInLogsExplorerAction];
 

diff --git a/.../plugins/observability_solution/dataset_quality/public/hooks/use_link_to_logs_explorer.ts b/.../plugins/observability_solution/dataset_quality/public/hooks/use_link_to_logs_explorer.ts