blob: 4aee1ec60c94ceefca7a1416c83fb5ba4ed2003f (
plain) (
blame)
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
74
75
|
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import ReactTooltip from 'react-tooltip';
import { defineMessages, intlShape } from 'react-intl';
import Tabbar from '../services/tabs/Tabbar';
import { ctrlKey } from '../../environment';
const messages = defineMessages({
settings: {
id: 'sidebar.settings',
defaultMessage: '!!!Settings',
},
});
export default class Sidebar extends Component {
static propTypes = {
openSettings: PropTypes.func.isRequired,
isPremiumUser: PropTypes.bool,
}
static defaultProps = {
isPremiumUser: false,
}
static contextTypes = {
intl: intlShape,
};
state = {
tooltipEnabled: true,
};
enableToolTip() {
this.setState({ tooltipEnabled: true });
}
disableToolTip() {
this.setState({ tooltipEnabled: false });
}
render() {
const { openSettings, isPremiumUser } = this.props;
const { intl } = this.context;
return (
<div className="sidebar">
<Tabbar
{...this.props}
enableToolTip={() => this.enableToolTip()}
disableToolTip={() => this.disableToolTip()}
/>
<button
onClick={openSettings}
className="sidebar__settings-button"
data-tip={`Settings (${ctrlKey}+,)`}
>
{isPremiumUser && (
<span className="emoji">
<img src="./assets/images/emoji/star.png" alt="" />
</span>
)}
<img
src="./assets/images/logo.svg"
className="sidebar__logo"
alt=""
/>
{intl.formatMessage(messages.settings)}
</button>
{this.state.tooltipEnabled && (
<ReactTooltip place="right" type="dark" effect="solid" />
)}
</div>
);
}
}
|