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

Add query param list in advanced transform modals #529

Merged
merged 3 commits into from
Dec 13, 2024
Merged

Add query param list in advanced transform modals #529

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
a3754bc
Add param list in all modals if applicable
ohltyler Dec 12, 2024
c5b45fa
Prevent duplicate keys for ML inputs/outputs
ohltyler Dec 12, 2024
230164a
Remove optional flag for search processors
ohltyler Dec 12, 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
11 changes: 7 additions & 4 deletions public/general_components/processors_title.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import { EuiFlexItem, EuiText } from '@elastic/eui';
interface ProcessorsTitleProps {
title: string;
processorCount: number;
optional: boolean;
}

/**
Expand All @@ -24,11 +25,13 @@ export function ProcessorsTitle(props: ProcessorsTitleProps) {
<>
<h3
style={{ display: 'inline-block' }}
>{`${props.title} (${props.processorCount}) -`}</h3>
>{`${props.title} (${props.processorCount})`}</h3>
&nbsp;
<h3 style={{ display: 'inline-block', fontStyle: 'italic' }}>
optional
</h3>
{props.optional && (
<h3 style={{ display: 'inline-block', fontStyle: 'italic' }}>
- optional
</h3>
)}
</>
</EuiText>
</EuiFlexItem>
Expand Down
1 change: 1 addition & 0 deletions public/pages/workflow_detail/workflow_inputs/ingest_inputs/enrich_data.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ export function EnrichData(props: EnrichDataProps) {
<ProcessorsTitle
title="Enrich data"
processorCount={props.uiConfig.ingest.enrich.processors?.length || 0}
optional={true}
/>
<EuiFlexItem>
<ProcessorsList
Expand Down
54 changes: 48 additions & 6 deletions ...orkflow_inputs/processor_inputs/ml_processor_inputs/modals/configure_expression_modal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,13 +39,18 @@ import {
WorkflowFormValues,
REQUEST_PREFIX,
REQUEST_PREFIX_WITH_JSONPATH_ROOT_SELECTOR,
QueryParam,
} from '../../../../../../../common';
import {
containsEmptyValues,
containsSameValues,
formikToPartialPipeline,
generateArrayTransform,
generateTransform,
getDataSourceId,
getInitialValue,
getPlaceholdersFromQuery,
injectParameters,
prepareDocsForSimulate,
unwrapTransformedDocs,
} from '../../../../../../utils';
Expand All @@ -56,6 +61,7 @@ import {
useAppDispatch,
} from '../../../../../../store';
import { getCore } from '../../../../../../services';
import { QueryParamsList } from '../../../../../../general_components';

interface ConfigureExpressionModalProps {
uiConfig: WorkflowConfig;
Expand Down Expand Up @@ -140,6 +146,29 @@ export function ConfigureExpressionModal(props: ConfigureExpressionModalProps) {
// fetching input data state
const [isFetching, setIsFetching] = useState<boolean>(false);

// query params state, if applicable. Users cannot run preview if there are query parameters
// and the user is configuring something in a search context (search request/response)
const [queryParams, setQueryParams] = useState<QueryParam[]>([]);
useEffect(() => {
if (props.context !== PROCESSOR_CONTEXT.INGEST && query !== undefined) {
const placeholders = getPlaceholdersFromQuery(query);
if (
!containsSameValues(
placeholders,
queryParams.map((queryParam) => queryParam.name)
)
) {
setQueryParams(
placeholders.map((placeholder) => ({
name: placeholder,
type: 'Text',
value: '',
}))
);
}
}
}, [query]);

// hook to re-generate the transform when any inputs to the transform are updated
useEffect(() => {
const tempExpressionAsInputMap = [
Expand Down Expand Up @@ -330,19 +359,21 @@ export function ConfigureExpressionModal(props: ConfigureExpressionModalProps) {
<EuiFlexItem grow={false}>
<EuiFlexGroup
direction="row"
justifyContent="spaceAround"
justifyContent="spaceBetween"
>
<EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiText size="m">Preview</EuiText>
</EuiFlexItem>
<EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiSmallButton
style={{ width: '100px' }}
isLoading={isFetching}
disabled={
onIngestAndNoDocs ||
onSearchAndNoQuery ||
!props.isDataFetchingAvailable
!props.isDataFetchingAvailable ||
(props.context !== PROCESSOR_CONTEXT.INGEST &&
containsEmptyValues(queryParams))
}
onClick={async () => {
setIsFetching(true);
Expand Down Expand Up @@ -426,7 +457,9 @@ export function ConfigureExpressionModal(props: ConfigureExpressionModalProps) {
// this if check as an extra layer of checking, and if mechanism for gating
// this is changed in the future.
if (curSearchPipeline === undefined) {
setSourceInput(values.search.request);
setSourceInput(
injectParameters(queryParams, query)
);
}
setIsFetching(false);
break;
Expand All @@ -448,7 +481,7 @@ export function ConfigureExpressionModal(props: ConfigureExpressionModalProps) {
index: values.search.index.name,
body: JSON.stringify({
...JSON.parse(
values.search.request as string
injectParameters(queryParams, query)
),
search_pipeline:
curSearchPipeline || {},
Expand Down Expand Up @@ -490,6 +523,15 @@ export function ConfigureExpressionModal(props: ConfigureExpressionModalProps) {
</EuiFlexItem>
</EuiFlexGroup>
</EuiFlexItem>
{props.context !== PROCESSOR_CONTEXT.INGEST &&
!isEmpty(queryParams) && (
<EuiFlexItem grow={false}>
<QueryParamsList
queryParams={queryParams}
setQueryParams={setQueryParams}
/>
</EuiFlexItem>
)}
<EuiFlexItem grow={false}>
<EuiText size="s">Source data</EuiText>
</EuiFlexItem>
Expand Down
50 changes: 45 additions & 5 deletions ...w_inputs/processor_inputs/ml_processor_inputs/modals/configure_multi_expression_modal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@ import {
MultiExpressionFormValues,
OutputMapEntry,
PROCESSOR_CONTEXT,
QueryParam,
SearchHit,
SearchPipelineConfig,
SimulateIngestPipelineResponse,
Expand All @@ -41,9 +42,13 @@ import {
WorkflowFormValues,
} from '../../../../../../../common';
import {
containsEmptyValues,
containsSameValues,
formikToPartialPipeline,
generateTransform,
getDataSourceId,
getPlaceholdersFromQuery,
injectParameters,
prepareDocsForSimulate,
unwrapTransformedDocs,
} from '../../../../../../utils';
Expand All @@ -54,6 +59,7 @@ import {
useAppDispatch,
} from '../../../../../../store';
import { getCore } from '../../../../../../services';
import { QueryParamsList } from '../../../../../../general_components';

interface ConfigureMultiExpressionModalProps {
uiConfig: WorkflowConfig;
Expand Down Expand Up @@ -144,6 +150,29 @@ export function ConfigureMultiExpressionModal(
// fetching input data state
const [isFetching, setIsFetching] = useState<boolean>(false);

// query params state, if applicable. Users cannot run preview if there are query parameters
// and the user is configuring something in a search context (search request/response)
const [queryParams, setQueryParams] = useState<QueryParam[]>([]);
useEffect(() => {
if (props.context !== PROCESSOR_CONTEXT.INGEST && query !== undefined) {
const placeholders = getPlaceholdersFromQuery(query);
if (
!containsSameValues(
placeholders,
queryParams.map((queryParam) => queryParam.name)
)
) {
setQueryParams(
placeholders.map((placeholder) => ({
name: placeholder,
type: 'Text',
value: '',
}))
);
}
}
}, [query]);

// hook to re-generate the transform when any inputs to the transform are updated
useEffect(() => {
const tempExpressionsAsOutputMap = tempExpressions.map(
Expand Down Expand Up @@ -356,19 +385,21 @@ export function ConfigureMultiExpressionModal(
<EuiFlexItem grow={false}>
<EuiFlexGroup
direction="row"
justifyContent="spaceAround"
justifyContent="spaceBetween"
>
<EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiText size="m">Preview</EuiText>
</EuiFlexItem>
<EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiSmallButton
style={{ width: '100px' }}
isLoading={isFetching}
disabled={
onIngestAndNoDocs ||
onSearchAndNoQuery ||
!props.isDataFetchingAvailable
!props.isDataFetchingAvailable ||
(props.context !== PROCESSOR_CONTEXT.INGEST &&
containsEmptyValues(queryParams))
}
onClick={async () => {
setIsFetching(true);
Expand Down Expand Up @@ -482,7 +513,7 @@ export function ConfigureMultiExpressionModal(
index: values.search.index.name,
body: JSON.stringify({
...JSON.parse(
values.search.request as string
injectParameters(queryParams, query)
),
search_pipeline:
curSearchPipeline || {},
Expand Down Expand Up @@ -522,6 +553,15 @@ export function ConfigureMultiExpressionModal(
</EuiFlexItem>
</EuiFlexGroup>
</EuiFlexItem>
{props.context !== PROCESSOR_CONTEXT.INGEST &&
!isEmpty(queryParams) && (
<EuiFlexItem grow={false}>
<QueryParamsList
queryParams={queryParams}
setQueryParams={setQueryParams}
/>
</EuiFlexItem>
)}
<EuiFlexItem grow={false}>
<EuiText size="s">Source data</EuiText>
</EuiFlexItem>
Expand Down
48 changes: 45 additions & 3 deletions .../workflow_inputs/processor_inputs/ml_processor_inputs/modals/configure_template_modal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,13 +43,18 @@ import {
TRANSFORM_CONTEXT,
WorkflowConfig,
WorkflowFormValues,
QueryParam,
} from '../../../../../../../common';
import {
containsEmptyValues,
containsSameValues,
formikToPartialPipeline,
generateArrayTransform,
generateTransform,
getDataSourceId,
getInitialValue,
getPlaceholdersFromQuery,
injectParameters,
prepareDocsForSimulate,
unwrapTransformedDocs,
} from '../../../../../../utils';
Expand All @@ -60,6 +65,7 @@ import {
useAppDispatch,
} from '../../../../../../store';
import { getCore } from '../../../../../../services';
import { QueryParamsList } from '../../../../../../general_components';

interface ConfigureTemplateModalProps {
uiConfig: WorkflowConfig;
Expand Down Expand Up @@ -168,6 +174,29 @@ export function ConfigureTemplateModal(props: ConfigureTemplateModalProps) {
// fetching input data state
const [isFetching, setIsFetching] = useState<boolean>(false);

// query params state, if applicable. Users cannot run preview if there are query parameters
// and the user is configuring something in a search context (search request/response)
const [queryParams, setQueryParams] = useState<QueryParam[]>([]);
useEffect(() => {
if (props.context !== PROCESSOR_CONTEXT.INGEST && query !== undefined) {
const placeholders = getPlaceholdersFromQuery(query);
if (
!containsSameValues(
placeholders,
queryParams.map((queryParam) => queryParam.name)
)
) {
setQueryParams(
placeholders.map((placeholder) => ({
name: placeholder,
type: 'Text',
value: '',
}))
);
}
}
}, [query]);

// hook to re-generate the transform when any inputs to the transform are updated
useEffect(() => {
const nestedVarsAsInputMap = tempNestedVars?.map((expressionVar) => {
Expand Down Expand Up @@ -546,7 +575,9 @@ export function ConfigureTemplateModal(props: ConfigureTemplateModalProps) {
disabled={
onIngestAndNoDocs ||
onSearchAndNoQuery ||
!props.isDataFetchingAvailable
!props.isDataFetchingAvailable ||
(props.context !== PROCESSOR_CONTEXT.INGEST &&
containsEmptyValues(queryParams))
}
onClick={async () => {
setIsFetching(true);
Expand Down Expand Up @@ -630,7 +661,9 @@ export function ConfigureTemplateModal(props: ConfigureTemplateModalProps) {
// this if check as an extra layer of checking, and if mechanism for gating
// this is changed in the future.
if (curSearchPipeline === undefined) {
setSourceInput(values.search.request);
setSourceInput(
injectParameters(queryParams, query)
);
}
setIsFetching(false);
break;
Expand All @@ -652,7 +685,7 @@ export function ConfigureTemplateModal(props: ConfigureTemplateModalProps) {
index: values.search.index.name,
body: JSON.stringify({
...JSON.parse(
values.search.request as string
injectParameters(queryParams, query)
),
search_pipeline:
curSearchPipeline || {},
Expand Down Expand Up @@ -694,6 +727,15 @@ export function ConfigureTemplateModal(props: ConfigureTemplateModalProps) {
</EuiFlexItem>
</EuiFlexGroup>
</EuiFlexItem>
{props.context !== PROCESSOR_CONTEXT.INGEST &&
!isEmpty(queryParams) && (
<EuiFlexItem grow={false}>
<QueryParamsList
queryParams={queryParams}
setQueryParams={setQueryParams}
/>
</EuiFlexItem>
)}
<EuiFlexItem grow={false}>
<EuiText size="s">Source data</EuiText>
</EuiFlexItem>
Expand Down
Loading
Loading