Google location link is being cut off and placed in a new line

[isagoico]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Action Performed:

1. Log in to e.cash and navigate to a conversation
2. Paste and send this link
   https://www.google.com/maps/place/Poster+Auctions+International,+Inc./@40.7384572,-73.9942151,20.17z/data=!4m13!1m7!3m6!1s0x89c259a2c5fdee77:0x1439488db9133bae!2s26+W+17th+St,+New+York,+NY+10011!3b1!8m2!3d40.7383679!4d-73.993907!3m4!1s0x89c259a2c438eb63:0x115ba65a3675338b!8m2!3d40.7384793!4d-73.9937764
3. Notice that the links are cut off after the colon and therefore don't hyperlink correctly.

Expected Result:

Link should be rendered without any breaks.

Actual Result:

Link is cut and placed in a new line before the period.

Workaround:

User needs to manually copy and paste the link to be able to navigate to the desired URL.

Platform:

Where is this issue occurring?

• Web
• iOS
• Android
• Desktop App
• Mobile Web

Version Number: 1.1.13-0

Reproducible in staging?: Yes
Reproducible in production?: Yes

Logs: https://stackoverflow.com/c/expensify/questions/4856

Notes/Photos/Videos: Any additional supporting documentation

This similar issue was already fixed #4105

Expensify/Expensify Issue URL:

Issue reported by: @mallenexpensify
Slack conversation: https://expensify.slack.com/archives/C01GTK53T8Q/p1635954172411200

View all open jobs on GitHub

view the job on upwork

[MelvinBot]

Triggered auto assignment to @flodnv (Engineering), see https://stackoverflow.com/c/expensify/questions/4319 for more details.

[mateusbra]

First of all, I don't think its being "cut and placed in a new line", the main problem here is that the regex doesn't matches with some characteres( . , = ( + $ ! * ) right before /, we can reproduce this problem putting any of those characteres instead of . in the url
-\w~@:%)

E.G.:
Input:
https://www.google.com/maps/place/Poster+Auctions+International,+Inc./test
Will match with:
https://www.google.com/maps/place/Poster+Auctions+International,+Inc
Ignoring all the rest of the link

If this could be external I would like to fix this issue:

PROPOSAL

We have to add support to . and all the others characteres to the regex:
At ExpensiMark.js we have to change URL_PATH_REGEX

https://github.com/Expensify/expensify-common/blob/e6ba00d53b8119fa0e641ed1544257ac4bcb9aec/lib/ExpensiMark.js#L6-L10

We will have:

const URL_PATH_REGEX = `(?:\\/${addEscapedChar('[-\\w$@.+!*:(),=%~]')}*${addEscapedChar('[-\\w$@.+!*:%$(),=~]')}|\\/)*`;

This way we guarantee any url will match with our REGEX even with thoses characteres in the end of the link, like what Github does.

[mateusbra]

Test with code changes:

[MelvinBot]

Triggered auto assignment to @jboniface (External), see https://stackoverflow.com/c/expensify/questions/8582 for more details.