[Obs AI Assistant] Show Inspect button when no ML nodes are available (#220173)

This commit is contained in:
Viduni Wickramarachchi 2025-05-07 08:14:41 -04:00 committed by GitHub
parent 1d1d650769
commit 1971ff261c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 61 additions and 51 deletions

View file

@ -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;
};

View file

@ -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,
}: {

View file

@ -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) {