[Security Assistant] Clean up AI settings tabs (#187705)

## Summary Code clean up for my previous PR: 1. #184678 (comment) - Remove additional props. 2. Add `Created on` column for quick prompt and system prompt table 3. Wording change: #184678 (comment) - Rename column title. **Landing page:** <img width="1282" alt="Screenshot 2024-07-09 at 19 07 34" src="https://github.com/elastic/kibana/assets/6295984/20366ee7-497f-412c-9690-953af9f6992b"> **Knowledge base:** <img width="2552" alt="Screenshot 2024-07-15 at 15 32 40" src="https://github.com/user-attachments/assets/1d651042-b187-4c08-b55d-c58c1104fd1b"> **Evaluation:** <img width="2560" alt="Screenshot 2024-07-15 at 15 34 04" src="https://github.com/user-attachments/assets/31855fe6-e5dd-462d-9c06-2fee2554361a"> <img width="2556" alt="Screenshot 2024-07-09 at 19 38 06" src="https://github.com/elastic/kibana/assets/6295984/15be4f36-261b-4652-8d4f-be8e7d14676a"> **Anonymization:** <img width="2551" alt="Screenshot 2024-07-15 at 15 32 33" src="https://github.com/user-attachments/assets/27688bb5-851e-46fc-8f75-9700ce7a248a"> **Quick prompts:** <img width="2559" alt="Screenshot 2024-07-15 at 15 30 30" src="https://github.com/user-attachments/assets/e00c39a0-fb12-46f1-bb2a-bdf5c5bd49d2"> <img width="2557" alt="Screenshot 2024-07-09 at 19 27 18" src="https://github.com/elastic/kibana/assets/6295984/b581fc46-003b-4363-9c16-22534eb1d71e"> **System prompts:** <img width="2557" alt="Screenshot 2024-07-15 at 15 30 11" src="https://github.com/user-attachments/assets/95fd4fca-5041-40b7-b500-efc192166be0"> <img width="2558" alt="Screenshot 2024-07-09 at 19 10 36" src="https://github.com/elastic/kibana/assets/6295984/a701391a-978f-4684-a2ea-f72a5f572217"> **Conversations:** <img width="2553" alt="Screenshot 2024-07-15 at 15 30 01" src="https://github.com/user-attachments/assets/3411beb8-4775-4ba7-8b3e-c4111497eed2"> <img width="2554" alt="Screenshot 2024-07-09 at 21 33 37" src="https://github.com/elastic/kibana/assets/6295984/fbe2ee80-ba20-41b6-b224-3e317dc1c20e"> Connectors: <img width="2558" alt="Screenshot 2024-07-09 at 19 09 15" src="https://github.com/elastic/kibana/assets/6295984/c711ce09-65c0-45b3-90c1-a9019d35093c"> [Design](https://www.figma.com/design/BMvpY9EhcPIaoOS7LSrkL0/[8.15]-GenAI-Security-Assistant-Settings%3A-Stack-Management-Pages?node-id=51-25207&t=JHlgCm0sCYsl8WCM-0) ### Checklist Delete any items that are not applicable to this PR. - [x] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios
elastic · Jul 17, 2024 · 60ba001 · 60ba001
1 parent 7e67c48
commit 60ba001
Show file tree

Hide file tree

Showing 55 changed files with 1,611 additions and 1,181 deletions.
diff --git a/...i_assistant_management/selection/public/routes/components/ai_assistant_selection_page.tsx b/...i_assistant_management/selection/public/routes/components/ai_assistant_selection_page.tsx
@@ -20,6 +20,7 @@ import {
   EuiText,
   EuiTitle,
 } from '@elastic/eui';
+import { FormattedMessage } from '@kbn/i18n-react';
 import { useAppContext } from '../../app_context';
 
 export function AiAssistantSelectionPage() {
@@ -86,21 +87,25 @@ export function AiAssistantSelectionPage() {
                   </>
                 ) : null}
                 <p>
-                  {i18n.translate(
-                    'aiAssistantManagementSelection.aiAssistantSelectionPage.obsAssistant.documentationLinkDescription',
-                    { defaultMessage: 'For more info, see our' }
-                  )}{' '}
-                  <EuiLink
-                    data-test-subj="pluginsAiAssistantSelectionPageDocumentationLink"
-                    external
-                    target="_blank"
-                    href="https://www.elastic.co/guide/en/observability/current/obs-ai-assistant.html"
-                  >
-                    {i18n.translate(
-                      'aiAssistantManagementSelection.aiAssistantSelectionPage.obsAssistant.documentationLinkLabel',
-                      { defaultMessage: 'documentation' }
-                    )}
-                  </EuiLink>
+                  <FormattedMessage
+                    id="aiAssistantManagementSelection.aiAssistantSelectionPage.obsAssistant.documentationLinkDescription"
+                    defaultMessage="For more info, see our {documentation}."
+                    values={{
+                      documentation: (
+                        <EuiLink
+                          data-test-subj="pluginsAiAssistantSelectionPageDocumentationLink"
+                          external
+                          target="_blank"
+                          href="https://www.elastic.co/guide/en/observability/current/obs-ai-assistant.html"
+                        >
+                          {i18n.translate(
+                            'aiAssistantManagementSelection.aiAssistantSelectionPage.obsAssistant.documentationLinkLabel',
+                            { defaultMessage: 'documentation' }
+                          )}
+                        </EuiLink>
+                      ),
+                    }}
+                  />
                 </p>
                 <EuiButton
                   iconType="gear"
@@ -151,21 +156,25 @@ export function AiAssistantSelectionPage() {
                   </>
                 ) : null}
                 <p>
