blob: bae3c4fddf2fa7f33c2a499962aa125268038073 (
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
|
// @flow
import React, { Component } from 'react';
import { If, Then } from 'react-if';
export type HeaderBarStyle = 'default' | 'defaultDark' | 'error' | 'success';
export type HeaderBarProps = {
style: HeaderBarStyle;
hidden: boolean;
showSettings: boolean;
onSettings: ?(() => void);
};
export default class HeaderBar extends Component {
props: HeaderBarProps;
static defaultProps: $Shape<HeaderBarProps> = {
hidden: false,
showSettings: false
};
render(): React.Element<*> {
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>
);
}
}
|
