diff --git a/internal_packages/account-sidebar/lib/account-sidebar-actions.coffee b/internal_packages/account-sidebar/lib/account-sidebar-actions.coffee
deleted file mode 100644
index e86583b76..000000000
--- a/internal_packages/account-sidebar/lib/account-sidebar-actions.coffee
+++ /dev/null
@@ -1,12 +0,0 @@
-Reflux = require 'reflux'
-
-Actions = [
-  'selectItem'
-  'setSectionCollapse'
-]
-
-for key in Actions
-  Actions[key] = Reflux.createAction(name)
-  Actions[key].sync = true
-
-module.exports = Actions
diff --git a/internal_packages/account-sidebar/lib/account-sidebar-items.coffee b/internal_packages/account-sidebar/lib/account-sidebar-items.coffee
index 4d0ec4eb8..88dbf8cd2 100644
--- a/internal_packages/account-sidebar/lib/account-sidebar-items.coffee
+++ b/internal_packages/account-sidebar/lib/account-sidebar-items.coffee
@@ -16,7 +16,8 @@ class MailboxPerspectiveSidebarItem
     @name = @shortenedName ? @mailboxPerspective.name
     @iconName = @mailboxPerspective.iconName
     @dataTransferType = 'nylas-thread-ids'
-    @useAltCountStyle = true if @mailboxPerspective.isInbox()
+<<<<<<< HEAD
+    @counterStyle = OutlineViewItem.CounterStyles.Alt if @mailboxPerspective.isInbox()
 
     # Sidenote: I think treating the sidebar items as dumb bundles of data is a
     # good idea. `count` /shouldn't/ be a function since if it's value changes,
@@ -29,9 +30,9 @@ class MailboxPerspectiveSidebarItem
     #    { count: X, isSelected: false, isDeleted: true}...
     #
     @count = @_count()
-    @isSelected = @_isSelected()
-    @isDeleted = @_isDeleted()
-    @isCollapsed = @_isCollapsed()
+    @selected = @_isSelected()
+    @deleted = @_isDeleted()
+    @collapsed = @_isCollapsed()
 
     @
 
@@ -55,8 +56,8 @@ class MailboxPerspectiveSidebarItem
   onToggleCollapsed: =>
     return unless @children.length > 0
     key = "core.accountSidebarCollapsed.#{@id}"
-    @isCollapsed = not @_isCollapsed()
-    NylasEnv.config.set(key, @isCollapsed)
+    @collapsed = not @_isCollapsed()
+    NylasEnv.config.set(key, @collapsed)
 
   onDelete: =>
     return if @category?.isDeleted is true
@@ -76,20 +77,16 @@ class MailboxPerspectiveSidebarItem
   onSelect: =>
     Actions.selectRootSheet(WorkspaceStore.Sheet.Threads)
     Actions.focusMailboxPerspective(@mailboxPerspective)
-    AccountSidebarActions.selectItem()
 
 
 class SheetSidebarItem
 
   constructor: (@name, @iconName, @sheet) ->
     @id = @sheet?.id ? @name
-
-  isSelected: =>
-    WorkspaceStore.rootSheet().id is @id
+    @selected = WorkspaceStore.rootSheet().id is @id
 
   onSelect: =>
     Actions.selectRootSheet(@sheet)
-    AccountSidebarActions.selectItem()
 
 
 class DraftListSidebarItem extends SheetSidebarItem
diff --git a/internal_packages/account-sidebar/lib/account-sidebar-sections.coffee b/internal_packages/account-sidebar/lib/account-sidebar-sections.coffee
index cc368e4cf..fe1701ccb 100644
--- a/internal_packages/account-sidebar/lib/account-sidebar-sections.coffee
+++ b/internal_packages/account-sidebar/lib/account-sidebar-sections.coffee
@@ -9,7 +9,7 @@ class CategorySidebarSection extends AccountSidebarSection
 
   constructor: ({@label, @iconName, @account, @items} = {}) ->
 
-  onCreateItem: (displayName) ->
+  onCreateItem: (displayName) =>
     return unless @account
     CategoryClass = @account.categoryClass()
     category = new CategoryClass
diff --git a/internal_packages/account-sidebar/lib/components/account-sidebar.cjsx b/internal_packages/account-sidebar/lib/components/account-sidebar.cjsx
index 5049593f8..fe04cc765 100644
--- a/internal_packages/account-sidebar/lib/components/account-sidebar.cjsx
+++ b/internal_packages/account-sidebar/lib/components/account-sidebar.cjsx
@@ -1,8 +1,9 @@
-React = require 'react'
 _ = require 'underscore'
+React = require 'react'
 {OutlineView, ScrollRegion} = require 'nylas-component-kit'
 AccountSidebarStore = require '../account-sidebar-store'
 
