Merge branch 'master' into moderate-shortcuts

client/talk-plugin-commentbox/CommentForm.js

@@ -85,8 +85,8 @@ export class CommentForm extends React.Component {
   render() {
     const {maxCharCount, submitEnabled, cancelButtonClassName, submitButtonClassName, charCountEnable, body, loadingState} = this.props;
 
-    const length = body.length;
-    const isRespectingMaxCount = (length) => charCountEnable && maxCharCount && length > maxCharCount;
+    const length = body.trim().length;
+    const isRespectingMaxCount = (length) => charCountEnable && maxCharCount && length > maxCharCount; 
     const disableSubmitButton = !length || isRespectingMaxCount(length) || !submitEnabled({body}) || loadingState === 'loading';
     const disableCancelButton = loadingState === 'loading';
     const disableTextArea = loadingState === 'loading';

plugins/talk-plugin-auth/client/components/ForgotContent.js

@@ -1,14 +1,23 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './styles.css';
-import {Button} from 'plugin-api/beta/client/components/ui';
+import {Button, TextField} from 'plugin-api/beta/client/components/ui';
 import t from 'coral-framework/services/i18n';
 
 class ForgotContent extends React.Component {
+  
+  state = {value: ''};
+
   handleSubmit = (e) => {
     e.preventDefault();
-    this.props.fetchForgotPassword(this.emailInput.value);
+    this.props.fetchForgotPassword(this.state.value);
   };
 
+  handleChangeEmail = (e) => {
+    const {value} = e.target;
+    this.setState({value});
+  }
+
   render() {
     const {changeView, auth} = this.props;
     const {passwordRequestSuccess, passwordRequestFailure} = auth;
@@ -20,13 +29,14 @@ class ForgotContent extends React.Component {
         </div>
         <form onSubmit={this.handleSubmit}>
           <div className={styles.textField}>
-            <label htmlFor="email">{t('sign_in.email')}</label>
-            <input
-              ref={(input) => (this.emailInput = input)}
-              type="text"
+            <TextField
+              type="email"
               style={{fontSize: 16}}
               id="email"
               name="email"
+              label={t('sign_in.email')}
+              onChange={this.handleChangeEmail}
+              value={this.state.value}
             />
           </div>
           <Button
@@ -69,4 +79,10 @@ class ForgotContent extends React.Component {
   }
 }
 
+ForgotContent.propTypes = {
+  auth: PropTypes.object,
+  changeView: PropTypes.func,
+  fetchForgotPassword: PropTypes.func,
+};
+
 export default ForgotContent;