import React, { Component } from 'react'; import PropTypes from 'prop-types'; import ReactTooltip from 'react-tooltip'; import { defineMessages, intlShape } from 'react-intl'; import { inject, observer } from 'mobx-react'; import { Link } from 'react-router'; import Tabbar from '../services/tabs/Tabbar'; import { ctrlKey, shiftKey, settingsShortcutKey } from '../../environment'; import { workspaceStore } from '../../features/workspaces'; import { todosStore } from '../../features/todos'; import { todoActions } from '../../features/todos/actions'; import AppStore from '../../stores/AppStore'; import SettingsStore from '../../stores/SettingsStore'; const messages = defineMessages({ settings: { id: 'sidebar.settings', defaultMessage: '!!!Settings', }, addNewService: { id: 'sidebar.addNewService', defaultMessage: '!!!Add new service', }, mute: { id: 'sidebar.muteApp', defaultMessage: '!!!Disable notifications & audio', }, unmute: { id: 'sidebar.unmuteApp', defaultMessage: '!!!Enable notifications & audio', }, openWorkspaceDrawer: { id: 'sidebar.openWorkspaceDrawer', defaultMessage: '!!!Open workspace drawer', }, closeWorkspaceDrawer: { id: 'sidebar.closeWorkspaceDrawer', defaultMessage: '!!!Close workspace drawer', }, openTodosDrawer: { id: 'sidebar.openTodosDrawer', defaultMessage: '!!!Open Franz Todos', }, closeTodosDrawer: { id: 'sidebar.closeTodosDrawer', defaultMessage: '!!!Close Franz Todos', }, lockFerdi: { id: 'sidebar.lockFerdi', defaultMessage: '!!!Lock Ferdi', }, }); export default @inject('stores', 'actions') @observer class Sidebar extends Component { static propTypes = { openSettings: PropTypes.func.isRequired, closeSettings: PropTypes.func.isRequired, setActive: PropTypes.func.isRequired, reorder: PropTypes.func.isRequired, reload: PropTypes.func.isRequired, toggleNotifications: PropTypes.func.isRequired, toggleAudio: PropTypes.func.isRequired, showMessageBadgeWhenMutedSetting: PropTypes.bool.isRequired, showMessageBadgesEvenWhenMuted: PropTypes.bool.isRequired, deleteService: PropTypes.func.isRequired, updateService: PropTypes.func.isRequired, hibernateService: PropTypes.func.isRequired, wakeUpService: PropTypes.func.isRequired, toggleMuteApp: PropTypes.func.isRequired, isAppMuted: PropTypes.bool.isRequired, isWorkspaceDrawerOpen: PropTypes.bool.isRequired, toggleWorkspaceDrawer: PropTypes.func.isRequired, isTodosServiceActive: PropTypes.bool.isRequired, stores: PropTypes.shape({ app: PropTypes.instanceOf(AppStore).isRequired, settings: PropTypes.instanceOf(SettingsStore).isRequired, }).isRequired, actions: PropTypes.shape({ settings: PropTypes.instanceOf(SettingsStore).isRequired, }).isRequired, }; static contextTypes = { intl: intlShape, }; state = { tooltipEnabled: true, }; componentDidUpdate() { ReactTooltip.rebuild(); } enableToolTip() { this.setState({ tooltipEnabled: true }); } disableToolTip() { this.setState({ tooltipEnabled: false }); } updateToolTip() { this.disableToolTip(); setTimeout(this.enableToolTip.bind(this)); } render() { const { openSettings, toggleMuteApp, isAppMuted, isWorkspaceDrawerOpen, toggleWorkspaceDrawer, stores, actions, isTodosServiceActive, } = this.props; const { intl } = this.context; const todosToggleMessage = ( todosStore.isTodosPanelVisible ? messages.closeTodosDrawer : messages.openTodosDrawer ); const workspaceToggleMessage = ( isWorkspaceDrawerOpen ? messages.closeWorkspaceDrawer : messages.openWorkspaceDrawer ); const isLoggedIn = Boolean(localStorage.getItem('authToken')); return (