Skip to content

Commit 8bca66d

Browse files
backport flatten result index related change into 2.x (#968)
* Add Enable Flattened custom result index checkbox (#830) * Add Enable Flattened custom result index checkbox Signed-off-by: Jackie Han <jkhanjob@gmail.com> * add hint text Signed-off-by: Jackie Han <jkhanjob@gmail.com> --------- Signed-off-by: Jackie Han <jkhanjob@gmail.com> * update snapshots Signed-off-by: Jackie Han <hnyng@amazon.com> --------- Signed-off-by: Jackie Han <jkhanjob@gmail.com> Signed-off-by: Jackie Han <hnyng@amazon.com>
1 parent 2acb94a commit 8bca66d

File tree

16 files changed

+492
-21
lines changed

16 files changed

+492
-21
lines changed

public/models/interfaces.ts

+1
Original file line numberDiff line numberDiff line change
@@ -194,6 +194,7 @@ export type Detector = {
194194
resultIndexMinAge?: number;
195195
resultIndexMinSize?: number;
196196
resultIndexTtl?: number;
197+
flattenCustomResultIndex?: boolean;
197198
filterQuery: { [key: string]: any };
198199
featureAttributes: FeatureAttributes[];
199200
windowDelay: { period: Schedule };

public/pages/DefineDetector/components/CustomResultIndex/CustomResultIndex.tsx

+59-16
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,7 @@ interface CustomResultIndexProps {
4848
function CustomResultIndex(props: CustomResultIndexProps) {
4949
const [enabled, setEnabled] = useState<boolean>(!!props.resultIndex);
5050
const [customResultIndexConditionsEnabled, setCustomResultIndexConditionsEnabled] = useState<boolean>(true);
51+
const [isDisabled, setIsDisabled] = useState(false);
5152
const customResultIndexMinAge = get(props.formikProps, 'values.resultIndexMinAge');
5253
const customResultIndexMinSize = get(props.formikProps, 'values.resultIndexMinSize');
5354
const customResultIndexTTL = get(props.formikProps, 'values.resultIndexTtl');
@@ -66,6 +67,24 @@ function CustomResultIndex(props: CustomResultIndexProps) {
6667
}
6768
},[customResultIndexConditionsEnabled])
6869

70+
useEffect(() => {
71+
if (props.isEdit && !get(props.formikProps, 'values.flattenCustomResultIndex')) {
72+
setIsDisabled(true);
73+
} else {
74+
setIsDisabled(false);
75+
}
76+
}, [props.isEdit]);
77+
78+
const hintTextStyle = {
79+
color: '#69707d',
80+
fontSize: '12px',
81+
lineHeight: '16px',
82+
fontWeight: 'normal',
83+
fontFamily: 'Helvetica, sans-serif',
84+
textAlign: 'left',
85+
width: '400px',
86+
};
87+
6988
return (
7089
<ContentPanel
7190
title={
@@ -136,25 +155,49 @@ function CustomResultIndex(props: CustomResultIndexProps) {
136155
</EuiCompressedFormRow>
137156
</EuiFlexItem>
138157
) : null}
139-
140-
{enabled ? (
141-
<EuiFlexItem>
142-
<EuiCompressedCheckbox
143-
id={'resultIndexConditionCheckbox'}
144-
label="Enable custom result index lifecycle management"
145-
checked={customResultIndexConditionsEnabled}
146-
onChange={() => {
147-
setCustomResultIndexConditionsEnabled(!customResultIndexConditionsEnabled);
148-
}}
149-
/>
150-
</EuiFlexItem>
151-
) : null}
152158
</EuiFlexGroup>
153159
)}
154160
</Field>
155161

156-
{ (enabled && customResultIndexConditionsEnabled) ? (<Field
157-
name="resultIndexMinAge"
162+
<EuiFlexGroup direction="column">
163+
<EuiFlexItem>
164+
{ enabled ? (
165+
<Field
166+
name="flattenCustomResultIndex">
167+
{({ field, form }: FieldProps) => (
168+
<EuiFlexGroup>
169+
<EuiFlexItem>
170+
<EuiCompressedCheckbox
171+
id={'flattenCustomResultIndex'}
172+
label="Enable flattened custom result index"
173+
checked={field.value ? field.value : get(props.formikProps, 'values.flattenCustomResultIndex')}
174+
disabled={isDisabled}
175+
{...field}
176+
/>
177+
<p style={hintTextStyle}>Flattening the custom result index will make it easier to query them on the dashboard. It also allows you to perform term aggregations on categorical fields.</p>
178+
</EuiFlexItem>
179+
</EuiFlexGroup>
180+
)}
181+
</Field>) : null}
182+
</EuiFlexItem>
183+
<EuiFlexItem>
184+
{enabled ? (
185+
<EuiFlexItem>
186+
<EuiCompressedCheckbox
187+
id={'resultIndexConditionCheckbox'}
188+
label="Enable custom result index lifecycle management"
189+
checked={customResultIndexConditionsEnabled}
190+
onChange={() => {
191+
setCustomResultIndexConditionsEnabled(!customResultIndexConditionsEnabled);
192+
}}
193+
/>
194+
</EuiFlexItem>
195+
) : null}
196+
</EuiFlexItem>
197+
</EuiFlexGroup>
198+
199+
{ (enabled && customResultIndexConditionsEnabled) ? (<Field
200+
name="resultIndexMinAge"
158201
validate={(enabled && customResultIndexConditionsEnabled) ? validateEmptyOrPositiveInteger : null}
159202
>
160203
{({ field, form }: FieldProps) => (
@@ -285,4 +328,4 @@ function CustomResultIndex(props: CustomResultIndexProps) {
285328
);
286329
}
287330

288-
export default CustomResultIndex;
331+
export default CustomResultIndex;

public/pages/DefineDetector/containers/DefineDetector.tsx

+1
Original file line numberDiff line numberDiff line change
@@ -229,6 +229,7 @@ export const DefineDetector = (props: DefineDetectorProps) => {
229229
formikProps.setFieldTouched('resultIndexMinAge');
230230
formikProps.setFieldTouched('resultIndexMinSize');
231231
formikProps.setFieldTouched('resultIndexTtl');
232+
formikProps.setFieldTouched('flattenCustomResultIndex');
232233
formikProps.validateForm().then((errors) => {
233234
if (isEmpty(errors)) {
234235
if (props.isEdit) {

public/pages/DefineDetector/containers/__tests__/__snapshots__/DefineDetector.test.tsx.snap

+30
Original file line numberDiff line numberDiff line change
@@ -1080,6 +1080,16 @@ exports[`<DefineDetector /> Full creating detector definition renders the compon
10801080
</div>
10811081
</div>
10821082
</div>
1083+
<div
1084+
class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
1085+
>
1086+
<div
1087+
class="euiFlexItem"
1088+
/>
1089+
<div
1090+
class="euiFlexItem"
1091+
/>
1092+
</div>
10831093
</div>
10841094
</div>
10851095
</div>
@@ -2166,6 +2176,16 @@ exports[`<DefineDetector /> empty creating detector definition renders the compo
21662176
</div>
21672177
</div>
21682178
</div>
2179+
<div
2180+
class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
2181+
>
2182+
<div
2183+
class="euiFlexItem"
2184+
/>
2185+
<div
2186+
class="euiFlexItem"
2187+
/>
2188+
</div>
21692189
</div>
21702190
</div>
21712191
</div>
@@ -3253,6 +3273,16 @@ exports[`<DefineDetector /> empty editing detector definition renders the compon
32533273
</div>
32543274
</div>
32553275
</div>
3276+
<div
3277+
class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
3278+
>
3279+
<div
3280+
class="euiFlexItem"
3281+
/>
3282+
<div
3283+
class="euiFlexItem"
3284+
/>
3285+
</div>
32563286
</div>
32573287
</div>
32583288
</div>

public/pages/DefineDetector/models/interfaces.ts

+1
Original file line numberDiff line numberDiff line change
@@ -25,5 +25,6 @@ export interface DetectorDefinitionFormikValues {
2525
resultIndexMinAge?: number | string;
2626
resultIndexMinSize?: number | string;
2727
resultIndexTtl?:number | string;
28+
flattenCustomResultIndex?: boolean;
2829
clusters?: any[];
2930
}

public/pages/DefineDetector/utils/__tests__/helpers.test.tsx

+2
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ describe('detectorDefinitionToFormik', () => {
4444
resultIndexMinAge: randomDetector.resultIndexMinAge,
4545
resultIndexMinSize: randomDetector.resultIndexMinSize,
4646
resultIndexTtl: randomDetector.resultIndexTtl,
47+
flattenCustomResultIndex: randomDetector.flattenCustomResultIndex,
4748
});
4849
});
4950
test('should return if detector does not have metadata', () => {
@@ -64,6 +65,7 @@ describe('detectorDefinitionToFormik', () => {
6465
resultIndexMinAge: randomDetector.resultIndexMinAge,
6566
resultIndexMinSize: randomDetector.resultIndexMinSize,
6667
resultIndexTtl: randomDetector.resultIndexTtl,
68+
flattenCustomResultIndex: randomDetector.flattenCustomResultIndex,
6769
});
6870
});
6971
test("upgrade old detector's filters to include filter type", () => {

public/pages/DefineDetector/utils/constants.tsx

+2-1
Original file line numberDiff line numberDiff line change
@@ -46,5 +46,6 @@ export const INITIAL_DETECTOR_DEFINITION_VALUES: DetectorDefinitionFormikValues
4646
resultIndex: undefined,
4747
resultIndexMinAge: 7,
4848
resultIndexMinSize: 51200,
49-
resultIndexTtl: 60
49+
resultIndexTtl: 60,
50+
flattenCustomResultIndex: false,
5051
};

public/pages/DefineDetector/utils/helpers.ts

+2
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,7 @@ export function detectorDefinitionToFormik(
4848
resultIndexMinAge: get(ad, 'resultIndexMinAge', undefined),
4949
resultIndexMinSize:get(ad, 'resultIndexMinSize', undefined),
5050
resultIndexTtl: get(ad, 'resultIndexTtl', undefined),
51+
flattenCustomResultIndex: get(ad, 'flattenCustomResultIndex', false),
5152
};
5253
}
5354

@@ -125,6 +126,7 @@ export function formikToDetectorDefinition(
125126
resultIndexMinAge: values.resultIndexMinAge,
126127
resultIndexMinSize: values.resultIndexMinSize,
127128
resultIndexTtl: values.resultIndexTtl,
129+
flattenCustomResultIndex: values.flattenCustomResultIndex,
128130
} as Detector;
129131

130132
return detectorBody;

public/pages/DetectorConfig/containers/__tests__/__snapshots__/DetectorConfig.test.tsx.snap

+102
Original file line numberDiff line numberDiff line change
@@ -432,6 +432,40 @@ exports[`<DetectorConfig /> spec renders rules 1`] = `
432432
</div>
433433
</div>
434434
</div>
435+
<div
436+
class="euiFlexItem"
437+
>
438+
<div
439+
class="euiFormRow euiFormRow--compressed"
440+
id="random_html_id-row"
441+
style="width: 250px;"
442+
>
443+
<div
444+
class="euiFormRow__labelWrapper"
445+
>
446+
<label
447+
class="euiFormLabel euiFormRow__label"
448+
for="random_html_id"
449+
>
450+
Flatten custom result index
451+
</label>
452+
</div>
453+
<div
454+
class="euiFormRow__fieldWrapper"
455+
>
456+
<div
457+
class="euiText euiText--medium"
458+
id="random_html_id"
459+
>
460+
<p
461+
class="enabled"
462+
>
463+
-
464+
</p>
465+
</div>
466+
</div>
467+
</div>
468+
</div>
435469
<div
436470
class="euiFlexItem"
437471
>
@@ -1929,6 +1963,40 @@ exports[`<DetectorConfig /> spec renders the component 1`] = `
19291963
</div>
19301964
</div>
19311965
</div>
1966+
<div
1967+
class="euiFlexItem"
1968+
>
1969+
<div
1970+
class="euiFormRow euiFormRow--compressed"
1971+
id="random_html_id-row"
1972+
style="width: 250px;"
1973+
>
1974+
<div
1975+
class="euiFormRow__labelWrapper"
1976+
>
1977+
<label
1978+
class="euiFormLabel euiFormRow__label"
1979+
for="random_html_id"
1980+
>
1981+
Flatten custom result index
1982+
</label>
1983+
</div>
1984+
<div
1985+
class="euiFormRow__fieldWrapper"
1986+
>
1987+
<div
1988+
class="euiText euiText--medium"
1989+
id="random_html_id"
1990+
>
1991+
<p
1992+
class="enabled"
1993+
>
1994+
Yes
1995+
</p>
1996+
</div>
1997+
</div>
1998+
</div>
1999+
</div>
19322000
<div
19332001
class="euiFlexItem"
19342002
>
@@ -3338,6 +3406,40 @@ exports[`<DetectorConfig /> spec renders the component with 2 custom and 1 simpl
33383406
</div>
33393407
</div>
33403408
</div>
3409+
<div
3410+
class="euiFlexItem"
3411+
>
3412+
<div
3413+
class="euiFormRow euiFormRow--compressed"
3414+
id="random_html_id-row"
3415+
style="width: 250px;"
3416+
>
3417+
<div
3418+
class="euiFormRow__labelWrapper"
3419+
>
3420+
<label
3421+
class="euiFormLabel euiFormRow__label"
3422+
for="random_html_id"
3423+
>
3424+
Flatten custom result index
3425+
</label>
3426+
</div>
3427+
<div
3428+
class="euiFormRow__fieldWrapper"
3429+
>
3430+
<div
3431+
class="euiText euiText--medium"
3432+
id="random_html_id"
3433+
>
3434+
<p
3435+
class="enabled"
3436+
>
3437+
Yes
3438+
</p>
3439+
</div>
3440+
</div>
3441+
</div>
3442+
</div>
33413443
<div
33423444
class="euiFlexItem"
33433445
>

0 commit comments

Comments
 (0)