From e43c91e87e68ca67317ba727f862752db4882ca4 Mon Sep 17 00:00:00 2001 From: Mike Salvatore Date: Thu, 28 Jan 2021 13:06:21 -0500 Subject: [PATCH] ui: Show warning message when master checkbox selected with unsafe --- .../ui-components/AdvancedMultiSelect.js | 37 ++++++++++------ .../src/components/ui-components/InfoPane.js | 43 +++++++++++++------ 2 files changed, 55 insertions(+), 25 deletions(-) diff --git a/monkey/monkey_island/cc/ui/src/components/ui-components/AdvancedMultiSelect.js b/monkey/monkey_island/cc/ui/src/components/ui-components/AdvancedMultiSelect.js index 834dcec3f..575dbae8e 100644 --- a/monkey/monkey_island/cc/ui/src/components/ui-components/AdvancedMultiSelect.js +++ b/monkey/monkey_island/cc/ui/src/components/ui-components/AdvancedMultiSelect.js @@ -3,7 +3,7 @@ import {Button, Card} from 'react-bootstrap'; import {cloneDeep} from 'lodash'; -import {getDefaultPaneParams, InfoPane} from './InfoPane'; +import {getDefaultPaneParams, InfoPane, WarningType} from './InfoPane'; import {MasterCheckbox, MasterCheckboxState} from './MasterCheckbox'; import ChildCheckboxContainer from './ChildCheckbox'; import {getFullDefinitionByKey} from './JsonSchemaHelpers'; @@ -41,7 +41,11 @@ class AdvancedMultiSelect extends React.Component { this.state = { masterCheckboxState: this.getMasterCheckboxState(props.value), hideReset: this.getHideResetState(props.value), - infoPaneParams: getDefaultPaneParams(this.infoPaneRefString, this.registry) + infoPaneParams: getDefaultPaneParams( + this.infoPaneRefString, + this.registry, + this.unsafeOptionsSelected(this.props.value) + ) }; } @@ -55,6 +59,7 @@ class AdvancedMultiSelect extends React.Component { this.props.onChange(newValues); this.setMasterCheckboxState(newValues); this.setHideResetState(newValues); + this.setPaneInfoToDefault(this.unsafeOptionsSelected(newValues)); } onChildCheckboxClick = (value) => { @@ -98,7 +103,7 @@ class AdvancedMultiSelect extends React.Component { this.props.onChange(this.defaultValues); this.setHideResetState(this.defaultValues); this.setMasterCheckboxState(this.defaultValues); - this.setPaneInfoToDefault(); + this.setPaneInfoToDefault(this.unsafeOptionsSelected(this.defaultValues)); } setHideResetState(selectValues) { @@ -108,7 +113,15 @@ class AdvancedMultiSelect extends React.Component { } getHideResetState(selectValues) { - return selectValues.every((value) => this.isSafe(value)); + return !(this.unsafeOptionsSelected(selectValues)) + } + + unsafeOptionsSelected(selectValues) { + return !(selectValues.every((value) => this.isSafe(value))); + } + + isSafe = (itemKey) => { + return getFullDefinitionByKey(this.infoPaneRefString, this.registry, itemKey).safe; } setPaneInfo = (itemKey) => { @@ -119,22 +132,22 @@ class AdvancedMultiSelect extends React.Component { title: definitionObj.title, content: definitionObj.info, link: definitionObj.link, - showWarning: !(this.isSafe(itemKey)) + warningType: !(this.isSafe(itemKey)) ? WarningType.SINGLE : WarningType.NONE } } ); } - setPaneInfoToDefault() { + setPaneInfoToDefault(unsafeOptionsSelected) { this.setState(() => ({ - infoPaneParams: getDefaultPaneParams(this.props.schema.items.$ref, this.props.registry) + infoPaneParams: getDefaultPaneParams( + this.props.schema.items.$ref, + this.props.registry, + unsafeOptionsSelected + ) })); } - isSafe = (itemKey) => { - return getFullDefinitionByKey(this.infoPaneRefString, this.registry, itemKey).safe; - } - render() { const { schema, @@ -161,7 +174,7 @@ class AdvancedMultiSelect extends React.Component { + warningType={this.state.infoPaneParams.warningType}/> ); } diff --git a/monkey/monkey_island/cc/ui/src/components/ui-components/InfoPane.js b/monkey/monkey_island/cc/ui/src/components/ui-components/InfoPane.js index f0545a5c6..841eafe16 100644 --- a/monkey/monkey_island/cc/ui/src/components/ui-components/InfoPane.js +++ b/monkey/monkey_island/cc/ui/src/components/ui-components/InfoPane.js @@ -6,13 +6,19 @@ import {faQuestionCircle} from '@fortawesome/free-solid-svg-icons'; import {getObjectFromRegistryByRef} from './JsonSchemaHelpers'; import WarningIcon from './WarningIcon'; -function getDefaultPaneParams(refString, registry) { +const WarningType = { + NONE: 0, + SINGLE: 1, + MULTIPLE: 2 +} + +function getDefaultPaneParams(refString, registry, unsafeOptionsSelected) { let configSection = getObjectFromRegistryByRef(refString, registry); return ( { title: configSection.title, content: configSection.description, - showWarning: false + warningType: unsafeOptionsSelected ? WarningType.Multiple : WarningType.NONE }); } @@ -56,8 +62,8 @@ function getSubtitle(props) { function getBody(props) { let body = [{props.body}]; - if (props.showWarning) { - body.push(getWarning()); + if (props.warningType != WarningType.NONE) { + body.push(getWarning(props.warningType)); } return ( @@ -67,14 +73,25 @@ function getBody(props) { ) } -function getWarning() { - return ( -
- This option may cause a system to become unstable or - change the system's state in undesirable ways. Therefore, this option - is not recommended for use in production or other sensitive environments. -
- ); +function getWarning(warningType) { + if (warningType == WarningType.SINGLE) { + return ( +
+ This option may cause a system to become unstable or may + change a system's state in undesirable ways. Therefore, this option + is not recommended for use in production or other sensitive environments. +
+ ); + } else { + return ( +
+ Some options have been selected that may cause a system + to become unstable or may change a system's state in undesirable ways. + Running Infection Monkey in a production or other sensitive environment + with this configuration is not recommended. +
+ ); + } } -export {getDefaultPaneParams, InfoPane} +export {getDefaultPaneParams, InfoPane, WarningType}