From e10e6fb54827479186509cc91a578f7357b75be6 Mon Sep 17 00:00:00 2001
From: Jori Lallo <jtlallo@gmail.com>
Date: Sun, 17 Jul 2016 20:59:32 -0700
Subject: [PATCH] Boilerplate for /search

---
 package.json                            |  1 +
 src/components/Layout/Layout.js         | 28 ++++++++++++++++++-------
 src/index.js                            |  3 +++
 src/scenes/DocumentEdit/DocumentEdit.js |  2 ++
 src/scenes/Search/Search.js             | 27 ++++++++++++++++++++++++
 src/scenes/Search/Search.scss           |  0
 src/scenes/Search/index.js              |  2 ++
 7 files changed, 56 insertions(+), 7 deletions(-)
 create mode 100644 src/scenes/Search/Search.js
 create mode 100644 src/scenes/Search/Search.scss
 create mode 100644 src/scenes/Search/index.js

diff --git a/package.json b/package.json
index 8ec23dfb7..cc6bcaef7 100644
--- a/package.json
+++ b/package.json
@@ -95,6 +95,7 @@
     "react-dom": "15.1.0",
     "react-dropzone": "3.3.2",
     "react-helmet": "3.1.0",
+    "react-keydown": "^1.6.1",
     "react-router": "2.5.1",
     "rebass": "0.2.6",
     "safestart": "0.8.0",
diff --git a/src/components/Layout/Layout.js b/src/components/Layout/Layout.js
index f7d5581d8..c4ee19ba9 100644
--- a/src/components/Layout/Layout.js
+++ b/src/components/Layout/Layout.js
@@ -1,7 +1,8 @@
 import React from 'react';
-import Link from 'react-router/lib/Link';
+import { browserHistory, Link } from 'react-router';
 import Helmet from 'react-helmet';
 import { observer } from 'mobx-react';
+import keydown from 'react-keydown';
 
 import DropdownMenu, { MenuItem } from 'components/DropdownMenu';
 import Flex from 'components/Flex';
@@ -21,6 +22,17 @@ class Layout extends React.Component {
     fixed: React.PropTypes.bool,
     loading: React.PropTypes.bool,
     user: React.PropTypes.object.isRequired,
+    search: React.PropTypes.bool,
+  }
+
+  static defaultProps = {
+    search: true,
+  }
+
+  @keydown(['/', 't'])
+  search() {
+    if (!this.props.search) return;
+    browserHistory.push('/search');
   }
 
   render() {
@@ -50,11 +62,13 @@ class Layout extends React.Component {
             <Flex align="center" className={ styles.actions }>
               { this.props.actions }
             </Flex>
-            <Flex>
-              <div className={ styles.search }>
-                <img src={ require('assets/icons/search.svg') } />
-              </div>
-            </Flex>
+            { this.props.search && (
+              <Flex>
+                <div className={ styles.search } onClick={ this.search }>
+                  <img src={ require('assets/icons/search.svg') } />
+                </div>
+              </Flex>
+            ) }
             <DropdownMenu label={
               <Avatar
                 circle
@@ -75,4 +89,4 @@ class Layout extends React.Component {
   }
 }
 
-export default Layout;
\ No newline at end of file
+export default Layout;
diff --git a/src/index.js b/src/index.js
index 01fabe032..b82052d87 100644
--- a/src/index.js
+++ b/src/index.js
@@ -22,6 +22,7 @@ import Dashboard from 'scenes/Dashboard';
 import Atlas from 'scenes/Atlas';
 import DocumentScene from 'scenes/DocumentScene';
 import DocumentEdit from 'scenes/DocumentEdit';
+import Search from 'scenes/Search';
 import SlackAuth from 'scenes/SlackAuth';
 
 let DevTools;
@@ -52,6 +53,8 @@ render((
           <Route path="/documents/:id/edit" component={ DocumentEdit } onEnter={ requireAuth } />
           <Route path="/documents/:id/new" component={ DocumentEdit } onEnter={ requireAuth } newChildDocument={ true } />
 
+          <Route path="/search" component={ Search } onEnter={ requireAuth } />
+
           <Route path="/auth/slack" component={SlackAuth} />
         </Route>
       </Router>
diff --git a/src/scenes/DocumentEdit/DocumentEdit.js b/src/scenes/DocumentEdit/DocumentEdit.js
index 4a6b9559b..fb2c4f000 100644
--- a/src/scenes/DocumentEdit/DocumentEdit.js
+++ b/src/scenes/DocumentEdit/DocumentEdit.js
@@ -1,6 +1,7 @@
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
 import { browserHistory, withRouter } from 'react-router';
+import keydown from 'react-keydown';
 
 import DocumentEditStore, {
   DOCUMENT_EDIT_SETTINGS,
@@ -132,6 +133,7 @@ class DocumentEdit extends Component {
         titleText={ titleText }
         fixed
         loading={ this.store.isSaving }
+        search={ false }
       >
         { (this.store.isFetching || !('Editor' in this.state)) ? (
           <CenteredContent>
diff --git a/src/scenes/Search/Search.js b/src/scenes/Search/Search.js
new file mode 100644
index 000000000..f9c64eaef
--- /dev/null
+++ b/src/scenes/Search/Search.js
@@ -0,0 +1,27 @@
+import React from 'react';
+import { observer } from 'mobx-react';
+
+import Flex from 'components/Flex';
+import Layout from 'components/Layout';
+import CenteredContent from 'components/CenteredContent';
+
+@observer
+class Search extends React.Component {
+  render() {
+    return (
+      <Layout
+        title="Search"
+        titleText="Search"
+        search={ false }
+      >
+        <CenteredContent>
+          <Flex direction="column" flex={ true }>
+            TBA
+          </Flex>
+        </CenteredContent>
+      </Layout>
+    );
+  }
+}
+
+export default Search;
diff --git a/src/scenes/Search/Search.scss b/src/scenes/Search/Search.scss
new file mode 100644
index 000000000..e69de29bb
diff --git a/src/scenes/Search/index.js b/src/scenes/Search/index.js
new file mode 100644
index 000000000..ac515625d
--- /dev/null
+++ b/src/scenes/Search/index.js
@@ -0,0 +1,2 @@
+import Search from './Search';
+export default Search;