import React from 'react';
import AppBar from 'material-ui/AppBar';
import IconButton from 'material-ui/IconButton';
import SVGNavMenu from 'material-ui/svg-icons/navigation/menu';
import FlatButton from 'material-ui/FlatButton';
import FontIcon from 'material-ui/FontIcon';
import Avatar from 'material-ui/Avatar';
import ListItem from 'material-ui/List/ListItem';

const Navigation = props => {
  const RightArea = !props.userData
    ? <FlatButton
        href="https://github.com/callemall/material-ui"
        target="_blank"
        label="Login to Chat"
        secondary={true}
        icon={<FontIcon className="fa fa-twitch" />}
      />
    : <ListItem
        disabled={true}
        leftAvatar={
          <Avatar src={props.userData.image}  />
        }
      >
        {props.userData.name}
      </ListItem>;

  return (
    <AppBar
      title={props.title}
      onLeftIconButtonTouchTap={props.onLeftIconClicked}
      onRightIconButtonTouchTap={props.onRightIconClicked}
      iconElementLeft={<IconButton><SVGNavMenu /></IconButton>}
      iconElementRight={RightArea}
    />
  );
};

export default Navigation;

import React from 'react';
import AppBar from 'material-ui/AppBar';
import IconButton from 'material-ui/IconButton';
import SVGNavMenu from 'material-ui/svg-icons/navigation/menu';
import FlatButton from 'material-ui/FlatButton';
import FontIcon from 'material-ui/FontIcon';
import Avatar from 'material-ui/Avatar';
import ListItem from 'material-ui/List/ListItem';

const Navigation = props => {
  const RightArea = !props.userData
    ? <FlatButton
        label="Login to Chat"
        secondary={true}
        icon={<FontIcon className="fa fa-twitch" />}
      />
    : <ListItem
        disabled={true}
        leftAvatar={
          <Avatar src={props.userData.image}  />
        }
      >
        {props.userData.name}
      </ListItem>;

  return (
    <AppBar
      title={props.title}
      onLeftIconButtonTouchTap={props.onLeftIconClicked}
      onRightIconButtonTouchTap={props.onRightIconClicked}
      iconElementLeft={<IconButton><SVGNavMenu /></IconButton>}
      iconElementRight={RightArea}
    />
  );
};

export default Navigation;

Fix issue of login button leading to unwanted website
Fix issue of login button leading to unwanted website
