p17860254
/
monkey
forked from p15670423/monkey
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Refactor form data in ConfigurePage.js to be held in state 

This change will allow dynamically modifying other state parameters and re-rendering on form data change
This commit is contained in:
VakarisZ 2021-06-30 14:24:27 +03:00
parent a82850cb64
commit 889df554ae
1 changed files with 13 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
monkey/monkey_island/cc/ui/src/components/pages/ConfigurePage.js
View File

@ -27,7 +27,6 @@ class ConfigurePageComponent extends AuthComponent {
constructor(props) { constructor(props) {
super(props); super(props);
this.currentSection = 'attack'; this.currentSection = 'attack';
this.currentFormData = {};
this.initialConfig = {}; this.initialConfig = {};
this.initialAttackConfig = {}; this.initialAttackConfig = {};
this.sectionsOrder = ['attack', 'basic', 'basic_network', 'ransomware', 'monkey', 'internal']; this.sectionsOrder = ['attack', 'basic', 'basic_network', 'ransomware', 'monkey', 'internal'];
@ -35,6 +34,7 @@ class ConfigurePageComponent extends AuthComponent {
this.state = { this.state = {
attackConfig: {}, attackConfig: {},
configuration: {}, configuration: {},
currentFormData: {},
importCandidateConfig: null, importCandidateConfig: null,
lastAction: 'none', lastAction: 'none',
schema: {}, schema: {},
@ -213,14 +213,15 @@ class ConfigurePageComponent extends AuthComponent {
}; };
onChange = ({formData}) => { onChange = ({formData}) => {
this.currentFormData = formData; let configuration = this.state.configuration;
configuration[this.state.selectedSection] = formData;
this.setState({currentFormData: formData, configuration: configuration});
}; };
updateConfigSection = () => { updateConfigSection = () => {
let newConfig = this.state.configuration; let newConfig = this.state.configuration;
if (Object.keys(this.currentFormData).length > 0) { if (Object.keys(this.state.currentFormData).length > 0) {
newConfig[this.currentSection] = this.currentFormData; newConfig[this.currentSection] = this.state.currentFormData;
this.currentFormData = {};
} }
this.setState({configuration: newConfig, lastAction: 'none'}); this.setState({configuration: newConfig, lastAction: 'none'});
}; };
@ -295,8 +296,8 @@ class ConfigurePageComponent extends AuthComponent {
userChangedConfig() { userChangedConfig() {
if (JSON.stringify(this.state.configuration) === JSON.stringify(this.initialConfig)) { if (JSON.stringify(this.state.configuration) === JSON.stringify(this.initialConfig)) {
if (Object.keys(this.currentFormData).length === 0 || if (Object.keys(this.state.currentFormData).length === 0 ||
JSON.stringify(this.initialConfig[this.currentSection]) === JSON.stringify(this.currentFormData)) { JSON.stringify(this.initialConfig[this.currentSection]) === JSON.stringify(this.state.currentFormData)) {
return false; return false;
} }
} }
@ -316,7 +317,8 @@ class ConfigurePageComponent extends AuthComponent {
this.updateConfigSection(); this.updateConfigSection();
this.currentSection = key; this.currentSection = key;
this.setState({ this.setState({
selectedSection: key selectedSection: key,
currentFormData: this.state.configuration[key]
}); });
}; };
@ -332,7 +334,8 @@ class ConfigurePageComponent extends AuthComponent {
this.setState({ this.setState({
lastAction: 'reset', lastAction: 'reset',
schema: res.schema, schema: res.schema,
configuration: res.configuration configuration: res.configuration,
currentFormData: res.configuration[this.state.selectedSection]
}); });
this.setInitialConfig(res.configuration); this.setInitialConfig(res.configuration);
this.props.onStatusChange(); this.props.onStatusChange();
@ -407,7 +410,7 @@ class ConfigurePageComponent extends AuthComponent {
setPbaFilenameLinux: this.setPbaFilenameLinux, setPbaFilenameLinux: this.setPbaFilenameLinux,
selectedSection: this.state.selectedSection selectedSection: this.state.selectedSection
}) })
formProperties['formData'] = this.state.configuration[this.state.selectedSection]; formProperties['formData'] = this.state.currentFormData;
formProperties['onChange'] = this.onChange; formProperties['onChange'] = this.onChange;
formProperties['customFormats'] = formValidationFormats; formProperties['customFormats'] = formValidationFormats;
formProperties['transformErrors'] = transformErrors; formProperties['transformErrors'] = transformErrors;