From 1971ff261c9d2b48d29a2a5414d935d788c801cd Mon Sep 17 00:00:00 2001
From: Viduni Wickramarachchi <viduni.wickramarachchi@elastic.co>
Date: Wed, 7 May 2025 08:14:41 -0400
Subject: [PATCH] [Obs AI Assistant] Show Inspect button when no ML nodes are
 available (#220173)

---
 .../inspect_knowlegde_base_popover.tsx        | 51 ++++++++++++++++++
 ...owledge_base_installation_status_panel.tsx | 53 ++-----------------
 .../welcome_message_knowledge_base.tsx        |  8 ++-
 3 files changed, 61 insertions(+), 51 deletions(-)
 create mode 100644 x-pack/platform/packages/shared/kbn-ai-assistant/src/knowledge_base/inspect_knowlegde_base_popover.tsx

diff --git a/x-pack/platform/packages/shared/kbn-ai-assistant/src/knowledge_base/inspect_knowlegde_base_popover.tsx b/x-pack/platform/packages/shared/kbn-ai-assistant/src/knowledge_base/inspect_knowlegde_base_popover.tsx
new file mode 100644
index 000000000000..1a0bdd3306a9
--- /dev/null
+++ b/x-pack/platform/packages/shared/kbn-ai-assistant/src/knowledge_base/inspect_knowlegde_base_popover.tsx
@@ -0,0 +1,51 @@
+/*
+ * 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 React, { useState } from 'react';
+import { EuiButtonEmpty, EuiFlexItem, EuiPopover } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+import { WelcomeMessageKnowledgeBaseSetupErrorPanel } from './welcome_message_knowledge_base_setup_error_panel';
+import { UseKnowledgeBaseResult } from '../hooks';
+
+export const InspectKnowledgeBasePopover = ({
+  knowledgeBase,
+}: {
+  knowledgeBase: UseKnowledgeBaseResult;
+}) => {
+  const [isPopoverOpen, setIsPopoverOpen] = useState(false);
+
+  const handleInstall = async (inferenceId: string) => {
+    setIsPopoverOpen(false);
+    await knowledgeBase.install(inferenceId);
+  };
+
+  return knowledgeBase.status.value?.modelStats ? (
+    <EuiFlexItem grow={false}>
+      <EuiPopover
+        button={
+          <EuiButtonEmpty
+            data-test-subj="observabilityAiAssistantWelcomeMessageInspectErrorsButton"
+            iconType="inspect"
+            onClick={() => setIsPopoverOpen(!isPopoverOpen)}
+          >
+            {i18n.translate('xpack.aiAssistant.welcomeMessage.inspectErrorsButtonEmptyLabel', {
+              defaultMessage: 'Inspect',
+            })}
+          </EuiButtonEmpty>
+        }
+        isOpen={isPopoverOpen}
+        panelPaddingSize="none"
+        closePopover={() => setIsPopoverOpen(false)}
+      >
+        <WelcomeMessageKnowledgeBaseSetupErrorPanel
+          knowledgeBase={knowledgeBase}
+          onRetryInstall={handleInstall}
+        />
+      </EuiPopover>
+    </EuiFlexItem>
+  ) : null;
+};
diff --git a/x-pack/platform/packages/shared/kbn-ai-assistant/src/knowledge_base/knowledge_base_installation_status_panel.tsx b/x-pack/platform/packages/shared/kbn-ai-assistant/src/knowledge_base/knowledge_base_installation_status_panel.tsx
index b7cd81960090..cfb68bf34e65 100644
--- a/x-pack/platform/packages/shared/kbn-ai-assistant/src/knowledge_base/knowledge_base_installation_status_panel.tsx
+++ b/x-pack/platform/packages/shared/kbn-ai-assistant/src/knowledge_base/knowledge_base_installation_status_panel.tsx
@@ -5,22 +5,14 @@
  * 2.0.
  */
 
-import React, { useState } from 'react';
-import {
-  EuiButton,
-  EuiButtonEmpty,
-  EuiFlexGroup,
-  EuiFlexItem,
-  EuiPopover,
-  EuiSpacer,
-  EuiText,
-} from '@elastic/eui';
+import React from 'react';
+import { EuiButton, EuiFlexGroup, EuiFlexItem, EuiSpacer, EuiText } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import { KnowledgeBaseState } from '@kbn/observability-ai-assistant-plugin/public';
 import { UseKnowledgeBaseResult } from '../hooks';
-import { WelcomeMessageKnowledgeBaseSetupErrorPanel } from './welcome_message_knowledge_base_setup_error_panel';
 import { SelectModelAndInstallKnowledgeBase } from './select_model_and_install_knowledge_base';
 import { SettingUpKnowledgeBase } from './setting_up_knowledge_base';
+import { InspectKnowledgeBasePopover } from './inspect_knowlegde_base_popover';
 
 const WarmUpModel = ({
   knowledgeBase,
@@ -81,45 +73,6 @@ const WarmUpModel = ({
   );
 };
 
-const InspectKnowledgeBasePopover = ({
-  knowledgeBase,
-}: {
-  knowledgeBase: UseKnowledgeBaseResult;
-}) => {
-  const [isPopoverOpen, setIsPopoverOpen] = useState(false);
-
-  const handleInstall = async (inferenceId: string) => {
-    setIsPopoverOpen(false);
-    await knowledgeBase.install(inferenceId);
-  };
-
-  return knowledgeBase.status.value?.modelStats ? (
-    <EuiFlexItem grow={false}>
-      <EuiPopover
-        button={
-          <EuiButtonEmpty
-            data-test-subj="observabilityAiAssistantWelcomeMessageInspectErrorsButton"
-            iconType="inspect"
-            onClick={() => setIsPopoverOpen(!isPopoverOpen)}
-          >
-            {i18n.translate('xpack.aiAssistant.welcomeMessage.inspectErrorsButtonEmptyLabel', {
-              defaultMessage: 'Inspect',
-            })}
-          </EuiButtonEmpty>
-        }
-        isOpen={isPopoverOpen}
-        panelPaddingSize="none"
-        closePopover={() => setIsPopoverOpen(false)}
-      >
-        <WelcomeMessageKnowledgeBaseSetupErrorPanel
-          knowledgeBase={knowledgeBase}
-          onRetryInstall={handleInstall}
-        />
-      </EuiPopover>
-    </EuiFlexItem>
-  ) : null;
-};
-
 export const KnowledgeBaseInstallationStatusPanel = ({
   knowledgeBase,
 }: {
diff --git a/x-pack/platform/packages/shared/kbn-ai-assistant/src/knowledge_base/welcome_message_knowledge_base.tsx b/x-pack/platform/packages/shared/kbn-ai-assistant/src/knowledge_base/welcome_message_knowledge_base.tsx
index 909856196437..7471b2604732 100644
--- a/x-pack/platform/packages/shared/kbn-ai-assistant/src/knowledge_base/welcome_message_knowledge_base.tsx
+++ b/x-pack/platform/packages/shared/kbn-ai-assistant/src/knowledge_base/welcome_message_knowledge_base.tsx
@@ -13,6 +13,7 @@ import usePrevious from 'react-use/lib/usePrevious';
 import { UseKnowledgeBaseResult } from '../hooks';
 import { KnowledgeBaseInstallationStatusPanel } from './knowledge_base_installation_status_panel';
 import { SettingUpKnowledgeBase } from './setting_up_knowledge_base';
+import { InspectKnowledgeBasePopover } from './inspect_knowlegde_base_popover';
 
 export function WelcomeMessageKnowledgeBase({
   knowledgeBase,
@@ -29,7 +30,12 @@ export function WelcomeMessageKnowledgeBase({
   }, [knowledgeBase.isInstalling, prevIsInstalling]);
 
   if (knowledgeBase.isInstalling) {
-    return <SettingUpKnowledgeBase />;
+    return (
+      <>
+        <SettingUpKnowledgeBase />
+        <InspectKnowledgeBasePopover knowledgeBase={knowledgeBase} />
+      </>
+    );
   }
 
   if (knowledgeBase.status.value?.kbState === KnowledgeBaseState.READY) {