Skip to content

Commit 6e7187f

Browse files
committed
fixing bug where two conditions didn't display
Signed-off-by: Amit Galitzky <amgalitz@amazon.com>
1 parent 553c521 commit 6e7187f

File tree

5 files changed

+97
-73
lines changed

5 files changed

+97
-73
lines changed

public/pages/ConfigureModel/components/FeatureAccordion/FeatureAccordion.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ import {
2424
EuiSpacer,
2525
} from '@elastic/eui';
2626
import './styles.scss';
27-
import { Field, FieldArray, FieldProps } from 'formik';
27+
import { Field, FieldProps } from 'formik';
2828
import {
2929
required,
3030
isInvalid,

public/pages/ConfigureModel/components/SuppressionRules/SuppressionRules.tsx

+65-28
Original file line numberDiff line numberDiff line change
@@ -13,19 +13,12 @@ import {
1313
EuiFlexItem,
1414
EuiFlexGroup,
1515
EuiText,
16-
EuiLink,
17-
EuiTitle,
1816
EuiCompressedFieldNumber,
1917
EuiSpacer,
2018
EuiCompressedSelect,
2119
EuiButtonIcon,
22-
EuiCompressedFieldText,
2320
EuiToolTip,
24-
OuiTextColor,
25-
EuiTextColor,
2621
EuiSelect,
27-
EuiCheckbox,
28-
EuiFieldNumber,
2922
EuiButtonEmpty,
3023
} from '@elastic/eui';
3124
import { Field, FieldProps, FieldArray } from 'formik';
@@ -34,8 +27,6 @@ import ContentPanel from '../../../../components/ContentPanel/ContentPanel';
3427
import { BASE_DOCS_LINK } from '../../../../utils/constants';
3528
import {
3629
isInvalid,
37-
getError,
38-
validatePositiveInteger,
3930
validatePositiveDecimal,
4031
} from '../../../../utils/utils';
4132
import { FormattedFormRow } from '../../../../components/FormattedFormRow/FormattedFormRow';
@@ -72,8 +63,8 @@ export function SuppressionRules(props: SuppressionRulesProps) {
7263
? 'relative threshold'
7364
: fieldKey;
7465
return typeof fieldError === 'string'
75-
? `${friendlyFieldName} ${fieldError.toLowerCase()}`
76-
: String(fieldError || '');
66+
? `${friendlyFieldName} ${fieldError.toLowerCase()}`
67+
: String(fieldError || '');
7768
}
7869
}
7970
}
@@ -315,23 +306,69 @@ export function SuppressionRules(props: SuppressionRulesProps) {
315306
<Field
316307
name={`suppressionRules.${props.featureIndex}[${index}].aboveBelow`}
317308
>
318-
{({ field }: FieldProps) => (
319-
<EuiToolTip content="Select above or below expected value">
320-
<EuiSelect
321-
options={[
322-
{
323-
value: 'above',
324-
text: 'above the expected value',
325-
},
326-
{
327-
value: 'below',
328-
text: 'below the expected value',
329-
},
330-
]}
331-
{...field}
332-
/>
333-
</EuiToolTip>
334-
)}
309+
{({ field }: FieldProps) => {
310+
const currentRules =
311+
form.values.suppressionRules?.[
312+
props.featureIndex
313+
] || [];
314+
315+
// Check if there's a directionRule = true and get its "aboveBelow" value
316+
const directionRule = currentRules.find(
317+
(rule) => rule.directionRule === true
318+
);
319+
320+
let options = [
321+
{
322+
value: 'above',
323+
text: 'above the expected value',
324+
disabled: false,
325+
},
326+
{
327+
value: 'below',
328+
text: 'below the expected value',
329+
disabled: false,
330+
},
331+
];
332+
333+
let tooltipContent =
334+
'Select above or below expected value';
335+
336+
// Modify options based on the directionRule logic
337+
if (directionRule) {
338+
options = options.map((option) => ({
339+
...option,
340+
disabled:
341+
directionRule.aboveBelow !==
342+
option.value,
343+
}));
344+
345+
if (
346+
field.value !==
347+
directionRule.aboveBelow
348+
) {
349+
form.setFieldValue(
350+
`suppressionRules.${props.featureIndex}[${index}].aboveBelow`,
351+
directionRule.aboveBelow
352+
);
353+
}
354+
if (directionRule?.aboveBelow) {
355+
const directionText =
356+
directionRule.aboveBelow === 'above'
357+
? 'exceeds'
358+
: 'drops below';
359+
tooltipContent = `Base criteria includes anomalies where the actual value ${directionText} the expected value. Rules can only be made in this direction.`;
360+
}
361+
}
362+
363+
return (
364+
<EuiToolTip content={tooltipContent}>
365+
<EuiSelect
366+
options={options}
367+
{...field}
368+
/>
369+
</EuiToolTip>
370+
);
371+
}}
335372
</Field>
336373
</EuiFlexItem>
337374
<EuiFlexItem grow={false}>

public/pages/ConfigureModel/utils/helpers.ts

+29-37
Original file line numberDiff line numberDiff line change
@@ -479,7 +479,6 @@ export const getSuppressionRulesArray = (detector: Detector): string[] => {
479479
return `Ignore anomalies for feature "${featureName}" when actual value is below the expected value`;
480480
}
481481

482-
483482
let value = condition.value;
484483
const isPercentage =
485484
thresholdType === ThresholdType.ACTUAL_OVER_EXPECTED_RATIO ||
@@ -558,15 +557,14 @@ export const getSuppressionRulesArrayForFeature = (
558557
export const formikToRules = (
559558
formikValues?: RuleFormikValues[]
560559
): Rule[] | undefined => {
561-
562560
if (!formikValues || formikValues.length === 0) {
563561
return undefined; // Return undefined for undefined or empty input
564562
}
565563

566-
// Flatten the nested array of suppressionRule by feature and filter out null entries
567-
const flattenedSuppressionFormikValues = formikValues.flatMap((nestedArray) =>
568-
nestedArray || [] // If null, replace with an empty array
569-
);
564+
// Flatten the nested array of suppressionRule by feature and filter out null entries
565+
const flattenedSuppressionFormikValues = formikValues.flatMap(
566+
(nestedArray) => nestedArray || [] // If null, replace with an empty array
567+
);
570568

571569
return flattenedSuppressionFormikValues.map((formikValue) => {
572570
const conditions: Condition[] = [];
@@ -592,12 +590,14 @@ export const formikToRules = (
592590
}
593591
};
594592

595-
596-
597593
if (formikValue.directionRule) {
598594
conditions.push({
599595
featureName: formikValue.featureName,
600-
thresholdType: getThresholdType(formikValue.aboveBelow, true, formikValue.directionRule),
596+
thresholdType: getThresholdType(
597+
formikValue.aboveBelow,
598+
true,
599+
formikValue.directionRule
600+
),
601601
operator: undefined,
602602
value: undefined,
603603
});
@@ -647,28 +647,26 @@ export const formikToRules = (
647647
});
648648
};
649649

650-
// Convert Rule[] to RuleFormikValues[][]
651-
export const rulesToFormik = (rules?: Rule[]): (RuleFormikValues[] | null)[] => {
650+
export const rulesToFormik = (
651+
rules?: Rule[]
652+
): (RuleFormikValues[] | null)[] => {
652653
if (!rules || rules.length === 0) {
653-
return []; // Return empty array for undefined or empty input
654+
return [];
654655
}
655656
// Group rules by featureName
656657
const groupedRules: { [featureName: string]: RuleFormikValues[] } = {};
657658

658659
rules.forEach((rule) => {
659-
// Start with default values for each rule
660-
const formikValue: RuleFormikValues = {
661-
featureName: '',
662-
absoluteThreshold: undefined,
663-
relativeThreshold: undefined,
664-
aboveBelow: 'above', // Default to 'above', adjust as needed
665-
};
666-
667-
// Loop through conditions to populate formikValue
668660
rule.conditions.forEach((condition) => {
669-
formikValue.featureName = condition.featureName;
661+
// Create a new formikValue for each condition
662+
const formikValue: RuleFormikValues = {
663+
featureName: condition.featureName,
664+
absoluteThreshold: undefined,
665+
relativeThreshold: undefined,
666+
aboveBelow: 'above', // Default to 'above', adjust as needed
667+
};
670668

671-
// Determine the value and type of threshold
669+
// Populate formikValue based on threshold type
672670
switch (condition.thresholdType) {
673671
case ThresholdType.ACTUAL_OVER_EXPECTED_MARGIN:
674672
formikValue.absoluteThreshold = condition.value;
@@ -679,13 +677,11 @@ export const rulesToFormik = (rules?: Rule[]): (RuleFormikValues[] | null)[] =>
679677
formikValue.aboveBelow = 'below';
680678
break;
681679
case ThresholdType.ACTUAL_OVER_EXPECTED_RATIO:
682-
// *100 to convert to percentage
683-
formikValue.relativeThreshold = (condition.value ?? 1) * 100;
680+
formikValue.relativeThreshold = (condition.value ?? 1) * 100; // Convert to percentage
684681
formikValue.aboveBelow = 'above';
685682
break;
686683
case ThresholdType.EXPECTED_OVER_ACTUAL_RATIO:
687-
// *100 to convert to percentage
688-
formikValue.relativeThreshold = (condition.value ?? 1) * 100;
684+
formikValue.relativeThreshold = (condition.value ?? 1) * 100; // Convert to percentage
689685
formikValue.aboveBelow = 'below';
690686
break;
691687
case ThresholdType.ACTUAL_IS_BELOW_EXPECTED:
@@ -701,21 +697,17 @@ export const rulesToFormik = (rules?: Rule[]): (RuleFormikValues[] | null)[] =>
701697
default:
702698
break;
703699
}
704-
});
705700

706-
// Add the rule to the grouped object based on featureName
707-
if (!groupedRules[formikValue.featureName]) {
708-
groupedRules[formikValue.featureName] = [];
709-
}
710-
groupedRules[formikValue.featureName].push(formikValue);
701+
if (!groupedRules[formikValue.featureName]) {
702+
groupedRules[formikValue.featureName] = [];
703+
}
704+
groupedRules[formikValue.featureName].push(formikValue);
705+
});
711706
});
712707

713-
// Convert grouped object into an array of arrays based on featureList index
714-
const featureList = Object.keys(groupedRules); // Ensure you have a reference to your feature list somewhere
715-
708+
const featureList = Object.keys(groupedRules);
716709
const finalRules: (RuleFormikValues[] | null)[] = featureList.map(
717710
(featureName) => groupedRules[featureName] || null
718711
);
719-
720712
return finalRules;
721713
};

public/pages/DetectorConfig/containers/Features.tsx

+2-3
Original file line numberDiff line numberDiff line change
@@ -25,8 +25,8 @@ import {
2525
FEATURE_TYPE,
2626
FeatureAttributes,
2727
} from '../../../models/interfaces';
28-
import { get, isEmpty, sortBy } from 'lodash';
29-
import { PLUGIN_NAME, BASE_DOCS_LINK } from '../../../utils/constants';
28+
import { get, sortBy } from 'lodash';
29+
import { PLUGIN_NAME } from '../../../utils/constants';
3030
import ContentPanel from '../../../components/ContentPanel/ContentPanel';
3131
import { CodeModal } from '../components/CodeModal/CodeModal';
3232
import { getTitleWithCount } from '../../../utils/utils';
@@ -39,7 +39,6 @@ import {
3939
getSuppressionRulesArrayForFeature,
4040
} from '../../ConfigureModel/utils/helpers';
4141
import { SuppressionRulesModal } from '../../ReviewAndCreate/components/SuppressionRulesModal/SuppressionRulesModal';
42-
import { Rule } from '../../../models/types';
4342

4443
interface FeaturesProps {
4544
detectorId: string;

public/pages/DetectorConfig/containers/__tests__/Features.test.tsx

-4
Original file line numberDiff line numberDiff line change
@@ -28,15 +28,11 @@ import {
2828
} from '../../../../models/types';
2929
import { getRandomDetector } from '../../../../redux/reducers/__tests__/utils';
3030
import {
31-
Detector,
3231
UiMetaData,
3332
FILTER_TYPES,
34-
UIFilter,
3533
FEATURE_TYPE,
3634
UiFeature,
3735
FeatureAttributes,
38-
OPERATORS_MAP,
39-
UNITS,
4036
} from '../../../../models/interfaces';
4137
import { featureQuery1, featureQuery2 } from './DetectorConfig.test';
4238

0 commit comments

Comments
 (0)