Simplify state to just persist interface

Signed-off-by: Tyler Ohlsen <[email protected]>
opensearch-project · Sep 3, 2024 · 561e815 · 561e815
1 parent 6a4bb7c
commit 561e815
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 27 deletions.
diff --git a/public/pages/workflow_detail/workflow_inputs/processor_inputs/input_transform_modal.tsx b/public/pages/workflow_detail/workflow_inputs/processor_inputs/input_transform_modal.tsx
@@ -28,6 +28,7 @@ import {
   JSONPATH_ROOT_SELECTOR,
   ML_INFERENCE_DOCS_LINK,
   MapArrayFormValue,
+  ModelInterface,
   PROCESSOR_CONTEXT,
   SearchHit,
   SimulateIngestPipelineResponse,
@@ -47,7 +48,7 @@ import {
   useAppDispatch,
 } from '../../../../store';
 import { getCore } from '../../../../services';
-import { getDataSourceId } from '../../../../utils/utils';
+import { getDataSourceId, parseModelInputs } from '../../../../utils/utils';
 import { MapArrayField } from '../input_fields';
 
 interface InputTransformModalProps {
@@ -56,7 +57,7 @@ interface InputTransformModalProps {
   context: PROCESSOR_CONTEXT;
   inputMapField: IConfigField;
   inputMapFieldPath: string;
-  inputFields: any[];
+  modelInterface: ModelInterface | undefined;
   onClose: () => void;
 }
 
@@ -88,6 +89,10 @@ export function InputTransformModal(props: InputTransformModalProps) {
     number | undefined
   >((outputOptions[0]?.value as number) ?? undefined);
 
+  // TODO: integrated with Ajv to fetch any model interface and perform validation
+  // on the produced output on-the-fly. For examples, see
+  // https://www.npmjs.com/package/ajv
+
   return (
     <EuiModal onClose={props.onClose} style={{ width: '70vw' }}>
       <EuiModalHeader>
@@ -254,7 +259,7 @@ export function InputTransformModal(props: InputTransformModalProps) {
                     ? 'Query field'
                     : 'Document field'
                 }
-                keyOptions={props.inputFields}
+                keyOptions={parseModelInputs(props.modelInterface)}
                 // If the map we are adding is the first one, populate the selected option to index 0
                 onMapAdd={(curArray) => {
                   if (isEmpty(curArray)) {

diff --git a/public/pages/workflow_detail/workflow_inputs/processor_inputs/ml_processor_inputs.tsx b/public/pages/workflow_detail/workflow_inputs/processor_inputs/ml_processor_inputs.tsx
@@ -22,10 +22,9 @@ import {
   PROCESSOR_CONTEXT,
   WorkflowConfig,
   JSONPATH_ROOT_SELECTOR,
-  ModelInputFormField,
-  ModelOutputFormField,
   ML_INFERENCE_DOCS_LINK,
   WorkflowFormValues,
+  ModelInterface,
 } from '../../../../../common';
 import { MapArrayField, ModelField } from '../input_fields';
 import { isEmpty } from 'lodash';
@@ -108,9 +107,9 @@ export function MLProcessorInputs(props: MLProcessorInputsProps) {
   >(false);
 
   // model interface state
-  const [hasModelInterface, setHasModelInterface] = useState<boolean>(true);
-  const [inputFields, setInputFields] = useState<ModelInputFormField[]>([]);
-  const [outputFields, setOutputFields] = useState<ModelOutputFormField[]>([]);
+  const [modelInterface, setModelInterface] = useState<
+    ModelInterface | undefined
+  >(undefined);
 
   // Hook to listen when the selected model has changed. We do a few checks here:
   // 1: update model interface states
@@ -136,15 +135,7 @@ export function MLProcessorInputs(props: MLProcessorInputsProps) {
   // reusable function to update interface states based on the model ID
   function updateModelInterfaceStates(modelId: string) {
     const newSelectedModel = models[modelId];
-    if (newSelectedModel?.interface !== undefined) {
-      setInputFields(parseModelInputs(newSelectedModel.interface));
-      setOutputFields(parseModelOutputs(newSelectedModel.interface));
-      setHasModelInterface(true);
-    } else {
-      setInputFields([]);
-      setOutputFields([]);
-      setHasModelInterface(false);
-    }
+    setModelInterface(newSelectedModel?.interface);
   }
 
   return (
@@ -156,7 +147,7 @@ export function MLProcessorInputs(props: MLProcessorInputsProps) {
           context={props.context}
           inputMapField={inputMapField}
           inputMapFieldPath={inputMapFieldPath}
-          inputFields={inputFields}
+          modelInterface={modelInterface}
           onClose={() => setIsInputTransformModalOpen(false)}
         />
       )}
@@ -167,14 +158,14 @@ export function MLProcessorInputs(props: MLProcessorInputsProps) {
           context={props.context}
           outputMapField={outputMapField}
           outputMapFieldPath={outputMapFieldPath}
-          outputFields={outputFields}
+          modelInterface={modelInterface}
           onClose={() => setIsOutputTransformModalOpen(false)}
         />
       )}
       <ModelField
         field={modelField}
         fieldPath={modelFieldPath}
-        hasModelInterface={hasModelInterface}
+        hasModelInterface={modelInterface !== undefined}
         onModelChange={onModelChange}
       />
       {!isEmpty(getIn(values, modelFieldPath)?.id) && (
@@ -226,7 +217,7 @@ export function MLProcessorInputs(props: MLProcessorInputsProps) {
                 ? 'Query field'
                 : 'Document field'
             }
-            keyOptions={inputFields}
+            keyOptions={parseModelInputs(modelInterface)}
           />
           <EuiSpacer size="l" />
           <EuiFlexGroup direction="row">
@@ -274,7 +265,7 @@ export function MLProcessorInputs(props: MLProcessorInputsProps) {
                 : 'Document field'
             }
             valuePlaceholder="Model output field"
-            valueOptions={outputFields}
+            valueOptions={parseModelOutputs(modelInterface)}
           />
           <EuiSpacer size="s" />
           {inputMapValue.length !== outputMapValue.length &&

diff --git a/public/pages/workflow_detail/workflow_inputs/processor_inputs/output_transform_modal.tsx b/public/pages/workflow_detail/workflow_inputs/processor_inputs/output_transform_modal.tsx
@@ -28,6 +28,7 @@ import {
   JSONPATH_ROOT_SELECTOR,
   ML_INFERENCE_DOCS_LINK,
   MapArrayFormValue,
+  ModelInterface,
   PROCESSOR_CONTEXT,
   SearchHit,
   SearchPipelineConfig,
@@ -49,15 +50,15 @@ import {
 } from '../../../../store';
 import { getCore } from '../../../../services';
 import { MapArrayField } from '../input_fields';
-import { getDataSourceId } from '../../../../utils/utils';
+import { getDataSourceId, parseModelOutputs } from '../../../../utils/utils';
 
 interface OutputTransformModalProps {
   uiConfig: WorkflowConfig;
   config: IProcessorConfig;
   context: PROCESSOR_CONTEXT;
   outputMapField: IConfigField;
   outputMapFieldPath: string;
-  outputFields: any[];
+  modelInterface: ModelInterface | undefined;
   onClose: () => void;
 }
 
@@ -237,7 +238,7 @@ export function OutputTransformModal(props: OutputTransformModalProps) {
                 helpLink={ML_INFERENCE_DOCS_LINK}
                 keyPlaceholder="Document field"
                 valuePlaceholder="Model output field"
-                valueOptions={props.outputFields}
+                valueOptions={parseModelOutputs(props.modelInterface)}
                 // If the map we are adding is the first one, populate the selected option to index 0
                 onMapAdd={(curArray) => {
                   if (isEmpty(curArray)) {

diff --git a/public/utils/utils.ts b/public/utils/utils.ts
@@ -203,7 +203,7 @@ export function generateTransform(input: {}, map: MapFormValue): {} {
 
 // Derive the collection of model inputs from the model interface JSONSchema into a form-ready list
 export function parseModelInputs(
-  modelInterface: ModelInterface
+  modelInterface: ModelInterface | undefined
 ): ModelInputFormField[] {
   const modelInputsObj = get(
     modelInterface,
@@ -223,7 +223,7 @@ export function parseModelInputs(
 
 // Derive the collection of model outputs from the model interface JSONSchema into a form-ready list
 export function parseModelOutputs(
-  modelInterface: ModelInterface
+  modelInterface: ModelInterface | undefined
 ): ModelOutputFormField[] {
   const modelOutputsObj = get(modelInterface, 'output.properties', {}) as {
     [key: string]: ModelOutput;