[HOLD for payment 2024-09-24] [$250] Advanced approval - RHP turns to not here page while dismissing after deleting the workflow

[IuliiaHerets]

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: v9.0.25-1
Reproducible in staging?: Y
Reproducible in production?: N
Email or phone of affected tester (no customers): applausetester+kh050806@applause.expensifail.com
Issue reported by: Applause Internal Team

Action Performed:

1. Go to staging.new.expensify.com
2. Go to workspace settings > Workflows.
3. Click Add approval workflow.
4. Select user for "Expenses from" and "Approval".
5. Click Add workflow on confirmation page.
6. Click on the added workflow.
7. Click Delete.
8. Delete the worfklow.

Expected Result:

RHP will close without turning to not here page after deleting the workflow.

Actual Result:

RHP closes while briefly displaying the not here page after deleting the workflow.

Workaround:

Unknown

Platforms:

• Android: Native
• Android: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Bug6583988_1724749616430.20240827_170252.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~011b0021bbcd2e0b55
• Upwork Job ID: 1828575300443505062
• Last Price Increase: 2024-09-03
• Automatic offers:
• Krishna2323 | Contributor | 103807249

[melvin-bot]

Triggered auto assignment to @greg-schroeder (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.

[melvin-bot]

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

[github-actions]

👋 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.

[IuliiaHerets]

We think that this bug might be related to #wave-control

[nkdengineer]

Proposal

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

RHP turns to not here page while dismissing after deleting the workflow.

What is the root cause of that problem?

This comes from #47845

Let's see the condition to show the not found page here. When we confirm delete, the currentApprovalWorkflow can be updated before we close the RHP then the not found page display briefly

App/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsEditPage.tsx

Lines 88 to 90 in 6ca91cd

	(isEmptyObject(policy) && !isLoadingReportData) || !PolicyUtils.isPolicyAdmin(policy) || PolicyUtils.isPendingDeletePolicy(policy) || !currentApprovalWorkflow;
	// Set the initial approval workflow when the page is loaded

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

We should check if the currentApprovalWorkflow just changed to empty we will not show not found page. We can use usePrevious hook for currentApprovalWorkflow then only show not found page if both currentApprovalWorkflow and prevCurrentApprovalWorkflow is empty

const prevCurrentApprovalWorkflow = usePrevious(currentApprovalWorkflow);
    // eslint-disable-next-line rulesdir/no-negated-variables
    const shouldShowNotFoundView =
        (isEmptyObject(policy) && !isLoadingReportData) ||
        !PolicyUtils.isPolicyAdmin(policy) ||
        PolicyUtils.isPendingDeletePolicy(policy) ||
        (!currentApprovalWorkflow && !prevCurrentApprovalWorkflow);

App/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsEditPage.tsx

Lines 88 to 90 in 6ca91cd

	(isEmptyObject(policy) && !isLoadingReportData) || !PolicyUtils.isPolicyAdmin(policy) || PolicyUtils.isPendingDeletePolicy(policy) || !currentApprovalWorkflow;
	// Set the initial approval workflow when the page is loaded

What alternative solutions did you explore? (Optional)

[Krishna2323]

Proposal

Offending PR: #47845

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

Advanced approval - RHP turns to not here page while dismissing after deleting the workflow

What is the root cause of that problem?

When we call removeApprovalWorkflow, shouldShowNotFoundView becomes true and not found page is shown, removeApprovalWorkflow can finish before the close animation happens that's why we see the not found page.

App/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsEditPage.tsx

Lines 86 to 88 in 6ca91cd

	// eslint-disable-next-line rulesdir/no-negated-variables
	const shouldShowNotFoundView =
	(isEmptyObject(policy) && !isLoadingReportData) || !PolicyUtils.isPolicyAdmin(policy) || PolicyUtils.isPendingDeletePolicy(policy) || !currentApprovalWorkflow;

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

We can simply update the condition below to shouldShow={shouldShowNotFoundView && isFocused}.

App/src/pages/workspace/workflows/approvals/WorkspaceWorkflowsApprovalsEditPage.tsx

Line 121 in 6ca91cd

shouldShow={shouldShowNotFoundView}

What alternative solutions did you explore? (Optional)



Result

Monosnap.screencast.2024-08-27.20-54-43.mp4

[srikarparsi]

Hi @dylanexpensify, do you think you could help confirm what the expected behavior is here? I believe the RHP should close, it's just that the Not here page briefly shows while the RHP closes. Is that expected? Also ccing @tgolen and @muttmuure based on this thread.

[srikarparsi]

Also demoting this as it is very minute and the feature is currently behind a beta -

App/src/libs/Permissions.ts

Line 24 in 80f7d1e

return !!betas?.includes(CONST.BETAS.WORKFLOWS_ADVANCED_APPROVAL) || canUseAllBetas(betas);

[blazejkustra]

I believe the RHP should close, it's just that the Not here page briefly shows while the RHP closes. Is that expected?

That's exactly it, we don't want to show NotFoundPage for a brief moment.

[srikarparsi]

Cool thanks, updated the issue description and making this external

[melvin-bot]

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

[melvin-bot]

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

[srikarparsi]

Cool, assigning @Krishna2323

[melvin-bot]

📣 @Krishna2323 🎉 An offer has been automatically sent to your Upwork account for the Contributor role 🎉 Thanks for contributing to the Expensify app!

Offer link
Upwork job
Please accept the offer and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻
Keep in mind: Code of Conduct | Contributing 📖

[blazejkustra]

@Krishna2323 When can we expect a PR for this? 👀

[Krishna2323]

@blazejkustra, PR raised, recordings will be added in few minutes.

[Krishna2323]

@Ollyws, PR ready for review.

[greg-schroeder]

PR still in review

[greg-schroeder]

Same as above

[greg-schroeder]

PR merged and deployed to staging. Awaiting deploy to prod

[greg-schroeder]

Deployed to prod 9/17

[greg-schroeder]

Updated title and payment date to account for failed automation

[greg-schroeder]

Payment summary:

Contributor: @Krishna2323 - $250 - will be paid via Upwork on 9/24
C+: @Ollyws - $250 - Can make a manual request via ND on 9/24

[Ollyws]

Requested in ND.

[greg-schroeder]

Upwork contracts paid

[garrettmknight]

$250 approved for @Ollyws