[HOLD #43783][$250] Accounting - Submit button flickers in and out for non-admin submitter immediately after clicking Submit

lanitochka17 commented 4 months ago

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

Version Number: 9.0.8-0 Reproducible in staging?: Y Reproducible in production?: N If this was caught during regression testing, add the test name, ID and link from TestRail: N/A Issue reported by: Applause - Internal Team

Issue found when executing PR https://github.com/Expensify/App/pull/44170

Action Performed:

Pre-requisite:

Have a collect workspace
Enable delayed submission for the workspace
Create either a QBO or Xero connection
1. Navigate to staging.new.expensify.com
2. Sign in as the admin of the workspace
3. Create an expense in the workspace chat
4. Navigate to the combined expense report page and click on submit
5. Wait for a few seconds and observe the header button
6. Navigate back to the workspace chat page
7. Navigate back to the combined expense report page

Expected Result:

Right after a non-admin submitter clicks submit, the Submit button should disappear and no other button should show up.

Actual Result:

After a non-admin submits the expense, a Pay button shows up where the Submit button was before.

Workaround:

Unknown

Platforms:

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

[x] Android: Native
[x] Android: mWeb Chrome
[x] iOS: Native
[x] iOS: mWeb Safari
[x] MacOS: Chrome / Safari
[x] MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

https://github.com/user-attachments/assets/a11a832f-89ee-4b3d-94f7-6728d83897d8

View all open jobs on GitHub

Upwork Automation - Do Not Edit

Upwork Job URL: https://www.upwork.com/jobs/~011ac532d9ba102642
Upwork Job ID: 1813660172360646886
Last Price Increase: 2024-08-07

melvin-bot[bot] commented 4 months ago

Triggered auto assignment to @francoisl (DeployBlockerCash), see https://stackoverflowteams.com/c/expensify/questions/9980/ for more details.

github-actions[bot] commented 4 months ago

:wave: Friendly reminder that deploy blockers are time-sensitive ⏱ issues! Check out the open `StagingDeployCash` deploy checklist to see the list of PRs included in this release, then work quickly to do one of the following:

Identify the pull request that introduced this issue and revert it.
Find someone who can quickly fix the issue.
Fix the issue yourself.

francoisl commented 4 months ago

Going to look at that PR https://github.com/Expensify/App/pull/44170 to see if anything stands out.

In the meantime, /cc @kosmydel @hungvu193 if you have any idea

francoisl commented 4 months ago

The issue seems to be that in the rerender right after calling IOU.submitReport(), the money request's statusNum is still 0, and so shouldShowPayButton here is set to false (because isOpenExpenseReport here is true)

We correctly update the optimistic data of the IOU here in submitReport() though, so I can't tell why the statusNum is wrong in the memo 😕

melvin-bot[bot] commented 4 months ago

Job added to Upwork: https://www.upwork.com/jobs/~011ac532d9ba102642

melvin-bot[bot] commented 4 months ago

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

francoisl commented 4 months ago

In the meantime, here's a draft revert if we can't figure out a fix.

kosmydel commented 4 months ago

This problem must have been present before, but instead of displaying the "Export" button, no button was shown at all.

const shouldShowExportIntegrationButton = !shouldShowPayButton && !shouldShowSubmitButton && connectedIntegration && !!policy;

As we can see, the Pay button has higher priority, and if it is displayed, the export integration button must be hidden.

trjExpensify commented 4 months ago

Okay, I did two tests on production to corroborate that theory a bit, @kosmydel.

Workflows config:

Delayed submission: Enabled
Approvals: Disabled
Payments: Enabled

Result: The pay button appears immediately after clicking Submit.

https://github.com/user-attachments/assets/bb5b5d21-1154-4601-8a46-12eb5b5238e5

Workflows config:

Delayed submission: Enabled
Approvals: Disabled
Payments: Disabled

Result: There's a brief flash of the Submit button after clicking submit, and then no button.

https://github.com/user-attachments/assets/b9545d30-4d8e-4e97-a714-00ef52b11b7e

melvin-bot[bot] commented 4 months ago

Triggered auto assignment to @sakluger (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

mountiny commented 4 months ago

We are going to demote this one as it is specific to the admin submitting on a policy with a specific setup so it is not very common case, additionally, it can be fixed by revisiting the report.

Looking for a proposal to fix this flicker of the incorrect button

lakchote commented 4 months ago

With this PR that fixes the Export option showing wrongfully for workspace members (it should only be for admins), there's still a glitch.

Now, here's what happens:

Pay button -> Submit button briefly showing -> Pay button

https://github.com/user-attachments/assets/868d6428-c276-477f-a037-a6cd2d2916d4

mountiny commented 4 months ago

Nice, thanks for testing again. This just supports the theory the optimistic data is somewhat incorrect probably for this specific submit and close setting