[HOLD for payment 2023-10-27] [$500] Chat - The three-dot menu fails to close after clicking on "Pin"

[kbecciv]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Action Performed:

1. Navigate to the "New room" section.
2. Enter a name for the room and select the workspace.
3. Set the visibility of the room to "Public"
4. Click on the "Create room" button.
5. Go to "Share code" > "Copy URL to clipboard"
6. Open another browser where you are not signed in.
7. Paste the copied URL.
8. Click on three dots for menu and click on "Pin"

Expected Result:

Upon clicking "Pin" the three-dot menu should close

Actual Result:

The three-dot menu remains open after clicking on "Pin"

Workaround:

Unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

• Android / native
• Android / Chrome
• iOS / native
• iOS / Safari
• MacOS / Chrome / Safari
• MacOS / Desktop

Version Number: 1.3.75.8
Reproducible in staging?: y
Reproducible in production?: y
If this was caught during regression testing, add the test name, ID and link from TestRail:
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Notes/Photos/Videos: Any additional supporting documentation

Screen.Recording.2023-09-29.at.3.19.35.PM.1.mov

screen-recording-2023-09-29-at-25557-pm_IijAF1Pu.1.mp4

Recording.4814.mp4

Expensify/Expensify Issue URL:
Issue reported by: @ayazhussain79
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1695981995544409

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~018cbad69c4c13b118
• Upwork Job ID: 1708815358175035392
• Last Price Increase: 2023-10-09

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~018cbad69c4c13b118

[melvin-bot]

