client/src/components/NavbarLogin.js
changeset 151 57d63a248f0d
parent 149 298d0373812e
child 154 a28361bda28c
equal deleted inserted replaced
150:97536386b397 151:57d63a248f0d
    14   componentWillUnmount() {
    14   componentWillUnmount() {
    15     document.removeEventListener('click', this.handleClickOutside, false);
    15     document.removeEventListener('click', this.handleClickOutside, false);
    16   }
    16   }
    17 
    17 
    18   handleClickOutside = (e) => {
    18   handleClickOutside = (e) => {
       
    19     e.preventDefault();
    19     const currentNode = ReactDOM.findDOMNode(this);
    20     const currentNode = ReactDOM.findDOMNode(this);
    20     if(!currentNode.contains(e.target)) {
    21     if(!currentNode.contains(e.target)) {
    21       this.hideDropDown();
    22       this.hideDropDown();
    22     }
    23     }
    23   }
    24   }
    45     const {isAuthenticated, currentUser, onLogout} = this.props;
    46     const {isAuthenticated, currentUser, onLogout} = this.props;
    46 
    47 
    47     if (isAuthenticated) {
    48     if (isAuthenticated) {
    48       return (
    49       return (
    49 
    50 
    50         <li className={`nav-item dropdown navs ${this.state.showDropdown?'show':''}`}>
    51         <li className={`nav-item dropdown ${this.state.showDropdown?'show':''}`}>
    51           <a className="nav-link dropdown-toggle" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded={this.state.showDropdown} onClick={this.toggleShowDropdown} onBlur={this.hideDropDown}>
    52           <a name className="nav-link dropdown-toggle username" id="navbarDropdown" role="button" aria-haspopup="true" aria-expanded={this.state.showDropdown} onClick={this.toggleShowDropdown} onBlur={this.hideDropDown}>
    52           { currentUser.get('username') }
    53           { currentUser.get('username') }
    53           &nbsp;<span className="caret"></span>
    54           &nbsp;<span className="caret"></span>
    54           </a>
    55           </a>
    55           <ul className={`dropdown-menu ${this.state.showDropdown?'show':''}`} aria-labelledby="navbarDropdown">
    56           <div className={`dropdown-menu dropdown-menu-right bg-primary border-0 ${this.state.showDropdown?'show':''}`} aria-labelledby="navbarDropdown">
    56             <li><a className="user-dropdown" href="#settings" onClick={this.onClickSettings}>Paramètres</a></li>
    57             <a className="dropdown-item bg-primary text-secondary" onClick={this.onClickSettings}>Paramètres</a>
    57             <li><a className="user-dropdown" href="#logout" onClick={onLogout}>Se déconnecter</a></li>
    58             <a className="dropdown-item bg-primary text-secondary" onClick={onLogout}>Se déconnecter</a>
    58           </ul>
    59           </div>
    59         </li>
    60         </li>
    60       );
    61       );
    61     } else {
    62     } else {
    62       return (
    63       return (
    63           <li>
    64           <li className="nav-item">
    64           <a className="navs" onClick={this.onClickLogin} href="/login">Se connecter</a>
    65           <a className="nav-link" onClick={this.onClickLogin} href="/login">Se connecter</a>
    65           </li>
    66           </li>
    66       );
    67       );
    67     }
    68     }
    68   }
    69   }
    69 }
    70 }