app\static\js\components\Header(1).jsx

#...

const LoggedInView = props => {
    if (props.currentUser) {
        return (
            <ul className="nav navbar-nav pull-xs-right">
                <li className="nav-item">
                    <Link to="/" className="nav-link">
                        Home
                    </Link>
                </li>

                <li className="nav-item">
                    <Link to="settings" className="nav-link">
                        Settings
                    </Link>
                </li>

                <li className="nav-item">
                    <Link to={`@${props.currentUser.username}`}
                          className="nav-link">
                        <img src={props.currentUser.image} alt="none" className="user-pic" />
                    </Link>
                </li>
            </ul>
        )
    }

    return null;
};

class Header extends React.Component {
    render() {
        return (
            <nav className="navbar navbar-light">
                <div className="container">
                    <Link to="/" className="navbar-brand">
                        {this.props.appName}
                    </Link>

                    <LoggedOutView currentUser={this.props.currentUser}/>
                    
                    <LoggedInView currentUser={this.props.currentUser} />
                
                </div>
            </nav>
        )
    }
}