Styling and autosuggest fixes for #293

app/javascript/flavours/glitch/features/composer/textarea/index.js

@@ -32,7 +32,7 @@ const handlers = {
 
   //  When blurring the textarea, suggestions are hidden.
   handleBlur () {
-    //this.setState({ suggestionsHidden: true });
+    this.setState({ suggestionsHidden: true });
   },
 
   //  When the contents of the textarea change, we have to pull up new
@@ -57,7 +57,7 @@ const handlers = {
     const right = value.slice(selectionStart).search(/[\s\u200B]/);
     const token = function () {
       switch (true) {
-      case left < 0 || /[@:]/.test(!value[left]):
+      case left < 0 || !/[@:]/.test(value[left]):
         return null;
       case right < 0:
         return value.slice(left);

app/javascript/flavours/glitch/features/composer/textarea/suggestions/item/index.js

@@ -24,9 +24,16 @@ const handlers = {
     } = this.props;
     if (onClick) {
       e.preventDefault();
+      e.stopPropagation();  //  Prevents following account links
       onClick(index);
     }
   },
+
+  //  This prevents the focus from changing, which would mess with
+  //  our suggestion code.
+  handleMouseDown (e) {
+    e.preventDefault();
+  },
 };
 
 //  The component.
@@ -40,7 +47,10 @@ export default class ComposerTextareaSuggestionsItem extends React.Component {
 
   //  Rendering.
   render () {
-    const { handleClick } = this.handlers;
+    const {
+      handleMouseDown,
+      handleClick,
+    } = this.handlers;
     const {
       selected,
       suggestion,
@@ -51,7 +61,8 @@ export default class ComposerTextareaSuggestionsItem extends React.Component {
     return (
       <div
         className={computedClass}
-        onMouseDown={handleClick}
+        onMouseDown={handleMouseDown}
+        onClickCapture={handleClick}  //  Jumps in front of contents
         role='button'
         tabIndex='0'
       >