Keyboard focus related bugs (#299)

* Focus when opening the emoji board and editing a message

* Clean emoji board after closing

* Focus room search and member search

* Resolve conversations
This commit is contained in:
ginnyTheCat 2022-02-08 12:43:59 +01:00 committed by GitHub
parent d0e9728c26
commit cdd909f2dd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 45 additions and 12 deletions

View file

@ -1,5 +1,7 @@
/* eslint-disable react/prop-types */
import React, { useState, useEffect, useCallback, useRef } from 'react';
import React, {
useState, useEffect, useCallback, useRef,
} from 'react';
import PropTypes from 'prop-types';
import './Message.scss';
@ -245,6 +247,14 @@ MessageBody.propTypes = {
function MessageEdit({ body, onSave, onCancel }) {
const editInputRef = useRef(null);
useEffect(() => {
editInputRef.current.focus();
// Setting the value here instead of using the value prop below
// makes the cursor end up at the end of the line instead of the begining
editInputRef.current.value = body;
}, []);
const handleKeyDown = (e) => {
if (e.keyCode === 13 && e.shiftKey === false) {
e.preventDefault();
@ -257,7 +267,6 @@ function MessageEdit({ body, onSave, onCancel }) {
<Input
forwardRef={editInputRef}
onKeyDown={handleKeyDown}
value={body}
placeholder="Edit message"
required
resizable