[$125] Update `Start a free trial` on the Concierge DM header to be clickable

[danielrvidal]

Problem: Users keep clicking Start a free trial in the Concierge DM header, thinking it will help them start their free trial, but it doesn’t take them anywhere, so they are confused about how to start the trial.

Solution: Make the notice in the Concierge DM header a clickable button that takes you to Settings > Subscriptions (https://new.expensify.com/settings/subscription)

Please note: We have the "Start a free trial" notice in the LHN on the Concierge DM and in Settings Subscriptions. We do not need to make those clickable; we're only addressing the one in the Concierge DM header.

Issue Owner

Current Issue Owner: @

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021848465720168177047
• Upwork Job ID: 1848465720168177047
• Last Price Increase: 2024-10-21

[melvin-bot[bot]]

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

[melvin-bot[bot]]

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

[FitseTLT]

Proposal

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

Update Start a free trial on the Concierge DM header to be clickable

What is the root cause of that problem?

New Feature

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

We need to create a pressable prop for FreeTrialBadge

function FreeTrialBadge({badgeStyles, pressable = false}: FreeTrialBadgeProps) {

pass true here https://github.com/Expensify/App/blob/b2fc5c9627821ed4647d7fa656ba9d2b0a5d6d58/src/pages/home/HeaderView.tsx#L283

                                {ReportUtils.isChatUsedForOnboarding(report) && <FreeTrialBadge pressable />}

Add onPress conditionally here to navigate https://github.com/Expensify/App/blob/b2fc5c9627821ed4647d7fa656ba9d2b0a5d6d58/src/pages/settings/Subscription/FreeTrialBadge.tsx#L35

pressable={pressable}
            onPress={pressable ? () => Navigation.navigate(ROUTES.SETTINGS_SUBSCRIPTION) : undefined}

What alternative solutions did you explore? (Optional)

[brunovjk]

I tested it and @FitseTLT's proposal looks good to me:

https://github.com/user-attachments/assets/7e320ac7-cddb-4c97-8120-d4f02efe5004

🎀👀🎀 C+ reviewed

[melvin-bot[bot]]

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

[melvin-bot[bot]]

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

[melvin-bot[bot]]

Current assignee @brunovjk is eligible for the External assigner, not assigning anyone new.