Add beta badge to chrome

elastic · Aug 31, 2023 · b97c53d · b97c53d
1 parent 7fc1039
commit b97c53d
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 4 deletions.
diff --git a/x-pack/plugins/infra/public/plugin.ts b/x-pack/plugins/infra/public/plugin.ts
@@ -130,7 +130,12 @@ export class Plugin implements InfraClientPluginClass {
                     label: 'Logs',
                     sortKey: 200,
                     entries: [
-                      { label: 'Explorer', app: 'observability-log-explorer', path: '/' },
+                      {
+                        label: 'Explorer',
+                        app: 'observability-log-explorer',
+                        path: '/',
+                        isBetaFeature: true,
+                      },
                       { label: 'Stream', app: 'logs', path: '/stream' },
                       { label: 'Anomalies', app: 'logs', path: '/anomalies' },
                       { label: 'Categories', app: 'logs', path: '/log-categories' },

diff --git a/x-pack/plugins/observability_log_explorer/common/translations.ts b/x-pack/plugins/observability_log_explorer/common/translations.ts
@@ -10,3 +10,14 @@ import { i18n } from '@kbn/i18n';
 export const logExplorerAppTitle = i18n.translate('xpack.observabilityLogExplorer.appTitle', {
   defaultMessage: 'Log Explorer',
 });
+
+export const betaBadgeTitle = i18n.translate('xpack.observabilityLogExplorer.betaBadgeTitle', {
+  defaultMessage: 'Beta',
+});
+
+export const betaBadgeDescription = i18n.translate(
+  'xpack.observabilityLogExplorer.betaBadgeDescription',
+  {
+    defaultMessage: 'This application is in beta and therefore subject to change.',
+  }
+);
diff --git a/x-pack/plugins/observability_log_explorer/public/utils/breadcrumbs.tsx b/x-pack/plugins/observability_log_explorer/public/utils/breadcrumbs.tsx
@@ -9,11 +9,15 @@ import { EuiBreadcrumb } from '@elastic/eui';
 import type { ChromeStart } from '@kbn/core-chrome-browser';
 import type { ServerlessPluginStart } from '@kbn/serverless/public';
 import { useEffect } from 'react';
-import { logExplorerAppTitle } from '../../common/translations';
+import {
+  betaBadgeDescription,
+  betaBadgeTitle,
+  logExplorerAppTitle,
+} from '../../common/translations';
 
 export const useBreadcrumbs = (
   breadcrumbs: EuiBreadcrumb[],
-  chromeService?: ChromeStart,
+  chromeService: ChromeStart,
   serverlessService?: ServerlessPluginStart
 ) => {
   useEffect(() => {
@@ -23,7 +27,7 @@ export const useBreadcrumbs = (
 
 export function setBreadcrumbs(
   breadcrumbs: EuiBreadcrumb[],
-  chromeService?: ChromeStart,
+  chromeService: ChromeStart,
   serverlessService?: ServerlessPluginStart
 ) {
   if (serverlessService) {
@@ -36,6 +40,10 @@ export function setBreadcrumbs(
       ...breadcrumbs,
     ]);
   }
+  chromeService.setBadge({
+    text: betaBadgeTitle,
+    tooltip: betaBadgeDescription,
+  });
 }
 
 export const noBreadcrumbs: EuiBreadcrumb[] = [];