[Backport 2.x] Add dedicated prompt configuration for ML search resp processors

common/constants.ts

@@ -3,7 +3,12 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { MapEntry, QueryPreset, WORKFLOW_STATE } from './interfaces';
+import {
+  MapEntry,
+  PromptPreset,
+  QueryPreset,
+  WORKFLOW_STATE,
+} from './interfaces';
 import { customStringify } from './utils';
 
 export const PLUGIN_ID = 'search-studio';
@@ -409,6 +414,39 @@ export const QUERY_PRESETS = [
   },
 ] as QueryPreset[];
 
+/**
+ * PROMPT PRESETS
+ */
+export const SUMMARIZE_DOCS_PROMPT =
+  "Human: You are a professional data analyist. \
+You are given a list of document results. You will \
+analyze the data and generate a human-readable summary of the results. If you don't \
+know the answer, just say I don't know.\
+\n\n Results: <provide some results> \
+\n\n Human: Please summarize the results.\
+\n\n Assistant:";
+
+export const QA_WITH_DOCUMENTS_PROMPT =
+  "Human: You are a professional data analyist. \
+You are given a list of document results, along with a question. You will \
+analyze the results and generate a human-readable response to the question, \
+based on the results. If you don't know the answer, just say I don't know.\
+\n\n Results: <provide some results> \
+\n\n Question: <provide some question> \
+\n\n Human: Please answer the question using the provided results.\
+\n\n Assistant:";
+
+export const PROMPT_PRESETS = [
+  {
+    name: 'Summarize documents',
+    prompt: SUMMARIZE_DOCS_PROMPT,
+  },
+  {
+    name: 'QA with documents',
+    prompt: QA_WITH_DOCUMENTS_PROMPT,
+  },
+] as PromptPreset[];
+
 /**
  * MISCELLANEOUS
  */

common/interfaces.ts

@@ -482,6 +482,11 @@ export type QueryPreset = {
   query: string;
 };
 
+export type PromptPreset = {
+  name: string;
+  prompt: string;
+};
+
 export type QuickConfigureFields = {
   modelId?: string;
   vectorField?: string;

public/pages/workflow_detail/workflow_inputs/processor_inputs/ml_processor_inputs.tsx

@@ -17,6 +17,7 @@ import {
   EuiSpacer,
   EuiText,
   EuiToolTip,
+  EuiSmallButton,
 } from '@elastic/eui';
 import {
   IProcessorConfig,
@@ -30,8 +31,11 @@ import {
   IndexMappings,
 } from '../../../../../common';
 import { MapArrayField, ModelField } from '../input_fields';
-import { InputTransformModal } from './input_transform_modal';
-import { OutputTransformModal } from './output_transform_modal';
+import {
+  ConfigurePromptModal,
+  InputTransformModal,
+  OutputTransformModal,
+} from './modals';
 import { AppState, getMappings, useAppDispatch } from '../../../../store';
 import {
   formikToPartialPipeline,
@@ -108,13 +112,14 @@ export function MLProcessorInputs(props: MLProcessorInputsProps) {
     }
   }, [props.uiConfig.search.enrichRequest.processors]);
 
-  // advanced transformations modal state
+  // various modal states
   const [isInputTransformModalOpen, setIsInputTransformModalOpen] = useState<
     boolean
   >(false);
   const [isOutputTransformModalOpen, setIsOutputTransformModalOpen] = useState<
     boolean
   >(false);
+  const [isPromptModalOpen, setIsPromptModalOpen] = useState<boolean>(false);
 
   // model interface state
   const [modelInterface, setModelInterface] = useState<
@@ -240,6 +245,14 @@ export function MLProcessorInputs(props: MLProcessorInputsProps) {
           onClose={() => setIsOutputTransformModalOpen(false)}
         />
       )}
+      {isPromptModalOpen && (
+        <ConfigurePromptModal
+          config={props.config}
+          baseConfigPath={props.baseConfigPath}
+          modelInterface={modelInterface}
+          onClose={() => setIsPromptModalOpen(false)}
+        />
+      )}
       <ModelField
         field={modelField}
         fieldPath={modelFieldPath}
@@ -249,6 +262,23 @@ export function MLProcessorInputs(props: MLProcessorInputsProps) {
       {!isEmpty(getIn(values, modelFieldPath)?.id) && (
         <>
           <EuiSpacer size="s" />
+          {props.context === PROCESSOR_CONTEXT.SEARCH_RESPONSE && (
+            <>
+              <EuiText
+                size="m"
+                style={{ marginTop: '4px' }}
+              >{`Configure prompt (Optional)`}</EuiText>
+              <EuiSpacer size="s" />
+              <EuiSmallButton
+                style={{ width: '100px' }}
+                fill={false}
+                onClick={() => setIsPromptModalOpen(true)}
+              >
+                Configure
+              </EuiSmallButton>
+              <EuiSpacer size="l" />
+            </>
+          )}
           <EuiFlexGroup direction="row">
             <EuiFlexItem grow={false}>
               <EuiText
@@ -281,7 +311,6 @@ export function MLProcessorInputs(props: MLProcessorInputsProps) {
             </EuiFlexItem>
           </EuiFlexGroup>
           <EuiSpacer size="s" />
-          <EuiSpacer size="s" />
           <MapArrayField
             field={inputMapField}
             fieldPath={inputMapFieldPath}