Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Move exposed configs in the advanced transform modals #466

Merged
merged 3 commits into from
Nov 7, 2024
Merged

Move exposed configs in the advanced transform modals #466

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
9bf8eb3
Change boolean field to checkbox; expose full_response_path in output…
ohltyler Nov 6, 2024
56ad381
Update onetoone config on input transform
ohltyler Nov 6, 2024
d03d2a7
fix ut
ohltyler Nov 6, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 12 additions & 25 deletions public/pages/workflow_detail/workflow_detail.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -78,11 +78,6 @@ describe('WorkflowDetail Page with create ingestion option', () => {
} = renderWithRouter(workflowId, workflowName, type);

expect(getAllByText(workflowName).length).toBeGreaterThan(0);
expect(getAllByText('Create an ingest pipeline').length).toBeGreaterThan(
0
);
expect(getAllByText('Skip ingestion pipeline').length).toBeGreaterThan(0);
expect(getAllByText('Define ingest pipeline').length).toBeGreaterThan(0);
expect(getAllByText('Inspector').length).toBeGreaterThan(0);
expect(getAllByText('Preview').length).toBeGreaterThan(0);
expect(
Expand Down Expand Up @@ -188,27 +183,19 @@ describe('WorkflowDetail Page with skip ingestion option (Hybrid Search Workflow
jest.clearAllMocks();
});
test(`renders the WorkflowDetail page with skip ingestion option`, async () => {
const {
container,
getByTestId,
getAllByText,
getAllByTestId,
} = renderWithRouter(workflowId, workflowName, WORKFLOW_TYPE.HYBRID_SEARCH);

// "Create an ingest pipeline" option should be selected by default
const createIngestRadio = container.querySelector('#create');
expect(createIngestRadio).toBeChecked();
const { getByTestId, getAllByText, getAllByTestId } = renderWithRouter(
workflowId,
workflowName,
WORKFLOW_TYPE.HYBRID_SEARCH
);

// "Skip ingestion pipeline" option should be unselected by default
const skipIngestRadio = container.querySelector('#skip');
expect(skipIngestRadio).not.toBeChecked();
// Defining a new ingest pipeline & index is enabled by default
const enabledCheckbox = getByTestId('checkbox-ingest.enabled');
expect(enabledCheckbox).toBeChecked();

// Selected "Skip ingestion pipeline"
userEvent.click(skipIngestRadio!);
await waitFor(() => {
expect(createIngestRadio).not.toBeChecked();
});
expect(skipIngestRadio).toBeChecked();
// Skipping ingest pipeline and navigating to search
userEvent.click(enabledCheckbox);
await waitFor(() => {});
const searchPipelineButton = getByTestId('searchPipelineButton');
userEvent.click(searchPipelineButton);

Expand Down Expand Up @@ -255,7 +242,7 @@ describe('WorkflowDetail Page with skip ingestion option (Hybrid Search Workflow
userEvent.click(searchPipelineBackButton);

await waitFor(() => {
expect(skipIngestRadio).toBeChecked();
expect(enabledCheckbox).not.toBeChecked();
});
});
});
9 changes: 0 additions & 9 deletions public/pages/workflow_detail/workflow_inputs/config_field_list.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -63,15 +63,6 @@ export function ConfigFieldList(props: ConfigFieldListProps) {
<BooleanField
label={camelCaseToTitleString(field.id)}
fieldPath={fieldPath}
enabledOption={{
id: `${fieldPath}_true`,
label: 'True',
}}
disabledOption={{
id: `${fieldPath}_false`,
label: 'False',
}}
showLabel={true}
/>
<EuiSpacer size={CONFIG_FIELD_SPACER_SIZE} />
</EuiFlexItem>
Expand Down
68 changes: 29 additions & 39 deletions public/pages/workflow_detail/workflow_inputs/input_fields/boolean_field.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,22 +6,17 @@
import React from 'react';
import { Field, FieldProps } from 'formik';
import {
EuiCompressedFormRow,
EuiCompressedRadioGroup,
EuiLink,
EuiRadioGroupOption,
EuiCompressedCheckbox,
EuiFlexGroup,
EuiFlexItem,
EuiIconTip,
EuiText,
} from '@elastic/eui';
import { camelCaseToTitleString } from '../../../../utils';

interface BooleanFieldProps {
fieldPath: string; // the full path in string-form to the field (e.g., 'ingest.enrich.processors.text_embedding_processor.inputField')
enabledOption: EuiRadioGroupOption;
disabledOption: EuiRadioGroupOption;
label?: string;
helpLink?: string;
label: string;
helpText?: string;
showLabel?: boolean;
}

/**
Expand All @@ -32,37 +27,32 @@ export function BooleanField(props: BooleanFieldProps) {
<Field name={props.fieldPath}>
{({ field, form }: FieldProps) => {
return (
<EuiCompressedFormRow
key={props.fieldPath}
<EuiCompressedCheckbox
data-testid={`checkbox-${field.name}`}
id={`checkbox-${field.name}`}
label={
props.showLabel &&
(props.label || camelCaseToTitleString(field.name))
<>
<EuiFlexGroup direction="row">
<EuiFlexItem grow={false}>
<EuiText size="s">{props.label}</EuiText>
</EuiFlexItem>
{props.helpText && (
<EuiFlexItem
grow={false}
style={{ marginLeft: '-8px', marginTop: '10px' }}
>
<EuiIconTip content={props.helpText} position="right" />
</EuiFlexItem>
)}
</EuiFlexGroup>
</>
}
labelAppend={
props.helpLink ? (
<EuiText size="xs">
<EuiLink href={props.helpLink} target="_blank">
Learn more
</EuiLink>
</EuiText>
) : undefined
}
helpText={props.helpText || undefined}
isInvalid={false}
>
<EuiCompressedRadioGroup
options={[props.enabledOption, props.disabledOption]}
idSelected={
field.value === undefined || field.value === true
? props.enabledOption.id
: props.disabledOption.id
}
onChange={(id) => {
form.setFieldValue(field.name, !field.value);
form.setFieldTouched(field.name, true);
}}
/>
</EuiCompressedFormRow>
checked={field.value === undefined || field.value === true}
onChange={() => {
form.setFieldValue(field.name, !field.value);
form.setFieldTouched(field.name, true);
}}
/>
);
}}
</Field>
Expand Down
33 changes: 16 additions & 17 deletions ...c/pages/workflow_detail/workflow_inputs/processor_inputs/modals/input_transform_modal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ import {
EuiIconTip,
EuiCompressedSwitch,
EuiCallOut,
EuiAccordion,
} from '@elastic/eui';
import {
IConfigField,
Expand All @@ -37,7 +38,6 @@ import {
InputTransformFormValues,
InputTransformSchema,
JSONPATH_ROOT_SELECTOR,
ML_INFERENCE_RESPONSE_DOCS_LINK,
MapArrayFormValue,
ModelInterface,
PROCESSOR_CONTEXT,
Expand Down Expand Up @@ -331,16 +331,6 @@ export function InputTransformModal(props: InputTransformModalProps) {
<BooleanField
label={'One-to-one'}
fieldPath={'one_to_one'}
enabledOption={{
id: `one_to_one_true`,
label: 'True',
}}
disabledOption={{
id: `one_to_one_false`,
label: 'False',
}}
showLabel={true}
helpLink={ML_INFERENCE_RESPONSE_DOCS_LINK}
helpText="Run inference for each document separately"
/>
);
Expand Down Expand Up @@ -544,6 +534,21 @@ export function InputTransformModal(props: InputTransformModalProps) {
</EuiFlexGroup>
<EuiSpacer size="s" />
{InputMap}
{props.context === PROCESSOR_CONTEXT.SEARCH_RESPONSE && (
<>
<EuiSpacer size="s" />
<EuiAccordion
id={`advancedSettingsInputTransform${props.config.id}`}
buttonContent="Advanced settings"
paddingSize="none"
>
<EuiSpacer size="s" />
<EuiFlexItem style={{ marginLeft: '4px' }}>
{OneToOneConfig}
</EuiFlexItem>
</EuiAccordion>
</>
)}
</>
</EuiFlexItem>
<EuiFlexItem>
Expand Down Expand Up @@ -573,12 +578,6 @@ export function InputTransformModal(props: InputTransformModalProps) {
<EuiSpacer size="s" />
</>
)}
{props.context === PROCESSOR_CONTEXT.SEARCH_RESPONSE && (
<>
{OneToOneConfig}
<EuiSpacer size="s" />
</>
)}
{FetchButton}
</>
</EuiFlexItem>
Expand Down
43 changes: 18 additions & 25 deletions .../pages/workflow_detail/workflow_inputs/processor_inputs/modals/output_transform_modal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,14 +27,13 @@ import {
EuiCodeBlock,
EuiCallOut,
EuiIconTip,
EuiAccordion,
} from '@elastic/eui';
import {
IConfigField,
IProcessorConfig,
IngestPipelineConfig,
JSONPATH_ROOT_SELECTOR,
ML_INFERENCE_DOCS_LINK,
ML_INFERENCE_RESPONSE_DOCS_LINK,
MapArrayFormValue,
ModelInterface,
OutputTransformFormValues,
Expand Down Expand Up @@ -254,22 +253,8 @@ root object selector "${JSONPATH_ROOT_SELECTOR}"`}

const FullResponsePathConfig = (
<BooleanField
label={'Full response path'}
label={'Full Response Path'}
fieldPath={'full_response_path'}
enabledOption={{
id: `full_response_path_true`,
label: 'True',
}}
disabledOption={{
id: `full_response_path_false`,
label: 'False',
}}
showLabel={true}
helpLink={
props.context === PROCESSOR_CONTEXT.INGEST
? ML_INFERENCE_DOCS_LINK
: ML_INFERENCE_RESPONSE_DOCS_LINK
}
helpText="Parse the full model output"
/>
);
Expand Down Expand Up @@ -474,6 +459,22 @@ root object selector "${JSONPATH_ROOT_SELECTOR}"`}
</EuiFlexGroup>
<EuiSpacer size="s" />
{OutputMap}
{(props.context === PROCESSOR_CONTEXT.INGEST ||
props.context === PROCESSOR_CONTEXT.SEARCH_RESPONSE) && (
<>
<EuiSpacer size="s" />
<EuiAccordion
id={`advancedSettingsOutputTransform${props.config.id}`}
buttonContent="Advanced settings"
paddingSize="none"
>
<EuiSpacer size="s" />
<EuiFlexItem style={{ marginLeft: '4px' }}>
{FullResponsePathConfig}
</EuiFlexItem>
</EuiAccordion>
</>
)}
</>
</EuiFlexItem>
<EuiFlexItem>
Expand Down Expand Up @@ -508,14 +509,6 @@ root object selector "${JSONPATH_ROOT_SELECTOR}"`}
<EuiSpacer size="s" />
</>
)}
{(props.context === PROCESSOR_CONTEXT.INGEST ||
props.context ===
PROCESSOR_CONTEXT.SEARCH_RESPONSE) && (
<>
{FullResponsePathConfig}
<EuiSpacer size="s" />
</>
)}
{FetchButton}
</>
</EuiFlexItem>
Expand Down
34 changes: 2 additions & 32 deletions public/pages/workflow_detail/workflow_inputs/workflow_inputs.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,11 +82,6 @@ interface WorkflowInputsProps {
setUnsavedSearchProcessors: (unsavedSearchProcessors: boolean) => void;
}

enum INGEST_OPTION {
CREATE = 'create',
SKIP = 'skip',
}

/**
* The workflow inputs component containing the multi-step flow to create ingest
* and search flows for a particular workflow.
Expand Down Expand Up @@ -692,33 +687,8 @@ export function WorkflowInputs(props: WorkflowInputsProps) {
<>
<BooleanField
fieldPath="ingest.enabled"
enabledOption={{
id: INGEST_OPTION.CREATE,
label: (
<EuiFlexGroup direction="column" gutterSize="none">
<EuiText color="default">
Create an ingest pipeline
</EuiText>
<EuiText size="xs" color="subdued">
Configure and ingest data into an index.
</EuiText>
</EuiFlexGroup>
),
}}
disabledOption={{
id: INGEST_OPTION.SKIP,
label: (
<EuiFlexGroup direction="column" gutterSize="none">
<EuiText color="default">
Skip ingestion pipeline
</EuiText>
<EuiText size="xs" color="subdued">
Use an existing index with data ingested.
</EuiText>
</EuiFlexGroup>
),
}}
showLabel={false}
label="Enabled"
helpText="Create a new ingest pipeline and index"
/>
</>
)}
Expand Down
Loading