+
 class AccountSidebar extends React.Component
   @displayName: 'AccountSidebar'
 
@@ -35,7 +36,7 @@ class AccountSidebar extends React.Component
       <OutlineView key={section.label} {...section} />
 
   render: =>
-    <ScrollRegion style={flex:1} id="account-sidebar">
+    <ScrollRegion className="account-sidebar" >
       <div className="account-sidebar-sections">
         {@_renderSections()}
       </div>
diff --git a/internal_packages/account-sidebar/stylesheets/account-sidebar.less b/internal_packages/account-sidebar/stylesheets/account-sidebar.less
index 71852309a..98acdb2a4 100644
--- a/internal_packages/account-sidebar/stylesheets/account-sidebar.less
+++ b/internal_packages/account-sidebar/stylesheets/account-sidebar.less
@@ -3,6 +3,12 @@
 
 @unread-count-color: fadeout(@text-color-subtle, 40%);
 
+.account-sidebar {
+  flex: 1;
+  height: 100%;
+  background-color: @source-list-bg;
+}
+
 #account-switcher {
   order: 1;
   height: 100%;
diff --git a/src/components/editable-list.jsx b/src/components/editable-list.jsx
index 80b4d2d4d..ce94511dc 100644
--- a/src/components/editable-list.jsx
+++ b/src/components/editable-list.jsx
@@ -20,8 +20,10 @@ import React, {Component, PropTypes} from 'react';
  * @param {string} props.className - CSS class to be applied to component
  * @param {array} props.items - Items to be rendered by the list
  * @param {function} props.itemContent - A function that returns a component
-          or string for each item. To be editable, itemContent must be a string.
-          If no function is provided, each value in `items` is coerced to a string.
+ * or string for each item. To be editable, itemContent must be a string.
+ * If no function is provided, each value in `items` is coerced to a string.
+ * @param {(string|object)} props.selected - The selected item. This prop is
+ * optional unless uou want to control the selection externally.
  * @param {boolean} props.showEditIcon - Determines wether to show edit icon
  * button on selected items
  * @param {object} props.createInputProps - Props object to be passed on to
diff --git a/src/components/outline-view-item.jsx b/src/components/outline-view-item.jsx
index e35a8477e..353a8ac97 100644
--- a/src/components/outline-view-item.jsx
+++ b/src/components/outline-view-item.jsx
@@ -4,6 +4,12 @@ import DisclosureTriangle from './disclosure-triangle';
 import DropZone from './drop-zone';
 import RetinaImg from './retina-img';
 
