// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved. // See License.txt for license information. const NavbarDropdown = require('./navbar_dropdown.jsx'); const TutorialTip = require('./tutorial/tutorial_tip.jsx'); const UserStore = require('../stores/user_store.jsx'); const PreferenceStore = require('../stores/preference_store.jsx'); const Utils = require('../utils/utils.jsx'); const Constants = require('../utils/constants.jsx'); const Preferences = Constants.Preferences; const TutorialSteps = Constants.TutorialSteps; const Tooltip = ReactBootstrap.Tooltip; const OverlayTrigger = ReactBootstrap.OverlayTrigger; export default class SidebarHeader extends React.Component { constructor(props) { super(props); this.toggleDropdown = this.toggleDropdown.bind(this); this.onPreferenceChange = this.onPreferenceChange.bind(this); this.state = this.getStateFromStores(); } componentDidMount() { PreferenceStore.addChangeListener(this.onPreferenceChange); } componentWillUnmount() { PreferenceStore.removeChangeListener(this.onPreferenceChange); } getStateFromStores() { const tutorialPref = PreferenceStore.getPreference(Preferences.TUTORIAL_STEP, UserStore.getCurrentId(), {value: '0'}); return {showTutorialTip: parseInt(tutorialPref.value, 10) === TutorialSteps.MENU_POPOVER}; } onPreferenceChange() { this.setState(this.getStateFromStores()); } toggleDropdown(e) { e.preventDefault(); if (this.refs.dropdown.blockToggle) { this.refs.dropdown.blockToggle = false; return; } $('.team__header').find('.dropdown-toggle').dropdown('toggle'); } createTutorialTip() { const screens = []; screens.push(

{'Main Menu'}

{'The '}{'Main Menu'}{' is where you can '} {'Invite New Members'} {', access your '} {'Account Settings'} {' and set your '}{'Theme Color'}{'.'}

{'Team administrators can also access their '}{'Team Settings'}{' from this menu.'}

); return (
); } render() { var me = UserStore.getCurrentUser(); var profilePicture = null; if (!me) { return null; } if (me.last_picture_update) { profilePicture = ( ); } let tutorialTip = null; if (this.state.showTutorialTip) { tutorialTip = this.createTutorialTip(); } return (
{tutorialTip} {profilePicture}
{'@' + me.username}
{this.props.teamDisplayName}} ref='descriptionOverlay' >
{this.props.teamDisplayName}
); } } SidebarHeader.defaultProps = { teamDisplayName: global.window.mm_config.SiteName, teamType: '' }; SidebarHeader.propTypes = { teamDisplayName: React.PropTypes.string, teamName: React.PropTypes.string, teamType: React.PropTypes.string };