optimise requests on edit / send

web/app/components/input/input.jsx

@@ -95,38 +95,24 @@ export default class Input extends Component {
 
     this.setState({ isFieldDisabled: true, isErrorShown: false });
 
-    if (mods.mode === 'edit') {
-      api.edit({ text, id })
-        .then(comment => {
-          if (this.props.onSubmit) {
-            this.props.onSubmit(comment);
-          }
+    const request = mods.mode === 'edit'
+      ? api.edit({ text, id })
+      : api.send({ text, ...(pid ? { pid } : {}) });
 
-          this.fieldNode.value = '';
-          this.fieldNode.style.height = '';
-          this.setState({ preview: null });
-        })
-        .catch(() => {
-          this.setState({ isErrorShown: true });
-        })
-        .finally(() => this.setState({ isFieldDisabled: false }));
-    } else {
-      api.send({ text, ...(pid ? { pid } : {}) })
-        .then(({ id }) => {
-          // TODO: maybe we should run onsubmit before send; like in optimistic ui
-          if (this.props.onSubmit) {
-            this.props.onSubmit({ text, id, pid });
-          }
+    request
+      .then(comment => {
+        if (this.props.onSubmit) {
+          this.props.onSubmit(comment);
+        }
 
-          this.fieldNode.value = '';
-          this.fieldNode.style.height = '';
-          this.setState({ preview: null });
-        })
-        .catch(() => {
-          this.setState({ isErrorShown: true });
-        })
-        .finally(() => this.setState({ isFieldDisabled: false }));
-    }
+        this.fieldNode.value = '';
+        this.fieldNode.style.height = '';
+        this.setState({ preview: null });
+      })
+      .catch(() => {
+        this.setState({ isErrorShown: true });
+      })
+      .finally(() => this.setState({ isFieldDisabled: false }));
   }
 
   getPreview() {

web/app/components/root/root.jsx

@@ -33,7 +33,7 @@ export default class Root extends Component {
       sort,
     };
 
-    this.addComment = this.addComment.bind(this);
+    this.replaceComment = this.replaceComment.bind(this);
     this.onSignIn = this.onSignIn.bind(this);
     this.onSignOut = this.onSignOut.bind(this);
     this.onBlockedUsersShow = this.onBlockedUsersShow.bind(this);
@@ -157,17 +157,7 @@ export default class Root extends Component {
     this.setState({ wasSomeoneUnblocked: true });
   }
 
-  addComment(data) {
-    store.addComment(data);
-    this.setState({ comments: store.get('comments') });
-
-    api.getComment({ id: data.id }).then(comment => {
-      store.replaceComment(comment);
-      this.setState({ comments: store.get('comments') });
-    });
-  }
-
-  editComment(comment) {
+  replaceComment(comment) {
     store.replaceComment(comment);
     this.setState({ comments: store.get('comments') });
   }
@@ -209,7 +199,7 @@ export default class Root extends Component {
                     <Input
                       mix="root__input"
                       mods={{ type: 'main' }}
-                      onSubmit={this.addComment}
+                      onSubmit={this.replaceComment}
                     />
                   )
                 }
@@ -239,8 +229,8 @@ export default class Root extends Component {
                             mix="root__thread"
                             mods={{ level: 0 }}
                             data={thread}
-                            onReply={this.addComment}
-                            onEdit={this.editComment}
+                            onReply={this.replaceComment}
+                            onEdit={this.replaceComment}
                           />
                         ))
                       }