[$1000] Clicking the statement link in the Mac Desktop app opens the link in web instead of opening in the app sidebar directly

[m-natarajan]

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: 1.4.22-0 Reproducible in staging?: needs reproduction Reproducible in production?: needs reproduction If this was caught during regression testing, add the test name, ID and link from TestRail: Email or phone of affected tester (no customers): Logs: https://stackoverflow.com/c/expensify/questions/4856 Expensify/Expensify Issue URL: Issue reported by: @puneetlath Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1704219520043159

Action Performed:

1. Click on the statement link from concierge chat in desktop app

Expected Result:

Should open in the side bar

Actual Result:

Opens in the web

Workaround:

unknown

Platforms:

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

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

Screenshots/Videos

Add any screenshot/video evidence

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01e81b7c4cb7cbfa0e
• Upwork Job ID: 1744433753657077760
• Last Price Increase: 2024-01-31
• Automatic offers:
• akinwale | Reviewer | 28099226

[melvin-bot[bot]]

Triggered auto assignment to @bfitzexpensify (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[melvin-bot[bot]]

Bug0 Triage Checklist (Main S/O)

• [ ] This "bug" occurs on a supported platform (ensure Platforms in OP are ✅)
• [ ] This bug is not a duplicate report (check E/App issues and #expensify-bugs)
  • If it is, comment with a link to the original report, close the issue and add any novel details to the original issue instead
• [ ] This bug is reproducible using the reproduction steps in the OP. S/O
  • If the reproduction steps are clear and you're unable to reproduce the bug, check with the reporter and QA first, then close the issue.
  • If the reproduction steps aren't clear and you determine the correct steps, please update the OP.
• [ ] This issue is filled out as thoroughly and clearly as possible
  • Pay special attention to the title, results, platforms where the bug occurs, and if the bug happens on staging/production.
• [ ] I have reviewed and subscribed to the linked Slack conversation to ensure Slack/Github stay in sync

[melvin-bot[bot]]

@bfitzexpensify Whoops! This issue is 2 days overdue. Let's get this updated quick!

[melvin-bot[bot]]

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

[melvin-bot[bot]]

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

[melvin-bot[bot]]

📣 @AnaVlasin! 📣 Hey, it seems we don’t have your contributor details yet! You'll only have to do this once, and this is how we'll hire you on Upwork. Please follow these steps:

1. Make sure you've read and understood the contributing guidelines.
2. Get the email address used to login to your Expensify account. If you don't already have an Expensify account, create one here. If you have multiple accounts (e.g. one for testing), please use your main account email.
3. Get the link to your Upwork profile. It's necessary because we only pay via Upwork. You can access it by logging in, and then clicking on your name. It'll look like this. If you don't already have an account, sign up for one here.
4. Copy the format below and paste it in a comment on this issue. Replace the placeholder text with your actual details. Format:

Contributor details
Your Expensify account email: <REPLACE EMAIL HERE>
Upwork Profile Link: <REPLACE LINK HERE>

[BriniM]

Contributor details Your Expensify account email: [email protected] Upwork Profile Link: https://www.upwork.com/freelancers/maherbrini

[melvin-bot[bot]]

✅ Contributor details stored successfully. Thank you for contributing to Expensify!

[bfitzexpensify]

Awaiting proposals.

[BriniM]

Is there a way to reproduce creating that Monthly statement, without having to enter any personal information, say as by having a test account or similar? Also I am fairly new to Expensify so a step-by-step guide / video recording on how to reproduce this would be nice.

[bfitzexpensify]

Hey @BriniM, does https://expensify.slack.com/archives/C01GTK53T8Q/p1701213684698809 answer your question?

[bfitzexpensify]

I'm going to be mostly ooo until Jan 29, assigning a second BZ team member to keep an eye on this.

• awaiting proposals

[melvin-bot[bot]]

Triggered auto assignment to @MitchExpensify (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[Piotrfj]

Hello, Im Piotr from Callstack and would like to help with this issue

[MitchExpensify]

Sounds good @Piotrfj !

[melvin-bot[bot]]

📣 @akinwale 🎉 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[bot]]

@akinwale, @MitchExpensify, @bfitzexpensify, @Piotrfj Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[MitchExpensify]

What's the latest on progress here @Piotrfj ?

[melvin-bot[bot]]

@akinwale @MitchExpensify @bfitzexpensify @Piotrfj this issue was created 2 weeks ago. Are we close to approving a proposal? If not, what's blocking us from getting this issue assigned? Don't hesitate to create a thread in #expensify-open-source to align faster in real time. Thanks!

[mvtglobally]

Issue not reproducible during KI retests. (First week)

[MitchExpensify]

Friendly bump @Piotrfj

[Piotrfj]

Update: The issue is replicable and the source seems to be in link conversion

[melvin-bot[bot]]

@akinwale, @MitchExpensify, @bfitzexpensify, @Piotrfj Eep! 4 days overdue now. Issues have feelings too...

[MitchExpensify]

@bfitzexpensify Not much movement on this one while you were out. Worth doubling do you think?

[melvin-bot[bot]]

Upwork job price has been updated to $1000

[bfitzexpensify]

Not much movement on this one while you were out. Worth doubling do you think?

Yep, I reckon - updated to $1000

[BriniM]

Wanted to reproduce the monthly statement but couldn't find a way to do this for a fresh expensify account with dummy data, would love to investigate this otherwise.

[ikevin127]

Proposal

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

Clicking on a chat statement link on MacOS: Desktop / Native platforms opens the link in web instead of opening the RHN with the statement as it happens on Web / mWeb.

What is the root cause of that problem?

The RenderCommentHTML component is responsible for rendering comments that have links in them, and in our case when there's a message with text + statement link (Concierge) or just a statement link, this is what the component renders:

• <a href="https://staging.new.expensify.com/statements/202312" target="_blank" rel="noreferrer noopener">https://staging.new.expensify.com/statements/202312</a>

Because on MacOS: Desktop / Native platforms the we don't have logic to handle this type of external links with target="_blank" rel="noreferrer noopener" -> the app opens them via the browser.

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

TLDR: Use native / desktop specific component like TextLink which will handle the statement link internally.

A solution for this would require the following:

• create a library for both .desktop.ts and .native.ts, where index.ts would be noop
• use regex to check if the rendered html contains statements/YYYYMM format, like this: /statements\/\d{6}/g
• if any matches, next use regex to extract the href from the html, like this: html.match(/href="([^"]*)/)?.[1]
• finally, return TextLink component that onPress calls: Navigation.navigate(ROUTES.WALLET_STATEMENT_WITH_DATE.replace(':yearMonth', statementYearMonth)) wrapping the statement link, making sure to also render any other text that might be part of the comment, if any

