From 473357b6b7e56d859726e13ba9be04cc78596b7e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A1ssio=20Zen?= <cassiozen@gmail.com>
Date: Tue, 5 Jul 2016 13:48:52 -0300
Subject: [PATCH] start implementing findbar

---
 .babelrc                         | 2 +-
 package.json                     | 4 +++-
 src/containers/CollectionPage.js | 9 +++++++++
 src/containers/FindBar.js        | 8 ++++++--
 webpack.config.js                | 2 +-
 5 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/.babelrc b/.babelrc
index 1f594c7a..36c73acb 100644
--- a/.babelrc
+++ b/.babelrc
@@ -1,4 +1,4 @@
 {
   "presets": ["react", "es2015"],
-  "plugins": ["transform-class-properties", "transform-object-assign", "transform-object-rest-spread"]
+  "plugins": ["transform-class-properties", "transform-object-assign", "transform-object-rest-spread", "lodash"]
 }
diff --git a/package.json b/package.json
index dadad656..10bcb53d 100644
--- a/package.json
+++ b/package.json
@@ -20,6 +20,7 @@
     "babel-core": "^6.5.1",
     "babel-eslint": "^4.1.8",
     "babel-loader": "^6.2.2",
+    "babel-plugin-lodash": "^3.2.0",
     "babel-plugin-transform-class-properties": "^6.5.2",
     "babel-plugin-transform-object-assign": "^6.5.0",
     "babel-plugin-transform-object-rest-spread": "^6.5.0",
@@ -67,6 +68,7 @@
     "draft-js-import-markdown": "^0.1.6",
     "fuzzy": "^0.1.1",
     "json-loader": "^0.5.4",
-    "localforage": "^1.4.2"
+    "localforage": "^1.4.2",
+    "lodash": "^4.13.1"
   }
 }
diff --git a/src/containers/CollectionPage.js b/src/containers/CollectionPage.js
index 8d8b12b4..93552691 100644
--- a/src/containers/CollectionPage.js
+++ b/src/containers/CollectionPage.js
@@ -5,6 +5,7 @@ import { connect } from 'react-redux';
 import { loadEntries } from '../actions/entries';
 import { selectEntries } from '../reducers';
 import EntryListing from '../components/EntryListing';
+import FindBar from './FindBar';
 
 class DashboardPage extends React.Component {
   componentDidMount() {
@@ -28,8 +29,16 @@ class DashboardPage extends React.Component {
       return <h1>No collections defined in your config.yml</h1>;
     }
 
+    const commands = [
+      { pattern: 'Create Collections(:collectionName)' },
+      { pattern: 'Create Posts(:postName)' },
+      { pattern: 'Find(:seachTerm as what?)' },
+      { pattern: '(:searchTerm as Find...)' }
+    ];
+
     return <div>
       <h1>Dashboard</h1>
+      <FindBar commands={commands} />
       <div>
         {collections.map((collection) => (
           <div key={collection.get('name')}>
diff --git a/src/containers/FindBar.js b/src/containers/FindBar.js
index 99d073f2..0efbc3db 100644
--- a/src/containers/FindBar.js
+++ b/src/containers/FindBar.js
@@ -1,9 +1,11 @@
 import React, { PropTypes } from 'react';
 import fuzzy from 'fuzzy';
+import _ from 'lodash';
 import { connect } from 'react-redux';
 
 class FindBar extends React.Component {
-  constructor() {
+  constructor(props) {
+    super(props);
     this.compiledCommands = {};
     this.state = {
       prompt: '',
@@ -13,7 +15,7 @@ class FindBar extends React.Component {
 
     this.compileCommand = this.compileCommand.bind(this);
     this.matchCommand = this.matchCommand.bind(this);
-    this.getSuggestions = this.getSuggestions.bind(this);
+    this.getSuggestions = _.throttle(this.getSuggestions.bind(this), 200);
     this.handleInputChange = this.handleInputChange.bind(this);
   }
 
@@ -67,12 +69,14 @@ class FindBar extends React.Component {
   }
 
   getSuggestions(value) {
+    console.log(value);
     const options = {
       //pre: '<strong>',
       //post: '</strong>',
       extract: el => el. token
     };
     const results = fuzzy.filter(value, this.compiledCommands, options);
+
     return results;
   }
 
diff --git a/webpack.config.js b/webpack.config.js
index 5b6a093c..021575e2 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -21,7 +21,7 @@ module.exports = {
         query: {
           cacheDirectory: true,
           presets: ['react', 'es2015'],
-          plugins: ['transform-class-properties', 'transform-object-assign', 'transform-object-rest-spread']
+          plugins: ['transform-class-properties', 'transform-object-assign', 'transform-object-rest-spread', 'lodash']
         }
       }
     ]