+
+const CounterStyles = {
+  Default: 'def',
+  Alt: 'alt',
+}
+
 class OutlineViewItem extends Component {
   static displayName = 'OutlineView'
 
@@ -13,11 +19,11 @@ class OutlineViewItem extends Component {
     name: PropTypes.string.isRequired,
     iconName: PropTypes.string.isRequired,
     count: PropTypes.number,
-    useAltCountStyle: PropTypes.bool,
+    counterStyle: PropTypes.string,
     dataTransferType: PropTypes.string,
-    isCollapsed: PropTypes.bool,
-    isDeleted: PropTypes.bool,
-    isSelected: PropTypes.bool,
+    collapsed: PropTypes.bool,
+    deleted: PropTypes.bool,
+    selected: PropTypes.bool,
     shouldAcceptDrop: PropTypes.func,
     onToggleCollapsed: PropTypes.func,
     onDrop: PropTypes.func,
@@ -28,10 +34,11 @@ class OutlineViewItem extends Component {
   static defaultProps = {
     children: [],
     count: 0,
-    useAltCountStyle: false,
-    isCollapsed: false,
-    isDeleted: false,
-    isSelected: false,
+    counterStyle: CounterStyles.Default,
+    dataTransferType: '',
+    collapsed: false,
+    deleted: false,
+    selected: false,
     shouldAcceptDrop: ()=> false,
     onToggleCollapsed: ()=> {},
     onDrop: ()=> {},
@@ -59,15 +66,20 @@ class OutlineViewItem extends Component {
     }
   }
 
+  static CounterStyles = CounterStyles;
+
+
+  // Handlers
+
   _onShowContextMenu = ()=> {
     const item = this.props;
-    const label = item.name;
+    const name = item.name;
     const {remote} = require('electron');
     const {Menu, MenuItem} = remote.require('electron');
 
     const menu = new Menu();
     menu.append(new MenuItem({
-      label: `Delete ${label}`,
+      name: `Delete ${name}`,
       click: ()=> {
         item.onDelete(item.id);
       },
@@ -97,11 +109,14 @@ class OutlineViewItem extends Component {
     this.props.onSelect(this.props.id);
   }
 
+
+  // Renderers
+
   _renderCount(item = this.props) {
     if (!item.count) return <span></span>;
     const className = classnames({
       'item-count-box': true,
-      'alt-count': item.useAltCountStyle === true,
+      'alt-count': item.counterStyle === CounterStyles.Alt,
     });
     return <div className={className}>{item.count}</div>;
   }
@@ -118,9 +133,9 @@ class OutlineViewItem extends Component {
   _renderItem(item = this.props, state = this.state) {
     const containerClass = classnames({
       'item': true,
-      'selected': item.isSelected,
+      'selected': item.selected,
       'dropping': state.isDropping,
-      'deleted': item.isDeleted,
+      'deleted': item.deleted,
     });
 
     return (
@@ -139,7 +154,7 @@ class OutlineViewItem extends Component {
   }
 
   _renderChildren(item = this.props) {
-    if (item.children.length > 0 && !item.isCollapsed) {
+    if (item.children.length > 0 && !item.collapsed) {
       return (
         <section key={`${item.id}-children`}>
           {item.children.map(
@@ -157,7 +172,7 @@ class OutlineViewItem extends Component {
       <div>
         <span className="item-container">
           <DisclosureTriangle
-            collapsed={item.isCollapsed}
+            collapsed={item.collapsed}
             visible={item.children.length > 0}
             onToggleCollapsed={item.onToggleCollapsed} />
           {this._renderItem()}
diff --git a/src/components/outline-view.jsx b/src/components/outline-view.jsx
index 966e2f9d1..814bebd17 100644
--- a/src/components/outline-view.jsx
+++ b/src/components/outline-view.jsx
@@ -10,17 +10,15 @@ class OutlineView extends Component {
   static displayName = 'OutlineView'
 
   static propTypes = {
-    label: PropTypes.string,
+    title: PropTypes.string,
     iconName: PropTypes.string,
     items: PropTypes.array,
-    collapsible: PropTypes.bool,
     onToggleCollapsed: PropTypes.func,
     onCreateItem: PropTypes.func,
   }
 
   static defaultProps = {
     title: '',
-    collapsible: false,
     items: [],
   }
 
@@ -47,19 +45,19 @@ class OutlineView extends Component {
     if (event.key === 'Escape') {
       this.setState({showCreateInput: false});
     }
-    if (['Enter', 'Return'].include(event.key)) {
+    if (_.includes(['Enter', 'Return'], event.key)) {
       this.props.onCreateItem(event.target.value);
       this.setState({showCreateInput: false});
     }
   }
 
   _renderCreateButton() {
-    const label = this.props.label;
+    const title = this.props.title;
     return (
       <div
         className="add-item-button"
         onMouseDown={this._onCreateButtonMouseDown}
-        onMouseUp={this._onCreateButtonClicked.bind(this, label)}>
+        onMouseUp={this._onCreateButtonClicked.bind(this, title)}>
         <RetinaImg
           url="nylas://account-sidebar/assets/icon-sidebar-addcategory@2x.png"
           style={{height: 14, width: 14}}
@@ -68,16 +66,16 @@ class OutlineView extends Component {
     );
   }
 
-  _renderCreateInput(section = this.props) {
-    const label = _str.decapitalize(section.label.slice(0, section.label.length - 1));
-    const placeholder = `Create new ${label}`;
+  _renderCreateInput(props = this.props) {
+    const title = _str.decapitalize(props.title.slice(0, props.title.length - 1));
+    const placeholder = `Create new ${title}`;
     return (
       <span className="item-container">
         <div className="item add-item-container">
           <DisclosureTriangle collapsed={false} visible={false} />
           <div className="icon">
             <RetinaImg
-              name={section.iconName}
+              name={props.iconName}
               fallback="folder.png"
               mode={RetinaImg.Mode.ContentIsMask} />
           </div>
@@ -108,7 +106,7 @@ class OutlineView extends Component {
 
     return (
       <section className="nylas-outline-view">
-        <div className="heading">{this.props.label}</div>
+        <div className="heading">{this.props.title}</div>
         {allowCreate ? this._renderCreateButton() : void 0}
         {allowCreate && showInput ? this._renderCreateInput() : void 0}
         {this._renderItems()}
diff --git a/static/components/outline-view.less b/static/components/outline-view.less
index 27ea9ed33..ad8998dc9 100644
--- a/static/components/outline-view.less
+++ b/static/components/outline-view.less
@@ -5,8 +5,6 @@
 
 .nylas-outline-view {
   order: 1;
-  height: 100%;
-  background-color: @source-list-bg;
 
   section {
     margin-bottom: @padding-base-vertical;