Add version component to UI

This commit is contained in:
itay 2019-04-22 18:09:21 +03:00
parent fe1d9b8f72
commit d486471fb2
3 changed files with 60 additions and 1 deletions

View File

@ -20,6 +20,7 @@ import 'react-data-components/css/table-twbs.css';
import 'styles/App.css';
import 'react-toggle/style.css';
import 'react-table/react-table.css';
import VersionComponent from "./side-menu/VersionComponent";
let logoImage = require('../images/monkey-icon.svg');
let infectionMonkeyImage = require('../images/infection-monkey.svg');
@ -85,7 +86,7 @@ class AppComponent extends AuthComponent {
infection_done: false,
report_done: false,
isLoggedIn: undefined
}
},
};
}
@ -175,6 +176,7 @@ class AppComponent extends AuthComponent {
<div className="license-link text-center">
<NavLink to="/license">License</NavLink>
</div>
<VersionComponent/>
</Col>
<Col sm={9} md={10} smOffset={3} mdOffset={2} className="main">
<Route path='/login' render={(props) => (<LoginPageComponent onStatusChange={this.updateStatus}/>)}/>

View File

@ -0,0 +1,47 @@
import React from 'react';
import AuthComponent from "../AuthComponent";
import {Icon} from 'react-fa';
class VersionComponent extends AuthComponent {
constructor(props) {
super(props);
this.state = {
currentVersion: undefined,
newerVersion: undefined,
downloadLink: undefined
}
}
componentDidMount() {
this.authFetch('/api/version-update')
.then(res => res.json())
.then(res => {
this.setState({
currentVersion: res['current_version'],
newerVersion: res['newer_version'],
downloadLink: res['download_link'],
});
});
}
render() {
return (
<div className="version-text text-center">
Infection Monkey Version: {this.state.currentVersion}
{
this.state.newerVersion ?
<div>
<b>Newer version available!</b>
<br/>
<b><a target="_blank" href={this.state.downloadLink}>Download here <Icon name="download"/></a></b>
</div>
:
undefined
}
</div>
);
}
}
export default VersionComponent;

View File

@ -515,3 +515,13 @@ body {
}
}
.version-text {
font-size: 0.9em;
position: absolute;
bottom: 5px;
left: 0;
right: 0;
margin-left: auto;
margin-right: auto;
}