[HOLD for payment 2025-01-28] [$125] Per diem - Ellipsis from Destination is too close to Subrate

[IuliiaHerets]

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

---

Version Number: 9.0.74-0
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught on HybridApp, is this reproducible on New Expensify Standalone?: Yes, reproducible on both
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): applausetester+kh1311020@applause.expensifail.com
Issue reported by: Applause Internal Team

Action Performed:

Precondition:

• Workspace has per diem rates.

1. Go to staging.new.expensify.com
2. Go to workspace settings.
3. Go to Per diem.
4. Narrow down the window size (or use mobile layout on mweb, Android or iOS).

Expected Result:

Ellipsis from Destination will not be too close to Subrate.

Actual Result:

Ellipsis from Destination is too close to Subrate.

Workaround:

Unknown

Platforms:

• Android: Standalone
• Android: HybridApp
• Android: mWeb Chrome
• iOS: Standalone
• iOS: HybridApp
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Bug6690702_1733905709285!German_Per_Diem_-Dependent_Tags___2.csv

Bug6690702_1733905709304.20241211_162528.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021869068273756230212
• Upwork Job ID: 1869068273756230212
• Last Price Increase: 2025-01-21
• Automatic offers:
• dominictb | Contributor | 105580681
• mkzie2 | Contributor | 105611798

Issue Owner

Current Issue Owner: @abekkala

[melvin-bot]

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

[mkzie2]

Edited by proposal-police: This proposal was edited at 2024-12-11 13:20:16 UTC.

Proposal

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

Ellipsis from Destination is too close to Subrate.

What is the root cause of that problem?

The Subrate text doesn't have a space with the Destination

App/src/pages/workspace/perDiem/WorkspacePerDiemPage.tsx

Line 174 in 665fa04

<Text style={[styles.alignItemsStart, styles.textSupporting, styles.label]}>{value.subRateName}</Text>

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

Add styles.pl2 here and here like the same padding left style here

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

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.

[melvin-bot]

@abekkala Eep! 4 days overdue now. Issues have feelings too...

[abekkala]

@Expensify/design I'm torn on this one. This seems expected/normal to me. But I'm not a professional when it comes to visually pleasing/correct design work. 🤣

[shawnborton]

Hmm yeah, this is a super low priority but I could see adding maybe 4px or 8px more space between those columns. I think we can take proposals but perhaps keep this as a super low bounty given it will likely be a one line change.

[melvin-bot]

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