-                  {i18n.translate(
-                    'aiAssistantManagementSelection.aiAssistantSelectionPage.securityAssistant.documentationLinkDescription',
-                    { defaultMessage: 'For more info, see our' }
-                  )}{' '}
-                  <EuiLink
-                    data-test-subj="securityAiAssistantSelectionPageDocumentationLink"
-                    external
-                    target="_blank"
-                    href="https://www.elastic.co/guide/en/security/current/security-assistant.html"
-                  >
-                    {i18n.translate(
-                      'aiAssistantManagementSelection.aiAssistantSettingsPage.securityAssistant.documentationLinkLabel',
-                      { defaultMessage: 'documentation' }
-                    )}
-                  </EuiLink>
+                  <FormattedMessage
+                    id="aiAssistantManagementSelection.aiAssistantSelectionPage.securityAssistant.documentationLinkDescription"
+                    defaultMessage="For more info, see our {documentation}."
+                    values={{
+                      documentation: (
+                        <EuiLink
+                          data-test-subj="securityAiAssistantSelectionPageDocumentationLink"
+                          external
+                          target="_blank"
+                          href="https://www.elastic.co/guide/en/security/current/security-assistant.html"
+                        >
+                          {i18n.translate(
+                            'aiAssistantManagementSelection.aiAssistantSettingsPage.securityAssistant.documentationLinkLabel',
+                            { defaultMessage: 'documentation' }
+                          )}
+                        </EuiLink>
+                      ),
+                    }}
+                  />
                 </p>
                 <EuiButton
                   data-test-subj="pluginsAiAssistantSelectionPageButton"

diff --git a/...n-elastic-assistant/impl/assistant/api/conversations/bulk_update_actions_conversations.ts b/...n-elastic-assistant/impl/assistant/api/conversations/bulk_update_actions_conversations.ts
@@ -139,7 +139,13 @@ export const bulkUpdateConversations = async (
     toasts?.addError(error.body && error.body.message ? new Error(error.body.message) : error, {
       title: i18n.translate('xpack.elasticAssistant.conversations.bulkActionsConversationsError', {
         defaultMessage: 'Error updating conversations {error}',
-        values: { error },
+        values: {
+          error: error.message
+            ? Array.isArray(error.message)
+              ? error.message.join(',')
+              : error.message
+            : error,
+        },
       }),
     });
   }

diff --git a/x-pack/packages/kbn-elastic-assistant/impl/assistant/api/prompts/bulk_update_prompts.ts b/x-pack/packages/kbn-elastic-assistant/impl/assistant/api/prompts/bulk_update_prompts.ts
@@ -47,7 +47,13 @@ export const bulkUpdatePrompts = async (
     toasts?.addError(error.body && error.body.message ? new Error(error.body.message) : error, {
       title: i18n.translate('xpack.elasticAssistant.prompts.bulkActionspromptsError', {
         defaultMessage: 'Error updating prompts {error}',
-        values: { error },
+        values: {
+          error: error.message
+            ? Array.isArray(error.message)
+              ? error.message.join(',')
+              : error.message
+            : error,
+        },
       }),
     });
   }

