Integrates with GenAI Connector

x-pack/packages/kbn-elastic-assistant/impl/assistant/api.tsx

@@ -6,8 +6,11 @@
  */
 
 import axios from 'axios';
+import { OpenAiProviderType } from '@kbn/stack-connectors-plugin/public/common';
 
+import { HttpSetup } from '@kbn/core-http-browser';
 import type { Message } from '../assistant_context/types';
+import { Conversation } from '../assistant_context/types';
 
 export const fetchOpenAlerts = async () => []; // TODO: fetch alerts via alerts API
 
@@ -58,43 +61,63 @@ export const sendFileToVirusTotal = async ({
   return response.data;
 };
 
-export interface FetchChatCompletionProps {
+export interface FetchConnectorExecuteAction {
+  apiConfig: Conversation['apiConfig'];
+  http: HttpSetup;
   messages: Message[];
-  baseUrl: string;
-  apiKey: string;
   signal?: AbortSignal | undefined;
 }
-export const fetchChatCompletion = async ({
+
+export const fetchConnectorExecuteAction = async ({
+  http,
   messages,
-  baseUrl,
-  apiKey,
+  apiConfig,
   signal,
-}: FetchChatCompletionProps): Promise<string> => {
+}: FetchConnectorExecuteAction): Promise<string> => {
   const outboundMessages = messages.map((msg) => ({
     role: msg.role,
     content: msg.content,
   }));
 
+  const body =
+    apiConfig?.provider === OpenAiProviderType.OpenAi
+      ? {
+          model: 'gpt-3.5-turbo',
+          messages: outboundMessages,
+          n: 1,
+          stop: null,
+          temperature: 0.2,
+        }
+      : {
+          messages: outboundMessages,
+        };
+
   const requestBody = {
-    messages: outboundMessages,
-    n: 1,
-    stop: null,
-    temperature: 0.2,
+    params: {
+      subActionParams: {
+        body: JSON.stringify(body),
+      },
+      subAction: 'test',
+    },
   };
 
   try {
-    const response = await fetch(baseUrl, {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-        'api-key': apiKey,
-      },
-      body: JSON.stringify(requestBody),
-      signal,
-    });
+    // TODO: Find return type for this API
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const response = await http.fetch<any>(
+      `/api/actions/connector/${apiConfig?.connectorId}/_execute`,
+      {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify(requestBody),
+        signal,
+      }
+    );
 
-    const data = await response.json();
-    if (!response.ok) {
+    const data = response.data;
+    if (response.status !== 'ok') {
       return 'An error occurred while processing your request.';
     }
 

x-pack/packages/kbn-elastic-assistant/impl/assistant/assistant_overlay/index.tsx

@@ -13,6 +13,7 @@ import useEvent from 'react-use/lib/useEvent';
 import styled from 'styled-components';
 import { ShowAssistantOverlayProps, useAssistantContext } from '../../assistant_context';
 import { Assistant } from '..';
+import { WELCOME_CONVERSATION_ID } from '../use_conversation/sample_conversations';
 
 const isMac = navigator.platform.toLowerCase().indexOf('mac') >= 0;
 
@@ -28,7 +29,7 @@ const StyledEuiModal = styled(EuiModal)`
  */
 export const AssistantOverlay: React.FC = React.memo(() => {
   const [isModalVisible, setIsModalVisible] = useState(false);
-  const [conversationId, setConversationId] = useState<string | undefined>('default');
+  const [conversationId, setConversationId] = useState<string | undefined>(WELCOME_CONVERSATION_ID);
   const [promptContextId, setPromptContextId] = useState<string | undefined>();
   const { setShowAssistantOverlay } = useAssistantContext();
 
@@ -50,7 +51,7 @@ export const AssistantOverlay: React.FC = React.memo(() => {
     setShowAssistantOverlay(showOverlay);
   }, [setShowAssistantOverlay, showOverlay]);
 
-  // Register keyboard listener to show the modal when cmd + / is pressed
+  // Register keyboard listener to show the modal when cmd + ; is pressed
   const onKeyDown = useCallback(
     (event: KeyboardEvent) => {
       if (event.key === ';' && (isMac ? event.metaKey : event.ctrlKey)) {
@@ -66,8 +67,8 @@ export const AssistantOverlay: React.FC = React.memo(() => {
   const cleanupAndCloseModal = useCallback(() => {
     setIsModalVisible(false);
     setPromptContextId(undefined);
-    setConversationId('default');
-  }, [setIsModalVisible]);
+    setConversationId(conversationId);
+  }, [conversationId]);
 
   const handleCloseModal = useCallback(() => {
     cleanupAndCloseModal();

x-pack/packages/kbn-elastic-assistant/impl/assistant/conversation_selector/index.tsx

@@ -18,6 +18,7 @@ interface Props {
   conversationId?: string;
   onSelectionChange?: (value: string) => void;
   shouldDisableKeyboardShortcut?: () => boolean;
+  isDisabled?: boolean;
 }
 
 const getPreviousConversationId = (conversationIds: string[], selectedConversationId: string) => {
@@ -37,6 +38,7 @@ export const ConversationSelector: React.FC<Props> = React.memo(
     conversationId = 'default',
     onSelectionChange,
     shouldDisableKeyboardShortcut = () => false,
+    isDisabled = false,
   }) => {
     const [selectedConversationId, setSelectedConversationId] = useState<string>(conversationId);
 
@@ -59,7 +61,7 @@ export const ConversationSelector: React.FC<Props> = React.memo(
     // Register keyboard listener for quick conversation switching
     const onKeyDown = useCallback(
       (event: KeyboardEvent) => {
-        if (conversationIds.length <= 1) {
+        if (isDisabled || conversationIds.length <= 1) {
           return;
         }
 
@@ -80,7 +82,13 @@ export const ConversationSelector: React.FC<Props> = React.memo(
           onRightArrowClick();
         }
       },
-      [conversationIds.length, onLeftArrowClick, onRightArrowClick, shouldDisableKeyboardShortcut]
+      [
+        conversationIds.length,
+        isDisabled,
+        onLeftArrowClick,
+        onRightArrowClick,
+        shouldDisableKeyboardShortcut,
+      ]
     );
     useEvent('keydown', onKeyDown);
 
@@ -102,14 +110,15 @@ export const ConversationSelector: React.FC<Props> = React.memo(
           valueOfSelected={selectedConversationId}
           onChange={onChange}
           compressed={true}
+          disabled={isDisabled}
           aria-label="Conversation Selector"
           prepend={
             <EuiToolTip content="Previous Conversation (⌘ + ←)" display="block">
               <EuiButtonIcon
                 iconType="arrowLeft"
                 aria-label="Previous Conversation"
                 onClick={onLeftArrowClick}
-                disabled={conversationIds.length <= 1}
+                disabled={isDisabled || conversationIds.length <= 1}
               />
             </EuiToolTip>
           }
@@ -119,7 +128,7 @@ export const ConversationSelector: React.FC<Props> = React.memo(
                 iconType="arrowRight"
                 aria-label="Next Conversation"
                 onClick={onRightArrowClick}
-                disabled={conversationIds.length <= 1}
+                disabled={isDisabled || conversationIds.length <= 1}
               />
             </EuiToolTip>
           }