blob: 1b12f55613657871cbf13d78b38253f715f38bf3 (
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
|
import React, { Component, PropTypes } from 'react';
import { If } from 'react-if';
import Enum from '../lib/enum';
export default class HeaderBar extends Component {
/** Bar style */
static Style = Enum('default', 'defaultDark', 'error', 'success');
static propTypes = {
style: PropTypes.string,
hidden: PropTypes.bool,
showSettings: PropTypes.bool,
onSettings: PropTypes.func
};
render() {
const style = this.props.style;
let containerClass = ['headerbar'];
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 }>
<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 }>
<button className="headerbar__settings" onClick={ this.props.onSettings } />
</If>
</div>
</If>
</div>
);
}
}
|