[ikevin127]

I think the problem comes from BE here and I came to this conclusion while debugging (more context above in my outdated proposal) - how so ? I noticed that there's no issues with any platform opening the RHN of the statement as long as the statement link has the following form:

• DEV: https://dev.new.expensify.com:PORT/statements/202312 - the PORT match matters when testing locally
• STG: https://staging.new.expensify.com/statements/202312
• PROD: https://new.expensify.com/statements/202312

The only case when the app opens the link externally via the browser is when the statement's link domain env doesn't match the app's env which that's trying to open said link.

This is where I assume the BE sent the wrong env domain for the statement link via Concierge and when this issue was found, if it was found on staging, the link most likely had the prod env domain which the staging app doesn't recognize therefore it opens a new web tab regardless of the platform (web, desktop, natives).

Note: It doesn't have anything to do with the statement link being corrupt or anything like that - it's just the domain env mismatch with the app that's trying to open the link.

We can wait for confirmation from @m-natarajan as to how their Concierge statement link actually looks in terms of domain env and where the open attempt was performed.

For anyone who wants to test or confirm this, here's how you can generate a statement bypassing the wallet / bank flow:

• create a button somewhere in the UI and add the following function onClick / onPress: User.generateStatementPDF(yearMonth) - yearMonth: string - The statement year and month as one string, i.e. 202110
• open Network tab to make sure it gets created when pressing the button (call succeeds)
• once you created a statement, this can be accessed via the links demonstrated above for each env
• you can just paste the link in a chat and click on it - notice that if the link matches your app's env / port (for dev) the statement RHN will open instead of a new browser tab and vice versa

[melvin-bot[bot]]

@akinwale @MitchExpensify @bfitzexpensify @Piotrfj this issue is now 4 weeks old and preventing us from maintaining WAQ, can you:

• Decide whether any proposals currently meet our guidelines and can be approved as-is today
• If no proposals meet that standard, please take this issue internal and treat it as one of your highest priorities
• If you have any questions, don't hesitate to start a discussion in #expensify-open-source

Thanks!