drag/drop to chat and compose work, but cannot publish or reply. Added shouldCondense as compose form state, to allow re-render as non-condensed when drop or paste is detected.

app/soapbox/components/autosuggest_textarea.js

@@ -55,7 +55,7 @@ class AutosuggestTextarea extends ImmutablePureComponent {
     autoFocus: PropTypes.bool,
     onFocus: PropTypes.func,
     onBlur: PropTypes.func,
-    // onAttachment: PropTypes.func,
+    onAttachment: PropTypes.func,
   };
 
   static defaultProps = {
@@ -231,20 +231,20 @@ class AutosuggestTextarea extends ImmutablePureComponent {
     return false;
   }
 
-  // handleAttachment = () => {
-  //   const { onAttachment } = this.props;
-  //   onAttachment(true);
-  // }
+  handleAttachment = () => {
+    const { onAttachment } = this.props;
+    onAttachment(true);
+  }
 
   handleFiles = (files) => {
     const { dispatch } = this.props;
 
     this.setState({ isUploading: true });
 
-    const data = new FormData();
-    data.append('file', files[0]);
-    dispatch(uploadCompose(data));
-    // dispatch(this.handleAttachment());
+    // const data = new FormData();
+    // data.append('file', files[0]);
+    dispatch(uploadCompose(files));
+    dispatch(this.handleAttachment());
     // dispatch(uploadMedia(data, this.onUploadProgress)).then(response => {
     //   this.setState({ attachment: response.data, isUploading: false });
     //   this.handleAttachment();
@@ -316,15 +316,14 @@ class AutosuggestTextarea extends ImmutablePureComponent {
     const { value, suggestions, disabled, placeholder, onKeyUp, autoFocus, children } = this.props;
     const { draggingOver, suggestionsHidden } = this.state;
     const style = { direction: 'ltr' };
-    const { draggingOver } = this.state;
 
     if (isRtl(value)) {
       style.direction = 'rtl';
     }
 
     return [
-      <div className='compose-form__autosuggest-wrapper' key='compose-form__autosuggest-wrapper'>
-        <div className='autosuggest-textarea' ref={this.setRef}>
+      <div className='compose-form__autosuggest-wrapper' key='compose-form__autosuggest-wrapper' ref={this.setRef}>
+        <div className='autosuggest-textarea'>
           <UploadArea active={draggingOver} onClose={this.closeUploadModal} />
           <label>
             <span style={{ display: 'none' }}>{placeholder}</span>

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

@@ -87,6 +87,12 @@ class ComposeForm extends ImmutablePureComponent {
     });
   }
 
+  handleAttachment = () => {
+    this.setState({
+      shouldCondense: false,
+    });
+  }
+
   handleKeyDown = (e) => {
     if (e.keyCode === 13 && (e.ctrlKey || e.metaKey)) {
       this.handleSubmit();
@@ -173,6 +179,9 @@ class ComposeForm extends ImmutablePureComponent {
   componentDidMount() {
     document.addEventListener('click', this.handleClick, true);
     this.setCursor(this.props.text.length); // Set cursor at end
+    this.setState({
+      shouldCondense: this.props.shouldCondense,
+    });
   }
 
   componentWillUnmount() {
@@ -224,7 +233,8 @@ class ComposeForm extends ImmutablePureComponent {
   }
 
   render() {
-    const { intl, onPaste, showSearch, anyMedia, shouldCondense, autoFocus, isModalOpen, maxTootChars } = this.props;
+    const { intl, onPaste, showSearch, anyMedia, autoFocus, isModalOpen, maxTootChars } = this.props;
+    const { shouldCondense } = this.state;
     const condensed = shouldCondense && !this.props.text && !this.state.composeFocused;
     const disabled = this.props.isSubmitting;
     const text     = [this.props.spoilerText, countableText(this.props.text)].join('');
@@ -285,6 +295,7 @@ class ComposeForm extends ImmutablePureComponent {
           onSuggestionsClearRequested={this.onSuggestionsClearRequested}
           onSuggestionSelected={this.onSuggestionSelected}
           onPaste={onPaste}
+          onAttachment={this.handleAttachment}
           autoFocus={shouldAutoFocus}
         >
           {