Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix/28324 : App keeps both right click LHN popup and delete message popup open together #28846

Merged
merged 8 commits into from
Oct 16, 2023
Merged

Fix/28324 : App keeps both right click LHN popup and delete message popup open together #28846

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
4bb4619
28324
astrohunter62 Oct 4, 2023
4c90ba4
resolve conflict
astrohunter62 Oct 5, 2023
82b7f02
removed ReportActionComposeFocusManager from PopoverProvider
astrohunter62 Oct 10, 2023
7ca2a1a
Merge branch 'main' into a-28324
astrohunter62 Oct 10, 2023
2ca6049
add comment
astrohunter62 Oct 13, 2023
3aa0000
Update src/components/LHNOptionsList/OptionRowLHN.js
astrohunter62 Oct 13, 2023
d83fb5c
revert
astrohunter62 Oct 13, 2023
fa08095
revert
astrohunter62 Oct 13, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion src/components/LHNOptionsList/OptionRowLHN.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@ import * as ReportUtils from '../../libs/ReportUtils';
import useLocalize from '../../hooks/useLocalize';
import Permissions from '../../libs/Permissions';
import Tooltip from '../Tooltip';
import DomUtils from '../../libs/DomUtils';
import useWindowDimensions from '../../hooks/useWindowDimensions';

const propTypes = {
Expand Down Expand Up @@ -183,7 +184,10 @@ function OptionRowLHN(props) {
// Prevent losing Composer focus
e.preventDefault();
}}
onSecondaryInteraction={(e) => showPopover(e)}
onSecondaryInteraction={(e) => {
showPopover(e);
DomUtils.blurActiveElement();
}}
withoutFocusOnSecondaryInteraction
activeOpacity={0.8}
style={[
Expand Down
2 changes: 2 additions & 0 deletions src/components/PopoverProvider/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
import ReportActionComposeFocusManager from '../../libs/ReportActionComposeFocusManager';

const propTypes = {
children: PropTypes.node.isRequired,
Expand All @@ -24,6 +25,7 @@ function PopoverContextProvider(props) {
}
activePopoverRef.current.close();
activePopoverRef.current = null;
ReportActionComposeFocusManager.focus();
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We can't call this here as it would focus on the composer in all places where this component is used, e.g. when picking a new avatar (AvatarWithImagePicker).

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Does this still work to keep focus on the composer when clicking the same chat?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is a screenshot for this solution.

1.webm

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This results in the composer not being focused when switching chats. I still think an early return for anything other than a left click in onMouseDown might be the best bet here.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

My solution is working when switching chats. I think onMouseDown is used to prevent loss of focus when clicking the same chat.
But if you want to use it,

onMouseDown={(e) => {
    if (!e) {
        return;
    }
    ReportActionComposeFocusManager.focus();
    if (e.button !== 2) e.preventDefault();
}}

Copy link
Contributor

@jjcoffee jjcoffee Oct 6, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah my bad, I must have tested incorrectly! Retested and that seems to work. The downside is long-presses focus on the composer still (which would affect tablet users). Do you have any reason you aren't keen on the early return in onMouseDown?

Copy link
Contributor Author

@astrohunter62 astrohunter62 Oct 9, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@jjcoffee I have changed my solution to handle the issue for tablets.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@astrohunter62 Can you push the change so I can test tomorrow? Thanks!

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yup.

setIsOpen(false);
}, []);

Expand Down
Loading