[Due for payment 2025-04-25] [$250] Identify and update all read-only push rows to be copiable via long-press or right click

[blimpich]

Coming from this issue, we want all menu items in the app that are readonly to be copiable using the same pattern as shown here:

CleanShot.2025-03-07.at.10.23.09.mp4

There are many places where we have read-only menu items that are either not copiable or they are copiable but they use an old pattern that shows a copy icon that they user clicks in order to get the value copied to their clipboard. Example below.

The responsibility of this issue is to:

1. find all instances where we have read-only rows that could we could feasibly want to have copied, and list them out in this issue for other people to double check.
2. make all these instances copiable using the long press (for mobile) and right click (for desktop) pattern.

cc: @Expensify/design

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021904624205290928803
• Upwork Job ID: 1904624205290928803
• Last Price Increase: 2025-03-25

Issue Owner

Current Issue Owner: @

Issue Owner

Current Issue Owner: @lydiabarclay

[melvin-bot]

Triggered auto assignment to @lydiabarclay (NewFeature), see https://stackoverflowteams.com/c/expensify/questions/14418#:~:text=BugZero%20process%20steps%20for%20feature%20requests for more details. Please add this Feature request to a GH project, as outlined in the SO.

[melvin-bot]

⚠️ It looks like this issue is labelled as a New Feature but not tied to any GitHub Project. Keep in mind that all new features should be tied to GitHub Projects in order to properly track external CAP software time ⚠️

[melvin-bot]

Triggered auto assignment to Design team member for new feature review - @dubielzyk-expensify (NewFeature)

[blimpich]

Holding until this issue is done since it'll give us an example of the new pattern. Once that is done we can add the external label and get this started.

[lydiabarclay]

still holding, above issue is still open

[blimpich]

Unblocking since #57800 is now merged in it's PR and deployed to production

[melvin-bot]

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

[melvin-bot]

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

[sosek108]

Hi, I'm Hubert from Callstack - expert contributor group - and I would like to take a look at this issue.

[sosek108]

At this moment I've identified at least three places where read-only properties are shown:

1. Profile details
2. Preview of expense report
3. Workspace's overview.

I imagine there are more such places on views related to special functionalities such as travels, credit cards, accountant integrations etc. Is there any possibility I'd have access to an account with these functionalities enabled? @blimpich

---

My initial though was to add new prop to component rendering these detail but I quickly found out that there is no such component reused in these places.

There are two ways to do that:

1. create one component to show readonly properties with this look: top-lable, botton-value, but in each place these vary in visual and functional properties so it can be hard to do generic "do it all" component
2. create High Order Component with CopiableValue-ish name which will wrap component and add desired functionality.

[blimpich]

@sosek108 it might be helpful to browse through https://help.expensify.com/new-expensify and see if you can find the UI components you're looking for. That'll have lots of examples of features that might have a read-only row that we want to modify.

I'll try to setup an account for you on my local machine, but some of those flows you mention aren't easily testable. I can add you to a travel policy in staging that is testable, and I can create an account on my local machine that has access to card feeds and expensify cards, but it's not simple to get you access to an account that would let you manually explore all advanced features of the app. That's why I think looking through the documentation on help.expensify.com will probably be easiest.

Let me know the email you'd like added to the travel testing account on staging.

[sosek108]

[email protected] is my main account, I'm using for test. Thank you in advance!

[melvin-bot]

@jjcoffee Huh... This is 4 days overdue. Who can take care of this?

[jjcoffee]

The proposal LGTM!

🎀👀🎀 C+ reviewed

[melvin-bot]

Current assignee @blimpich is eligible for the choreEngineerContributorManagement assigner, not assigning anyone new.

[sosek108]

Pull request: #59731

[sosek108]

@jjcoffee @blimpich Please be informed that I'll be out of office until monday

[melvin-bot]

⚠️ Looks like this issue was linked to a Deploy Blocker here

If you are the assigned CME please investigate whether the linked PR caused a regression and leave a comment with the results.

If a regression has occurred and you are the assigned CM follow the instructions here.

If this regression could have been avoided please consider also proposing a recommendation to the PR checklist so that we can avoid it in the future.

[melvin-bot]

Reviewing label has been removed, please complete the "BugZero Checklist".

[melvin-bot]

The solution for this issue has been 🚀 deployed to production 🚀 in version 9.1.29-10 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• Feat: Identify and update all read-only push rows to be copiable via long-press or right click #59731

If no regressions arise, payment will be issued on 2025-04-25. 🎊

For reference, here are some details about the assignees on this issue:

• @sosek108 does not require payment (Contractor)
• @jjcoffee requires payment through NewDot Manual Requests

[melvin-bot]

BugZero Checklist: The PR adding this new feature has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

• [@jjcoffee] Please propose regression test steps to ensure the new feature will work correctly on production in further releases.
• [@lydiabarclay] Link the GH issue for creating/updating the regression test once above steps have been agreed upon: https://github.com/Expensify/Expensify/issues/493889

[jjcoffee]

Regression Test Proposal

Precondition:

• Have an Expensify Card assigned to your user
• Be a member of a workspace not owned by you
• Have a paid distance expense with a merchant provided

Test:

Verify that copy functionality is available in all of the following locations, and that they follow exactly the same pattern (right click->copy for desktop, long-press->copy for mobile).

1. Go to Account and select any Workspace -> Members and select a member, check the email field
2. Select Profile and check the email field
3. Go to any Workspace not owned by the user, check the address field
4. Go to any paid report, with a merchant provided, check the merchant field
5. Go to any paid distance expense, check the distance, rate and date fields
6. Go to settings -> Wallet, open the card under Assigned cards, reveal the details and check the card number field
7. Check the Balance field on the Wallet page

Do we agree 👍 or 👎

[lydiabarclay]

Payment Summary

Contributor: @sosek108 does not require payment (Contractor)
Contributor+: @jjcoffee due $250 via NewDot

...

Paid, regression test filed: https://github.com/Expensify/Expensify/issues/493889

[garrettmknight]

$250 approved for @jjcoffee