add comments submit with ctrl,cmd+Enter Close #1260

DemocracyOS · Jan 18, 2017 · 14aed55 · 14aed55
1 parent 7184a51
commit 14aed55
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 5 deletions.
diff --git a/lib/site/topic-layout/topic-article/comments/form/autogrow-textarea.js b/lib/site/topic-layout/topic-article/comments/form/autogrow-textarea.js
@@ -1,5 +1,4 @@
 import React, {Component} from 'react'
-import {findDOMNode} from 'react-dom'
 
 export default class AutoGrowTextarea extends Component {
   componentDidMount () {
@@ -15,14 +14,14 @@ export default class AutoGrowTextarea extends Component {
   }
 
   recomputeSize = () => {
-    const node = findDOMNode(this)
+    const node = this.refs.textarea
     node.style.minHeight = 'auto'
     node.style.minHeight = `${node.scrollHeight}px`
   }
 
   render () {
     return (
-      <textarea onChange={this.handleChange} {...this.props} />
+      <textarea onChange={this.handleChange} {...this.props} ref='textarea' />
     )
   }
 }
diff --git a/lib/site/topic-layout/topic-article/comments/form/component.js b/lib/site/topic-layout/topic-article/comments/form/component.js
@@ -47,11 +47,20 @@ class CommentsForm extends Component {
   }
 
   handleTextChange = (evt) => {
+    const text = evt.currentTarget.value || ''
+
     this.setState({
-      text: evt.currentTarget.value || ''
+      text: text,
+      focused: text ? true : this.state.focused
     })
   }
 
+  handleKeyDown = (evt) => {
+    if ((evt.ctrlKey || evt.metaKey) && evt.key === 'Enter') {
+      this.handleSubmit(evt)
+    }
+  }
+
   handleSubmit = (evt) => {
     evt.preventDefault()
     this.setState({error: ''})
@@ -94,6 +103,7 @@ class CommentsForm extends Component {
           onChange={this.handleTextChange}
           onFocus={this.handleFocus}
           onBlur={this.handleBlur}
+          onKeyDown={this.handleKeyDown}
           placeholder={t('comments.create.placeholder')}
           maxLength='4096'
           minLength='1'

diff --git a/lib/site/topic-layout/topic-article/comments/list/comment/replies/form/component.js b/lib/site/topic-layout/topic-article/comments/list/comment/replies/form/component.js
@@ -47,11 +47,20 @@ class RepliesForm extends Component {
   }
 
   handleTextChange = (evt) => {
+    const text = evt.currentTarget.value || ''
+
     this.setState({
-      text: evt.currentTarget.value || ''
+      text: text,
+      focused: text ? true : this.state.focused
     })
   }
 
+  handleKeyDown = (evt) => {
+    if ((evt.ctrlKey || evt.metaKey) && evt.key === 'Enter') {
+      this.handleSubmit(evt)
+    }
+  }
+
   handleSubmit = (evt) => {
     evt.preventDefault()
     this.setState({error: ''})
@@ -94,6 +103,7 @@ class RepliesForm extends Component {
           onChange={this.handleTextChange}
           onFocus={this.handleFocus}
           onBlur={this.handleBlur}
+          onKeyDown={this.handleKeyDown}
           placeholder={t('comments.arguments.reply')}
           maxLength='4096'
           minLength='1'