diff --git a/bigbluebutton-html5/imports/ui/components/chat/message-form/component.jsx b/bigbluebutton-html5/imports/ui/components/chat/message-form/component.jsx index b3eb989e95da01901bafbac16581155a7d8d2178..37a840db039fb84668b921ecb9a723781b6e750b 100755 --- a/bigbluebutton-html5/imports/ui/components/chat/message-form/component.jsx +++ b/bigbluebutton-html5/imports/ui/components/chat/message-form/component.jsx @@ -2,6 +2,7 @@ import React, { PureComponent } from 'react'; import { defineMessages, injectIntl } from 'react-intl'; import cx from 'classnames'; import TextareaAutosize from 'react-autosize-textarea'; +import browser from 'browser-detect'; import { styles } from './styles'; import Button from '../../button/component'; @@ -42,11 +43,30 @@ class MessageForm extends PureComponent { hasErrors: false, }; + this.BROWSER_RESULTS = browser(); + this.handleMessageChange = this.handleMessageChange.bind(this); this.handleMessageKeyDown = this.handleMessageKeyDown.bind(this); this.handleSubmit = this.handleSubmit.bind(this); } + componentDidMount() { + const { mobile } = this.BROWSER_RESULTS; + + if (!mobile) { + this.textarea.focus(); + } + } + + componentDidUpdate(prevProps) { + const { chatName } = this.props; + const { mobile } = this.BROWSER_RESULTS; + + if (prevProps.chatName !== chatName && !mobile) { + this.textarea.focus(); + } + } + handleMessageKeyDown(e) { // TODO Prevent send message pressing enter on mobile and/or virtual keyboard if (e.keyCode === 13 && !e.shiftKey) { @@ -136,6 +156,7 @@ class MessageForm extends PureComponent { <TextareaAutosize className={styles.input} id="message-input" + innerRef={(ref) => { this.textarea = ref; return this.textarea; }} placeholder={intl.formatMessage(messages.inputPlaceholder, { 0: chatName })} aria-controls={chatAreaId} aria-label={intl.formatMessage(messages.inputLabel, { 0: chatTitle })}