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

Run monkey page improvement, small style and attack report fixes

This commit is contained in:
VakarisZ 2020-06-23 16:31:00 +03:00
parent 44c8ffda60
commit 37f356a6e2
5 changed files with 74 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,6 +1,6 @@
import React from 'react';
import {css} from '@emotion/core';
import {Button, Col, Card, Nav, Collapse} from 'react-bootstrap';
import {Button, Col, Card, Nav, Collapse, Row} from 'react-bootstrap';
import CopyToClipboard from 'react-copy-to-clipboard';
import GridLoader from 'react-spinners/GridLoader';
@ -17,8 +17,6 @@ import AwsRunTable from '../run-monkey/AwsRunTable';
import MissingBinariesModal from '../ui-components/MissingBinariesModal';
import '../../styles/MonkeyRunPage.scss';
const loading_css_override = css`
display: block;
margin-right: auto;
@ -141,8 +139,9 @@ class RunMonkeyPageComponent extends AuthComponent {
/* If Monkey binaries are missing, change the state accordingly */
if (res['error_text'].startsWith('Copy file failed')) {
this.setState({
showModal: true,
errorDetails: res['error_text']}
showModal: true,
errorDetails: res['error_text']
}
);
}
this.setState({
@ -327,9 +326,9 @@ class RunMonkeyPageComponent extends AuthComponent {
{RunMonkeyPageComponent.renderIconByState(this.state.runningOnIslandState)}
</Button>
<MissingBinariesModal
showModal = {this.state.showModal}
onClose = {this.closeModal}
errorDetails = {this.state.errorDetails}/>
showModal={this.state.showModal}
onClose={this.closeModal}
errorDetails={this.state.errorDetails}/>
{
// TODO: implement button functionality
/*
@ -358,38 +357,55 @@ class RunMonkeyPageComponent extends AuthComponent {
<Collapse in={this.state.showManual}>
<div style={{'marginBottom': '2em'}}>
<p style={{'fontSize': '1.2em'}}>
Choose the operating system where you want to run the monkey
{this.state.ips.length > 1 ? ', and the interface to communicate with.' : '.'}
Choose the operating system where you want to run the monkey:
</p>
<Nav variant='pills' id={'bootstrap-override'} className={'run-on-os-buttons'}
activeKey={this.state.selectedOs} onSelect={this.setSelectedOs}>
<Nav.Item>
<Nav.Link eventKey={'windows-32'}>
Windows (32 bit)
</Nav.Link>
</Nav.Item>
<Nav.Item>
<Nav.Link eventKey='windows-64'>
Windows (64 bit)
</Nav.Link>
</Nav.Item>
<Nav.Item>
<Nav.Link eventKey='linux-32' variant={'monkey-alt'}>
Linux (32 bit)
</Nav.Link>
</Nav.Item>
<Nav.Item>
<Nav.Link eventKey='linux-64'>
Linux (64 bit)
</Nav.Link>
</Nav.Item>
</Nav>
<Row>
<Col>
<Nav variant='pills' fill id={'bootstrap-override'} className={'run-on-os-buttons'}
activeKey={this.state.selectedOs} onSelect={this.setSelectedOs}>
<Nav.Item>
<Nav.Link eventKey={'windows-32'}>
Windows (32 bit)
</Nav.Link>
</Nav.Item>
<Nav.Item>
<Nav.Link eventKey='windows-64'>
Windows (64 bit)
</Nav.Link>
</Nav.Item>
<Nav.Item>
<Nav.Link eventKey='linux-32'>
Linux (32 bit)
</Nav.Link>
</Nav.Item>
<Nav.Item>
<Nav.Link eventKey='linux-64'>
Linux (64 bit)
</Nav.Link>
</Nav.Item>
</Nav>
</Col>
</Row>
{this.state.ips.length > 1 ?
<Nav variant="pills" activeKey={this.state.selectedIp} onSelect={this.setSelectedIp}
className={'run-on-os-buttons'}>
{this.state.ips.map(ip => <Nav.Item>
<Nav.Link eventKey={ip}>{ip}</Nav.Link></Nav.Item>)}
</Nav>
<div>
<Row>
<Col>
<p style={{'fontSize': '1.2em'}}>
Choose the interface to communicate with:
</p>
</Col>
</Row>
<Row>
<Col>
<Nav variant="pills" fill activeKey={this.state.selectedIp} onSelect={this.setSelectedIp}
className={'run-on-os-buttons'}>
{this.state.ips.map(ip => <Nav.Item>
<Nav.Link eventKey={ip}>{ip}</Nav.Link></Nav.Item>)}
</Nav>
</Col>
</Row>
</div>
: <div style={{'marginBottom': '2em'}}/>
}
<p style={{'fontSize': '1.2em'}}>

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

@ -3,11 +3,12 @@
@import '../../node_modules/bootstrap/scss/bootstrap';
// Imports that require variables
@import './report/ReportPage';
@import './report/ReportPage.scss';
@import './report/AttackReport.scss';
@import './PreviewPane.scss';
@import './ConfigurationPage';
@import './AuthPage';
@import './ConfigurationPage.scss';
@import './AuthPage.scss';
@import './MonkeyRunPage.scss';
// Define custom elements after bootstrap import
@ -16,6 +17,11 @@
color: $monkey-black;
}
.btn-outline-monkey-alt, button {
@include button-outline-variant($monkey-alt, $monkey-white, $monkey-alt, $monkey-alt);
color: $monkey-black;
}
.btn-outline-standard, button {
@include button-outline-variant($light-gray, $monkey-black, $light-gray, $light-gray);
color: $monkey-black;

9
monkey/monkey_island/cc/ui/src/styles/MonkeyRunPage.scss
View File

@ -5,3 +5,12 @@ div.run-on-os-buttons {
div.run-on-os-buttons > .nav-item{
margin: 0 10px 0 10px;
}
div.run-on-os-buttons > .nav-item > .nav-link{
border: 1px solid $monkey-alt;
}
div.run-on-os-buttons > .nav-item > .nav-link:hover{
color: $monkey-white;
background-color: $monkey-alt;
}

2
monkey/monkey_island/cc/ui/src/styles/_variables.scss
View File

@ -1,6 +1,6 @@
$monkey-alt: #28a745;
$monkey-yellow: #ffc107;
$monkey-black: #000;
$monkey-black: #000000;
$monkey-white: #ffffff;
$light-gray: #ececec;

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

@ -50,6 +50,7 @@
}
.attack-report .toggle-btn {
box-shadow: None !important;
padding: 0;
margin-bottom: 30px;
margin-left: 6px;