Add assistant button everywhere in Observability

dgieselaar · Aug 6, 2023 · ffa972c · ffa972c
1 parent 85bc1e6
commit ffa972c
Show file tree

Hide file tree

Showing 32 changed files with 228 additions and 132 deletions.
diff --git a/x-pack/plugins/exploratory_view/kibana.jsonc b/x-pack/plugins/exploratory_view/kibana.jsonc
@@ -22,7 +22,8 @@
       "security",
       "share",
       "triggersActionsUi",
-      "unifiedSearch"
+      "unifiedSearch",
+      "observabilityAIAssistant"
     ],
     "optionalPlugins": ["discover", "embeddable", "home", "licensing", "spaces", "usageCollection"],
     "requiredBundles": [

diff --git a/x-pack/plugins/exploratory_view/public/application/index.tsx b/x-pack/plugins/exploratory_view/public/application/index.tsx
@@ -19,6 +19,7 @@ import {
 } from '@kbn/kibana-react-plugin/public';
 import { Storage } from '@kbn/kibana-utils-plugin/public';
 import { UsageCollectionSetup } from '@kbn/usage-collection-plugin/public';
+import { ObservabilityAIAssistantProvider } from '@kbn/observability-ai-assistant-plugin/public';
 import { PluginContext } from '../context/plugin_context';
 import { routes } from '../routes';
 import { ExploratoryViewPublicPluginsStart } from '../plugin';
@@ -70,34 +71,41 @@ export const renderApp = ({
   const ApplicationUsageTrackingProvider =
     usageCollection?.components.ApplicationUsageTrackingProvider ?? React.Fragment;
 
+  const aiAssistantService = plugins.observabilityAIAssistant;
+
   ReactDOM.render(
     <EuiErrorBoundary>
       <ApplicationUsageTrackingProvider>
         <KibanaThemeProvider theme$={theme$}>
-          <KibanaContextProvider
-            services={{
-              ...core,
-              ...plugins,
-              storage: new Storage(localStorage),
-              isDev,
-            }}
-          >
-            <PluginContext.Provider
-              value={{
-                appMountParameters,
+          <ObservabilityAIAssistantProvider value={aiAssistantService}>
+            <KibanaContextProvider
+              services={{
+                ...core,
+                ...plugins,
+                storage: new Storage(localStorage),
+                isDev,
               }}
             >
-              <Router history={history}>
-                <EuiThemeProvider darkMode={isDarkMode}>
-                  <i18nCore.Context>
-                    <RedirectAppLinks application={core.application} className={APP_WRAPPER_CLASS}>
-                      <App />
-                    </RedirectAppLinks>
-                  </i18nCore.Context>
-                </EuiThemeProvider>
-              </Router>
-            </PluginContext.Provider>
-          </KibanaContextProvider>
+              <PluginContext.Provider
+                value={{
+                  appMountParameters,
+                }}
+              >
+                <Router history={history}>
+                  <EuiThemeProvider darkMode={isDarkMode}>
+                    <i18nCore.Context>
+                      <RedirectAppLinks
+                        application={core.application}
+                        className={APP_WRAPPER_CLASS}
+                      >
+                        <App />
+                      </RedirectAppLinks>
+                    </i18nCore.Context>
+                  </EuiThemeProvider>
+                </Router>
+              </PluginContext.Provider>
+            </KibanaContextProvider>
+          </ObservabilityAIAssistantProvider>
         </KibanaThemeProvider>
       </ApplicationUsageTrackingProvider>
     </EuiErrorBoundary>,

diff --git a/...ory_view/public/components/shared/exploratory_view/components/action_menu/action_menu.tsx b/...ory_view/public/components/shared/exploratory_view/components/action_menu/action_menu.tsx
@@ -9,6 +9,10 @@ import React, { useState } from 'react';
 import { EuiButton, EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import { LensEmbeddableInput, TypedLensByValueInput } from '@kbn/lens-plugin/public';
+import {
+  useObservabilityAIAssistant,
+  ObservabilityAIAssistantActionMenuItem,
+} from '@kbn/observability-ai-assistant-plugin/public';
 import { useKibana } from '@kbn/kibana-react-plugin/public';
 import { EmbedAction } from '../../header/embed_action';
 import { ObservabilityAppServices } from '../../../../../application/types';
@@ -29,6 +33,8 @@ export function ExpViewActionMenuContent({
 
   const LensSaveModalComponent = lens.SaveModalComponent;
 
+  const service = useObservabilityAIAssistant();
+
   return (
     <>
       <EuiFlexGroup
@@ -93,6 +99,11 @@ export function ExpViewActionMenuContent({
             })}
           </EuiButton>
         </EuiFlexItem>
+        {service.isEnabled() ? (
+          <EuiFlexItem>
+            <ObservabilityAIAssistantActionMenuItem />
+          </EuiFlexItem>
+        ) : null}
       </EuiFlexGroup>
 
       {isSaveOpen && lensAttributes && (

diff --git a/x-pack/plugins/exploratory_view/public/plugin.ts b/x-pack/plugins/exploratory_view/public/plugin.ts
@@ -37,6 +37,7 @@ import { GuidedOnboardingPluginStart } from '@kbn/guided-onboarding-plugin/publi
 import { SpacesPluginStart } from '@kbn/spaces-plugin/public';
 import { LicensingPluginStart } from '@kbn/licensing-plugin/public';
 import { UnifiedSearchPublicPluginStart } from '@kbn/unified-search-plugin/public';
+import { ObservabilityAIAssistantPluginStart } from '@kbn/observability-ai-assistant-plugin/public';
 import { getExploratoryViewEmbeddable } from './components/shared/exploratory_view/embeddable';
 import { createExploratoryViewUrl } from './components/shared/exploratory_view/configurations/exploratory_view_url';
 import getAppDataView from './utils/observability_data_views/get_app_data_view';
@@ -70,6 +71,7 @@ export interface ExploratoryViewPublicPluginsStart {
   usageCollection: UsageCollectionSetup;
   unifiedSearch: UnifiedSearchPublicPluginStart;
   home?: HomePublicPluginStart;
+  observabilityAIAssistant: ObservabilityAIAssistantPluginStart;
 }
 
 export type ExploratoryViewPublicSetup = ReturnType<Plugin['setup']>;

diff --git a/x-pack/plugins/infra/public/pages/logs/page_content.tsx b/x-pack/plugins/infra/public/pages/logs/page_content.tsx
@@ -11,6 +11,7 @@ import React, { useContext } from 'react';
 import { Routes, Route } from '@kbn/shared-ux-router';
 import { useKibana } from '@kbn/kibana-react-plugin/public';
 import { HeaderMenuPortal, useLinkProps } from '@kbn/observability-shared-plugin/public';
+import { ObservabilityAIAssistantActionMenuItem } from '@kbn/observability-ai-assistant-plugin/public';
 import { LazyAlertDropdownWrapper } from '../../alerting/log_threshold';
 import { HelpCenterContent } from '../../components/help_center_content';
 import { useReadOnlyBadge } from '../../hooks/use_readonly_badge';
@@ -81,6 +82,7 @@ export const LogsPageContent: React.FunctionComponent = () => {
             >
               {ADD_DATA_LABEL}
             </EuiHeaderLink>
+            <ObservabilityAIAssistantActionMenuItem />
           </EuiHeaderLinks>
         </HeaderMenuPortal>
       )}

diff --git a/x-pack/plugins/infra/public/pages/metrics/index.tsx b/x-pack/plugins/infra/public/pages/metrics/index.tsx
@@ -14,6 +14,7 @@ import { Routes, Route } from '@kbn/shared-ux-router';
 import { EuiErrorBoundary, EuiHeaderLinks, EuiHeaderLink } from '@elastic/eui';
 import { useKibana } from '@kbn/kibana-react-plugin/public';
 import { HeaderMenuPortal, useLinkProps } from '@kbn/observability-shared-plugin/public';
+import { ObservabilityAIAssistantActionMenuItem } from '@kbn/observability-ai-assistant-plugin/public';
 import { MetricsSourceConfigurationProperties } from '../../../common/metrics_sources';
 import { HelpCenterContent } from '../../components/help_center_content';
 import { useReadOnlyBadge } from '../../hooks/use_readonly_badge';
@@ -89,6 +90,7 @@ export const InfrastructurePage = ({ match }: RouteComponentProps) => {
                         >
                           {ADD_DATA_LABEL}
                         </EuiHeaderLink>
+                        <ObservabilityAIAssistantActionMenuItem />
                       </EuiHeaderLinks>
                     </HeaderMenuPortal>
                   )}

diff --git a/x-pack/plugins/observability/kibana.jsonc b/x-pack/plugins/observability/kibana.jsonc
@@ -22,6 +22,7 @@
       "inspector",
       "lens",
       "observabilityShared",
+      "observabilityAIAssistant",
       "ruleRegistry",
       "triggersActionsUi",
       "security",

diff --git a/x-pack/plugins/observability/public/application/index.tsx b/x-pack/plugins/observability/public/application/index.tsx
@@ -21,6 +21,7 @@ import {
 } from '@kbn/kibana-react-plugin/public';
 import { Storage } from '@kbn/kibana-utils-plugin/public';
 import { UsageCollectionSetup } from '@kbn/usage-collection-plugin/public';
+import { ObservabilityAIAssistantProvider } from '@kbn/observability-ai-assistant-plugin/public';
 import { HasDataContextProvider } from '../context/has_data_context/has_data_context';
 import { PluginContext } from '../context/plugin_context/plugin_context';
 import { ConfigSchema, ObservabilityPublicPluginsStart } from '../plugin';
@@ -100,32 +101,34 @@ export const renderApp = ({
                 kibanaVersion,
               }}
             >
-              <PluginContext.Provider
-                value={{
-                  config,
-                  appMountParameters,
-                  observabilityRuleTypeRegistry,
-                  ObservabilityPageTemplate,
-                }}
-              >
-                <Router history={history}>
-                  <EuiThemeProvider darkMode={isDarkMode}>
-                    <i18nCore.Context>
-                      <RedirectAppLinks
-                        application={core.application}
-                        className={APP_WRAPPER_CLASS}
-                      >
-                        <QueryClientProvider client={queryClient}>
-                          <HasDataContextProvider>
-                            <App />
-                          </HasDataContextProvider>
-                          <HideableReactQueryDevTools />
-                        </QueryClientProvider>
-                      </RedirectAppLinks>
-                    </i18nCore.Context>
-                  </EuiThemeProvider>
-                </Router>
-              </PluginContext.Provider>
+              <ObservabilityAIAssistantProvider value={plugins.observabilityAIAssistant}>
+                <PluginContext.Provider
+                  value={{
+                    config,
+                    appMountParameters,
+                    observabilityRuleTypeRegistry,
+                    ObservabilityPageTemplate,
+                  }}
+                >
+                  <Router history={history}>
+                    <EuiThemeProvider darkMode={isDarkMode}>
+                      <i18nCore.Context>
+                        <RedirectAppLinks
+                          application={core.application}
+                          className={APP_WRAPPER_CLASS}
+                        >
+                          <QueryClientProvider client={queryClient}>
+                            <HasDataContextProvider>
+                              <App />
+                            </HasDataContextProvider>
+                            <HideableReactQueryDevTools />
+                          </QueryClientProvider>
+                        </RedirectAppLinks>
+                      </i18nCore.Context>
+                    </EuiThemeProvider>
+                  </Router>
+                </PluginContext.Provider>
+              </ObservabilityAIAssistantProvider>
             </KibanaContextProvider>
           </CloudProvider>
         </KibanaThemeProvider>

diff --git a/x-pack/plugins/observability/public/pages/alert_details/alert_details.tsx b/x-pack/plugins/observability/public/pages/alert_details/alert_details.tsx
@@ -27,6 +27,7 @@ import { getTimeZone } from '../../utils/get_time_zone';
 import { isAlertDetailsEnabledPerApp } from '../../utils/is_alert_details_enabled';
 import { observabilityFeatureId } from '../../../common';
 import { paths } from '../../../common/locators/paths';
+import { HeaderMenu } from '../overview/components/header_menu/header_menu';
 
 interface AlertDetailsPathParams {
   alertId: string;
@@ -137,6 +138,7 @@ export function AlertDetails() {
       }}
       data-test-subj="alertDetails"
     >
+      <HeaderMenu />
       <AlertSummary alertSummaryFields={summaryFields} />
       <EuiSpacer size="l" />
       {AlertDetailsAppSection && rule && (

diff --git a/x-pack/plugins/observability/public/pages/alerts/alerts.tsx b/x-pack/plugins/observability/public/pages/alerts/alerts.tsx
@@ -31,6 +31,7 @@ import { calculateTimeRangeBucketSize } from '../overview/helpers/calculate_buck
 import { getAlertSummaryTimeRange } from '../../utils/alert_summary_widget';
 import { observabilityAlertFeatureIds } from '../../../common/constants';
 import { ALERTS_URL_STORAGE_KEY } from '../../../common/constants';
+import { HeaderMenu } from '../overview/components/header_menu/header_menu';
 
 const ALERTS_SEARCH_BAR_ID = 'alerts-search-bar-o11y';
 const ALERTS_PER_PAGE = 50;
@@ -175,6 +176,7 @@ function InternalAlertsPage() {
           rightSideItems: renderRuleStats(ruleStats, manageRulesHref, ruleStatsLoading),
         }}
       >
+        <HeaderMenu />
         <EuiFlexGroup direction="column" gutterSize="m">
           <EuiFlexItem>
             <ObservabilityAlertSearchBar

diff --git a/x-pack/plugins/observability/public/pages/cases/cases.tsx b/x-pack/plugins/observability/public/pages/cases/cases.tsx
@@ -13,6 +13,7 @@ import { useHasData } from '../../hooks/use_has_data';
 import { Cases } from './components/cases';
 import { LoadingObservability } from '../../components/loading_observability';
 import { CaseFeatureNoPermissions } from './components/feature_no_permissions';
+import { HeaderMenu } from '../overview/components/header_menu/header_menu';
 
 export function CasesPage() {
   const userCasesPermissions = useGetUserCasesPermissions();
@@ -26,6 +27,7 @@ export function CasesPage() {
 
   return userCasesPermissions.read ? (
     <ObservabilityPageTemplate isPageDataLoaded data-test-subj="o11yCasesPage">
+      <HeaderMenu />
       <Cases permissions={userCasesPermissions} />
     </ObservabilityPageTemplate>
   ) : (

diff --git a/x-pack/plugins/observability/public/pages/overview/components/header_menu/header_menu.tsx b/x-pack/plugins/observability/public/pages/overview/components/header_menu/header_menu.tsx
@@ -8,6 +8,7 @@
 import { EuiHeaderLink, EuiHeaderLinks } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import React from 'react';
+import { ObservabilityAIAssistantActionMenuItem } from '@kbn/observability-ai-assistant-plugin/public';
 import { useKibana } from '../../../../utils/kibana_react';
 import { usePluginContext } from '../../../../hooks/use_plugin_context';
 import HeaderMenuPortal from './header_menu_portal';
@@ -28,6 +29,7 @@ export function HeaderMenu(): React.ReactElement | null {
         >
           {addDataLinkText}
         </EuiHeaderLink>
+        <ObservabilityAIAssistantActionMenuItem />
       </EuiHeaderLinks>
     </HeaderMenuPortal>
   );

diff --git a/x-pack/plugins/observability/public/pages/rule_details/rule_details.tsx b/x-pack/plugins/observability/public/pages/rule_details/rule_details.tsx
@@ -38,6 +38,7 @@ import {
   getDefaultAlertSummaryTimeRange,
 } from '../../utils/alert_summary_widget';
 import type { AlertStatus } from '../../../common/typings';
+import { HeaderMenu } from '../overview/components/header_menu/header_menu';
 
 export type TabId = typeof RULE_DETAILS_ALERTS_TAB | typeof RULE_DETAILS_EXECUTION_TAB;
 
@@ -217,6 +218,7 @@ export function RuleDetailsPage() {
         ],
       }}
     >
+      <HeaderMenu />
       <EuiFlexGroup wrap gutterSize="m">
         <EuiFlexItem style={{ minWidth: 350 }}>
           <RuleStatusPanel

diff --git a/x-pack/plugins/observability/public/pages/rules/rules.tsx b/x-pack/plugins/observability/public/pages/rules/rules.tsx
@@ -18,6 +18,7 @@ import { useBreadcrumbs } from '@kbn/observability-shared-plugin/public';
 import { useKibana } from '../../utils/kibana_react';
 import { usePluginContext } from '../../hooks/use_plugin_context';
 import { useGetFilteredRuleTypes } from '../../hooks/use_get_filtered_rule_types';
+import { HeaderMenu } from '../overview/components/header_menu/header_menu';
 
 export function RulesPage() {
   const {
@@ -142,6 +143,7 @@ export function RulesPage() {
       }}
       data-test-subj="rulesPage"
     >
+      <HeaderMenu />
       <EuiFlexGroup direction="column" gutterSize="s">
         <EuiFlexItem>
           <RuleList

diff --git a/x-pack/plugins/observability/public/pages/slo_details/slo_details.tsx b/x-pack/plugins/observability/public/pages/slo_details/slo_details.tsx
@@ -28,6 +28,7 @@ import type { SloDetailsPathParams } from './types';
 import { AutoRefreshButton } from '../slos/components/auto_refresh_button';
 import { FeedbackButton } from '../../components/slo/feedback_button/feedback_button';
 import { useGetInstanceIdQueryParam } from './hooks/use_get_instance_id_query_param';
+import { HeaderMenu } from '../overview/components/header_menu/header_menu';
 
 export function SloDetailsPage() {
   const {
@@ -83,6 +84,7 @@ export function SloDetailsPage() {
       }}
       data-test-subj="sloDetailsPage"
     >
+      <HeaderMenu />
       {isLoading && <EuiLoadingSpinner data-test-subj="sloDetailsLoading" />}
       {!isLoading && <SloDetails slo={slo!} isAutoRefreshing={isAutoRefreshing} />}
     </ObservabilityPageTemplate>

diff --git a/x-pack/plugins/observability/public/pages/slo_edit/slo_edit.tsx b/x-pack/plugins/observability/public/pages/slo_edit/slo_edit.tsx
@@ -19,6 +19,7 @@ import { useCapabilities } from '../../hooks/slo/use_capabilities';
 import { useFetchSloGlobalDiagnosis } from '../../hooks/slo/use_fetch_global_diagnosis';
 import { FeedbackButton } from '../../components/slo/feedback_button/feedback_button';
 import { SloEditForm } from './components/slo_edit_form';
+import { HeaderMenu } from '../overview/components/header_menu/header_menu';
 
 export function SloEditPage() {
   const {
@@ -83,6 +84,7 @@ export function SloEditPage() {
       }}
       data-test-subj="slosEditPage"
     >
+      <HeaderMenu />
       <SloEditForm slo={slo} />
     </ObservabilityPageTemplate>
   );

diff --git a/x-pack/plugins/observability/public/pages/slos/slos.tsx b/x-pack/plugins/observability/public/pages/slos/slos.tsx
@@ -20,6 +20,7 @@ import { AutoRefreshButton } from './components/auto_refresh_button';
 import { HeaderTitle } from './components/header_title';
 import { FeedbackButton } from '../../components/slo/feedback_button/feedback_button';
 import { paths } from '../../../common/locators/paths';
+import { HeaderMenu } from '../overview/components/header_menu/header_menu';
 
 export function SlosPage() {
   const {
@@ -88,6 +89,7 @@ export function SlosPage() {
       }}
       data-test-subj="slosPage"
     >
+      <HeaderMenu />
       <SloList autoRefresh={isAutoRefreshing} />
     </ObservabilityPageTemplate>
   );

diff --git a/x-pack/plugins/observability/public/pages/slos_welcome/slos_welcome.tsx b/x-pack/plugins/observability/public/pages/slos_welcome/slos_welcome.tsx
@@ -26,6 +26,7 @@ import { useFetchSloList } from '../../hooks/slo/use_fetch_slo_list';
 import { paths } from '../../../common/locators/paths';
 import illustration from './assets/illustration.svg';
 import { useFetchSloGlobalDiagnosis } from '../../hooks/slo/use_fetch_global_diagnosis';
+import { HeaderMenu } from '../overview/components/header_menu/header_menu';
 
 export function SlosWelcomePage() {
   const {
@@ -57,6 +58,7 @@ export function SlosWelcomePage() {
 
   return hasSlosAndHasPermissions || isLoading ? null : (
     <ObservabilityPageTemplate data-test-subj="slosPageWelcomePrompt">
+      <HeaderMenu />
       <EuiPageTemplate.EmptyPrompt
         title={
           <EuiTitle size="l">