Expensify / App

Welcome to New Expensify: a complete re-imagination of financial collaboration, centered around chat. Help us build the next generation of Expensify by sharing feedback and contributing to the code.
https://new.expensify.com
MIT License
3.36k stars 2.79k forks source link

[$250] Expense-Expense preview is hidden briefly when returning to expense report via header subtitle #49741

Open lanitochka17 opened 5 days ago

lanitochka17 commented 5 days 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.40-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 Email or phone of affected tester (no customers): applausetester+kh230901@applause.expensifail.com Issue reported by: Applause - Internal Team

Action Performed:

  1. Go to staging.new.expensify.com
  2. Go to DM
  3. Submit at least two expenses to the user
  4. Go to transaction thread of the first expense
  5. Click on the header subtitle link to go back to expense report

Expected Result:

The second expense preview will show instantly after returning to expense report via header subtitle (production behavior)

Actual Result:

The second expense preview is hidden briefly after returning to expense report via header subtitle

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

Add any screenshot/video evidence

https://github.com/user-attachments/assets/e1087dab-4a1b-4535-817f-34e0dff15c91

View all open jobs on GitHub

Upwork Automation - Do Not Edit
  • Upwork Job URL: https://www.upwork.com/jobs/~021839062492993280361
  • Upwork Job ID: 1839062492993280361
  • Last Price Increase: 2024-09-25
Issue OwnerCurrent Issue Owner: @fedirjh
melvin-bot[bot] commented 5 days ago

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

github-actions[bot] commented 5 days 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:

  1. Identify the pull request that introduced this issue and revert it.
  2. Find someone who can quickly fix the issue.
  3. Fix the issue yourself.
lanitochka17 commented 5 days ago

We think that this bug might be related to #wave-collect - Release 1

francoisl commented 4 days ago

I also notice a short delay on production, albeit shorter than on staging. Roughly like 50ms on production, and 200ms on staging. It doesn't look like there's any API call happening when returning to the parent report, so it's probably not due to anything changing in Onyx.

There's nothing that stands out in the checklist so I'm going to open this up for proposals. Doesn't seem worthy of blocking though.

melvin-bot[bot] commented 4 days ago

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

melvin-bot[bot] commented 4 days ago

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

mkzie2 commented 4 days ago

Proposal

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

The second expense preview is hidden briefly after returning to expense report via header subtitle

What is the root cause of that problem?

  1. The expense preview is hidden briefly

loadNewerChats is called with a delay here because we wrapped it in InteractionManager.runAfterInteractions and requestAnimationFrame

https://github.com/Expensify/App/blob/2d0d4e9618970547e8a42886f0a34b37526022e1/src/pages/home/report/ReportActionsList.tsx#L617-L619

That leads isFirstLinkedActionRender ref being updated to false after more delay here

https://github.com/Expensify/App/blob/2d0d4e9618970547e8a42886f0a34b37526022e1/src/pages/home/report/ReportActionsView.tsx#L395

As a result, it takes more time to change reportActions from [preview1] (isFirstLinkedActionRender.current is true) to [preview1, preview 2] (isFirstLinkedActionRender is changed to false)

https://github.com/Expensify/App/blob/2d0d4e9618970547e8a42886f0a34b37526022e1/src/pages/home/report/ReportActionsView.tsx#L232-L234

  1. This happens every time we click on the header subtitle of the transaction thread report

We use goBack with shouldEnforceFallback as true to ensure we navigate to the previous report instead of going back. Then because it's a new screen in the stack, this bug happens as the reason at the point 1.

https://github.com/Expensify/App/blob/2d0d4e9618970547e8a42886f0a34b37526022e1/src/components/ParentNavigationSubtitle.tsx#L47

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

  1. If we agree that it's not a bug we can do nothing here since this change is added here to fix another bug. If not, we should remove this change and find another solution to fix the issue related to this change.

https://github.com/Expensify/App/blob/2d0d4e9618970547e8a42886f0a34b37526022e1/src/pages/home/report/ReportActionsList.tsx#L617-L619

  1. To prevent the flicker when clicking on the header subtitle, we should use Navigation.isNavigationReady here instead of passing shouldEnforceFallback param as true
Navigation.isNavigationReady().then(() => {
    Navigation.goBack(ROUTES.REPORT_WITH_ID.getRoute(parentReportID, parentReportActionID));
});

https://github.com/Expensify/App/blob/2d0d4e9618970547e8a42886f0a34b37526022e1/src/components/ParentNavigationSubtitle.tsx#L47

What alternative solutions did you explore? (Optional)