LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

Fix MenuButton behavior from toggle dropdown onMousePress to onClick (#7335)

Browse source 
* changed behavior of a MenuButton. now it shows drop down on click not on mouse down

* fix 'Enter' key handling

* changed behavior of a MenuButton. now it shows drop down on click not on mouse down

* fix 'Enter' key handling
This commit is contained in:
Bohdan Kornatskyi 2021-12-09 15:05:37 -08:00 committed by GitHub
parent 6e27100606
commit 3458fa5e50
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 19 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
ui/component/claimMenuList/view.jsx
View file

@ -265,15 +265,34 @@ function ClaimMenuList(props: Props) {
push(`/$/${PAGES.REPORT_CONTENT}?claimId=${contentClaim && contentClaim.claim_id}`);
}
// changes MenuButton behavior to show/hide MenuList not on press but on click event
let isEventSimulated = false;
const menuButtonHandler = (e) => {
if (e.key === 'Enter') {
e.preventDefault();
e.type = 'click';
}
if (!isEventSimulated && e.type === 'mousedown') {
e.preventDefault();
} else if (e.type === 'click') {
isEventSimulated = true;
e.target.dispatchEvent(new MouseEvent('mousedown', { bubbles: true }));
isEventSimulated = false;
}
};
const shouldShow = !IS_WEB || (IS_WEB && isAuthenticated);
return (
<Menu>
<MenuButton
className={classnames('menu__button', { 'claim__menu-button': !inline, 'claim__menu-button--inline': inline })}
onMouseDown={menuButtonHandler}
onClick={(e) => {
e.stopPropagation();
e.preventDefault();
menuButtonHandler(e);
}}
onKeyDown={menuButtonHandler}
>
<Icon size={20} icon={ICONS.MORE_VERTICAL} />
</MenuButton>