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

Edited by proposal-police: This proposal was edited at 2024-09-26 19:28:01 UTC.

Proposal

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

SSN translated placeholder overlaps with data entered in the field

What is the root cause of that problem?

The Spanish translation is too long which is why it overlaps. This issue will occur in all the places where the placeholder goes to the second line. We don’t see this elsewhere because we don’t have long translations as placeholders.

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

We can use a small translation here

        last4SSN: 'Últimos 4 dígitos de tu SSN'',

Instead of using the full form 'social security number' in the Spanish translation, we can use 'SSN.' We should make sure that we are using the correct Spanish translation. The Spanish translation can be confirmed in PR. We should also check for places where we are using long texts as placeholders.

What alternative solutions did you explore? (Optional)

Or we can use

last4SSN: Últimos 4 del SSN.

Looks like some padding issue with placeholder. I can handle it with padding or placeholder font size.

📣 @jais-nikhil! 📣
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>

Edited by proposal-police: This proposal was edited at 2024-09-27 08:43:52 UTC.

Proposal

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

• SSN placeholder overlaps with the data entered in the field

What is the root cause of that problem?

• When displaying text input's label, we don't have numberOflLines prop:
  

  App/src/components/TextInput/TextInputLabel/index.tsx

  Line 23 in 4c76858

  <Animated.Text

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

• Should pass numberOfLines={1} to the above.

• Similar can be done with native file.

• A flag prop can be introduced to ensure the above changes are applied only for SSN input cases.

• Result:

What alternative solutions did you explore? (Optional)

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

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

@twisterdotcom Can you confirm the expected behavior here? In case the input label is too long, should we:

1. Use the smaller label.

2. Just display one line as we did in other logics. If the text is overflow, display "..." at the end like below:

We should use the elipses ... to shorten it.

@twisterdotcom The Spanish translation here is not the same as the English translation. We don't have long placeholders anywhere else. I think we should use the same translation as we have in English here. Also, such long placeholders look weird.

My suggestion is to use the same copy as we do in English.

@twisterdotcom Also, we use 'SSN' in other places too, where we have the correct and shorter translation. We can use the same translation here to fix this

Ah, good point. Yes, absolutely. I think the acronym is fine to keep using. SSN specifically refers to the US Social Security Number - it's a proper noun in English, so let's keep using that.

If we disable overflow it it will read Últimos 4 dígitos de tu número de la seguridad... which doesn't really make sense.
I like @Nodebrute's solution as that's the only peice of Spanish copy where we use seguridad social where we would usually use SSN.
🎀👀🎀 C+ reviewed

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

How to join myself as a contributor for expensify?
email: nomanahmeda789@gmail.com
Upwork account: https://www.upwork.com/freelancers/nomanahmed7

📣 @Nomanahmeda789! 📣
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>

📣 @Nodebrute 🎉 An offer has been automatically sent to your Upwork account for the Contributor role 🎉 Thanks for contributing to the Expensify app!

Offer link
Upwork job
Please accept the offer and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻
Keep in mind: Code of Conduct | Contributing 📖

@twisterdotcom The pr was deployed to production 2 weeks ago #49863 (comment). It is ready for payment.

Payment Summary:

• @Nodebrute paid $250 via Upwork here (Contributor)
• @Ollyws paid $250 via NewDot Requests (C+)

Requested in ND.

$250 approved for @Ollyws