Composer: fixes #419 jumpy cursor

app/soapbox/components/autosuggest_textarea.js

@@ -159,6 +159,16 @@ export default class AutosuggestTextarea extends ImmutablePureComponent {
     this.textarea.focus();
   }
 
+  shouldComponentUpdate(nextProps, nextState) {
+    // Skip updating when lastToken changes so the cursor doesn't jump around
+    // due to re-rendering unnecessarily
+    if (this.state.lastToken !== nextState.lastToken) {
+      return false;
+    } else {
+      return super.shouldComponentUpdate(nextProps, nextState);
+    }
+  }
+
   componentDidUpdate(prevProps, prevState) {
     const { suggestions } = this.props;
     if (suggestions !== prevProps.suggestions && suggestions.size > 0 && prevState.suggestionsHidden && prevState.focused) {

app/soapbox/features/compose/components/compose_form.js

@@ -160,11 +160,6 @@ class ComposeForm extends ImmutablePureComponent {
     this.props.onChangeSpoilerText(e.target.value);
   }
 
-  doFocus = () => {
-    if (!this.autosuggestTextarea) return;
-    this.autosuggestTextarea.textarea.focus();
-  }
-
   setCursor = (start, end = start) => {
     if (!this.autosuggestTextarea) return;
     this.autosuggestTextarea.textarea.setSelectionRange(start, end);
@@ -219,8 +214,22 @@ class ComposeForm extends ImmutablePureComponent {
     }
   }
 
+  maybeUpdateCursor = prevProps => {
+    const shouldUpdate = [
+      // Autosuggest has been updated and
+      // the cursor position explicitly set
+      this.props.focusDate !== prevProps.focusDate,
+      typeof this.props.caretPosition === 'number',
+    ].every(Boolean);
+
+    if (shouldUpdate) {
+      this.setCursor(this.props.caretPosition);
+    }
+  }
+
   componentDidUpdate(prevProps) {
     this.maybeUpdateFocus(prevProps);
+    this.maybeUpdateCursor(prevProps);
   }
 
   render() {