[Glitch] Fix opening the emoji picker scrolling the single-column view to the top

Port aa86cf9557 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
This commit is contained in:
Claire 2022-02-16 21:44:47 +01:00
parent d70e4e3da0
commit 41a8606627

View file

@ -250,7 +250,7 @@ class EmojiPickerMenu extends React.PureComponent {
state = { state = {
modifierOpen: false, modifierOpen: false,
placement: null, readyToFocus: false,
}; };
handleDocumentClick = e => { handleDocumentClick = e => {
@ -262,6 +262,16 @@ class EmojiPickerMenu extends React.PureComponent {
componentDidMount () { componentDidMount () {
document.addEventListener('click', this.handleDocumentClick, false); document.addEventListener('click', this.handleDocumentClick, false);
document.addEventListener('touchend', this.handleDocumentClick, listenerOptions); document.addEventListener('touchend', this.handleDocumentClick, listenerOptions);
// Because of https://github.com/react-bootstrap/react-bootstrap/issues/2614 we need
// to wait for a frame before focusing
requestAnimationFrame(() => {
this.setState({ readyToFocus: true });
if (this.node) {
const element = this.node.querySelector('input[type="search"]');
if (element) element.focus();
}
});
} }
componentWillUnmount () { componentWillUnmount () {
@ -361,7 +371,7 @@ class EmojiPickerMenu extends React.PureComponent {
showSkinTones={false} showSkinTones={false}
backgroundImageFn={backgroundImageFn} backgroundImageFn={backgroundImageFn}
notFound={notFoundFn} notFound={notFoundFn}
autoFocus autoFocus={this.state.readyToFocus}
emojiTooltip emojiTooltip
native={useSystemEmojiFont} native={useSystemEmojiFont}
/> />
@ -396,6 +406,7 @@ class EmojiPickerDropdown extends React.PureComponent {
state = { state = {
active: false, active: false,
loading: false, loading: false,
placement: null,
}; };
setRef = (c) => { setRef = (c) => {