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

Style improvements to pass travis

This commit is contained in:
VakarisZ 2019-11-29 10:07:43 +02:00
parent aff66d8994
commit 4d68da2c15
5 changed files with 37 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
monkey/monkey_island/cc/ui/src/components/pages/ReportPage.js
View File

@ -1,7 +1,7 @@
import '../../styles/report/ReportPage.scss';
import React from 'react';
import {Route} from "react-router-dom";
import {Route} from 'react-router-dom';
import {Col, Nav, NavItem} from 'react-bootstrap';
import {ReactiveGraph} from 'components/reactive-graph/ReactiveGraph';
import {edgeGroupToColor, options} from 'components/map/MapOptions';
@ -10,8 +10,8 @@ import MustRunMonkeyWarning from '../report-components/common/MustRunMonkeyWarni
import AttackReport from '../report-components/AttackReport'
import SecurityReport from '../report-components/SecurityReport'
import ZeroTrustReport from '../report-components/ZeroTrustReport'
import {extractExecutionStatusFromServerResponse} from "../report-components/common/ExecutionStatus";
import MonkeysStillAliveWarning from "../report-components/common/MonkeysStillAliveWarning";
import {extractExecutionStatusFromServerResponse} from '../report-components/common/ExecutionStatus';
import MonkeysStillAliveWarning from '../report-components/common/MonkeysStillAliveWarning';
class ReportPageComponent extends AuthComponent {
@ -110,10 +110,10 @@ class ReportPageComponent extends AuthComponent {
renderNav = () => {
return (
<Route render={({history}) => (
<Nav bsStyle="tabs" justified
<Nav bsStyle='tabs' justified
activeKey={this.state.selectedSection}
onSelect={(key) => {this.setSelectedSection(key); history.push(key)}}
className={"report-nav"}>
className={'report-nav'}>
{this.state.sections.map(section => this.renderNavButton(section))}
</Nav>)}/>)
};
@ -147,7 +147,7 @@ class ReportPageComponent extends AuthComponent {
}
return (
<Col xs={12} lg={10}>
<h1 className="page-title no-print">4. Security Reports</h1>
<h1 className='page-title no-print'>4. Security Reports</h1>
{this.renderNav()}
<MonkeysStillAliveWarning allMonkeysAreDead={this.state.allMonkeysAreDead}/>
<div style={{'fontSize': '1.2em'}}>

18
monkey/monkey_island/cc/ui/src/components/report-components/AttackReport.js
View File

@ -71,7 +71,7 @@ class AttackReport extends React.Component {
super(props);
this.state = {
selectedTechnique: false,
collapseOpen: '',
collapseOpen: ''
};
if (typeof this.props.report.schema !== 'undefined' && typeof this.props.report.techniques !== 'undefined'){
this.state['schema'] = this.props.report['schema'];
@ -87,7 +87,6 @@ class AttackReport extends React.Component {
}
onTechniqueSelect = (technique, value, mapped = false) => {
//this.setState({selectedTechnique: technique});
let selectedTechnique = this.getTechniqueByTitle(technique);
if (selectedTechnique === false){
return;
@ -107,17 +106,17 @@ class AttackReport extends React.Component {
}
renderLegend() {
return (<div id="header" className="row justify-content-between attack-legend">
return (<div id='header' className='row justify-content-between attack-legend'>
<Col xs={4}>
<FontAwesomeIcon icon={faCircle} className="icon-default"/>
<FontAwesomeIcon icon={faCircle} className='icon-default'/>
<span> - Not scanned</span>
</Col>
<Col xs={4}>
<FontAwesomeIcon icon={faCircle} className="icon-info"/>
<FontAwesomeIcon icon={faCircle} className='icon-info'/>
<span> - Scanned</span>
</Col>
<Col xs={4}>
<FontAwesomeIcon icon={faCircle} className="icon-danger"/>
<FontAwesomeIcon icon={faCircle} className='icon-danger'/>
<span> - Used</span>
</Col>
</div>)
@ -125,12 +124,12 @@ class AttackReport extends React.Component {
generateReportContent() {
return (
<div id="attack" className="attack-report report-page">
<div id='attack' className='attack-report report-page'>
<ReportHeader report_type={ReportTypes.attack}/>
<hr/>
<p>
This report shows information about
<Button bsStyle={"link"} href={"https://attack.mitre.org/"} bsSize={"lg"} className={"attack-link"}>ATT&CK </Button>
<Button bsStyle={'link'} href={'https://attack.mitre.org/'} bsSize={'lg'} className={'attack-link'}>ATT&CK </Button>
techniques used by Infection Monkey.
</p>
{this.renderLegend()}
@ -147,6 +146,7 @@ class AttackReport extends React.Component {
getTechniqueByTitle(title){
for (let tech_id in this.state.techniques){
if (! this.state.techniques.hasOwnProperty(tech_id)) {return false;}
let technique = this.state.techniques[tech_id];
if (technique.title === title){
technique['tech_id'] = tech_id;
@ -159,8 +159,10 @@ class AttackReport extends React.Component {
static addLinksToTechniques(schema, techniques){
schema = schema.properties;
for(let type in schema){
if (! schema.hasOwnProperty(type)) {return false;}
let typeTechniques = schema[type].properties;
for(let tech_id in typeTechniques){
if (! typeTechniques.hasOwnProperty(tech_id)) {return false;}
if (typeTechniques[tech_id] !== undefined){
techniques[tech_id]['link'] = typeTechniques[tech_id].link
}

16
monkey/monkey_island/cc/ui/src/components/report-components/attack/SelectedTechnique.js
View File

@ -1,9 +1,9 @@
import React from "react";
import React from 'react';
import Collapse from '@kunukn/react-collapse';
import AttackReport from '../AttackReport';
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
import {faQuestionCircle} from "@fortawesome/free-solid-svg-icons";
import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
import {faQuestionCircle} from '@fortawesome/free-solid-svg-icons';
const classNames = require('classnames');
@ -34,13 +34,13 @@ class SelectedTechnique extends React.Component {
AttackReport.getComponentClass(tech_id, this.state.techniques))}>
<span>{this.state.techniques[tech_id].title}</span>
<span>
<a href={this.state.techniques[tech_id].link} target="_blank" className={"link-to-technique"}>
<a href={this.state.techniques[tech_id].link} target='_blank' className={'link-to-technique'}>
<FontAwesomeIcon icon={faQuestionCircle}/>
</a>
</span>
</button>
<Collapse
className="collapse-comp"
className='collapse-comp'
isOpen={true}
render={() => {
return (<div className={`content ${tech_id}`}>
@ -55,15 +55,15 @@ class SelectedTechnique extends React.Component {
let content = {};
let selectedTechId = this.state.selectedTechnique;
if(selectedTechId === false){
content = "None. Select a technique from ATT&CK matrix above.";
content = 'None. Select a technique from ATT&CK matrix above.';
} else {
content = this.getSelectedTechniqueComponent(selectedTechId)
}
return (
<div>
<h3 className="selected-technique-title">Selected technique:</h3>
<section className="attack-report selected-technique">
<h3 className='selected-technique-title'>Selected technique:</h3>
<section className='attack-report selected-technique'>
{content}
</section>
</div>

16
monkey/monkey_island/cc/ui/src/components/report-components/attack/TechniqueDropdowns.js
View File

@ -1,4 +1,4 @@
import React from "react";
import React from 'react';
import Collapse from '@kunukn/react-collapse';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faQuestionCircle, faChevronUp, faChevronDown } from '@fortawesome/free-solid-svg-icons'
@ -36,14 +36,14 @@ class TechniqueDropdowns extends React.Component{
onClick={() => this.onToggle(tech_id)}>
<span>{this.state.techniques[tech_id].title}</span>
<span>
<a href={this.state.techniques[tech_id].link} target="_blank" className={"link-to-technique"}>
<a href={this.state.techniques[tech_id].link} target='_blank' className={'link-to-technique'}>
<FontAwesomeIcon icon={faQuestionCircle}/>
</a>
<FontAwesomeIcon icon={this.state.collapseOpen === tech_id ? faChevronDown : faChevronUp}/>
</span>
</button>
<Collapse
className="collapse-comp"
className='collapse-comp'
isOpen={this.state.collapseOpen === tech_id}
onChange={({collapseState}) => {
this.setState({tech_id: collapseState});
@ -73,18 +73,18 @@ class TechniqueDropdowns extends React.Component{
let listClass = '';
let content = [];
if (this.state.techniquesHidden){
listClass = "hidden-list"
listClass = 'hidden-list'
} else {
Object.keys(this.state.techniques).forEach((tech_id) => {
content.push(this.getTechniqueCollapse(tech_id))
});
}
return (
<div className="dropdown-list">
<Button bsStyle="link"
bsSize="large"
<div className='dropdown-list'>
<Button bsStyle='link'
bsSize='large'
onClick={() => this.toggleTechList()}>
{this.state.techniquesHidden ? "Show all" : "Hide all"}
{this.state.techniquesHidden ? 'Show all' : 'Hide all'}
</Button>
<section className={`attack-report ${listClass}`}>{content}</section>
</div>);

10
monkey/monkey_island/cc/ui/src/components/ui-components/Checkbox.js
View File

@ -19,7 +19,7 @@ class CheckboxComponent extends React.PureComponent {
*/
constructor(props) {
super(props);
if (this.props.hasOwnProperty("status")){
if (this.props.hasOwnProperty('status')){
this.status = this.props.status;
} else {
this.status = false
@ -79,11 +79,11 @@ class CheckboxComponent extends React.PureComponent {
<div
className={cl}
onClick={this.state.necessary ? void (0) : this.toggleChecked}>
<input className="ui ui-checkbox"
type="checkbox" value={this.state.checked}
<input className='ui ui-checkbox'
type='checkbox' value={this.state.checked}
name={this.props.name}/>
<label className="text">{this.props.children}</label>
<div className="ui-btn-ping" onTransitionEnd={this.stopAnimation}></div>
<label className='text'>{this.props.children}</label>
<div className='ui-btn-ping' onTransitionEnd={this.stopAnimation}></div>
</div>
)
}