diff --git a/x-pack/packages/kbn-elastic-assistant/impl/assistant/chat_send/use_chat_send.tsx b/x-pack/packages/kbn-elastic-assistant/impl/assistant/chat_send/use_chat_send.tsx
@@ -16,7 +16,7 @@ import { useConversation } from '../use_conversation';
 import { getCombinedMessage } from '../prompt/helpers';
 import { Conversation, useAssistantContext } from '../../..';
 import { getMessageFromRawResponse } from '../helpers';
-import { getDefaultSystemPrompt } from '../use_conversation/helpers';
+import { getDefaultSystemPrompt, getDefaultNewSystemPrompt } from '../use_conversation/helpers';
 
 export interface UseChatSendProps {
   allSystemPrompts: PromptResponse[];
@@ -204,10 +204,11 @@ export const useChatSend = ({
   }, [currentConversation, http, removeLastMessage, sendMessage, setCurrentConversation, toasts]);
 
   const handleOnChatCleared = useCallback(async () => {
-    const defaultSystemPromptId = getDefaultSystemPrompt({
-      allSystemPrompts,
-      conversation: currentConversation,
-    })?.id;
+    const defaultSystemPromptId =
+      getDefaultSystemPrompt({
+        allSystemPrompts,
+        conversation: currentConversation,
+      })?.id ?? getDefaultNewSystemPrompt(allSystemPrompts)?.id;
 
     setUserPrompt('');
     setSelectedPromptContexts({});

diff --git a/...assistant/impl/assistant/common/components/assistant_settings_management/flyout/index.tsx b/...assistant/impl/assistant/common/components/assistant_settings_management/flyout/index.tsx
@@ -27,6 +27,7 @@ interface Props {
   onClose: () => void;
   onSaveCancelled: () => void;
   onSaveConfirmed: () => void;
+  saveButtonDisabled?: boolean;
 }
 
 const FlyoutComponent: React.FC<Props> = ({
@@ -36,6 +37,7 @@ const FlyoutComponent: React.FC<Props> = ({
   onClose,
   onSaveCancelled,
   onSaveConfirmed,
+  saveButtonDisabled = false,
 }) => {
   return flyoutVisible ? (
     <EuiFlyout
@@ -71,6 +73,7 @@ const FlyoutComponent: React.FC<Props> = ({
               data-test-subj="save-button"
               onClick={onSaveConfirmed}
               iconType="check"
+              disabled={saveButtonDisabled}
               fill
             >
               {i18n.FLYOUT_SAVE_BUTTON_TITLE}

diff --git a/...t/impl/assistant/common/components/assistant_settings_management/inline_actions/index.tsx b/...t/impl/assistant/common/components/assistant_settings_management/inline_actions/index.tsx
@@ -0,0 +1,60 @@
+/*
+ * 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 { EuiTableActionsColumnType } from '@elastic/eui';
+import { useCallback } from 'react';
+import * as i18n from './translations';
+
+interface Props<T> {
+  disabled?: boolean;
+  onDelete?: (rowItem: T) => void;
+  onEdit?: (rowItem: T) => void;
+}
+
+export const useInlineActions = <T extends { isDefault?: boolean | undefined }>() => {
+  const getInlineActions = useCallback(({ disabled = false, onDelete, onEdit }: Props<T>) => {
+    const handleEdit = (rowItem: T) => {
+      onEdit?.(rowItem);
+    };
+
+    const handleDelete = (rowItem: T) => {
+      onDelete?.(rowItem);
+    };
+
+    const actions: EuiTableActionsColumnType<T> = {
+      name: i18n.ACTIONS_BUTTON,
+      actions: [
+        {
+          name: i18n.EDIT_BUTTON,
+          description: i18n.EDIT_BUTTON,
+          icon: 'pencil',
+          type: 'icon',
+          onClick: (rowItem: T) => {
+            handleEdit(rowItem);
+          },
+          enabled: () => !disabled,
+          available: () => onEdit != null,
+        },
+        {
+          name: i18n.DELETE_BUTTON,
+          description: i18n.DELETE_BUTTON,
+          icon: 'trash',
+          type: 'icon',
+          onClick: (rowItem: T) => {
+            handleDelete(rowItem);
+          },
+          enabled: ({ isDefault }: { isDefault?: boolean }) => !isDefault && !disabled,
+          available: () => onDelete != null,
+          color: 'danger',
+        },
+      ],
+    };
+    return actions;
+  }, []);
+
+  return getInlineActions;
+};
diff --git a/...gs_management/row_actions/translations.ts → ...management/inline_actions/translations.ts b/...gs_management/row_actions/translations.ts → ...management/inline_actions/translations.ts
@@ -20,3 +20,10 @@ export const DELETE_BUTTON = i18n.translate(
     defaultMessage: 'Delete',
   }
 );
+
+export const ACTIONS_BUTTON = i18n.translate(
+  'xpack.elasticAssistant.assistant.settings.actionsButtonTitle',
+  {
+    defaultMessage: 'Actions',
+  }
+);
diff --git a/...tant/impl/assistant/common/components/assistant_settings_management/row_actions/index.tsx b/...tant/impl/assistant/common/components/assistant_settings_management/row_actions/index.tsx
diff --git a/...n-elastic-assistant/impl/assistant/conversations/conversation_selector_settings/index.tsx b/...n-elastic-assistant/impl/assistant/conversations/conversation_selector_settings/index.tsx
@@ -93,7 +93,6 @@ export const ConversationSelectorSettings: React.FC<Props> = React.memo(
                 (conversation) =>
                   conversation.title === conversationSelectorSettingsOption[0]?.label
               ) ?? conversationSelectorSettingsOption[0]?.label;
-
         onConversationSelectionChange(newConversation);
       },
       [onConversationSelectionChange, conversations]

diff --git a/...sistant/impl/assistant/conversations/conversation_settings/conversation_settings.test.tsx b/...sistant/impl/assistant/conversations/conversation_settings/conversation_settings.test.tsx
@@ -11,8 +11,8 @@ import { ConversationSettings, ConversationSettingsProps } from './conversation_
 import { TestProviders } from '../../../mock/test_providers/test_providers';
 import { alertConvo, customConvo, welcomeConvo } from '../../../mock/conversation';
 import { mockSystemPrompts } from '../../../mock/system_prompt';
-import { OpenAiProviderType } from '@kbn/stack-connectors-plugin/common/openai/constants';
 import { mockConnectors } from '../../../mock/connectors';
+import { HttpSetup } from '@kbn/core/public';
 
 const mockConvos = {
   '1234': { ...welcomeConvo, id: '1234' },
@@ -24,18 +24,19 @@ const onSelectedConversationChange = jest.fn();
 const setConversationSettings = jest.fn();
 const setConversationsSettingsBulkActions = jest.fn();
 
-const testProps = {
+const testProps: ConversationSettingsProps = {
   allSystemPrompts: mockSystemPrompts,
+  assistantStreamingEnabled: false,
+  connectors: mockConnectors,
   conversationSettings: mockConvos,
-  defaultConnectorId: '123',
-  defaultProvider: OpenAiProviderType.OpenAi,
-  http: { basePath: { get: jest.fn() } },
+  conversationsSettingsBulkActions: {},
+  http: { basePath: { get: jest.fn() } } as unknown as HttpSetup,
   onSelectedConversationChange,
   selectedConversation: mockConvos['1234'],
+  setAssistantStreamingEnabled: jest.fn(),
   setConversationSettings,
-  conversationsSettingsBulkActions: {},
   setConversationsSettingsBulkActions,
-} as unknown as ConversationSettingsProps;
+};
 
 jest.mock('../../../connectorland/use_load_connectors', () => ({
   useLoadConnectors: () => ({
@@ -113,7 +114,6 @@ jest.mock('../../../connectorland/connector_selector', () => ({
     />
   ),
 }));
-
 describe('ConversationSettings', () => {
   beforeEach(() => {
     jest.clearAllMocks();