blob: 6bd0cc2b139a615b9e7abb57097330091decabdb (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
|
import React, { Component, PropTypes } from 'react';
import { If, Then } from 'react-if';
import Enum from '../lib/enum';
/**
* Header bar component
*
* @export
* @class HeaderBar
* @extends {React.Component}
*/
export default class HeaderBar extends Component {
/**
* Bar style
* @type {Style}
* @property {string} default - default
* @property {string} defaultDark - default dark blue
* @property {string} error - red
* @property {string} success - green
* @static
*
* @memberOf HeaderBar
*/
static Style = new Enum('default', 'defaultDark', 'error', 'success');
/**
* Prop types
* @static
*
* @memberOf HeaderBar
*/
static propTypes = {
style: PropTypes.string,
hidden: PropTypes.bool,
showSettings: PropTypes.bool,
onSettings: PropTypes.func
};
/**
* @override
*/
render() {
const style = this.props.style;
let containerClass = ['headerbar', 'headerbar--' + process.platform];
if(HeaderBar.Style.isValid(style)) {
containerClass.push(`headerbar--style-${style}`);
}
if(this.props.hidden) {
containerClass.push('headerbar--hidden');
}
return (
<div className={ containerClass.join(' ') }>
<If condition={ !this.props.hidden }>
<Then>
<div className="headerbar__container">
<img className="headerbar__logo" src="./assets/images/logo-icon.svg" />
<h2 className="headerbar__title">MULLVAD VPN</h2>
<If condition={ !!this.props.showSettings }>
<Then>
<button className="headerbar__settings" onClick={ this.props.onSettings } />
</Then>
</If>
</div>
</Then>
</If>
</div>
);
}
}
|
