Make all components with server interaction AuthComponents

This commit is contained in:
Itay Mizeretz 2018-02-22 10:36:10 +02:00
parent e02d282c03
commit df95cc73c5
8 changed files with 39 additions and 27 deletions

View File

@ -2,8 +2,9 @@ import React from 'react';
import {Icon} from 'react-fa';
import Toggle from 'react-toggle';
import {OverlayTrigger, Tooltip} from 'react-bootstrap';
import AuthComponent from '../../AuthComponent';
class PreviewPaneComponent extends React.Component {
class PreviewPaneComponent extends AuthComponent {
generateToolTip(text) {
return (
@ -64,7 +65,7 @@ class PreviewPaneComponent extends React.Component {
forceKill(event, asset) {
let newConfig = asset.config;
newConfig['alive'] = !event.target.checked;
fetch('/api/monkey/' + asset.guid,
this.authFetch('/api/monkey/' + asset.guid,
{
method: 'PATCH',
headers: {'Content-Type': 'application/json'},

View File

@ -2,8 +2,9 @@ import React from 'react';
import Form from 'react-jsonschema-form';
import {Col, Nav, NavItem} from 'react-bootstrap';
import fileDownload from 'js-file-download';
import AuthComponent from '../AuthComponent';
class ConfigurePageComponent extends React.Component {
class ConfigurePageComponent extends AuthComponent {
constructor(props) {
super(props);
@ -23,7 +24,7 @@ class ConfigurePageComponent extends React.Component {
}
componentDidMount() {
fetch('/api/configuration')
this.authFetch('/api/configuration')
.then(res => res.json())
.then(res => {
let sections = [];
@ -43,7 +44,7 @@ class ConfigurePageComponent extends React.Component {
onSubmit = ({formData}) => {
this.currentFormData = formData;
this.updateConfigSection();
fetch('/api/configuration',
this.authFetch('/api/configuration',
{
method: 'POST',
headers: {'Content-Type': 'application/json'},
@ -82,7 +83,7 @@ class ConfigurePageComponent extends React.Component {
};
resetConfig = () => {
fetch('/api/configuration',
this.authFetch('/api/configuration',
{
method: 'POST',
headers: {'Content-Type': 'application/json'},
@ -126,7 +127,7 @@ class ConfigurePageComponent extends React.Component {
};
updateMonkeysRunning = () => {
fetch('/api')
this.authFetch('/api')
.then(res => res.json())
.then(res => {
// This check is used to prevent unnecessary re-rendering

View File

@ -6,8 +6,9 @@ import PreviewPane from 'components/map/preview-pane/PreviewPane';
import {ReactiveGraph} from 'components/reactive-graph/ReactiveGraph';
import {ModalContainer, ModalDialog} from 'react-modal-dialog';
import {options, edgeGroupToColor} from 'components/map/MapOptions';
import AuthComponent from '../AuthComponent';
class MapPageComponent extends React.Component {
class MapPageComponent extends AuthComponent {
constructor(props) {
super(props);
this.state = {
@ -40,7 +41,7 @@ class MapPageComponent extends React.Component {
};
updateMapFromServer = () => {
fetch('/api/netmap')
this.authFetch('/api/netmap')
.then(res => res.json())
.then(res => {
res.edges.forEach(edge => {
@ -52,7 +53,7 @@ class MapPageComponent extends React.Component {
};
updateTelemetryFromServer = () => {
fetch('/api/telemetry-feed?timestamp='+this.state.telemetryLastTimestamp)
this.authFetch('/api/telemetry-feed?timestamp='+this.state.telemetryLastTimestamp)
.then(res => res.json())
.then(res => {
let newTelem = this.state.telemetry.concat(res['telemetries']);
@ -68,7 +69,7 @@ class MapPageComponent extends React.Component {
selectionChanged(event) {
if (event.nodes.length === 1) {
fetch('/api/netmap/node?id=' + event.nodes[0])
this.authFetch('/api/netmap/node?id=' + event.nodes[0])
.then(res => res.json())
.then(res => this.setState({selected: res, selectedType: 'node'}));
}
@ -80,7 +81,7 @@ class MapPageComponent extends React.Component {
if (displayedEdge['group'] === 'island') {
this.setState({selected: displayedEdge, selectedType: 'island_edge'});
} else {
fetch('/api/netmap/edge?id=' + event.edges[0])
this.authFetch('/api/netmap/edge?id=' + event.edges[0])
.then(res => res.json())
.then(res => this.setState({selected: res.edge, selectedType: 'edge'}));
}
@ -91,7 +92,7 @@ class MapPageComponent extends React.Component {
}
killAllMonkeys = () => {
fetch('/api?action=killall')
this.authFetch('/api?action=killall')
.then(res => res.json())
.then(res => this.setState({killPressed: (res.status === 'OK')}));
};

View File

@ -7,11 +7,12 @@ import {edgeGroupToColor, options} from 'components/map/MapOptions';
import StolenPasswords from 'components/report-components/StolenPasswords';
import CollapsibleWellComponent from 'components/report-components/CollapsibleWell';
import {Line} from 'rc-progress';
import AuthComponent from '../AuthComponent';
let guardicoreLogoImage = require('../../images/guardicore-logo.png');
let monkeyLogoImage = require('../../images/monkey-icon.svg');
class ReportPageComponent extends React.Component {
class ReportPageComponent extends AuthComponent {
Issue =
{
@ -76,7 +77,7 @@ class ReportPageComponent extends React.Component {
}
updateMonkeysRunning = () => {
return fetch('/api')
return this.authFetch('/api')
.then(res => res.json())
.then(res => {
// This check is used to prevent unnecessary re-rendering
@ -89,7 +90,7 @@ class ReportPageComponent extends React.Component {
};
updateMapFromServer = () => {
fetch('/api/netmap')
this.authFetch('/api/netmap')
.then(res => res.json())
.then(res => {
res.edges.forEach(edge => {
@ -102,7 +103,7 @@ class ReportPageComponent extends React.Component {
getReportFromServer(res) {
if (res['completed_steps']['run_monkey']) {
fetch('/api/report')
this.authFetch('/api/report')
.then(res => res.json())
.then(res => {
this.setState({

View File

@ -3,8 +3,9 @@ import {Button, Col, Well, Nav, NavItem, Collapse} from 'react-bootstrap';
import CopyToClipboard from 'react-copy-to-clipboard';
import {Icon} from 'react-fa';
import {Link} from 'react-router-dom';
import AuthComponent from '../AuthComponent';
class RunMonkeyPageComponent extends React.Component {
class RunMonkeyPageComponent extends AuthComponent {
constructor(props) {
super(props);
@ -19,14 +20,14 @@ class RunMonkeyPageComponent extends React.Component {
}
componentDidMount() {
fetch('/api')
this.authFetch('/api')
.then(res => res.json())
.then(res => this.setState({
ips: res['ip_addresses'],
selectedIp: res['ip_addresses'][0]
}));
fetch('/api/local-monkey')
this.authFetch('/api/local-monkey')
.then(res => res.json())
.then(res =>{
if (res['is_running']) {
@ -36,7 +37,7 @@ class RunMonkeyPageComponent extends React.Component {
}
});
fetch('/api/client-monkey')
this.authFetch('/api/client-monkey')
.then(res => res.json())
.then(res => {
if (res['is_running']) {
@ -60,7 +61,7 @@ class RunMonkeyPageComponent extends React.Component {
}
runLocalMonkey = () => {
fetch('/api/local-monkey',
this.authFetch('/api/local-monkey',
{
method: 'POST',
headers: {'Content-Type': 'application/json'},

View File

@ -2,12 +2,17 @@ import React from 'react';
import {Col} from 'react-bootstrap';
import {Link} from 'react-router-dom';
import AuthService from '../../services/AuthService'
class RunServerPageComponent extends React.Component {
constructor(props) {
super(props);
}
render() {
// TODO: something real
let auth = new AuthService();
auth.login('monkey', 'infectio1n');
return (
<Col xs={12} lg={8}>
<h1 className="page-title">1. Monkey Island C&C Server</h1>

View File

@ -2,8 +2,9 @@ import React from 'react';
import {Col} from 'react-bootstrap';
import {Link} from 'react-router-dom';
import {ModalContainer, ModalDialog} from 'react-modal-dialog';
import AuthComponent from '../AuthComponent';
class StartOverPageComponent extends React.Component {
class StartOverPageComponent extends AuthComponent {
constructor(props) {
super(props);
@ -15,7 +16,7 @@ class StartOverPageComponent extends React.Component {
}
updateMonkeysRunning = () => {
fetch('/api')
this.authFetch('/api')
.then(res => res.json())
.then(res => {
// This check is used to prevent unnecessary re-rendering
@ -104,7 +105,7 @@ class StartOverPageComponent extends React.Component {
this.setState({
cleaned: false
});
fetch('/api?action=reset')
this.authFetch('/api?action=reset')
.then(res => res.json())
.then(res => {
if (res['status'] === 'OK') {

View File

@ -2,6 +2,7 @@ import React from 'react';
import {Col} from 'react-bootstrap';
import JSONTree from 'react-json-tree'
import {DataTable} from 'react-data-components';
import AuthComponent from '../AuthComponent';
const renderJson = (val) => <JSONTree data={val} level={1} theme="eighties" invertTheme={true} />;
const renderTime = (val) => val.split('.')[0];
@ -13,7 +14,7 @@ const columns = [
{ title: 'Details', prop: 'data', render: renderJson, width: '40%' }
];
class TelemetryPageComponent extends React.Component {
class TelemetryPageComponent extends AuthComponent {
constructor(props) {
super(props);
this.state = {
@ -22,7 +23,7 @@ class TelemetryPageComponent extends React.Component {
}
componentDidMount = () => {
fetch('/api/telemetry')
this.authFetch('/api/telemetry')
.then(res => res.json())
.then(res => this.setState({data: res.objects}));
};