rondomoon/peer-calls
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Autofocus chat input

Browse Source
This commit is contained in:
Jerko Steiner 2019-11-17 09:34:02 -03:00
parent 63bae9fc55
commit ef110e6fe2
1 changed files with 9 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/client/components/Chat.tsx
View File

@ -29,6 +29,7 @@ export interface ChatProps {
export default class Chat extends React.PureComponent<ChatProps> {
chatHistoryRef = React.createRef<HTMLDivElement>()
inputRef = React.createRef<Input>()
scrollToBottom = () => {
const chatHistoryRef = this.chatHistoryRef.current!
@ -36,9 +37,16 @@ export default class Chat extends React.PureComponent<ChatProps> {
}
componentDidMount () {
this.scrollToBottom()
this.focus()
}
componentDidUpdate () {
this.scrollToBottom()
this.focus()
}
focus() {
if (this.props.visible) {
this.inputRef.current?.textArea.current?.focus()
}
}
render () {
const { messages, sendMessage } = this.props
@ -103,7 +111,7 @@ export default class Chat extends React.PureComponent<ChatProps> {
</div>
<Input sendMessage={sendMessage} />
<Input ref={this.inputRef} sendMessage={sendMessage} />
</div>
)
}