content: import React from 'react';
  import PropTypes from 'prop-types';
  import Paper from 'material-ui/Paper';
  import FloatingActionButton from 'material-ui/FloatingActionButton';
  import FlatButton from 'material-ui/FlatButton';
  import Toggle from 'material-ui/Toggle';
  import styles from './ToolBar.css';
  
  export default class ToolBar extends React.Component {
      static propTypes = {
          className: PropTypes.string,
          isOpen: PropTypes.bool.isRequired,
          clear: PropTypes.func,
          pick: PropTypes.func,
          submit: PropTypes.func,
          toggleToolbar: PropTypes.func.isRequired,
          toggleHot: PropTypes.func,
      };
  
      constructor(props) {
          super(props);
          this.state = {
              isPickToggled: false
          };
      }
  
      render() {
          let classNames = this.props.className ? styles['toolbar'] + ' ' + this.props.className : styles['toolbar'];
  
          let toolbarStyle = {
              width: this.props.isOpen ? '35%' : '70px'
          };
  
          let floatingButtonStyle = {
              backgroundColor: 'rgb(57, 161, 244)'
          };
  
          let buttonText = this.props.isOpen ? <i className="fa fa-arrow-right" aria-hidden="true" /> : <i className="fa fa-arrow-left" aria-hidden="true" />;
  
          let contentStyle = {
              width: this.props.isOpen ? '80%' : '0'
          };
  
          return (
              <div
                  className={classNames}
                  style={toolbarStyle}
              >
                  <FloatingActionButton
                      style={floatingButtonStyle}
                      className={styles['open']}
                      backgroundColor='rgb(57, 161, 244)'
                      onClick={this.props.toggleToolbar}
                  >
                      {buttonText}
                  </FloatingActionButton>
                  <Paper
                      className={styles['content']}
                      style={contentStyle}
                  >
                      <FlatButton
                          label="Pick"
                          onClick={this.props.pick}
                      />
                      <FlatButton
                          label="Clear"
                          onClick={this.props.clear}
                      />
                      <FlatButton
                          label="Submit"
                          onClick={this.props.submit}
                      />
                      <Toggle
                          defaultToggled={true}
                          label="Hot"
                          labelPosition="right"
                          onClick={this.props.toggleHot}
                      />
                  </Paper>
              </div>
          );
      }
  
  }