How to use the react-bootstrap.DropdownButton function in react-bootstrap

var React = require('react');

var Router = require('react-router')
    , RouteHandler = Router.RouteHandler
    , Route = Router.Route;

var ReactBootstrap = require('react-bootstrap')
    , Nav = ReactBootstrap.Nav
    , Navbar = ReactBootstrap.Navbar
    , NavItem = ReactBootstrap.NavItem
    , ButtonToolbar = ReactBootstrap.ButtonToolbar
    , Button = ReactBootstrap.Button
    , DropdownButton = ReactBootstrap.DropdownButton
    , MenuItem = ReactBootstrap.MenuItem
    , Jumbotron = ReactBootstrap.Jumbotron
    , Row = ReactBootstrap.Row
    , Col = ReactBootstrap.Col
    , Grid = ReactBootstrap.Grid
    ;

var ReactRouterBootstrap = require('react-router-bootstrap')
//    , NavItem = ReactRouterBootstrap.NavItem
//    , DropdownButton = ReactRouterBootstrap.DropdownButton
//    , NavItemLink = ReactRouterBootstrap.NavItemLink
//    , MenuItem = ReactRouterBootstrap.MenuItem
    , MenuItemLink = ReactRouterBootstrap.MenuItemLink
    , ButtonLink = ReactRouterBootstrap.ButtonLink
    ;

"use strict";

var React = require('react');

var Blink1Service = require('../../server/blink1Service');
var PatternsService = require('../../server/patternsService');

var Button = require('react-bootstrap').Button;
var MenuItem = require('react-bootstrap').MenuItem;
var DropdownButton = require('react-bootstrap').DropdownButton;

var log = require('../../logger');

var PatternView = React.createClass({
    propTypes: {
        pattern: React.PropTypes.object.isRequired,
        onPatternUpdated: React.PropTypes.func,
        onCopyPattern: React.PropTypes.func,
        onDeletePattern: React.PropTypes.func,
    },
    getInitialState: function() {
        return {
            activeSwatch: -1,
            pattern: this.props.pattern,  // this was a clone, why?
            editing: false
        };

{ active: true, key: index, onClick: _this2.handleItemClick.bind(_this2, index) },
                        choice
                    ) : React.createElement(
                        _reactBootstrap.ListGroupItem,
                        { key: index, onClick: _this2.handleItemClick.bind(_this2, index) },
                        choice
                    );
                }
            });
            var container;
            if (layoutMode === "ComboBox") {
                container = React.createElement(
                    _ui2.default.VBox,
                    { style: { height: "100%", flex: 1.0, alignItems: "center" } },
                    React.createElement(
                        _reactBootstrap.DropdownButton,
                        { title: selectedChoice, id: "dropdown-" + this.toolPath.getState("class") },
                        menus
                    )
                );
            } else {
                container = React.createElement(
                    _reactBootstrap.ListGroup,
                    null,
                    menus
                );
            }
            return React.createElement(
                "div",
                { style: layoutMode === "ComboBox" ? sessionStateComboBoxStyle : sessionStateMenuStyle },
                container
            );

render: function() {
        var ButtonToolbar = ReactBootstrap.ButtonToolbar;
        var DropdownButton = ReactBootstrap.DropdownButton;
        var MenuItem = ReactBootstrap.MenuItem;
        var Dropdown = ReactBootstrap.Dropdown;
        var datatype = this.props.datatype;
        var applyBtn = this.state.filterValue == '' ? 'true' : 'false';
        var stringFilter = (
            
                                    
                                    
                                    
                                    <div>
                                        <button>Apply</button>
                                    </div>
                                
        );

        var numberFilter = (

var _dropDown = this.dropDown();

      var dropDownTitle = _dropDown.dropDownTitle;
      var menuItem = _dropDown.menuItem;


      if (this.props.static) {
        return _react3.default.createElement(
          'div',
          null,
          dropDownTitle
        );
      }

      return _react3.default.createElement(
        _reactBootstrap.DropdownButton,
        { key: this.props.field.name, className: _lodash2.default.get(this.props.field, 'className'),
          onClick: function onClick(e) {
            e.preventDefault();
          },
          bsSize: _lodash2.default.get(this.props.field, 'bsSize', this.props.size),
          bsStyle: _lodash2.default.get(this.props.field, 'bsStyle', 'primary'),
          title: _lodash2.default.get(this.state, ['dropDownTitle', this.props.field.name]) || dropDownTitle,
          id: 'input-dropdown-addon' + this.props.field.name },
        menuItem
      );
    }
  }]);

var React = require('react');
var ReactIntl = require('react-intl');
var ReactBootstrap = require('react-bootstrap');

