2 files changed, 22 insertions, 4 deletions
diff --git a/webapp/components/suggestion/at_mention_provider.jsx b/webapp/components/suggestion/at_mention_provider.jsx
index d1a03deb5..6118b8d98 100644
--- a/webapp/components/suggestion/at_mention_provider.jsx
+++ b/webapp/components/suggestion/at_mention_provider.jsx
@@ -4,6 +4,7 @@
 import Suggestion from './suggestion.jsx';
 
 import ChannelStore from 'stores/channel_store.jsx';
+import SuggestionStore from 'stores/suggestion_store.jsx';
 
 import {autocompleteUsersInChannel} from 'actions/user_actions.jsx';
 
@@ -106,13 +107,24 @@ export default class AtMentionProvider {
     }
 
     componentWillUnmount() {
-        clearTimeout(this.timeoutId);
+        this.clearTimeout(this.timeoutId);
+    }
+
+    clearTimeout() {
+        if (this.timeoutId) {
+            clearTimeout(this.timeoutId);
+            this.timeoutId = '';
+
+            return true;
+        }
+
+        return false;
     }
 
     handlePretextChanged(suggestionId, pretext) {
-        clearTimeout(this.timeoutId);
+        const hadSuggestions = this.clearTimeout(this.timeoutId);
 
-        const captured = (/(?:^|\W)@([a-z0-9\-\._]*)$/i).exec(pretext.toLowerCase());
+        const captured = (/(?:^|\W)@([a-z0-9\-._]*)$/i).exec(pretext.toLowerCase());
         if (captured) {
             const prefix = captured[1];
 
@@ -160,5 +172,10 @@ export default class AtMentionProvider {
                 Constants.AUTOCOMPLETE_TIMEOUT
             );
         }
+
+        if (hadSuggestions) {
+            // Clear the suggestions since the user has now typed something invalid
+            SuggestionStore.clearSuggestions(suggestionId);
+        }
     }
 }
diff --git a/webapp/components/suggestion/suggestion_box.jsx b/webapp/components/suggestion/suggestion_box.jsx
index eeae5ba28..3a8cd65cf 100644
--- a/webapp/components/suggestion/suggestion_box.jsx
+++ b/webapp/components/suggestion/suggestion_box.jsx
@@ -39,7 +39,8 @@ export default class SuggestionBox extends React.Component {
     componentWillReceiveProps(nextProps) {
         // Clear any suggestions when the SuggestionBox is cleared
         if (nextProps.value === '' && this.props.value !== nextProps.value) {
-            GlobalActions.emitClearSuggestions(this.suggestionId);
+            // TODO - Find a better way to not "dispatch during dispatch"
+            setTimeout(() => GlobalActions.emitClearSuggestions(this.suggestionId), 1);
         }
     }