Re-implemented autosuggestions component for the compose form

Fix #205, fix #156, fix #124

8 files changed, 47 insertions, 15 deletions

diff --git a/storybook/config.js b/storybook/config.js
index d9fde833c..4a111a8b9 100644
--- a/storybook/config.js
+++ b/storybook/config.js
@@ -1,8 +1,14 @@
-import { configure } from '@kadira/storybook';
+import { configure, setAddon } from '@kadira/storybook';
+import IntlAddon from 'react-storybook-addon-intl';
 import React from 'react';
 import { storiesOf, action } from '@kadira/storybook';
+import { addLocaleData } from 'react-intl';
+import en from 'react-intl/locale-data/en';
+import '../app/assets/stylesheets/components.scss'
+import './storybook.scss'
 
-import './storybook.css'
+setAddon(IntlAddon);
+addLocaleData(en);
 
 window.storiesOf = storiesOf;
 window.action    = action;
@@ -11,7 +17,7 @@ window.React     = React;
 function loadStories () {
   require('./stories/loading_indicator.story.jsx');
   require('./stories/button.story.jsx');
-  require('./stories/tabs_bar.story.jsx');
+  require('./stories/autosuggest_textarea.story.jsx');
 }
 
 configure(loadStories, module);
diff --git a/storybook/stories/autosuggest_textarea.story.jsx b/storybook/stories/autosuggest_textarea.story.jsx
new file mode 100644
index 000000000..7d84ff1e1
--- /dev/null
+++ b/storybook/stories/autosuggest_textarea.story.jsx
@@ -0,0 +1,6 @@
+import { storiesOf } from '@kadira/storybook';
+import AutosuggestTextarea from '../../app/assets/javascripts/components/components/autosuggest_textarea.jsx'
+
+storiesOf('AutosuggestTextarea', module)
+  .add('default state', () => <AutosuggestTextarea />)
+  .add('with text', () => <AutosuggestTextarea value='Hello' />)
diff --git a/storybook/stories/button.story.jsx b/storybook/stories/button.story.jsx
index fe6d57ad0..fc392abef 100644
--- a/storybook/stories/button.story.jsx
+++ b/storybook/stories/button.story.jsx
@@ -1,3 +1,4 @@
+import { storiesOf } from '@kadira/storybook';
 import Button from '../../app/assets/javascripts/components/components/button.jsx'
 
 storiesOf('Button', module)
diff --git a/storybook/stories/loading_indicator.story.jsx b/storybook/stories/loading_indicator.story.jsx
index d169e4f55..f4a961c4e 100644
--- a/storybook/stories/loading_indicator.story.jsx
+++ b/storybook/stories/loading_indicator.story.jsx
@@ -1,6 +1,6 @@
+import { storiesOf } from '@kadira/storybook';
 import LoadingIndicator from '../../app/assets/javascripts/components/components/loading_indicator.jsx'
+import { IntlProvider } from 'react-intl';
 
 storiesOf('LoadingIndicator', module)
-  .add('default state', () => (
-    <LoadingIndicator />
-  ));
+  .add('default state', () => <IntlProvider><LoadingIndicator /></IntlProvider>);
diff --git a/storybook/stories/tabs_bar.story.jsx b/storybook/stories/tabs_bar.story.jsx
deleted file mode 100644
index daaedca5a..000000000
--- a/storybook/stories/tabs_bar.story.jsx
+++ /dev/null
@@ -1,6 +0,0 @@
-import TabsBar from '../../app/assets/javascripts/components/features/ui/components/tabs_bar.jsx'
-
-storiesOf('TabsBar', module)
-  .add('default state', () => (
-    <TabsBar />
-  ));
diff --git a/storybook/storybook.css b/storybook/storybook.css
deleted file mode 100644
index 3bda9e64c..000000000
--- a/storybook/storybook.css
+++ /dev/null
@@ -1,3 +0,0 @@
-#root {
-  padding: 4rem;
-}
diff --git a/storybook/storybook.scss b/storybook/storybook.scss
new file mode 100644
index 000000000..b0145f9bd
--- /dev/null
+++ b/storybook/storybook.scss
@@ -0,0 +1,15 @@
+@import url(https://fonts.googleapis.com/css?family=Roboto:400,500,400italic);
+@import url(https://fonts.googleapis.com/css?family=Roboto+Mono:400,500);
+
+#root {
+  font-family: 'Roboto', sans-serif;
+  background: #282c37;
+  font-size: 13px;
+  line-height: 18px;
+  font-weight: 400;
+  color: #fff;
+  padding-bottom: 140px;
+  text-rendering: optimizelegibility;
+  font-feature-settings: "kern";
+  padding: 4rem;
+}
diff --git a/storybook/webpack.config.js b/storybook/webpack.config.js
new file mode 100644
index 000000000..0ce563e1a
--- /dev/null
+++ b/storybook/webpack.config.js
@@ -0,0 +1,13 @@
+const path = require('path');
+
+module.exports = {
+  module: {
+    loaders: [
+      {
+        test: /.scss$/,
+        loaders: ["style", "css", "sass"],
+        include: path.resolve(__dirname, '../')
+      }
+    ]
+  }
+}