<commit_before>import React, { Component, PropTypes } from 'react';
import OnClickOut from 'react-onclickout';
import cx from 'classnames';
import _ from "underscore";

import MetabaseSettings from "metabase/lib/settings";
import Modal from "metabase/components/Modal.jsx";
import Logs from "metabase/components/Logs.jsx";

import UserAvatar from './UserAvatar.jsx';
import Icon from './Icon.jsx';
import LogoIcon from './LogoIcon.jsx';


export default class ProfileLink extends Component {

    constructor(props, context) {
        super(props, context);

        this.state = {
            dropdownOpen: false,
            modalOpen: null
        };

        _.bindAll(this, "toggleDropdown", "closeDropdown", "openModal", "closeModal");
    }

    static propTypes = {
        user: PropTypes.object.isRequired,
        context: PropTypes.string.isRequired,
    };

    toggleDropdown() {
        this.setState({ dropdownOpen: !this.state.dropdownOpen });
    }

    closeDropdown() {
        this.setState({ dropdownOpen: false });
    }

    openModal(modalName) {
        this.setState({ dropdownOpen: false, modalOpen: modalName });
    }

    closeModal() {
        this.setState({ modalOpen: null });
    }

    render() {
        const { user, context } = this.props;
        const { modalOpen, dropdownOpen } = this.state;
        const { tag, date } = MetabaseSettings.get('version');

        let dropDownClasses = cx({
            'NavDropdown': true,
            'inline-block': true,
            'cursor-pointer': true,
            'open': dropdownOpen,
        });

        return (
            <OnClickOut onClickOut={this.closeDropdown}>
                <div className={dropDownClasses}>
                    <a data-metabase-event={"Navbar;Profile Dropdown;Toggle"} className="NavDropdown-button NavItem flex align-center p2 transition-background" onClick={this.toggleDropdown}>
                        <div className="NavDropdown-button-layer">
                            <div className="flex align-center">
                                <UserAvatar user={user} style={{backgroundColor: 'transparent'}}/>
                                <Icon name="chevrondown" className="Dropdown-chevron ml1" width="8px" height="8px" />
                            </div>
                        </div>
                    </a>

                    { dropdownOpen ?
                        <div className="NavDropdown-content right">
                            <ul className="NavDropdown-content-layer">
                                <li>
                                    <a data-metabase-event={"Navbar;Profile Dropdown;Edit Profile"} onClick={this.closeDropdown} className="Dropdown-item block text-white no-decoration" href="/user/edit_current">
                                        Account Settings
                                    </a>
                                </li>

                                { user.is_superuser && context !== 'admin' ?
                                    <li>
                                        <a data-metabase-event={"Navbar;Profile Dropdown;Enter Admin"} onClick={this.closeDropdown} className="Dropdown-item block text-white no-decoration" href="/admin/">
                                            Admin Panel
                                        </a>
                                    </li>
                                : null }

                                { user.is_superuser && context === 'admin' ?
                                    <li>
                                        <a data-metabase-event={"Navbar;Profile Dropdown;Exit Admin"} onClick={this.closeDropdown} className="Dropdown-item block text-white no-decoration" href="/">
                                            Exit Admin
                                        </a>
                                    </li>
                                : null }

                                <li>
                                    <a data-metabase-event={"Navbar;Profile Dropdown;Help "+tag} className="Dropdown-item block text-white no-decoration" href={"http://www.metabase.com/docs/"+tag} target="_blank">
                                        Help
                                    </a>
                                </li>

                                { user.is_superuser &&
                                    <li>
                                        <a data-metabase-event={"Navbar;Profile Dropdown;Debugging "+tag} onClick={this.openModal.bind(this, "logs")} className="Dropdown-item block text-white no-decoration">
                                            Logs
                                        </a>
                                    </li>
                                }

                                <li>
                                    <a data-metabase-event={"Navbar;Profile Dropdown;About "+tag} onClick={this.openModal.bind(this, "about")} className="Dropdown-item block text-white no-decoration">
                                        About Metabase
                                    </a>
                                </li>

                                <li className="border-top border-light">
                                    <a data-metabase-event={"Navbar;Profile Dropdown;Logout"} className="Dropdown-item block text-white no-decoration" href="/auth/logout">Logout</a>
                                </li>
                            </ul>
                        </div>
                    : null }

                    { modalOpen === "about" ?
                        <Modal className="Modal Modal--small">
                            <div className="px4 pt4 pb2 text-centered relative">
                                <span className="absolute top right p4 text-normal text-grey-3 cursor-pointer" onClick={this.closeModal}>
                                    <Icon name={'close'} width={16} height={16} />
                                </span>
                                <div className="text-brand pb2">
                                    <LogoIcon width={48} height={48} />
                                </div>
                                <h2 style={{fontSize: "1.75em"}} className="text-dark">Thanks for using Metabase!</h2>
                                <p className="pt2">
                                    <h3 className="text-dark">You're on version {tag}</h3>
                                    <span className="text-grey-3 text-bold">built on {date}</span>
                                </p>
                            </div>
                            <div style={{borderWidth: "2px"}} className="p2 h5 text-centered text-grey-3 border-top">
                                <span className="block"><span className="text-bold">Metabase</span> is a Trademark of Metabase, Inc</span>
                                <span>and is built with care in San Francisco, CA</span>
                            </div>
                        </Modal>
                    : modalOpen === "logs" ?
                        <Modal className="Modal Modal--wide" onClose={this.closeModal}>
                            <Logs onClose={this.closeModal} />
                        </Modal>
                    : null }
                </div>
            </OnClickOut>
        );
    }
}<commit_msg>Expose the rest of the version info in a tooltip<commit_after>import React, { Component, PropTypes } from 'react';
import OnClickOut from 'react-onclickout';
import cx from 'classnames';
import _ from "underscore";

