diff --git a/monkey/monkey_island/cc/ui/src/components/configuration-components/InternalConfig.js b/monkey/monkey_island/cc/ui/src/components/configuration-components/InternalConfig.js new file mode 100644 index 000000000..feedd533f --- /dev/null +++ b/monkey/monkey_island/cc/ui/src/components/configuration-components/InternalConfig.js @@ -0,0 +1,69 @@ +import Form from 'react-jsonschema-form-bs4'; +import React, {useState} from 'react'; +import {Nav} from 'react-bootstrap'; + +const sectionOrder = ['network', 'monkey', 'island_server', 'logging', 'exploits', 'dropper', 'classes', 'general', + 'kill_file', 'testing']; +const initialSection = sectionOrder[0]; + +export default function InternalConfig(props) { + const { + schema, + uiSchema, + onChange, + customFormats, + className, + formData + } = props; + const [selectedSection, setSelectedSection] = useState(initialSection); + const [displayedSchema, setDisplayedSchema] = useState(getSchemaByKey(schema, initialSection)); + const [displayedSchemaUi, setDisplayedSchemaUi] = useState(uiSchema[initialSection]) + + const onInnerDataChange = (innerData) => { + formData[selectedSection] = innerData.formData; + onChange({formData: formData}); + } + + const setSection = (sectionKey) => { + setSelectedSection(sectionKey); + setDisplayedSchema(getSchemaByKey(schema, sectionKey)); + setDisplayedSchemaUi(uiSchema[sectionKey]) + } + + const renderNav = () => { + return () + } + + return (
+ {renderNav()} +
+ +
+
) +}; + +function getSchemaByKey(schema, key) { + let definitions = schema['definitions'] + return {definitions: definitions, properties: schema['properties'][key]['properties']} +} + +function getNavTitle(schema, key) { + return schema.properties[key].title; +} diff --git a/monkey/monkey_island/cc/ui/src/components/pages/ConfigurePage.js b/monkey/monkey_island/cc/ui/src/components/pages/ConfigurePage.js index 0fe3251eb..97e1056b9 100644 --- a/monkey/monkey_island/cc/ui/src/components/pages/ConfigurePage.js +++ b/monkey/monkey_island/cc/ui/src/components/pages/ConfigurePage.js @@ -10,6 +10,7 @@ import {faInfoCircle} from '@fortawesome/free-solid-svg-icons/faInfoCircle'; import {faCheck} from '@fortawesome/free-solid-svg-icons/faCheck'; import {faExclamationCircle} from '@fortawesome/free-solid-svg-icons/faExclamationCircle'; import {formValidationFormats} from "../configuration-components/ValidationFormats"; +import InternalConfig from "../configuration-components/InternalConfig"; const ATTACK_URL = '/api/attack'; const CONFIG_URL = '/api/configuration/island'; @@ -244,8 +245,8 @@ class ConfigurePageComponent extends AuthComponent { this.props.onStatusChange(); } ).then(() => { - this.removePBAfile(API_PBA_WINDOWS, this.setPbaFilenameWindows) - this.removePBAfile(API_PBA_LINUX, this.setPbaFilenameLinux) + this.removePBAfile(API_PBA_WINDOWS, this.setPbaFilenameWindows) + this.removePBAfile(API_PBA_LINUX, this.setPbaFilenameLinux) }); this.authFetch(ATTACK_URL, { method: 'POST', @@ -331,24 +332,33 @@ class ConfigurePageComponent extends AuthComponent { }; renderConfigContent = (displayedSchema) => { - return (
- {this.renderBasicNetworkWarning()} -
- -
-
) + let formProperties = {}; + formProperties['schema'] = displayedSchema + formProperties['uiSchema'] = UiSchema({ + PBA_linux_filename: this.state.configuration.monkey.post_breach.PBA_linux_filename, + PBA_windows_filename: this.state.configuration.monkey.post_breach.PBA_windows_filename, + setPbaFilenameWindows: this.setPbaFilenameWindows, + setPbaFilenameLinux: this.setPbaFilenameLinux, + selectedSection: this.state.selectedSection + }) + formProperties['formData'] = this.state.configuration[this.state.selectedSection] + formProperties['onChange'] = this.onChange + formProperties['customFormats'] = formValidationFormats + formProperties['className'] = 'config-form' + formProperties['liveValidate'] = true + + if (this.state.selectedSection === 'internal') { + return () + } else { + return ( +
+ {this.renderBasicNetworkWarning()} +
+ +
+
+ ) + } }; setPbaFilenameWindows = (filename) => { @@ -388,9 +398,9 @@ class ConfigurePageComponent extends AuthComponent { {this.state.sections.map(section => { let classProp = section.key.startsWith('basic') ? 'tab-primary' : ''; return ( - - {section.title} - ); + + {section.title} + ); })} ) };