p15670423
/
monkey
1
0
Fork 5
Code Issues Pull Requests 3 Projects Releases Wiki Activity

Basic structure of run monkey page step by step wizard

This commit is contained in:
VakarisZ 2020-08-21 11:30:54 +03:00
parent 7e90609b98
commit 5eaed088d6
13 changed files with 229 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
monkey/monkey_island/cc/ui/src/components/AuthComponent.js
View File

@ -10,4 +10,10 @@ class AuthComponent extends React.Component {
}
}
export function authFetch(){
const auth = new AuthService();
const authFetch = auth.authFetch;
const jwtHeader = auth.jwtHeader();
}
export default AuthComponent;

2
monkey/monkey_island/cc/ui/src/components/Main.js
View File

@ -4,7 +4,7 @@ import {Container} from 'react-bootstrap';
import RunServerPage from 'components/pages/RunServerPage';
import ConfigurePage from 'components/pages/ConfigurePage';
import RunMonkeyPage from 'components/pages/RunMonkeyPage';
import RunMonkeyPage from 'components/pages/RunMonkeyPage/RunMonkeyPage';
import MapPage from 'components/pages/MapPage';
import TelemetryPage from 'components/pages/TelemetryPage';
import StartOverPage from 'components/pages/StartOverPage';

0
monkey/monkey_island/cc/ui/src/components/pages/RunMonkeyPage/CommandTypes.js Normal file
View File

29
monkey/monkey_island/cc/ui/src/components/pages/RunMonkeyPage/InterfaceSelection.js Normal file
View File

@ -0,0 +1,29 @@
import React, {useEffect, useState} from 'react';
import NextSelectionButton from '../../ui-components/inline-selection/NextSelectionButton';
import InlineSelection from '../../ui-components/inline-selection/InlineSelection';
import CommandSection from '../../ui-components/inline-selection/CommandSection';
import LocalManualRunOptions from './LocalManualRunOptions';
function InterfaceSelection(props) {
return InlineSelection(getContents, props, LocalManualRunOptions)
}
const getContents = (props) => {
const ips = props.ips.map((ip) =>
<div>{ip}</div>
);
return (<div>{ips}</div>);
}
const setCommandAsContent = (props) => {
let commandComponent = () => InlineSelection(CommandSection,
{
commands: win64commands,
setComponent: props.setComponent
},
LocalManualRunOptions
);
props.setComponent(commandComponent, props);
}
export default InterfaceSelection;

42
monkey/monkey_island/cc/ui/src/components/pages/RunMonkeyPage/LocalManualRunOptions.js Normal file
View File

@ -0,0 +1,42 @@
import React, {useEffect} from 'react';
import NextSelectionButton from '../../ui-components/inline-selection/NextSelectionButton';
import InlineSelection from '../../ui-components/inline-selection/InlineSelection';
import CommandSection from '../../ui-components/inline-selection/CommandSection';
import ManualRunOptions from './ManualRunOptions';
import InterfaceSelection from './InterfaceSelection';
const LocalManualRunOptions = (props) => {
return InlineSelection(getContents, props, ManualRunOptions)
}
const win64commands = [{name: "CMD", command: "monkey.exe m0nk3y -s 192.168.56.1"}]
const getContents = (props) => {
return (
<>
<NextSelectionButton text={'Windows 64bit'}
onButtonClick={() => {
props.setComponent(InterfaceSelection('Windows64'))
}}/>
<NextSelectionButton text={'Windows 32bit'} onButtonClick={() => {
}}/>
<NextSelectionButton text={'Linux 64bit'} onButtonClick={() => {
}}/>
<NextSelectionButton text={'Linux 32bit'} onButtonClick={() => {
}}/>
</>
)
}
const setCommandAsContent = (props) => {
let commandComponent = () => InlineSelection(CommandSection,
{
commands: win64commands,
setComponent: props.setComponent
},
LocalManualRunOptions
);
props.setComponent(commandComponent, props);
}
export default LocalManualRunOptions;

58
monkey/monkey_island/cc/ui/src/components/pages/RunMonkeyPage/ManualRunOptions.js Normal file
View File

@ -0,0 +1,58 @@
import React, {useEffect, useState} from 'react';
import NextSelectionButton from '../../ui-components/inline-selection/NextSelectionButton';
import LocalManualRunOptions from './LocalManualRunOptions';
import AuthComponent from '../../AuthComponent';
function ManualRunOptions(props) {
const [currentContent, setCurrentContent] = useState(loadingContents());
const [ips, setIps] = useState([]);
const [initialized, setInitialized] = useState(false);
const authComponent = new AuthComponent({})
useEffect(() => {
if (initialized === false) {
authComponent.authFetch('/api')
.then(res => res.json())
.then(res => {
setIps([res['ip_addresses']]);
setInitialized(true);
});
}
})
useEffect(() => {
setCurrentContent(getDefaultContents());
}, [initialized])
function setComponent(component, props) {
if (component === undefined) {
setCurrentContent(getDefaultContents())
} else {
setCurrentContent(component({...props}))
}
}
function loadingContents() {
return (<div>Loading</div>)
}
function getDefaultContents() {
return (
<div className={`container inline-selection-component`}>
<NextSelectionButton text={'Local'} onButtonClick={() => {
setComponent(LocalManualRunOptions, {ips: ips, setComponent: setComponent})
}}/>
<NextSelectionButton text={'Remote'} onButtonClick={() => {
}}/>
<NextSelectionButton text={'Automation'} onButtonClick={() => {
}}/>
</div>
);
}
return currentContent;
}
export default ManualRunOptions;