import MetabaseSettings from "metabase/lib/settings";
import Modal from "metabase/components/Modal.jsx";
import Logs from "metabase/components/Logs.jsx";
import Tooltip from "metabase/components/Tooltip.jsx";

import UserAvatar from './UserAvatar.jsx';
import Icon from './Icon.jsx';
import LogoIcon from './LogoIcon.jsx';


export default class ProfileLink extends Component {

    constructor(props, context) {
        super(props, context);

        this.state = {
            dropdownOpen: false,
            modalOpen: null
        };

        _.bindAll(this, "toggleDropdown", "closeDropdown", "openModal", "closeModal");
    }

    static propTypes = {
        user: PropTypes.object.isRequired,
        context: PropTypes.string.isRequired,
    };

    toggleDropdown() {
        this.setState({ dropdownOpen: !this.state.dropdownOpen });
    }

    closeDropdown() {
        this.setState({ dropdownOpen: false });
    }

    openModal(modalName) {
        this.setState({ dropdownOpen: false, modalOpen: modalName });
    }

    closeModal() {
        this.setState({ modalOpen: null });
    }

    render() {
        const { user, context } = this.props;
        const { modalOpen, dropdownOpen } = this.state;
        const { tag, date } = MetabaseSettings.get('version');

        let dropDownClasses = cx({
            'NavDropdown': true,
            'inline-block': true,
            'cursor-pointer': true,
            'open': dropdownOpen,
        });

        return (
            <OnClickOut onClickOut={this.closeDropdown}>
                <div className={dropDownClasses}>
                    <a data-metabase-event={"Navbar;Profile Dropdown;Toggle"} className="NavDropdown-button NavItem flex align-center p2 transition-background" onClick={this.toggleDropdown}>
                        <div className="NavDropdown-button-layer">
                            <div className="flex align-center">
                                <UserAvatar user={user} style={{backgroundColor: 'transparent'}}/>
                                <Icon name="chevrondown" className="Dropdown-chevron ml1" width="8px" height="8px" />
                            </div>
                        </div>
                    </a>

                    { dropdownOpen ?
                        <div className="NavDropdown-content right">
                            <ul className="NavDropdown-content-layer">
                                <li>
                                    <a data-metabase-event={"Navbar;Profile Dropdown;Edit Profile"} onClick={this.closeDropdown} className="Dropdown-item block text-white no-decoration" href="/user/edit_current">
                                        Account Settings
                                    </a>
                                </li>

                                { user.is_superuser && context !== 'admin' ?
                                    <li>
                                        <a data-metabase-event={"Navbar;Profile Dropdown;Enter Admin"} onClick={this.closeDropdown} className="Dropdown-item block text-white no-decoration" href="/admin/">
                                            Admin Panel
                                        </a>
                                    </li>
                                : null }

                                { user.is_superuser && context === 'admin' ?
                                    <li>
                                        <a data-metabase-event={"Navbar;Profile Dropdown;Exit Admin"} onClick={this.closeDropdown} className="Dropdown-item block text-white no-decoration" href="/">
                                            Exit Admin
                                        </a>
                                    </li>
                                : null }

                                <li>
                                    <a data-metabase-event={"Navbar;Profile Dropdown;Help "+tag} className="Dropdown-item block text-white no-decoration" href={"http://www.metabase.com/docs/"+tag} target="_blank">
                                        Help
                                    </a>
                                </li>

                                { user.is_superuser &&
                                    <li>
                                        <a data-metabase-event={"Navbar;Profile Dropdown;Debugging "+tag} onClick={this.openModal.bind(this, "logs")} className="Dropdown-item block text-white no-decoration">
                                            Logs
                                        </a>
                                    </li>
                                }

                                <li>
                                    <a data-metabase-event={"Navbar;Profile Dropdown;About "+tag} onClick={this.openModal.bind(this, "about")} className="Dropdown-item block text-white no-decoration">
                                        About Metabase
                                    </a>
                                </li>

                                <li className="border-top border-light">
                                    <a data-metabase-event={"Navbar;Profile Dropdown;Logout"} className="Dropdown-item block text-white no-decoration" href="/auth/logout">Logout</a>
                                </li>
                            </ul>
                        </div>
                    : null }

                    { modalOpen === "about" ?
                        <Modal className="Modal Modal--small">
                            <div className="px4 pt4 pb2 text-centered relative">
                                <span className="absolute top right p4 text-normal text-grey-3 cursor-pointer" onClick={this.closeModal}>
                                    <Icon name={'close'} width={16} height={16} />
                                </span>
                                <div className="text-brand pb2">
                                    <LogoIcon width={48} height={48} />
                                </div>
                                <h2 style={{fontSize: "1.75em"}} className="text-dark">Thanks for using Metabase!</h2>
                                <Tooltip tooltip={<pre className="px2">{JSON.stringify(MetabaseSettings.get('version'), null, 2)}</pre>}>
                                    <div className="pt2">
                                        <h3 className="text-dark">You're on version {tag}</h3>
                                        <p className="text-grey-3 text-bold mt1">built on {date}</p>
                                    </div>
                                </Tooltip>
                            </div>
                            <div style={{borderWidth: "2px"}} className="p2 h5 text-centered text-grey-3 border-top">
                                <span className="block"><span className="text-bold">Metabase</span> is a Trademark of Metabase, Inc</span>
                                <span>and is built with care in San Francisco, CA</span>
                            </div>
                        </Modal>
                    : modalOpen === "logs" ?
                        <Modal className="Modal Modal--wide" onClose={this.closeModal}>
                            <Logs onClose={this.closeModal} />
                        </Modal>
                    : null }
                </div>
            </OnClickOut>
        );
    }
}
{'fraction_non_alphanumeric': 0.10871164003476633, 'fraction_numerical': 0.004345791268302467, 'mean_word_length': 1.1491379310344827, 'pattern_counts': {'":': 0, '<': 153, '<?xml version=': 0, '>': 153, 'https://': 0, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 90, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5037233', 'n_tokens_mistral': 3541, 'n_tokens_neox': 3351, 'n_words': 726}