add sending possibility on cmd/ctrl+enter

web/app/components/input/__field/input__field.scss

@@ -29,4 +29,8 @@
       display: block;
     }
   }
+
+  &:disabled {
+    color: #777;
+  }
 }

web/app/components/input/input.jsx

@@ -8,6 +8,7 @@ export default class Input extends Component {
 
     this.autoResize = this.autoResize.bind(this);
     this.send = this.send.bind(this);
+    this.onKeyDown = this.onKeyDown.bind(this);
   }
 
   componentDidMount() {
@@ -16,6 +17,12 @@ export default class Input extends Component {
     }
   }
 
+  onKeyDown(e) {
+    if (e.keyCode === 13 && (e.metaKey || e.ctrlKey)) {
+      this.send();
+    }
+  }
+
   autoResize() {
     this.fieldNode.style.height = '';
     this.setState({ height: this.fieldNode.scrollHeight });
@@ -25,7 +32,12 @@ export default class Input extends Component {
     const text = this.fieldNode.value;
     const pid = this.props.pid;
 
-    e.preventDefault();
+    if (e) e.preventDefault();
+
+    if (!text || !text.trim()) return;
+
+    this.setState({ isFieldDisabled: true });
+
     api.send({ text, ...(pid ? { pid } : {}) })
       .then(({ id }) => {
         // TODO: maybe we should run onsubmit before send; like in optimistic ui
@@ -37,18 +49,21 @@ export default class Input extends Component {
       })
       .catch(() => {
         // TODO: do smth?
-      });
+      })
+      .finally(() => this.setState({ isFieldDisabled: false }));
   }
 
-  render(props, { height }) {
+  render(props, { height, isFieldDisabled }) {
     return (
       <form className={b('input', props)} onSubmit={this.send}>
         <textarea
           className="input__field"
           onInput={this.autoResize}
+          onKeyDown={this.onKeyDown}
           style={{ height }}
           ref={r => (this.fieldNode = r)}
           required
+          disabled={isFieldDisabled}
         >
           {props.children}
         </textarea>