Skip to content

[7.9] [Security Solution][Detections] Fixes Risk Score and Severity mapping issues (#73233) #73543

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

Merged
merged 1 commit into from
Jul 28, 2020
Merged

[7.9] [Security Solution][Detections] Fixes Risk Score and Severity mapping issues (#73233) #73543

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
3 changes: 2 additions & 1 deletion x-pack/plugins/security_solution/common/detection_engine/schemas/common/schemas.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -222,8 +222,9 @@ export const risk_score_mapping_value = t.string;
export const risk_score_mapping_item = t.exact(
t.type({
field: risk_score_mapping_field,
operator,
value: risk_score_mapping_value,
operator,
risk_score: riskScoreOrUndefined,
})
);

Expand Down
1 change: 1 addition & 0 deletions ...ns/security_solution/public/detections/components/rules/description_step/helpers.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -331,6 +331,7 @@ describe('helpers', () => {
const result: ListItems[] = buildSeverityDescription({
value: 'low',
mapping: [{ field: 'host.name', operator: 'equals', value: 'hello', severity: 'high' }],
isMappingChecked: true,
});

expect(result[0].title).toEqual('Severity');
Expand Down
114 changes: 64 additions & 50 deletions ...plugins/security_solution/public/detections/components/rules/description_step/helpers.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ import { SeverityBadge } from '../severity_badge';
import ListTreeIcon from './assets/list_tree_icon.svg';
import { assertUnreachable } from '../../../../common/lib/helpers';
import { AboutStepRiskScore, AboutStepSeverity } from '../../../pages/detection_engine/rules/types';
import { defaultToEmptyTag } from '../../../../common/components/empty_value';

const NoteDescriptionContainer = styled(EuiFlexItem)`
height: 105px;
Expand Down Expand Up @@ -236,63 +237,76 @@ export const buildSeverityDescription = (severity: AboutStepSeverity): ListItems
title: i18nSeverity.DEFAULT_SEVERITY,
description: <SeverityBadge value={severity.value} />,
},
...severity.mapping.map((severityItem, index) => {
return {
title: index === 0 ? i18nSeverity.SEVERITY_MAPPING : '',
description: (
<EuiFlexGroup alignItems="center">
<OverrideColumn>
<EuiToolTip
content={severityItem.field}
data-test-subj={`severityOverrideField${index}`}
>
<>{severityItem.field}</>
</EuiToolTip>
</OverrideColumn>
<EuiToolTip content={severityItem.value} data-test-subj={`severityOverrideValue${index}`}>
<>{severityItem.value}</>
</EuiToolTip>
<EuiFlexItem grow={false}>
<EuiIcon type={'sortRight'} />
</EuiFlexItem>
<EuiFlexItem>
<SeverityBadge
data-test-subj={`severityOverrideSeverity${index}`}
value={severityItem.severity}
/>
</EuiFlexItem>
</EuiFlexGroup>
),
};
}),
...(severity.isMappingChecked
? severity.mapping
.filter((severityItem) => severityItem.field !== '')
.map((severityItem, index) => {
return {
title: index === 0 ? i18nSeverity.SEVERITY_MAPPING : '',
description: (
<EuiFlexGroup alignItems="center">
<OverrideColumn>
<EuiToolTip
content={severityItem.field}
data-test-subj={`severityOverrideField${index}`}
>
<>{`${severityItem.field}:`}</>
</EuiToolTip>
</OverrideColumn>
<OverrideColumn>
<EuiToolTip
content={severityItem.value}
data-test-subj={`severityOverrideValue${index}`}
>
{defaultToEmptyTag(severityItem.value)}
</EuiToolTip>
</OverrideColumn>
<EuiFlexItem grow={false}>
<EuiIcon type={'sortRight'} />
</EuiFlexItem>
<EuiFlexItem>
<SeverityBadge
data-test-subj={`severityOverrideSeverity${index}`}
value={severityItem.severity}
/>
</EuiFlexItem>
</EuiFlexGroup>
),
};
})
: []),
];

export const buildRiskScoreDescription = (riskScore: AboutStepRiskScore): ListItems[] => [
{
title: i18nRiskScore.RISK_SCORE,
description: riskScore.value,
},
...riskScore.mapping.map((riskScoreItem, index) => {
return {
title: index === 0 ? i18nRiskScore.RISK_SCORE_MAPPING : '',
description: (
<EuiFlexGroup alignItems="center">
<EuiFlexItem>
<EuiToolTip
content={riskScoreItem.field}
data-test-subj={`riskScoreOverrideField${index}`}
>
<>{riskScoreItem.field}</>
</EuiToolTip>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiIcon type={'sortRight'} />
</EuiFlexItem>
<EuiFlexItem>{'signal.rule.risk_score'}</EuiFlexItem>
</EuiFlexGroup>
),
};
}),
...(riskScore.isMappingChecked
? riskScore.mapping
.filter((riskScoreItem) => riskScoreItem.field !== '')
.map((riskScoreItem, index) => {
return {
title: index === 0 ? i18nRiskScore.RISK_SCORE_MAPPING : '',
description: (
<EuiFlexGroup alignItems="center">
<OverrideColumn>
<EuiToolTip
content={riskScoreItem.field}
data-test-subj={`riskScoreOverrideField${index}`}
>
<>{riskScoreItem.field}</>
</EuiToolTip>
</OverrideColumn>
<EuiFlexItem grow={false}>
<EuiIcon type={'sortRight'} />
</EuiFlexItem>
<EuiFlexItem>{'signal.rule.risk_score'}</EuiFlexItem>
</EuiFlexGroup>
),
};
})
: []),
];

const MyRefUrlLink = styled(EuiLink)`
Expand Down
66 changes: 33 additions & 33 deletions ...plugins/security_solution/public/detections/components/rules/risk_score_mapping/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,9 @@ import {
EuiIcon,
EuiSpacer,
} from '@elastic/eui';
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import React, { useCallback, useMemo } from 'react';
import styled from 'styled-components';
import { noop } from 'lodash/fp';
import * as i18n from './translations';
import { FieldHook } from '../../../../../../../../src/plugins/es_ui_shared/static/forms/hook_form_lib';
import { CommonUseField } from '../../../../cases/components/create';
Expand All @@ -24,6 +25,10 @@ import { FieldComponent } from '../../../../common/components/autocomplete/field
import { IFieldType } from '../../../../../../../../src/plugins/data/common/index_patterns/fields';
import { IIndexPattern } from '../../../../../../../../src/plugins/data/common/index_patterns';

const RiskScoreMappingEuiFormRow = styled(EuiFormRow)`
width: 468px;
`;

const NestedContent = styled.div`
margin-left: 24px;
`;
Expand All @@ -41,6 +46,7 @@ interface RiskScoreFieldProps {
field: FieldHook;
idAria: string;
indices: IIndexPattern;
isDisabled: boolean;
placeholder?: string;
}

Expand All @@ -49,40 +55,23 @@ export const RiskScoreField = ({
field,
idAria,
indices,
isDisabled,
placeholder,
}: RiskScoreFieldProps) => {
const [isRiskScoreMappingChecked, setIsRiskScoreMappingChecked] = useState(false);
const [initialFieldCheck, setInitialFieldCheck] = useState(true);

const fieldTypeFilter = useMemo(() => ['number'], []);

useEffect(() => {
if (
!isRiskScoreMappingChecked &&
initialFieldCheck &&
(field.value as AboutStepRiskScore).mapping?.length > 0
) {
setIsRiskScoreMappingChecked(true);
setInitialFieldCheck(false);
}
}, [
field,
initialFieldCheck,
isRiskScoreMappingChecked,
setIsRiskScoreMappingChecked,
setInitialFieldCheck,
]);

const handleFieldChange = useCallback(
([newField]: IFieldType[]): void => {
const values = field.value as AboutStepRiskScore;
field.setValue({
value: values.value,
isMappingChecked: values.isMappingChecked,
mapping: [
{
field: newField?.name ?? '',
operator: 'equals',
value: '',
value: undefined,
riskScore: undefined,
},
],
});
Expand All @@ -99,8 +88,13 @@ export const RiskScoreField = ({
}, [field.value, indices]);

const handleRiskScoreMappingChecked = useCallback(() => {
setIsRiskScoreMappingChecked(!isRiskScoreMappingChecked);
}, [isRiskScoreMappingChecked, setIsRiskScoreMappingChecked]);
const values = field.value as AboutStepRiskScore;
field.setValue({
value: values.value,
mapping: [...values.mapping],
isMappingChecked: !values.isMappingChecked,
});
}, [field]);

const riskScoreLabel = useMemo(() => {
return (
Expand All @@ -117,11 +111,16 @@ export const RiskScoreField = ({
const riskScoreMappingLabel = useMemo(() => {
return (
<div>
<EuiFlexGroup alignItems="center" gutterSize="s" onClick={handleRiskScoreMappingChecked}>
<EuiFlexGroup
alignItems="center"
gutterSize="s"
onClick={!isDisabled ? handleRiskScoreMappingChecked : noop}
>
<EuiFlexItem grow={false}>
<EuiCheckbox
id={`risk_score-mapping-override`}
checked={isRiskScoreMappingChecked}
checked={(field.value as AboutStepRiskScore).isMappingChecked}
disabled={isDisabled}
onChange={handleRiskScoreMappingChecked}
/>
</EuiFlexItem>
Expand All @@ -133,7 +132,7 @@ export const RiskScoreField = ({
</NestedContent>
</div>
);
}, [handleRiskScoreMappingChecked, isRiskScoreMappingChecked]);
}, [field.value, handleRiskScoreMappingChecked, isDisabled]);

return (
<EuiFlexGroup>
Expand All @@ -153,6 +152,7 @@ export const RiskScoreField = ({
componentProps={{
idAria: 'detectionEngineStepAboutRuleRiskScore',
'data-test-subj': 'detectionEngineStepAboutRuleRiskScore',
isDisabled,
euiFieldProps: {
max: 100,
min: 0,
Expand All @@ -166,11 +166,11 @@ export const RiskScoreField = ({
</EuiFormRow>
</EuiFlexItem>
<EuiFlexItem>
<EuiFormRow
<RiskScoreMappingEuiFormRow
label={riskScoreMappingLabel}
labelAppend={field.labelAppend}
helpText={
isRiskScoreMappingChecked ? (
(field.value as AboutStepRiskScore).isMappingChecked ? (
<NestedContent>{i18n.RISK_SCORE_MAPPING_DETAILS}</NestedContent>
) : (
''
Expand All @@ -184,7 +184,7 @@ export const RiskScoreField = ({
>
<NestedContent>
<EuiSpacer size="s" />
{isRiskScoreMappingChecked && (
{(field.value as AboutStepRiskScore).isMappingChecked && (
<EuiFlexGroup direction={'column'} gutterSize="s">
<EuiFlexItem>
<EuiFlexGroup alignItems="center" gutterSize="s">
Expand All @@ -208,11 +208,11 @@ export const RiskScoreField = ({
fieldTypeFilter={fieldTypeFilter}
isLoading={false}
isClearable={false}
isDisabled={false}
isDisabled={isDisabled}
onChange={handleFieldChange}
data-test-subj={dataTestSubj}
aria-label={idAria}
fieldInputWidth={230}
fieldInputWidth={270}
/>
</EuiFlexItem>
<EuiFlexItemIconColumn grow={false}>
Expand All @@ -226,7 +226,7 @@ export const RiskScoreField = ({
</EuiFlexGroup>
)}
</NestedContent>
</EuiFormRow>
</RiskScoreMappingEuiFormRow>
</EuiFlexItem>
</EuiFlexGroup>
);
Expand Down
Loading