20
monkey/monkey_island/cc/ui/src/components/pages/RunMonkeyPage.js → monkey/monkey_island/cc/ui/src/components/pages/RunMonkeyPage/RunMonkeyPage.js
View File

@ -12,10 +12,11 @@ import {faInfoCircle} from '@fortawesome/free-solid-svg-icons/faInfoCircle';
import {faExclamationTriangle} from '@fortawesome/free-solid-svg-icons/faExclamationTriangle';
import {Link} from 'react-router-dom';
import AuthComponent from '../AuthComponent';
import AwsRunTable from '../run-monkey/AwsRunTable';
import AuthComponent from '../../AuthComponent';
import AwsRunTable from '../../run-monkey/AwsRunTable';
import MissingBinariesModal from '../ui-components/MissingBinariesModal';
import MissingBinariesModal from '../../ui-components/MissingBinariesModal';
import ManualRunOptions from './ManualRunOptions';
const loading_css_override = css`
display: block;
@ -329,22 +330,11 @@ class RunMonkeyPageComponent extends AuthComponent {
showModal={this.state.showModal}
onClose={this.closeModal}
errorDetails={this.state.errorDetails}/>
{
// TODO: implement button functionality
/*
<button
className="btn btn-default"
disabled={this.state.runningOnClientState !== 'not_running'}
style={{'marginLeft': '1em'}}>
Download and run locally
{ this.renderIconByState(this.state.runningOnClientState) }
</button>
*/
}
</p>
<p className="text-center">
OR
</p>
<ManualRunOptions />
<p className={'text-center'}
style={this.state.showManual || !this.state.isOnAws ? {'marginBottom': '2em'} : {}}>
<Button onClick={this.toggleManual}

15
monkey/monkey_island/cc/ui/src/components/ui-components/inline-selection/BackButton.js Normal file
View File

@ -0,0 +1,15 @@
import {Button} from 'react-bootstrap';
import React from 'react';
import PropTypes from 'prop-types';
export default function backButton(props) {
return (
<Button variant={'secondary'} onClick={props.onClick}>
Back
</Button>
)
}
backButton.propTypes = {
onClick: PropTypes.func
}

19
monkey/monkey_island/cc/ui/src/components/ui-components/inline-selection/CommandSection.js Normal file
View File

@ -0,0 +1,19 @@
import React from 'react';
import PropTypes from 'prop-types';
export default function CommandSection(props){
return (
<div className={'command-section'}>
{props.commands[0].name}
{props.commands[0].command}
</div>
)
}
CommandSection.propTypes = {
commands: PropTypes.arrayOf(PropTypes.exact({
name: PropTypes.string,
command: PropTypes.string
}))
}

28
monkey/monkey_island/cc/ui/src/components/ui-components/inline-selection/InlineSelection.js Normal file
View File

@ -0,0 +1,28 @@
import React from 'react';
import PropTypes from 'prop-types';
import BackButton from './BackButton';
import ManualRunOptions from '../../pages/RunMonkeyPage/ManualRunOptions';
export default function InlineSelection(WrappedComponent, props, previousComponent){
return (
<div className={`container inline-selection-component`}>
{previousComponent === undefined ? '' :
<BackButton onClick={() => {setPreviousComponent(props, previousComponent)}}/>}
<WrappedComponent {...props}/>
</div>
)
}
function setPreviousComponent(props, previousComponent) {
if(previousComponent === ManualRunOptions){
return props.setComponent()
} else {
return props.setComponent(previousComponent)
}
}
InlineSelection.propTypes = {
setComponent: PropTypes.func,
ips: PropTypes.arrayOf(PropTypes.string)
}

17
monkey/monkey_island/cc/ui/src/components/ui-components/inline-selection/NextSelectionButton.js Normal file
View File

@ -0,0 +1,17 @@
import {Button} from 'react-bootstrap';
import React from 'react';
import PropTypes from 'prop-types';
export default function nextSelectionButton(props) {
return (
<Button variant={'outline-monkey'} size='lg' className={'selection-button'}
onClick={props.onButtonClick}>
{props.text}
</Button>
)
}
nextSelectionButton.propTypes = {
text: PropTypes.string,
onButtonClick: PropTypes.func
}

1
monkey/monkey_island/cc/ui/src/styles/Main.scss
View File

@ -11,6 +11,7 @@
@import 'components/InfoPane';
@import 'components/PreviewPane';
@import 'components/AdvancedMultiSelect';
@import 'components/InlineSelection';
// Define custom elements after bootstrap import

8
monkey/monkey_island/cc/ui/src/styles/components/InlineSelection.scss Normal file
View File

@ -0,0 +1,8 @@
.inline-selection-component.container {
display: flex;
justify-content: center;
}
.inline-selection-component.container .selection-button{
margin: 0 5px 0 5px;
}