github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 17:59:23 -04:00
Code Issues Projects Releases Packages Wiki Activity

[8.x] [ai][assistant] Refactor Security solution properties to use new Assistant logo and beacon (#204286) (#205409)

Browse source 
# Backport

This will backport the following commits from `main` to `8.x`:
- [[ai][assistant] Refactor Security solution properties to use new
Assistant logo and beacon
(#204286)](https://github.com/elastic/kibana/pull/204286)

<!--- Backport version: 9.4.3 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Clint Andrew
Hall","email":"clint.hall@elastic.co"},"sourceCommit":{"committedDate":"2025-01-02T16:27:17Z","message":"[ai][assistant]
Refactor Security solution properties to use new Assistant logo and
beacon (#204286)\n\n> A follow-up to #203879 \r\n\r\n##
Summary\r\n\r\nThis PR integrates the new Assistant Icon, Beacon, and
Avatar into\r\nsolutions and packages owned by Security. In most cases
this was a 1:1\r\nreplacement, but in a few, Icon was replaced with
Beacon for\r\nconsistency, (e.g. welcome screens, upsells,
etc)\r\n\r\nNote: the scaling of the icon/avatar _before_ was one
different from\r\nEUI. The new components match EUI directly and
represent a 2x scale\r\nchange (e.g. 's' becomes 'l', 'm' becomes 'xl',
etc).\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"de0dc5282476c1983e90d0872fdd9909b6cdf984","branchLabelMapping":{"^v9.0.0$":"main","^v8.18.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["review","release_note:skip","v9.0.0","backport:prev-minor"],"title":"[ai][assistant]
Refactor Security solution properties to use new Assistant logo and
beacon","number":204286,"url":"https://github.com/elastic/kibana/pull/204286","mergeCommit":{"message":"[ai][assistant]
Refactor Security solution properties to use new Assistant logo and
beacon (#204286)\n\n> A follow-up to #203879 \r\n\r\n##
Summary\r\n\r\nThis PR integrates the new Assistant Icon, Beacon, and
Avatar into\r\nsolutions and packages owned by Security. In most cases
this was a 1:1\r\nreplacement, but in a few, Icon was replaced with
Beacon for\r\nconsistency, (e.g. welcome screens, upsells,
etc)\r\n\r\nNote: the scaling of the icon/avatar _before_ was one
different from\r\nEUI. The new components match EUI directly and
represent a 2x scale\r\nchange (e.g. 's' becomes 'l', 'm' becomes 'xl',
etc).\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"de0dc5282476c1983e90d0872fdd9909b6cdf984"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","branchLabelMappingKey":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/204286","number":204286,"mergeCommit":{"message":"[ai][assistant]
Refactor Security solution properties to use new Assistant logo and
beacon (#204286)\n\n> A follow-up to #203879 \r\n\r\n##
Summary\r\n\r\nThis PR integrates the new Assistant Icon, Beacon, and
Avatar into\r\nsolutions and packages owned by Security. In most cases
this was a 1:1\r\nreplacement, but in a few, Icon was replaced with
Beacon for\r\nconsistency, (e.g. welcome screens, upsells,
etc)\r\n\r\nNote: the scaling of the icon/avatar _before_ was one
different from\r\nEUI. The new components match EUI directly and
represent a 2x scale\r\nchange (e.g. 's' becomes 'l', 'm' becomes 'xl',
etc).\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"de0dc5282476c1983e90d0872fdd9909b6cdf984"}}]}]
BACKPORT-->

---------

Co-authored-by: Clint Andrew Hall <clint.hall@elastic.co>
This commit is contained in:
Kibana Machine 2025-01-03 05:22:41 +11:00 • committed by GitHub
parent 5481699fce
commit 83065da636
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
30 changed files with 71 additions and 94 deletions
Download patch file Download diff file Expand all files Collapse all files

5
x-pack/platform/packages/shared/ai-assistant/icon/__stories__/beacon.stories.tsx
View file

@ -19,6 +19,11 @@ export default {
options: ['original', 's', 'm', 'l', 'xl', 'xxl'],
defaultValue: 'xxl',
},
backgroundColor: {
control: 'select',
options: ['body', 'emptyShade', 'lightShade', 'darkShade'],
defaultValue: 'body',
},
},
} as ComponentMeta<typeof Component>;

22
x-pack/platform/packages/shared/ai-assistant/icon/avatar.styles.ts
View file

@ -1,22 +0,0 @@
/*
* 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 { useEuiTheme } from '@elastic/eui';
import { css } from '@emotion/react';
export const useStyles = () => {
const {
euiTheme: { border, size },
} = useEuiTheme();
const root = css`
border: ${border.thin};
padding: ${size.xs};
`;
return { root };
};

5
x-pack/platform/packages/shared/ai-assistant/icon/avatar.tsx
View file

@ -9,7 +9,6 @@ import React from 'react';
import { EuiAvatar, EuiAvatarProps } from '@elastic/eui';
import { AssistantIcon } from './icon';
import { useStyles } from './avatar.styles';
/**
* Avatar component for the AI Assistant.
@ -23,11 +22,9 @@ export type AssistantAvatarProps = Omit<
* A `EuiAvatar` component customized for the AI Assistant.
*/
export const AssistantAvatar = ({
css,
color = 'plain',
size = 'm',
...props
}: AssistantAvatarProps) => {
const { root } = useStyles();
return <EuiAvatar {...{ ...props, color, size }} css={[root, css]} iconType={AssistantIcon} />;
return <EuiAvatar {...{ ...props, color, size }} iconType={AssistantIcon} />;
};

2
x-pack/platform/packages/shared/kbn-ai-assistant/src/chat/welcome_message.tsx
View file

@ -80,7 +80,7 @@ export function WelcomeMessage({
className={fullHeightClassName}
>
<EuiFlexItem grow={false}>
<AssistantBeacon backgroundColor="ghost" size="xl" />
<AssistantBeacon backgroundColor="emptyShade" size="xl" />
</EuiFlexItem>
<EuiFlexItem grow className={centerMaxWidthClassName}>
<EuiSpacer size={['xl', 'l'].includes(breakpoint!) ? 'l' : 's'} />

4
x-pack/platform/packages/shared/kbn-elastic-assistant/impl/assistant/assistant_body/empty_convo.tsx
View file

@ -9,7 +9,7 @@ import React, { Dispatch, SetStateAction } from 'react';
import { EuiFlexGroup, EuiFlexItem, EuiPanel, EuiText } from '@elastic/eui';
import { css } from '@emotion/react';
import { PromptResponse } from '@kbn/elastic-assistant-common';
import { AssistantAnimatedIcon } from '../assistant_animated_icon';
import { AssistantBeacon } from '@kbn/ai-assistant-icon';
import { SystemPrompt } from '../prompt_editor/system_prompt';
import { SetupKnowledgeBaseButton } from '../../knowledge_base/setup_knowledge_base_button';
import * as i18n from '../translations';
@ -41,7 +41,7 @@ export const EmptyConvo: React.FC<Props> = ({
>
<EuiFlexGroup alignItems="center" justifyContent="center" direction="column">
<EuiFlexItem grow={false}>
<AssistantAnimatedIcon />
<AssistantBeacon backgroundColor="emptyShade" size="xl" />
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiText>

7
x-pack/platform/packages/shared/kbn-elastic-assistant/impl/assistant/assistant_body/index.tsx
View file

@ -18,7 +18,7 @@ import { HttpSetup } from '@kbn/core-http-browser';
import { euiThemeVars } from '@kbn/ui-theme';
import { css } from '@emotion/react';
import { PromptResponse } from '@kbn/elastic-assistant-common';
import { AssistantAnimatedIcon } from '../assistant_animated_icon';
import { AssistantBeacon } from '@kbn/ai-assistant-icon';
import { EmptyConvo } from './empty_convo';
import { WelcomeSetup } from './welcome_setup';
import { Conversation } from '../../..';
@ -102,7 +102,10 @@ export const AssistantBody: FunctionComponent<Props> = ({
<EuiFlexGroup direction="column" justifyContent="spaceBetween">
<EuiFlexItem grow={false}>
{isLoading ? (
<EuiEmptyPrompt data-test-subj="animatedLogo" icon={<AssistantAnimatedIcon />} />
<EuiEmptyPrompt
data-test-subj="animatedLogo"
icon={<AssistantBeacon backgroundColor="emptyShade" />}
/>
) : isWelcomeSetup ? (
<WelcomeSetup
currentConversation={currentConversation}

4
x-pack/platform/packages/shared/kbn-elastic-assistant/impl/assistant/assistant_body/welcome_setup.tsx
View file

@ -8,8 +8,8 @@
import React from 'react';
import { EuiFlexGroup, EuiFlexItem, EuiPanel, EuiText } from '@elastic/eui';
import { css } from '@emotion/react';
import { AssistantBeacon } from '@kbn/ai-assistant-icon';
import { Conversation } from '../../..';
import { AssistantAnimatedIcon } from '../assistant_animated_icon';
import { ConnectorSetup } from '../../connectorland/connector_setup';
import * as i18n from '../translations';
@ -38,7 +38,7 @@ export const WelcomeSetup: React.FC<Props> = ({
data-test-subj="welcome-setup"
>
<EuiFlexItem grow={false}>
<AssistantAnimatedIcon />
<AssistantBeacon backgroundColor="emptyShade" />
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiText>

4
x-pack/platform/packages/shared/kbn-elastic-assistant/impl/assistant/assistant_title/index.tsx
View file

@ -8,9 +8,9 @@
import React, { useCallback, useEffect, useState } from 'react';
import { EuiFlexGroup, EuiFlexItem, EuiInlineEditTitle } from '@elastic/eui';
import { css } from '@emotion/react';
import { AssistantIcon } from '@kbn/ai-assistant-icon';
import { DataStreamApis } from '../use_data_stream_apis';
import type { Conversation } from '../../..';
import { AssistantAvatar } from '../assistant_avatar/assistant_avatar';
import { useConversation } from '../use_conversation';
import { NEW_CHAT } from '../conversations/conversation_sidepanel/translations';
@ -51,7 +51,7 @@ export const AssistantTitle: React.FC<{
return (
<EuiFlexGroup gutterSize="m" alignItems="center">
<EuiFlexItem grow={false}>
<AssistantAvatar data-test-subj="titleIcon" size={'s'} />
<AssistantIcon data-test-subj="titleIcon" size="l" />
</EuiFlexItem>
<EuiFlexItem
css={css`

3
x-pack/platform/packages/shared/kbn-elastic-assistant/index.ts
View file

@ -71,9 +71,6 @@ export { useAssistantOverlay } from './impl/assistant/use_assistant_overlay';
/** a helper that enriches content returned from a query with action buttons */
export { analyzeMarkdown } from './impl/assistant/use_conversation/helpers';
/** Default Elastic AI Assistant logo, can be removed once included in EUI **/
export { AssistantAvatar } from './impl/assistant/assistant_avatar/assistant_avatar';
export { ConnectorSelectorInline } from './impl/connectorland/connector_selector_inline/connector_selector_inline';
export {

1
x-pack/platform/packages/shared/kbn-elastic-assistant/tsconfig.json
View file

@ -34,5 +34,6 @@
"@kbn/zod",
"@kbn/data-views-plugin",
"@kbn/user-profile-components",
"@kbn/ai-assistant-icon",
]
}

21
x-pack/platform/plugins/shared/integration_assistant/public/components/create_integration/create_integration_assistant/header/header.tsx
View file

@ -5,16 +5,9 @@
* 2.0.
*/
import {
EuiAvatar,
EuiFlexGroup,
EuiFlexItem,
EuiSpacer,
EuiText,
useEuiTheme,
} from '@elastic/eui';
import { EuiFlexGroup, EuiFlexItem, EuiSpacer, EuiText, useEuiTheme } from '@elastic/eui';
import { css } from '@emotion/react';
import { AssistantAvatar } from '@kbn/elastic-assistant';
import { AssistantAvatar } from '@kbn/ai-assistant-icon';
import { KibanaPageTemplate } from '@kbn/shared-ux-page-kibana-template';
import React from 'react';
import { useActions } from '../state';
@ -40,8 +33,8 @@ interface HeaderProps {
}
export const Header = React.memo<HeaderProps>(({ currentStep, isGenerating }) => {
const { setStep } = useActions();
const { euiTheme } = useEuiTheme();
const avatarCss = useAvatarCss();
return (
<KibanaPageTemplate.Header>
<EuiFlexGroup direction="column" alignItems="center">
@ -56,13 +49,7 @@ export const Header = React.memo<HeaderProps>(({ currentStep, isGenerating }) =>
justifyContent="center"
>
<EuiFlexItem grow={false}>
<EuiAvatar
name={i18n.ASSISTANT_AVATAR}
size="m"
iconType={AssistantAvatar}
color={euiTheme.colors.emptyShade}
css={avatarCss}
/>
<AssistantAvatar css={avatarCss} name={i18n.ASSISTANT_AVATAR} />
</EuiFlexItem>
<EuiFlexItem>
<EuiText>

4
x-pack/platform/plugins/shared/integration_assistant/public/components/create_integration/create_integration_landing/integration_assistant_card.tsx
View file

@ -15,7 +15,7 @@ import {
EuiTitle,
EuiBetaBadge,
} from '@elastic/eui';
import { AssistantAvatar } from '@kbn/elastic-assistant';
import { AssistantIcon } from '@kbn/ai-assistant-icon';
import { useAuthorization } from '../../../common/hooks/use_authorization';
import { MissingPrivilegesTooltip } from '../../../common/components/authorization';
import { useNavigate, Page } from '../../../common/hooks/use_navigate';
@ -28,7 +28,7 @@ export const IntegrationAssistantCard = React.memo(() => {
<EuiPanel hasBorder={true} paddingSize="l">
<EuiFlexGroup direction="row" gutterSize="l" alignItems="center" justifyContent="center">
<EuiFlexItem grow={false}>
<AssistantAvatar />
<AssistantIcon />
</EuiFlexItem>
<EuiFlexItem>
<EuiFlexGroup

1
x-pack/platform/plugins/shared/integration_assistant/tsconfig.json
View file

@ -44,5 +44,6 @@
"@kbn/utils",
"@kbn/zod",
"@kbn/tooling-log",
"@kbn/ai-assistant-icon"
]
}

5
x-pack/solutions/security/packages/ecs_data_quality_dashboard/impl/data_quality_panel/actions/chat/index.tsx
View file

@ -6,9 +6,10 @@
*/
import React, { FC, useCallback } from 'react';
import { AssistantAvatar, NewChat } from '@kbn/elastic-assistant';
import { NewChat } from '@kbn/elastic-assistant';
import styled from 'styled-components';
import { AssistantIcon } from '@kbn/ai-assistant-icon';
import {
DATA_QUALITY_DASHBOARD_CONVERSATION_ID,
DATA_QUALITY_PROMPT_CONTEXT_PILL,
@ -44,7 +45,7 @@ const ChatActionComponent: FC<Props> = ({ indexName, markdownComment }) => {
iconType={null}
>
<StyledLinkText>
<AssistantAvatar size="xs" />
<AssistantIcon />
{ASK_ASSISTANT}
</StyledLinkText>
</NewChat>

1
x-pack/solutions/security/packages/ecs_data_quality_dashboard/tsconfig.json
View file

@ -26,5 +26,6 @@
"@kbn/core",
"@kbn/core-notifications-browser",
"@kbn/core-notifications-browser-mocks",
"@kbn/ai-assistant-icon",
]
}

6
x-pack/solutions/security/packages/upselling/sections/attack_discovery/index.tsx
View file

@ -5,10 +5,10 @@
* 2.0.
*/
import { EuiEmptyPrompt, EuiFlexGroup, EuiFlexItem, EuiSpacer, EuiText } from '@elastic/eui';
import React, { useMemo } from 'react';
import { EuiEmptyPrompt, EuiFlexGroup, EuiFlexItem, EuiSpacer, EuiText } from '@elastic/eui';
import { AssistantBeacon } from '@kbn/ai-assistant-icon';
import { AssistantAvatar } from './assistant_avatar/assistant_avatar';
import * as i18n from './translations';
interface Props {
@ -30,7 +30,7 @@ const AttackDiscoveryUpsellingSectionComponent: React.FC<Props> = ({
() => (
<EuiFlexGroup alignItems="center" direction="column" gutterSize="none">
<EuiFlexItem data-test-subj="assistantAvatar" grow={false}>
<AssistantAvatar size="m" />
<AssistantBeacon backgroundColor="emptyShade" />
<EuiSpacer size="m" />
</EuiFlexItem>

1
x-pack/solutions/security/packages/upselling/tsconfig.json
View file

@ -20,6 +20,7 @@
"@kbn/i18n",
"@kbn/security-solution-navigation",
"@kbn/shared-ux-page-kibana-template",
"@kbn/ai-assistant-icon",
],
"exclude": [
"target/**/*"

8
x-pack/solutions/security/plugins/security_solution/public/assistant/get_comments/index.tsx
View file

@ -9,7 +9,7 @@ import type { ClientMessage, GetAssistantMessages } from '@kbn/elastic-assistant
import { EuiAvatar, EuiLoadingSpinner } from '@elastic/eui';
import React from 'react';
import { AssistantAvatar } from '@kbn/elastic-assistant';
import { AssistantAvatar } from '@kbn/ai-assistant-icon';
import type { Replacements } from '@kbn/elastic-assistant-common';
import { replaceAnonymizedValuesWithOriginalValues } from '@kbn/elastic-assistant-common';
import styled from '@emotion/styled';
@ -117,9 +117,7 @@ export const getComments: GetAssistantMessages = ({
? [
{
username: i18n.SYSTEM,
timelineAvatar: (
<EuiAvatar name="machine" size="l" color="subdued" iconType={AssistantAvatar} />
),
timelineAvatar: <AssistantAvatar name="machine" size="l" color="subdued" />,
timestamp:
currentConversation.messages[0].timestamp.length === 0
? new Date().toLocaleString()
@ -148,7 +146,7 @@ export const getComments: GetAssistantMessages = ({
timelineAvatar: isUser ? (
<UserAvatar />
) : (
<EuiAvatar name="machine" size="l" color="subdued" iconType={AssistantAvatar} />
<AssistantAvatar name="machine" size="l" color="subdued" />
),
timestamp: i18n.AT(
message.timestamp.length === 0

4
x-pack/solutions/security/plugins/security_solution/public/assistant/header_link.tsx
View file

@ -10,7 +10,7 @@ import React, { useCallback } from 'react';
import { i18n } from '@kbn/i18n';
import { useAssistantContext } from '@kbn/elastic-assistant/impl/assistant_context';
import { AssistantAvatar } from '@kbn/elastic-assistant';
import { AssistantIcon } from '@kbn/ai-assistant-icon';
const isMac = navigator.platform.toLowerCase().indexOf('mac') >= 0;
@ -45,7 +45,7 @@ export const AssistantHeaderLink = () => {
<EuiHeaderLink data-test-subj="assistantHeaderLink" color="primary" onClick={showOverlay}>
<EuiFlexGroup gutterSize="s" alignItems="center">
<EuiFlexItem grow={false}>
<AssistantAvatar size="xs" />
<AssistantIcon size="m" />
</EuiFlexItem>
<EuiFlexItem grow={false}>{LINK_LABEL}</EuiFlexItem>
</EuiFlexGroup>

6
x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/results/attack_discovery_panel/title/index.tsx
View file

@ -6,7 +6,6 @@
*/
import { EuiFlexGroup, EuiFlexItem, EuiSkeletonTitle, EuiTitle, useEuiTheme } from '@elastic/eui';
import { AssistantAvatar } from '@kbn/elastic-assistant';
import {
replaceAnonymizedValuesWithOriginalValues,
type Replacements,
@ -14,6 +13,7 @@ import {
import { css } from '@emotion/react';
import React, { useMemo } from 'react';
import { AssistantIcon } from '@kbn/ai-assistant-icon';
const AVATAR_SIZE = 24; // px
@ -55,11 +55,11 @@ const TitleComponent: React.FC<Props> = ({
data-test-subj="assistantAvatar"
grow={false}
>
<AssistantAvatar
<AssistantIcon
css={css`
transform: translate(5px, 5px);
`}
size="xxs"
size="s"
/>
</EuiFlexItem>

4
x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/results/attack_discovery_panel/view_in_ai_assistant/index.tsx
View file

@ -5,11 +5,11 @@
* 2.0.
*/
import { AssistantAvatar } from '@kbn/elastic-assistant';
import type { AttackDiscovery, Replacements } from '@kbn/elastic-assistant-common';
import { EuiButton, EuiButtonEmpty, EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
import React from 'react';
import { AssistantIcon } from '@kbn/ai-assistant-icon';
import * as i18n from './translations';
import { useViewInAiAssistant } from './use_view_in_ai_assistant';
@ -48,7 +48,7 @@ const ViewInAiAssistantComponent: React.FC<Props> = ({
>
<EuiFlexGroup alignItems="center" gutterSize="xs">
<EuiFlexItem data-test-subj="assistantAvatar" grow={false}>
<AssistantAvatar size="xs" />
<AssistantIcon size="m" />
</EuiFlexItem>
<EuiFlexItem data-test-subj="viewInAiAssistantLabel" grow={false}>
{i18n.VIEW_IN_AI_ASSISTANT}

4
x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/results/empty_states/empty_prompt/index.tsx
View file

@ -5,7 +5,6 @@
* 2.0.
*/
import { AssistantAvatar } from '@kbn/elastic-assistant';
import {
EuiEmptyPrompt,
EuiFlexGroup,
@ -19,6 +18,7 @@ import {
import { css } from '@emotion/react';
import React, { useMemo } from 'react';
import { AssistantBeacon } from '@kbn/ai-assistant-icon';
import { AnimatedCounter } from './animated_counter';
import { Generate } from '../generate';
import * as i18n from './translations';
@ -50,7 +50,7 @@ const EmptyPromptComponent: React.FC<Props> = ({
gutterSize="none"
>
<EuiFlexItem data-test-subj="emptyPromptAvatar" grow={false}>
<AssistantAvatar size="m" />
<AssistantBeacon size="xl" backgroundColor="emptyShade" />
<EuiSpacer size="m" />
</EuiFlexItem>

4
x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/results/empty_states/no_alerts/index.tsx
View file

@ -5,7 +5,6 @@
* 2.0.
*/
import { AssistantAvatar } from '@kbn/elastic-assistant';
import {
EuiEmptyPrompt,
EuiFlexGroup,
@ -16,6 +15,7 @@ import {
} from '@elastic/eui';
import React, { useMemo } from 'react';
import { AssistantIcon } from '@kbn/ai-assistant-icon';
import * as i18n from './translations';
import { Generate } from '../generate';
@ -35,7 +35,7 @@ const NoAlertsComponent: React.FC<Props> = ({ isDisabled, isLoading, onGenerate
gutterSize="none"
>
<EuiFlexItem data-test-subj="emptyPromptAvatar" grow={false}>
<AssistantAvatar size="m" />
<AssistantIcon size="xl" />
<EuiSpacer size="m" />
</EuiFlexItem>

4
x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/results/empty_states/welcome/index.tsx
View file

@ -5,11 +5,11 @@
* 2.0.
*/
import { AssistantAvatar } from '@kbn/elastic-assistant';
import { ConnectorSetup } from '@kbn/elastic-assistant/impl/connectorland/connector_setup';
import { EuiEmptyPrompt, EuiFlexGroup, EuiFlexItem, EuiSpacer, EuiText } from '@elastic/eui';
import React, { useMemo } from 'react';
import { AssistantIcon } from '@kbn/ai-assistant-icon';
import * as i18n from './translations';
const WelcomeComponent: React.FC = () => {
@ -22,7 +22,7 @@ const WelcomeComponent: React.FC = () => {
gutterSize="none"
>
<EuiFlexItem data-test-subj="emptyPromptAvatar" grow={false}>
<AssistantAvatar size="m" />
<AssistantIcon size="xl" />
<EuiSpacer size="m" />
</EuiFlexItem>

12
x-pack/solutions/security/plugins/security_solution/public/detection_engine/rule_creation_ui/components/ai_assistant/index.tsx
View file

@ -9,8 +9,10 @@ import React, { useCallback } from 'react';
import { EuiSpacer } from '@elastic/eui';
import { FormattedMessage } from '@kbn/i18n-react';
import { NewChat, AssistantAvatar } from '@kbn/elastic-assistant';
import { NewChat } from '@kbn/elastic-assistant';
import { AssistantIcon } from '@kbn/ai-assistant-icon';
import { css } from '@emotion/react';
import { METRIC_TYPE, TELEMETRY_EVENT, track } from '../../../../common/lib/telemetry';
import { useAssistantAvailability } from '../../../../assistant/use_assistant_availability';
import * as i18nAssistant from '../../../../detections/pages/detection_engine/translations';
@ -116,7 +118,13 @@ Proposed solution should be valid and must not contain new line symbols (\\n)`;
isAssistantEnabled={isAssistantEnabled}
onExportCodeBlock={handleOnExportCodeBlock}
>
<AssistantAvatar size="xxs" /> {i18n.ASK_ASSISTANT_ERROR_BUTTON}
<AssistantIcon
size="s"
css={css`
vertical-align: inherit;
`}
/>{' '}
{i18n.ASK_ASSISTANT_ERROR_BUTTON}
</NewChat>
),
}}

4
x-pack/solutions/security/plugins/security_solution/public/management/pages/endpoint_hosts/view/details/components/insights/workflow_insights_scan.tsx
View file

@ -8,7 +8,6 @@
import React, { useCallback, useMemo } from 'react';
import { EuiButton, EuiFlexGroup, EuiFlexItem, EuiPanel, EuiText } from '@elastic/eui';
import {
AssistantAvatar,
DEFEND_INSIGHTS_STORAGE_KEY,
ConnectorSelectorInline,
DEFAULT_ASSISTANT_NAMESPACE,
@ -17,6 +16,7 @@ import {
import { noop } from 'lodash/fp';
import useLocalStorage from 'react-use/lib/useLocalStorage';
import { some } from 'lodash';
import { AssistantBeacon } from '@kbn/ai-assistant-icon';
import { useSpaceId } from '../../../../../../../common/hooks/use_space_id';
import { WORKFLOW_INSIGHTS } from '../../../translations';
import { useKibana } from '../../../../../../../common/lib/kibana';
@ -106,7 +106,7 @@ export const WorkflowInsightsScanSection = ({
<EuiFlexItem grow={false}>
<EuiFlexGroup alignItems="center" gutterSize="s">
<EuiFlexItem grow={false}>
<AssistantAvatar size={'xs'} />
<AssistantBeacon />
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiText size="s">

4
x-pack/solutions/security/plugins/security_solution/public/onboarding/components/onboarding_body/cards/assistant/index.ts
View file

@ -6,7 +6,7 @@
*/
import React from 'react';
import { AssistantAvatar } from '@kbn/elastic-assistant';
import { AssistantIcon } from '@kbn/ai-assistant-icon';
import type { OnboardingCardConfig } from '../../../../types';
import { OnboardingCardId } from '../../../../constants';
import { ASSISTANT_CARD_TITLE } from './translations';
@ -16,7 +16,7 @@ import type { AssistantCardMetadata } from './types';
export const assistantCardConfig: OnboardingCardConfig<AssistantCardMetadata> = {
id: OnboardingCardId.assistant,
title: ASSISTANT_CARD_TITLE,
icon: AssistantAvatar,
icon: AssistantIcon,
Component: React.lazy(
() =>
import(

4
x-pack/solutions/security/plugins/security_solution/public/onboarding/components/onboarding_body/cards/siem_migrations/ai_connector/index.ts
View file

@ -6,7 +6,7 @@
*/
import React from 'react';
import { AssistantAvatar } from '@kbn/elastic-assistant/impl/assistant/assistant_avatar/assistant_avatar';
import { AssistantIcon } from '@kbn/ai-assistant-icon';
import type { OnboardingCardConfig } from '../../../../../types';
import { OnboardingCardId } from '../../../../../constants';
import { AI_CONNECTOR_CARD_TITLE } from './translations';
@ -16,7 +16,7 @@ import type { AIConnectorCardMetadata } from './types';
export const aiConnectorCardConfig: OnboardingCardConfig<AIConnectorCardMetadata> = {
id: OnboardingCardId.siemMigrationsAiConnectors,
title: AI_CONNECTOR_CARD_TITLE,
icon: AssistantAvatar,
icon: AssistantIcon,
Component: React.lazy(
() =>
import(

8
x-pack/solutions/security/plugins/security_solution/public/siem_migrations/rules/components/rule_details_flyout/tabs/summary/index.tsx
View file

@ -7,9 +7,9 @@
import React, { useMemo } from 'react';
import type { EuiCommentProps } from '@elastic/eui';
import { EuiAvatar, EuiCommentList, EuiMarkdownFormat, EuiSpacer } from '@elastic/eui';
import { EuiCommentList, EuiMarkdownFormat, EuiSpacer } from '@elastic/eui';
import moment from 'moment';
import { AssistantAvatar } from '@kbn/elastic-assistant';
import { AssistantAvatar } from '@kbn/ai-assistant-icon';
import {
RuleMigrationStatusEnum,
type RuleMigration,
@ -31,9 +31,7 @@ export const SummaryTab: React.FC<SummaryTabProps> = React.memo(({ ruleMigration
return {
username: i18n.ASSISTANT_USERNAME,
timelineAvatarAriaLabel: i18n.ASSISTANT_USERNAME,
timelineAvatar: (
<EuiAvatar name="machine" size="l" color="subdued" iconType={AssistantAvatar} />
),
timelineAvatar: <AssistantAvatar name="machine" size="l" color="subdued" />,
event:
ruleMigration.status === RuleMigrationStatusEnum.failed
? i18n.COMMENT_EVENT_FAILED

3
x-pack/solutions/security/plugins/security_solution/tsconfig.json
View file

@ -230,6 +230,7 @@
"@kbn/react-hooks",
"@kbn/index-adapter",
"@kbn/core-http-server-utils",
"@kbn/llm-tasks-plugin"
"@kbn/llm-tasks-plugin",
"@kbn/ai-assistant-icon"
]
}