matrix/matrix-react-sdk
1
0
Fork 0
mirror of https://github.com/matrix-org/matrix-react-sdk.git synced 2025-11-07 10:46:24 +03:00
Code Activity

Fix usages of useContextMenu which never pass the ref to the element (#9449)

Browse Source
This commit is contained in:
Michael Telatynski
2022-10-18 13:39:59 +01:00
committed by GitHub
parent 450ddbe2b0
commit 0ef8c80815
2 changed files with 5 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/views/messages/MessageActionBar.tsx
View File

@@ -83,7 +83,7 @@ const OptionsButton: React.FC<IOptionsButtonProps> = ({
getRelationsForEvent, getRelationsForEvent,
}) => { }) => {
const [menuDisplayed, button, openMenu, closeMenu] = useContextMenu(); const [menuDisplayed, button, openMenu, closeMenu] = useContextMenu();
const [onFocus, isActive, ref] = useRovingTabIndex(button); const [onFocus, isActive] = useRovingTabIndex(button);
useEffect(() => { useEffect(() => {
onFocusChange(menuDisplayed); onFocusChange(menuDisplayed);
}, [onFocusChange, menuDisplayed]); }, [onFocusChange, menuDisplayed]);
@@ -123,7 +123,7 @@ const OptionsButton: React.FC<IOptionsButtonProps> = ({
onClick={onOptionsClick} onClick={onOptionsClick}
onContextMenu={onOptionsClick} onContextMenu={onOptionsClick}
isExpanded={menuDisplayed} isExpanded={menuDisplayed}
inputRef={ref} inputRef={button}
onFocus={onFocus} onFocus={onFocus}
tabIndex={isActive ? 0 : -1} tabIndex={isActive ? 0 : -1}
> >
@@ -141,7 +141,7 @@ interface IReactButtonProps {
const ReactButton: React.FC<IReactButtonProps> = ({ mxEvent, reactions, onFocusChange }) => { const ReactButton: React.FC<IReactButtonProps> = ({ mxEvent, reactions, onFocusChange }) => {
const [menuDisplayed, button, openMenu, closeMenu] = useContextMenu(); const [menuDisplayed, button, openMenu, closeMenu] = useContextMenu();
const [onFocus, isActive, ref] = useRovingTabIndex(button); const [onFocus, isActive] = useRovingTabIndex(button);
useEffect(() => { useEffect(() => {
onFocusChange(menuDisplayed); onFocusChange(menuDisplayed);
}, [onFocusChange, menuDisplayed]); }, [onFocusChange, menuDisplayed]);
@@ -173,7 +173,7 @@ const ReactButton: React.FC<IReactButtonProps> = ({ mxEvent, reactions, onFocusC
onClick={onClick} onClick={onClick}
onContextMenu={onClick} onContextMenu={onClick}
isExpanded={menuDisplayed} isExpanded={menuDisplayed}
inputRef={ref} inputRef={button}
onFocus={onFocus} onFocus={onFocus}
tabIndex={isActive ? 0 : -1} tabIndex={isActive ? 0 : -1}
> >

1
src/components/views/rooms/MessageComposerButtons.tsx
View File

@@ -179,6 +179,7 @@ const EmojiButton: React.FC<IEmojiButtonProps> = ({ addEmoji, menuPosition }) =>
iconClassName="mx_MessageComposer_emoji" iconClassName="mx_MessageComposer_emoji"
onClick={openMenu} onClick={openMenu}
title={_t("Emoji")} title={_t("Emoji")}
inputRef={button}
/> />
{ contextMenu } { contextMenu }