var DropdownButton = ReactBootstrap.DropdownButton,
  MenuItem = ReactBootstrap.MenuItem;

var AccountDropdown = React.createClass({

  mixins: [ReactIntl.IntlMixin],

  render: function() {
    return (
      
        <menuitem href="/api/auth/logout">
          {this.getIntlMessage('login.SIGN_OUT')}
        </menuitem>
      
		);
  },
});

/**
 * @jsx React.DOM
 */

var React = require('react');
var Moment = require('moment');
var Router = require('react-router');
var PureRenderMixin = require('react/addons').addons.PureRenderMixin;
var RB = require('react-bootstrap');
var Button = RB.Button;
var ButtonToolbar = RB.ButtonToolbar;
var DropdownButton = RB.DropdownButton;
var MenuItem = RB.MenuItem;
var _ = require('lodash');
var Scroller = require('../Scroller');
var SlidePanel = require('../SlidePanel');

/** Components */
var Task = require('../Task/Task.js');
var TaskList = require('../Task/TaskList');
var TaskDetail = require('../Task/TaskDetail');

/** Store */
var MemStore = require('../../stores/MemStore');

/** utils */
var DataAPI = require('../../utils/DataAPI');
var Util = require('../../utils/Util');

/*
var Router = require('react-router')
  , RouteHandler = Router.RouteHandler
  , Route = Router.Route;


var ReactRouterBootstrap = require('react-router-bootstrap')
  , NavItemLink = ReactRouterBootstrap.NavItemLink
  , ButtonLink = ReactRouterBootstrap.ButtonLink
  , ListGroupItemLink = ReactRouterBootstrap.ListGroupItemLink;
*/

var ReactBootstrap = require('react-bootstrap')
  , DropdownButton = ReactBootstrap.DropdownButton
  , MenuItem = ReactBootstrap.MenuItem
  , Button = ReactBootstrap.Button
  , ButtonGroup = ReactBootstrap.ButtonGroup
  , OverlayTrigger = ReactBootstrap.OverlayTrigger
  , Popover = ReactBootstrap.Popover
  , Glyphicon = ReactBootstrap.Glyphicon
  , Grid = ReactBootstrap.Grid
  , Col = ReactBootstrap.Col
  , Row = ReactBootstrap.Row

var React = require('react');
var ReactDOM = require('react-dom');
var ReactRouter = require('react-router');
var Router = ReactRouter.Router;
var Route = ReactRouter.Route; 
var IndexRoute = ReactRouter.IndexRoute;

* Created by steve on 08/07/15.
 */
var React = require('react');
var Router = require('react-router')
    , RouteHandler = Router.RouteHandler
    , Route = Router.Route;

var ReactPropTypes = React.PropTypes;
var AuthActionCreators = require('../actions/AuthActionCreators.js');

var ReactBootstrap = require('react-bootstrap')
    , Nav = ReactBootstrap.Nav
    , Navbar = ReactBootstrap.Navbar
    , CollapsibleNav = ReactBootstrap.CollapsibleNav
    , NavItem = ReactBootstrap.NavItem
    , DropdownButton = ReactBootstrap.DropdownButton
    , MenuItem = ReactBootstrap.MenuItem
    , ListGroup = ReactBootstrap.ListGroup;

var ReactRouterBootstrap = require('react-router-bootstrap')
    , NavItemLink = ReactRouterBootstrap.NavItemLink
    , MenuItemLink = ReactRouterBootstrap.MenuItemLink
    , ButtonLink = ReactRouterBootstrap.ButtonLink
    , ListGroupItemLink = ReactRouterBootstrap.ListGroupItemLink;



var Header = React.createClass({

    propTypes: {
        isLoggedIn: ReactPropTypes.bool,
        email: ReactPropTypes.string

var React = require('react')
var ButtonGroup = require('react-bootstrap').ButtonGroup
import Button from 'react-bootstrap-button-loader';
var ButtonToolbar = require('react-bootstrap').ButtonToolbar
var Modal = require('react-bootstrap').Modal
var ajax = require('jquery').ajax
var TestModal = require('./TestModal.jsx')
var SaveGrammarModal = require('./SaveGrammarModal.jsx')
var ExportGrammarModal = require('./ExportGrammarModal.jsx')
var FileList = require('./FileList.jsx')
var DropdownButton = require('react-bootstrap').DropdownButton
var Glyphicon = require('react-bootstrap').Glyphicon


const AUTHOR_IS_USING_A_MAC = navigator.platform.toUpperCase().indexOf('MAC') >= 0;


class HeaderBar extends React.Component {

    constructor(props) {
        super(props);
    }

    render() {
        return (
            <div>
                </div>