Started on prompt

app/components/Sidebar.js

@@ -67,7 +67,7 @@ class Sidebar extends Component {
     const isActive = activeRequest && filteredRequests.find(r => r.id == activeRequest.id);
 
     let folderIconClass = 'fa-folder';
-    let expanded = !requestGroup.collapsed;
+    let expanded = !requestGroup.collapsed || activeFilter;
     folderIconClass += !expanded ? '' : '-open';
     folderIconClass += isActive ? '' : '-o';
 
@@ -152,7 +152,7 @@ class Sidebar extends Component {
            <DebouncingInput
            type="text"
            placeholder="Filter Requests"
-           debounceMillis={100}
+           debounceMillis={300}
            value={activeFilter}
            onChange={this.onFilterChange.bind(this)}/>
            </div>

app/components/base/Modal.js

@@ -71,6 +71,7 @@ class Modal extends Component {
     if (!this.state.visible) {
       return null;
     }
+    console.log('render');
 
     return (
       <div className="modal grid grid--center" onClick={this._handleClick.bind(this)} ref="modal">

app/components/base/PromptModal.js

@@ -0,0 +1,22 @@
+import React, {Component, PropTypes} from 'react';
+import {Modal, ModalHeader, ModalBody, ModalFooter} from './Modal'
+
+class PromptModal extends Component {
+  render () {
+    return (
+      <Modal onClose={this.props.onClose}>
+        <ModalHeader>{this.props.header}</ModalHeader>
+        <ModalBody><input type="text"/></ModalBody>
+        <ModalFooter>Footer</ModalFooter>
+      </Modal>
+    )
+  }
+}
+
+PromptModal.propTypes = {
+  onSubmit: PropTypes.func.isRequired,
+  header: PropTypes.string.isRequired,
+  onClose: PropTypes.func
+};
+
+export default PromptModal;

app/css/components/modal.scss

@@ -12,7 +12,8 @@
   padding: $padding-xl;
 
   .modal__header {
-    border-radius: $radius-md;
+    border-top-left-radius: $radius-md;
+    border-top-right-radius: $radius-md;
     border-bottom: 1px solid $hl-md;
   }
 
@@ -25,7 +26,8 @@
   }
 
   .modal__footer {
-    border-radius: $radius-md;
+    border-bottom-left-radius: $radius-md;
+    border-bottom-right-radius: $radius-md;
     border-top: 1px solid $hl-md;
   }
 }

app/css/layout/base.scss

@@ -81,7 +81,7 @@ i.fa {
 }
 
 .scrollable {
-  overflow: scroll;
+  overflow: auto;
 }
 
 .hover-scrollbars {