[ai][assistant] Refactor o11y to use new Assistant logo and beacon (#…

…204289) (cherry picked from commit 8f70a2d)
elastic · Dec 18, 2024 · 846cdaf · 846cdaf
1 parent 7bcc2ae
commit 846cdaf
Show file tree

Hide file tree

Showing 6 changed files with 12 additions and 44 deletions.
diff --git a/...bility_solution/observability_ai_assistant/public/components/assistant_avatar.stories.tsx b/...bility_solution/observability_ai_assistant/public/components/assistant_avatar.stories.tsx
diff --git a/...ervability_solution/observability_ai_assistant/public/components/insight/insight_base.tsx b/...ervability_solution/observability_ai_assistant/public/components/insight/insight_base.tsx
@@ -21,7 +21,7 @@ import {
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import React, { useState } from 'react';
-import { AssistantAvatar } from '../assistant_avatar';
+import { AssistantIcon } from '@kbn/ai-assistant-icon';
 
 export interface InsightBaseProps {
   title: string;
@@ -66,7 +66,7 @@ export function InsightBase({
           <EuiFlexGroup wrap responsive={false} gutterSize="m" data-test-subj={dataTestSubj}>
             <EuiFlexItem grow={false}>
               <EuiSpacer size="xs" />
-              <AssistantAvatar size="xs" />
+              <AssistantIcon size="m" />
             </EuiFlexItem>
             <EuiFlexItem>
               <EuiFlexGroup gutterSize="s" alignItems="center">

diff --git a/...k/platform/plugins/shared/observability_solution/observability_ai_assistant/tsconfig.json b/...k/platform/plugins/shared/observability_solution/observability_ai_assistant/tsconfig.json
@@ -49,7 +49,8 @@
     "@kbn/inference-plugin",
     "@kbn/core-lifecycle-server",
     "@kbn/server-route-repository-utils",
-    "@kbn/inference-plugin"
+    "@kbn/inference-plugin",
+    "@kbn/ai-assistant-icon"
   ],
   "exclude": ["target/**/*"]
 }
diff --git a/...ervability/plugins/observability_ai_assistant_app/public/components/nav_control/index.tsx b/...ervability/plugins/observability_ai_assistant_app/public/components/nav_control/index.tsx
@@ -5,14 +5,15 @@
  * 2.0.
  */
 import React, { useEffect, useRef, useState } from 'react';
-import { AssistantAvatar, useAbortableAsync } from '@kbn/observability-ai-assistant-plugin/public';
+import { useAbortableAsync } from '@kbn/observability-ai-assistant-plugin/public';
 import { EuiButton, EuiButtonEmpty, EuiLoadingSpinner, EuiToolTip } from '@elastic/eui';
 import { css } from '@emotion/react';
 import { v4 } from 'uuid';
 import useObservable from 'react-use/lib/useObservable';
 import { i18n } from '@kbn/i18n';
 import { CoreStart } from '@kbn/core-lifecycle-browser';
 import { AIAssistantAppService, useAIAssistantAppService, ChatFlyout } from '@kbn/ai-assistant';
+import { AssistantIcon } from '@kbn/ai-assistant-icon';
 import { useKibana } from '../../hooks/use_kibana';
 import { useTheme } from '../../hooks/use_theme';
 import { useNavControlScreenContext } from '../../hooks/use_nav_control_screen_context';
@@ -157,7 +158,7 @@ export function NavControl({ isServerless }: { isServerless?: boolean }) {
             color="primary"
             size="s"
           >
-            {chatService.loading ? <EuiLoadingSpinner size="s" /> : <AssistantAvatar size="xs" />}
+            {chatService.loading ? <EuiLoadingSpinner size="s" /> : <AssistantIcon size="m" />}
           </EuiButtonEmpty>
         ) : (
           <EuiButton
@@ -174,7 +175,7 @@ export function NavControl({ isServerless }: { isServerless?: boolean }) {
             fullWidth={false}
             minWidth={0}
           >
-            {chatService.loading ? <EuiLoadingSpinner size="s" /> : <AssistantAvatar size="xs" />}
+            {chatService.loading ? <EuiLoadingSpinner size="s" /> : <AssistantIcon size="m" />}
           </EuiButton>
         )}
       </EuiToolTip>

diff --git a/...servability/plugins/observability_ai_assistant_app/public/rule_connector/ai_assistant.tsx b/...servability/plugins/observability_ai_assistant_app/public/rule_connector/ai_assistant.tsx
@@ -10,10 +10,8 @@ import type {
   ActionTypeModel as ConnectorTypeModel,
   GenericValidationResult,
 } from '@kbn/triggers-actions-ui-plugin/public/types';
-import {
-  AssistantAvatar,
-  ObservabilityAIAssistantService,
-} from '@kbn/observability-ai-assistant-plugin/public';
+import { ObservabilityAIAssistantService } from '@kbn/observability-ai-assistant-plugin/public';
+import { AssistantIcon } from '@kbn/ai-assistant-icon';
 import { OBSERVABILITY_AI_ASSISTANT_CONNECTOR_ID } from '../../common/rule_connector';
 import { ObsAIAssistantActionParams } from './types';
 import {
@@ -29,7 +27,7 @@ export function getConnectorType(
   return {
     id: OBSERVABILITY_AI_ASSISTANT_CONNECTOR_ID,
     modalWidth: 675,
-    iconClass: () => <AssistantAvatar />,
+    iconClass: () => <AssistantIcon />,
     isSystemActionType: true,
     isExperimental: true,
     selectMessage: CONNECTOR_DESC,

diff --git a/x-pack/solutions/observability/plugins/observability_ai_assistant_app/tsconfig.json b/x-pack/solutions/observability/plugins/observability_ai_assistant_app/tsconfig.json
@@ -80,6 +80,7 @@
     "@kbn/observability-ai-common",
     "@kbn/llm-tasks-plugin",
     "@kbn/product-doc-common",
+    "@kbn/ai-assistant-icon",
   ],
   "exclude": [
     "target/**/*"