Fixed UI bug where security report map didn't show propper images

This commit is contained in:
VakarisZ 2020-03-13 12:44:19 +02:00
parent 2fff8d3a69
commit f07d058d8b
3 changed files with 24 additions and 8 deletions

View File

@ -3,8 +3,6 @@ import '../../styles/report/ReportPage.scss';
import React from 'react';
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';
import AuthComponent from '../AuthComponent';
import MustRunMonkeyWarning from '../report-components/common/MustRunMonkeyWarning';
import AttackReport from '../report-components/AttackReport'

View File

@ -3,10 +3,18 @@ import Graph from 'react-graph-vis';
import Dimensions from 'react-dimensions'
class GraphWrapper extends React.Component {
constructor(props) {
super(props);
}
render() {
let newOptions = this.props.options;
newOptions.height = this.props.containerHeight.toString() + 'px';
newOptions.width = this.props.containerWidth.toString() + 'px';
let newOptions = null;
if(this.props.options !== undefined){
newOptions = this.props.options;
newOptions.height = this.props.containerHeight.toString() + 'px';
newOptions.width = this.props.containerWidth.toString() + 'px';
}
return (<Graph graph={this.props.graph} options={newOptions} events={this.props.events}/>)
}
}

View File

@ -3,7 +3,7 @@ import BreachedServers from 'components/report-components/security/BreachedServe
import ScannedServers from 'components/report-components/security/ScannedServers';
import PostBreach from 'components/report-components/security/PostBreach';
import {ReactiveGraph} from 'components/reactive-graph/ReactiveGraph';
import {edgeGroupToColor, options} from 'components/map/MapOptions';
import {edgeGroupToColor, getOptions} from 'components/map/MapOptions';
import StolenPasswords from 'components/report-components/security/StolenPasswords';
import CollapsibleWellComponent from 'components/report-components/security/CollapsibleWell';
import {Line} from 'rc-progress';
@ -54,14 +54,24 @@ class ReportPageComponent extends AuthComponent {
super(props);
this.state = {
report: props.report,
graph: {nodes: [], edges: []}
graph: {nodes: [], edges: []},
nodeStateList: []
};
}
componentDidMount() {
this.getNodeStateListFromServer();
this.updateMapFromServer();
}
getNodeStateListFromServer = () => {
this.authFetch('/api/netmap/nodeStates')
.then(res => res.json())
.then(res => {
this.setState({nodeStateList: res.node_states});
});
};
componentWillUnmount() {
clearInterval(this.interval);
}
@ -396,7 +406,7 @@ class ReportPageComponent extends AuthComponent {
<span>Island Communication <FontAwesomeIcon icon={faMinus} size="lg" style={{color: '#a9aaa9'}}/></span>
</div>
<div style={{position: 'relative', height: '80vh'}}>
<ReactiveGraph graph={this.state.graph} options={options}/>
<ReactiveGraph graph={this.state.graph} options={getOptions(this.state.nodeStateList)}/>
</div>
<div style={{marginBottom: '20px'}}>
<BreachedServers data={this.state.report.glance.exploited}/>