Better smart/dumb component separation

diff --git a/app/assets/javascripts/components/components/autosuggest_textarea.jsx b/app/assets/javascripts/components/components/autosuggest_textarea.jsx
index 51be393799f307c2a5b61c8c4c28570ffcecd93f..38deeae0e3690621b207b8169dbf94e0b7bcf5a6 100644 (file)
--- a/app/assets/javascripts/components/components/autosuggest_textarea.jsx
+++ b/app/assets/javascripts/components/components/autosuggest_textarea.jsx
@@ -1,8 +1,6 @@
 import AutosuggestAccountContainer from '../features/compose/containers/autosuggest_account_container';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import { isRtl } from '../rtl';
-import { connect } from 'react-redux';
-import { uploadCompose } from '../actions/compose';
 
 const textAtCursorMatchesToken = (str, caretPosition) => {
   let word;
@@ -35,7 +33,6 @@ const AutosuggestTextarea = React.createClass({
     value: React.PropTypes.string,
     suggestions: ImmutablePropTypes.list,
     disabled: React.PropTypes.bool,
-    dispatch: React.PropTypes.func.isRequired,
     fileDropDate: React.PropTypes.instanceOf(Date),
     placeholder: React.PropTypes.string,
     onSuggestionSelected: React.PropTypes.func.isRequired,
@@ -43,7 +40,8 @@ const AutosuggestTextarea = React.createClass({
     onSuggestionsFetchRequested: React.PropTypes.func.isRequired,
     onChange: React.PropTypes.func.isRequired,
     onKeyUp: React.PropTypes.func,
-    onKeyDown: React.PropTypes.func
+    onKeyDown: React.PropTypes.func,
+    onPaste: React.PropTypes.func.isRequired,
   },
 
   getInitialState () {
@@ -178,7 +176,7 @@ const AutosuggestTextarea = React.createClass({
 
   onPaste (e) {
     if (e.clipboardData && e.clipboardData.files.length === 1) {
-      this.props.dispatch(uploadCompose(e.clipboardData.files));
+      this.props.onPaste(e.clipboardData.files)
       e.preventDefault();
     }
   },
@@ -225,4 +223,4 @@ const AutosuggestTextarea = React.createClass({
 
 });
 
-export default connect()(AutosuggestTextarea);
+export default AutosuggestTextarea;

diff --git a/app/assets/javascripts/components/features/compose/components/compose_form.jsx b/app/assets/javascripts/components/features/compose/components/compose_form.jsx
index 31ae8e03470dc61f5df5f3c2d0533394caae1a72..a71f5b0fddacc5b442231db3837eb2f39be74725 100644 (file)
--- a/app/assets/javascripts/components/features/compose/components/compose_form.jsx
+++ b/app/assets/javascripts/components/features/compose/components/compose_form.jsx
@@ -47,6 +47,7 @@ const ComposeForm = React.createClass({
     onFetchSuggestions: React.PropTypes.func.isRequired,
     onSuggestionSelected: React.PropTypes.func.isRequired,
     onChangeSpoilerText: React.PropTypes.func.isRequired,
+    onPaste: React.PropTypes.func.isRequired,
   },
 
   mixins: [PureRenderMixin],
@@ -82,6 +83,10 @@ const ComposeForm = React.createClass({
     this.props.onChangeSpoilerText(e.target.value);
   },
 
+  onPaste (files) {
+    this.props.onPaste(files);
+  },
+
   componentDidUpdate (prevProps) {
     if (this.props.focusDate !== prevProps.focusDate) {
       // If replying to zero or one users, places the cursor at the end of the textbox.
@@ -149,6 +154,7 @@ const ComposeForm = React.createClass({
           onSuggestionsFetchRequested={this.onSuggestionsFetchRequested}
           onSuggestionsClearRequested={this.onSuggestionsClearRequested}
           onSuggestionSelected={this.onSuggestionSelected}
+          onPaste={this.onPaste}
         />
 
         <div style={{ marginTop: '10px', overflow: 'hidden' }}>

diff --git a/app/assets/javascripts/components/features/compose/containers/compose_form_container.jsx b/app/assets/javascripts/components/features/compose/containers/compose_form_container.jsx
index 53129af6e34e0e876e03ca76f539992ea33350cc..a34201747ff351ff8ad31be72aefda87eb28e67a 100644 (file)
--- a/app/assets/javascripts/components/features/compose/containers/compose_form_container.jsx
+++ b/app/assets/javascripts/components/features/compose/containers/compose_form_container.jsx
@@ -1,5 +1,6 @@
 import { connect } from 'react-redux';
 import ComposeForm from '../components/compose_form';
+import { uploadCompose } from '../../../actions/compose';
 import { createSelector } from 'reselect';
 import {
   changeCompose,
@@ -65,6 +66,10 @@ const mapDispatchToProps = (dispatch) => ({
     dispatch(changeComposeSpoilerText(checked));
   },
 
+  onPaste (files) {
+    dispatch(uploadCompose(files));
+  },
+
 });
 
 export default connect(mapStateToProps, mapDispatchToProps)(ComposeForm);