         </div>
         <div className="no-scroll">
           <Nav bsStyle="tabs" onSelect={@handleSelectDropdown}>
+            <NavDropdown id='plugin-dropdown' pullRight
+              title={activePlugin?.displayName || defaultPluginTitle}>
+            {pluginDropdownContents}
+            </NavDropdown>
           </Nav>
-          <TabContentsUnion ref='pluginTabUnion'
-            onChange={(key) => @setState {activePluginName: key}}>
-          {
-            for plugin, index in @state.plugins when !plugin.handleClick?
-              <div id={plugin.name} key={plugin.name} className="poi-app-tabpane poi-plugin">
-                <PluginWrap plugin={plugin} />
-              </div>
-          }
+          <TabContentsUnion ref='tabKeyUnion'>
+            {pluginContents}
           </TabContentsUnion>
         </div>
       </div>

  setTabOffset: (offset) ->
    return if !@props.children?
    nowKey = @activeKey()
    React.Children.forEach @props.children, (child, index) =>
      if child.key == nowKey
        nextIndex = (index+offset+@props.children.length) % @props.children.length
        @setNewKey @props.children[nextIndex].key

  render: ->
    onTheLeft = true

    @selectTab key
    @selectTab isPlugin if !@state.doubleTabbed
  handleShiftTabKeyDown: ->
    @refs.tabKeyUnion.setTabOffset -1
  handleTabKeyDown: ->
    @refs.tabKeyUnion.setTabOffset 1
  handleKeyDown: ->
    return if @listener?
    @listener = true