Triggered auto assignment to @dylanexpensify (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[melvin-bot]

Bug0 Triage Checklist (Main S/O)

• This "bug" occurs on a supported platform (ensure Platforms in OP are ✅)
• This bug is not a duplicate report (check E/App issues and #expensify-bugs)
  • If it is, comment with a link to the original report, close the issue and add any novel details to the original issue instead
• This bug is reproducible using the reproduction steps in the OP. S/O
  • If the reproduction steps are clear and you're unable to reproduce the bug, check with the reporter and QA first, then close the issue.
  • If the reproduction steps aren't clear and you determine the correct steps, please update the OP.
• This issue is filled out as thoroughly and clearly as possible
  • Pay special attention to the title, results, platforms where the bug occurs, and if the bug happens on staging/production.
• I have reviewed and subscribed to the linked Slack conversation to ensure Slack/Github stay in sync

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @situchan (External)

[ishpaul777]

Proposal

Problem

Chat - The three-dot menu fails to close after clicking on "Pin"

Root cause

We are using Session.checkIfActionIsAllowed to execute certain actions here when user is not logged the callback for onItemSelected never gets executed.

Changes

We can use the Modal.close action to hide any modal visible if the user is anonymous, we'll pass a new argument hideModal (false by default) and use the method if true

Screen.Recording.2023-10-02.at.7.12.25.PM.mov

[dukenv0307]

Proposal

Please re-state the problem that we are trying to solve in this issue.

The three-dot menu remains open after clicking on "Pin"

What is the root cause of that problem?

When the user is anonymous and clicking Pin, the check here will lead the user to sign in. So the onPress of the menu was never called to close the popover menu.

What changes do you think we should make in order to solve the problem?

For popover menu, we have our own checks here for anonymous user, so we don't have to check inside MenuItem

We can add a flag shouldCheckActionAllowedOnPress to the MenuItem, defaults to true. Only if it's true, we wrap the onPress callback with the check here. If it's false we rely on the parent component's checks and do not check in MenuItem

Then we pass shouldCheckActionAllowedOnPress={false} in the popover menu.

What alternative solutions did you explore? (Optional)

We can fix the same for any parent component which uses MenuItem, that has the same issue.

An alternative is to call Modal.close, but this is noticeably slow, the menu will stay there for a while instead of being closed immediately. Also I prefer not touching global state if possible since it causes a lot of rerendering.

[yh-0218]

Proposal

Please re-state the problem that we are trying to solve in this issue.

The three-dot menu remains open after clicking on "Pin"

What is the root cause of that problem?

When the user is clicking Pin, we show Login Modal and don't hide Popover menu.

App/src/components/MenuItem.js

Line 138 in 850e21e

onPress={Session.checkIfActionIsAllowed((e) => {

What changes do you think we should make in order to solve the problem?

we need to show Login Modal and must close Popover menu.
For this.

1. We don't check isAnonymousUser() on this for only Popover Menu
   

   App/src/components/MenuItem.js

   Line 138 in bba600a

   onPress={Session.checkIfActionIsAllowed((e) => {

   
   we can add isAnonymousAction={item.isAnonymousAction} to here
   

   App/src/components/PopoverMenu/index.js

   Line 101 in bba600a

   <MenuItem

2. We need to check isAnonymousUser() and add isAnonymousAction=true on onSelected function of threeDotMenuItems on HeaderView.js.
   For pin, we have already this check.
   

   App/src/pages/home/HeaderView.js

   Line 142 in bba600a

   onSelected: Session.checkIfActionIsAllowed(() => Report.togglePinnedState(props.report.reportID, props.report.isPinned)),

   
   Add

isAnonymousAction: true

App/src/pages/home/HeaderView.js

Line 138 in bba600a

threeDotMenuItems.push({

We need to this check and add for other options (zoom, googlemeet)

What alternative solutions did you explore? (Optional)

[dylanexpensify]

@situchan let's get some reviews! 🙇‍♂️

[melvin-bot]

@dylanexpensify, @situchan Eep! 4 days overdue now. Issues have feelings too...

[dylanexpensify]

@situchan can we please get some reviews in today? 🙏

[situchan]

reviewing today

[melvin-bot]

📣 It's been a week! Do we have any satisfactory proposals yet? Do we need to adjust the bounty for this issue? 💸

[situchan]

@dukenv0307's proposal looks good to me.
🎀 👀 🎀 C+ reviewed

[melvin-bot]

Triggered auto assignment to @marcochavezf, see https://stackoverflow.com/c/expensify/questions/7972 for more details.

[dylanexpensify]

Nice! @marcochavezf let us know what you think!

[marcochavezf]

Sounds good, thanks @situchan for the review. Assigning @dukenv0307 🚀

[dukenv0307]

@dylanexpensify I applied, thank you!

[melvin-bot]

@marcochavezf, @dylanexpensify, @situchan, @dukenv0307 Still overdue 6 days?! Let's take care of this!

[dylanexpensify]

nice! Payment now!

[melvin-bot]

@marcochavezf, @dylanexpensify, @situchan, @dukenv0307 Huh... This is 4 days overdue. Who can take care of this?

[marcochavezf]

Hi @dylanexpensify, I think we can close this out, correct? I will go ahead and close it, but feel free to re-open it if something is still pending :)

[situchan]

This is still waiting for payment

[melvin-bot]

Triggered auto assignment to @lschurr (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[melvin-bot]

Bug0 Triage Checklist (Main S/O)

• This "bug" occurs on a supported platform (ensure Platforms in OP are ✅)
• This bug is not a duplicate report (check E/App issues and #expensify-bugs)
  • If it is, comment with a link to the original report, close the issue and add any novel details to the original issue instead
• This bug is reproducible using the reproduction steps in the OP. S/O
  • If the reproduction steps are clear and you're unable to reproduce the bug, check with the reporter and QA first, then close the issue.
  • If the reproduction steps aren't clear and you determine the correct steps, please update the OP.
• This issue is filled out as thoroughly and clearly as possible
  • Pay special attention to the title, results, platforms where the bug occurs, and if the bug happens on staging/production.
• I have reviewed and subscribed to the linked Slack conversation to ensure Slack/Github stay in sync

[mountiny]

@lschurr could you help with the payment here please @situchan what is pending?

[situchan]

Here's payment summary: #28606 (comment)

[situchan]

Automatic offer failed on this issue.
I applied job as requested by @dylanexpensify
Job link: #28606 (comment)

[lschurr]

Looks like @dylanexpensify is the BZ on this one. Could you take a look at this one?

[situchan]

@lschurr @dylanexpensify is OOO. You're assigned based on https://expensify.slack.com/archives/C01GTK53T8Q/p1701271832347369?thread_ts=1701262010.017819&cid=C01GTK53T8Q.
Would be much appreciated if you can help.

[lschurr]

Got it, thanks. Just reviewing the job now and seeing what happened with payments: https://www.upwork.com/ab/applicants/1721476234243555328/applicants

[lschurr]

Alright, looks like none of the payments were made, so I've paid @ayazhussain79 and have sent offers to @dukenv0307 and @situchan - could you accept those so that we can pay and close?

Just repeating the payment summary here:

• Reporter: @ayazhussain79 $50
• Contributor: @dukenv0307 $750
• Contributor+: @situchan $750

[lschurr]

All payments done. Closing!