import React from 'react';
import IconMenu from 'material-ui/IconMenu';
import IconButton from 'material-ui/IconButton';
import FontIcon from 'material-ui/FontIcon';
import NavigationExpandMoreIcon from 'material-ui/svg-icons/navigation/expand-more';
import MenuItem from 'material-ui/MenuItem';
import DropDownMenu from 'material-ui/DropDownMenu';
import RaisedButton from 'material-ui/RaisedButton';
import FlatButton from 'material-ui/FlatButton';
import ContentAdd from 'material-ui/svg-icons/content/add';
import { Toolbar, ToolbarGroup, ToolbarSeparator, ToolbarTitle } from 'material-ui/Toolbar';
//import ProviderSelection from './ProviderSelection.js';
import OrganizationComponent from '../../organizations/components/OrganizationComponent';

class ToolbarProviders extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      value: 1,
    };
  }

  handleChange = (event, index, value) => this.setState({ value });
  // handleProvidersAdded = (providerList) => {
  //   if (this.props.onProvidersReceived) {
  //     this.props.onProvidersReceived(providerList);
  //   }
  // }

  render() {
    return (
      <Toolbar>
        <ToolbarGroup firstChild>
          <DropDownMenu value={this.state.value} openImmediately={false} onChange={this.handleChange}>
            <MenuItem value={1} primaryText="All Participating Providers" />
          </DropDownMenu>
        </ToolbarGroup>
        <ToolbarGroup>
          <FontIcon className="muidocs-icon-custom-sort" />
          <ToolbarSeparator />
          <OrganizationComponent title={"Provider"} buttonValue={"Add Provider"} />
          <div className="divider" />
          <ToolbarSeparator />
          <IconMenu
            iconButtonElement={
              <IconButton touch>
                <NavigationExpandMoreIcon />
              </IconButton>
            }
          >
            <MenuItem primaryText="Download" />
            <MenuItem primaryText="Print" />
          </IconMenu>
        </ToolbarGroup>
      </Toolbar>
    );
  }
}

const ToolbarProviderComponent = (props) => (
  <ToolbarProviders onProvidersReceived={props.onProvidersReceived} />
);


module.exports = ToolbarProviderComponent;
