[$250] Workflow - RHP for Add approval workflow doesn't appear after upgrading the workspace #56653

IuliiaHerets · 2025-02-11T09:43:45Z

If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!

Version Number: 9.0.96-0
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught during regression testing, add the test name, ID and link from TestRail: Exp
Email or phone of affected tester (no customers): [email protected]
Issue reported by: Applause Internal Team
Device used: Windows Windows 11 - Chrome, Samsung Galaxy A13 - Android 14, Wi-Fi, Chrome
App Component: Workspace Settings

Action Performed:

Go to https://staging.new.expensify.com/
Create a collect workspace
Go to workflows > Add approval workflow
upgrade to unlock the feature.

Expected Result:

RHP for Add approval workflow should appear immediately after upgrading to unlock the feature.

Actual Result:

RHP for Add approval workflow doesn't appear immediately.

Workaround:

Unknown

Platforms:

Screenshots/Videos

Bug6739287_1739260716457.bandicam_2025-02-11_10-50-58-255.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

Upwork Job URL: https://www.upwork.com/jobs/~021890550282210470430
Upwork Job ID: 1890550282210470430
Last Price Increase: 2025-02-14
Automatic offers:

brunovjk | Reviewer | 106163908
thelullabyy | Contributor | 106163909

Issue Owner

Current Issue Owner: @brunovjk

melvin-bot · 2025-02-11T09:43:53Z

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

nyomanjyotisa · 2025-02-11T10:00:25Z

🚨 Edited by proposal-police: This proposal was edited at 2025-02-11 11:45:01 UTC.

Proposal

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

Workflow - RHP for Add approval workflow doesn't appear after upgrading the workspace

What is the root cause of that problem?

The root cause is that the redirection route provided when launching the upgrade modal is incorrect. Currently, the navigation call in the addApprovalAction function uses:

App/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx

Lines 108 to 111 in 48520ec

    
           Navigation.navigate( 
        
               ROUTES.WORKSPACE_UPGRADE.getRoute(route.params.policyID, CONST.UPGRADE_FEATURE_INTRO_MAPPING.approvals.alias, ROUTES.WORKSPACE_WORKFLOWS.getRoute(route.params.policyID)), 
        
           ); 
        
           return;

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

We should update the third parameter of the route so that the upgrade modal redirects to the correct page. In addApprovalAction, change the navigation call to:

Navigation.navigate(
    ROUTES.WORKSPACE_UPGRADE.getRoute(
        route.params.policyID,
        CONST.UPGRADE_FEATURE_INTRO_MAPPING.approvals.alias,
        ROUTES.WORKSPACE_WORKFLOWS_APPROVALS_EXPENSES_FROM.getRoute(route.params.policyID)
    ),
);

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

create ui test, signin as test user, create fake collect workspace, render workflows setting page of that workspace, fireEvent.press "Add approval workflow", fireEvent.press "Upgrade" button, fireEvent.press "Got it, thanks" button, verify Add aproval workflow displayed

What alternative solutions did you explore? (Optional)

N/A

melvin-bot · 2025-02-14T23:54:48Z

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

melvin-bot · 2025-02-14T23:54:52Z

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

thelullabyy · 2025-02-15T09:26:38Z

Proposal

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

RHP for Add approval workflow doesn't appear immediately.

What is the root cause of that problem?

App/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx

Lines 107 to 109 in 48520ec

    
           if (!PolicyUtils.isControlPolicy(policy)) { 
        
               Navigation.navigate( 
        
                   ROUTES.WORKSPACE_UPGRADE.getRoute(route.params.policyID, CONST.UPGRADE_FEATURE_INTRO_MAPPING.approvals.alias, ROUTES.WORKSPACE_WORKFLOWS.getRoute(route.params.policyID)),

The third param (backTo) of the navigate function is wrong

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

Should update to ROUTES.WORKSPACE_WORKFLOWS_APPROVALS_EXPENSES_FROM.getRoute(route.params.policyID)

After making the above update, we have another problem. Before navigating to WORKSPACE_WORKFLOWS_APPROVALS_EXPENSES_FROM we need to set the initial workflow as we did

App/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx

Line 114 in 48520ec

Workflow.setApprovalWorkflow({

To address this additional problem, I suggest two solutions:

we can move Workflow.setApprovalWorkflow to the beginning of addApprovalAction function (I already tested thoroughly, and It will not be affected if we close the upgrade workspace page without upgrading)
Add setApprovalWorkflow to this place. But I still prefer the first solution because it will be cleaner

App/src/pages/workspace/upgrade/WorkspaceUpgradePage.tsx

Line 65 in fbcd7dd

Navigation.goBack();

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

NA

What alternative solutions did you explore? (Optional)

Reminder: Please use plain English, be brief and avoid jargon. Feel free to use images, charts or pseudo-code if necessary. Do not post large multi-line diffs or write walls of text. Do not create PRs unless you have been hired for this job.

huult · 2025-02-15T16:05:19Z

🚨 Edited by proposal-police: This proposal was edited at 2025-02-15 16:11:19 UTC.

Proposal

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

RHP for Add approval workflow doesn't appear after upgrading the workspace

What is the root cause of that problem?

After the upgrade workflow is complete, the thank you page should be shown.

App/src/pages/workspace/upgrade/WorkspaceUpgradePage.tsx

Lines 187 to 192 in 1f8e5bd

    
           {!!policy && isUpgraded && ( 
        
               <UpgradeConfirmation 
        
                   onConfirmUpgrade={goBack} 
        
                   policyName={policy.name} 
        
               /> 
        
           )}

On the thank you page, clicking 'Got it' will navigate back to Workflows

App/src/pages/workspace/upgrade/WorkspaceUpgradePage.tsx

Lines 65 to 68 in 1f8e5bd

    
           Navigation.goBack(); 
        
           if (route.params.backTo) { 
        
               Navigation.navigate(route.params.backTo); 
        
           }

So, we don't navigate to 'Add Approval Workflow' after a successful upgrade

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

To resolve this issue, we should call the 'Add Approval Workflow' function after clicking 'Got it' of 'thank you' page.

    const {availableMembers, usedApproverEmails} = useMemo(
        () =>
            convertPolicyEmployeesToApprovalWorkflows({
                employees: policy?.employeeList ?? {},
                defaultApprover: policyApproverEmail ?? policy?.owner ?? '',
                personalDetails: personalDetails ?? {},
            }),
        [personalDetails, policy?.employeeList, policy?.owner, policyApproverEmail],
    );

App/src/pages/workspace/upgrade/WorkspaceUpgradePage.tsx

Lines 65 to 68 in 1f8e5bd

    
           Navigation.goBack(); 
        
           if (route.params.backTo) { 
        
               Navigation.navigate(route.params.backTo); 
        
           }

Update to:

    case CONST.UPGRADE_FEATURE_INTRO_MAPPING.approvals.id:
        Workflow.setApprovalWorkflow({
            ...INITIAL_APPROVAL_WORKFLOW,
            availableMembers,
            usedApproverEmails,
        });
        Navigation.goBack();
        Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVALS_EXPENSES_FROM.getRoute(route.params.policyID));
        return;

Test branch

Screen.Recording.2025-02-15.at.22.59.56.mp4

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

None

What alternative solutions did you explore? (Optional)

Reminder: Please use plain English, be brief and avoid jargon. Feel free to use images, charts or pseudo-code if necessary. Do not post large multi-line diffs or write walls of text. Do not create PRs unless you have been hired for this job.

After successfully upgrading, we should automatically navigate to 'Add Approval Workflow'

1 Create new useEffect and add:

    useEffect(() => {
        if (!policy || !isUpgraded || feature?.id !== CONST.UPGRADE_FEATURE_INTRO_MAPPING.approvals.id) {
            return;
        }

        Workflow.setApprovalWorkflow({
            ...INITIAL_APPROVAL_WORKFLOW,
            availableMembers,
            usedApproverEmails,
        });

        Navigation.goBack();
        Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVALS_EXPENSES_FROM.getRoute(route.params.policyID ?? ''));
    }, [availableMembers, feature?.id, isUpgraded, policy, route.params.policyID, usedApproverEmails]);

Remove unused code and update the condition for showing the thank you page to ensure smooth navigation to 'Add Approval Workflow'.

Screen.Recording.2025-02-15.at.23.00.35.mp4

Alternative solutions 2

Call navigation to 'Add Approval Workflow' after a successful upgrade.

App/src/pages/workspace/upgrade/WorkspaceUpgradePage.tsx

Line 96 in 1f8e5bd

Policy.upgradeToCorporate(policy.id, feature?.name);

      InteractionManager.runAfterInteractions(() => {
            requestAnimationFrame(() => {
                if (!policy || !isUpgraded || feature?.id !== CONST.UPGRADE_FEATURE_INTRO_MAPPING.approvals.id) {
                    return;
                }

                Workflow.setApprovalWorkflow({
                    ...INITIAL_APPROVAL_WORKFLOW,
                    availableMembers,
                    usedApproverEmails,
                });

                Navigation.goBack();
                Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVALS_EXPENSES_FROM.getRoute(route.params.policyID ?? ''));
            });
        });

brunovjk · 2025-02-17T19:18:41Z

Thank you all for your proposals.

@nyomanjyotisa correctly identified the root cause: the incorrect route.params.backTo parameter. However, it missed the need to set the initial workflow before navigating. @thelullabyy addressed both the routing issue and the workflow initialization, offering a clean and effective solution by moving Workflow.setApprovalWorkflow to the beginning of addApprovalAction() or just before navigation. @huult proposed a similar approach by triggering the workflow setup after the "Got it" button on the thank you page, which duplicates an alternative mentioned by @thelullabyy.

I recommend proceeding with @thelullabyy proposal.

🎀👀🎀 C+ reviewed

melvin-bot · 2025-02-17T19:18:53Z

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

melvin-bot · 2025-02-17T20:58:18Z

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

Offer link
Upwork job

melvin-bot · 2025-02-17T20:58:21Z

📣 @thelullabyy 🎉 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 📖

brunovjk · 2025-02-18T12:12:51Z

@thelullabyy would you have an ETA for us? Thank you.

thelullabyy · 2025-02-18T12:34:50Z

The PR will be ready today

IuliiaHerets added Bug Something is broken. Auto assigns a BugZero manager. Daily KSv2 labels Feb 11, 2025

melvin-bot bot assigned johncschuster Feb 11, 2025

melvin-bot bot added the Overdue label Feb 13, 2025

johncschuster added the External Added to denote the issue can be worked on by a contributor label Feb 14, 2025

melvin-bot bot changed the title ~~Workflow - RHP for Add approval workflow doesn't appear after upgrading the workspace~~ [$250] Workflow - RHP for Add approval workflow doesn't appear after upgrading the workspace Feb 14, 2025

melvin-bot bot added the Help Wanted Apply this label when an issue is open to proposals by contributors label Feb 14, 2025

melvin-bot bot assigned brunovjk Feb 14, 2025

melvin-bot bot removed the Overdue label Feb 14, 2025

This comment has been minimized.

Sign in to view

melvin-bot bot assigned stitesExpensify Feb 17, 2025

stitesExpensify assigned thelullabyy Feb 17, 2025

melvin-bot bot removed the Help Wanted Apply this label when an issue is open to proposals by contributors label Feb 17, 2025

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[$250] Workflow - RHP for Add approval workflow doesn't appear after upgrading the workspace #56653

[$250] Workflow - RHP for Add approval workflow doesn't appear after upgrading the workspace #56653

IuliiaHerets commented Feb 11, 2025 •

edited by melvin-bot bot

Loading

melvin-bot bot commented Feb 11, 2025

nyomanjyotisa commented Feb 11, 2025 •

edited by github-actions bot

Loading

melvin-bot bot commented Feb 14, 2025

melvin-bot bot commented Feb 14, 2025

thelullabyy commented Feb 15, 2025

huult commented Feb 15, 2025 •

edited by github-actions bot

Loading

This comment has been minimized.

brunovjk commented Feb 17, 2025

melvin-bot bot commented Feb 17, 2025

melvin-bot bot commented Feb 17, 2025

melvin-bot bot commented Feb 17, 2025

brunovjk commented Feb 18, 2025

thelullabyy commented Feb 18, 2025

[$250] Workflow - RHP for Add approval workflow doesn't appear after upgrading the workspace #56653

[$250] Workflow - RHP for Add approval workflow doesn't appear after upgrading the workspace #56653

Comments

IuliiaHerets commented Feb 11, 2025 • edited by melvin-bot bot Loading

Action Performed:

Expected Result:

Actual Result:

Workaround:

Platforms:

Screenshots/Videos

melvin-bot bot commented Feb 11, 2025

nyomanjyotisa commented Feb 11, 2025 • edited by github-actions bot Loading

Proposal

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

What is the root cause of that problem?

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

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

What alternative solutions did you explore? (Optional)

melvin-bot bot commented Feb 14, 2025

melvin-bot bot commented Feb 14, 2025

thelullabyy commented Feb 15, 2025

Proposal

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

What is the root cause of that problem?

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

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

What alternative solutions did you explore? (Optional)

huult commented Feb 15, 2025 • edited by github-actions bot Loading

Proposal

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

What is the root cause of that problem?

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

Test branch

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

What alternative solutions did you explore? (Optional)

Alternative solutions 2

This comment has been minimized.

brunovjk commented Feb 17, 2025

melvin-bot bot commented Feb 17, 2025

melvin-bot bot commented Feb 17, 2025

melvin-bot bot commented Feb 17, 2025

brunovjk commented Feb 18, 2025

thelullabyy commented Feb 18, 2025

IuliiaHerets commented Feb 11, 2025 •

edited by melvin-bot bot

Loading

nyomanjyotisa commented Feb 11, 2025 •

edited by github-actions bot

Loading

huult commented Feb 15, 2025 •

edited by github-actions bot

Loading