blob: 5574951a0630c07878e62b144b5153599efb4aa9 (
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
|
// @flow
import React, { Component } from 'react';
import { If, Then } from 'react-if';
export type HeaderBarStyle = 'default' | 'defaultDark' | 'error' | 'success';
/**
* Header bar component
*/
export default class HeaderBar extends Component {
props: {
style: HeaderBarStyle,
hidden: boolean,
showSettings: boolean,
onSettings: () => void
};
render() {
let containerClass = [
'headerbar',
'headerbar--' + process.platform,
'headerbar--style-' + this.props.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>
);
}
}
|