feat(card): prompt for personal details before virtual card reveal#91634
Conversation
Reuses the existing MissingPersonalDetails flow for the virtual-card reveal entry point so users with incomplete details fill them in (name/DOB/address/phone) before viewing the card. ECUK virtual cards go through the SCA reveal scenario afterwards; US virtual cards go to the magic-code reveal page. PIN collection is already excluded for virtual cards by the existing selector. Adds a red dot on the wallet row and a home-page time-sensitive task as additional entry points. Implements Expensify#91461. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
|
Hey, I noticed you changed If you want to automatically generate translations for other locales, an Expensify employee will have to:
Alternatively, if you are an external contributor, you can run the translation script locally with your own OpenAI API key. To learn more, try running: npx ts-node ./scripts/generateTranslations.ts --helpTypically, you'd want to translate only what you changed by running |
Codecov Report❌ Looks like you've decreased code coverage for some files. Please write tests to increase, or at least maintain, the existing level of code coverage. See our documentation here for how to interpret this table.
|
Replaces the 4-API fan-out (updatePersonalDetailsForVirtualCard calling UPDATE_LEGAL_NAME / UPDATE_DATE_OF_BIRTH / UPDATE_PHONE_NUMBER / UPDATE_HOME_ADDRESS) with a single new WRITE_COMMAND modeled on SetPersonalDetailsAndShipExpensifyCards. Cleaner backend contract and keeps the submission atomic from the FE perspective. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
|
@chuckdries Would you like to take over this PR? |
🦜 Polyglot Parrot! 🦜Squawk! Looks like you added some shiny new English strings. Allow me to parrot them back to you in other tongues: View the translation diffdiff --git a/src/languages/de.ts b/src/languages/de.ts
index 26d5ace68bc..6c6f6240ae0 100644
--- a/src/languages/de.ts
+++ b/src/languages/de.ts
@@ -958,6 +958,11 @@ const translations: TranslationDeepObject<typeof en> = {
workspaceSubtitle: ({policyName}: {policyName: string}) => policyName,
personalSubtitle: 'Geldbörse',
},
+ addVirtualCardPersonalDetails: {
+ title: 'Fügen Sie Ihre persönlichen Daten hinzu',
+ subtitle: 'Fügen Sie Ihre Daten hinzu, um Ihre Expensify Karte anzusehen und zu verwenden.',
+ cta: 'Details hinzufügen',
+ },
},
announcements: 'Ankündigungen',
discoverSection: {
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 511d7baf7f4..52e08e15596 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -888,11 +888,7 @@ const translations: TranslationDeepObject<typeof en> = {
subtitle: 'Proporciona una dirección para recibir tu Tarjeta Expensify.',
cta: 'Añade dirección',
},
- addVirtualCardPersonalDetails: {
- title: 'Añade tus datos personales',
- subtitle: 'Añade tus datos para ver y empezar a usar tu Tarjeta Expensify.',
- cta: 'Añadir datos',
- },
+ addVirtualCardPersonalDetails: {title: 'Añade tus datos personales', subtitle: 'Añade tus datos para ver y empezar a usar tu Tarjeta Expensify.', cta: 'Añade detalles'},
addPaymentCard: {
title: 'Añade una tarjeta de pago para seguir usando Expensify',
subtitle: 'Cuenta > Suscripción',
diff --git a/src/languages/fr.ts b/src/languages/fr.ts
index 079293757c4..23252d0d36b 100644
--- a/src/languages/fr.ts
+++ b/src/languages/fr.ts
@@ -961,6 +961,11 @@ const translations: TranslationDeepObject<typeof en> = {
workspaceSubtitle: ({policyName}: {policyName: string}) => policyName,
personalSubtitle: 'Portefeuille',
},
+ addVirtualCardPersonalDetails: {
+ title: 'Ajoutez vos informations personnelles',
+ subtitle: 'Ajoutez vos informations pour afficher et commencer à utiliser votre Carte Expensify.',
+ cta: 'Ajouter des détails',
+ },
},
announcements: 'Annonces',
discoverSection: {
diff --git a/src/languages/it.ts b/src/languages/it.ts
index 3feb94469cc..e5cb6ad3a59 100644
--- a/src/languages/it.ts
+++ b/src/languages/it.ts
@@ -959,6 +959,11 @@ const translations: TranslationDeepObject<typeof en> = {
workspaceSubtitle: ({policyName}: {policyName: string}) => policyName,
personalSubtitle: 'Portafoglio',
},
+ addVirtualCardPersonalDetails: {
+ title: 'Aggiungi i tuoi dati personali',
+ subtitle: 'Aggiungi i tuoi dati per visualizzare e iniziare a usare la tua Carta Expensify.',
+ cta: 'Aggiungi dettagli',
+ },
},
announcements: 'Annunci',
discoverSection: {
diff --git a/src/languages/ja.ts b/src/languages/ja.ts
index 78c68061cdb..cde18967b15 100644
--- a/src/languages/ja.ts
+++ b/src/languages/ja.ts
@@ -942,6 +942,7 @@ const translations: TranslationDeepObject<typeof en> = {
workspaceSubtitle: ({policyName}: {policyName: string}) => policyName,
personalSubtitle: 'ウォレット',
},
+ addVirtualCardPersonalDetails: {title: '個人情報を追加してください', subtitle: 'Expensify カードを表示して使い始めるには、詳細情報を入力してください。', cta: '詳細を追加'},
},
announcements: 'お知らせ',
discoverSection: {
diff --git a/src/languages/nl.ts b/src/languages/nl.ts
index 1a3fc48f906..eb89d8ba9ad 100644
--- a/src/languages/nl.ts
+++ b/src/languages/nl.ts
@@ -957,6 +957,11 @@ const translations: TranslationDeepObject<typeof en> = {
workspaceSubtitle: ({policyName}: {policyName: string}) => policyName,
personalSubtitle: 'Portemonnee',
},
+ addVirtualCardPersonalDetails: {
+ title: 'Voeg je persoonlijke gegevens toe',
+ subtitle: 'Voeg je gegevens toe om je Expensify Kaart te bekijken en te gaan gebruiken.',
+ cta: 'Details toevoegen',
+ },
},
announcements: 'Aankondigingen',
discoverSection: {
diff --git a/src/languages/pl.ts b/src/languages/pl.ts
index 995aa727aeb..b265fd7409e 100644
--- a/src/languages/pl.ts
+++ b/src/languages/pl.ts
@@ -959,6 +959,7 @@ const translations: TranslationDeepObject<typeof en> = {
workspaceSubtitle: ({policyName}: {policyName: string}) => policyName,
personalSubtitle: 'Portfel',
},
+ addVirtualCardPersonalDetails: {title: 'Dodaj swoje dane osobowe', subtitle: 'Dodaj swoje dane, aby wyświetlić i zacząć używać swojej Karty Expensify.', cta: 'Dodaj szczegóły'},
},
announcements: 'Ogłoszenia',
discoverSection: {
diff --git a/src/languages/pt-BR.ts b/src/languages/pt-BR.ts
index 6fa49367a32..0cfb8f18448 100644
--- a/src/languages/pt-BR.ts
+++ b/src/languages/pt-BR.ts
@@ -957,6 +957,11 @@ const translations: TranslationDeepObject<typeof en> = {
workspaceSubtitle: ({policyName}: {policyName: string}) => policyName,
personalSubtitle: 'Carteira',
},
+ addVirtualCardPersonalDetails: {
+ title: 'Adicione seus dados pessoais',
+ subtitle: 'Adicione seus dados para visualizar e começar a usar seu Cartão Expensify.',
+ cta: 'Adicionar detalhes',
+ },
},
announcements: 'Comunicados',
discoverSection: {
diff --git a/src/languages/zh-hans.ts b/src/languages/zh-hans.ts
index 22ed75b0da0..00e60bf1f06 100644
--- a/src/languages/zh-hans.ts
+++ b/src/languages/zh-hans.ts
@@ -925,6 +925,7 @@ const translations: TranslationDeepObject<typeof en> = {
workspaceSubtitle: ({policyName}: {policyName: string}) => policyName,
personalSubtitle: '钱包',
},
+ addVirtualCardPersonalDetails: {title: '添加您的个人信息', subtitle: '添加您的详细信息以查看并开始使用 Expensify 卡。', cta: '添加详细信息'},
},
announcements: '公告',
discoverSection: {
Note You can apply these changes to your branch by copying the patch to your clipboard, then running |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: de5abedd4e
ℹ️ About Codex in GitHub
Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 57adf876f9
ℹ️ About Codex in GitHub
Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".
Reviewer Checklist
Screenshots/VideosAndroid: HybridAppandroid.UK.virtual.card.homepage.prompt.mp4android.uk.wallet.page.no.prompt.mp4iOS: HybridAppios.homepage.prompt.US.card.mp4MacOS: Chrome / Safariweb.UK.virtual.card.wallet.page.prompt.mp4 |
|
🚧 chuckdries has triggered a test Expensify/App build. You can view the workflow run here. |
|
✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release. |
|
🧪🧪 Use the links below to test this adhoc build on Android, iOS, and Web. Happy testing! 🧪🧪
|
|
🚀 Deployed to staging by https://github.com/chuckdries in version: 9.4.27-1 🚀
|
|
🤖 I reviewed the changes in this PR against the help site files under Docs changes are required. This PR adds a new step to the virtual Expensify Card reveal flow — cardholders with incomplete personal details are now prompted to add them (legal name, date of birth, address, phone number) before their card details can be revealed. The View your virtual card details section of Draft PR: #95294 — adds a note documenting the Add details prompt and how US (magic code) vs. UK/EU (biometrics/passkey) cardholders verify their identity to reveal the card. Why no other articles were updatedThe reveal flow for NewDot virtual cards is documented only in @DylanDylann, please review the linked help site PR and confirm it reflects the current behavior. Then mark the linked help site PR |
|
Deploy Blocker #95362 was identified to be related to this PR. |
|
Hi @DylanDylann We can't verified this PR as we have only one account with non US bank account and when trying issue new virtual Expensify Card pop-up window appears about updating the currency to USD. Could you please check this internally? Thank you in advance
Recording.3855.mp4 |
|
@joekaufmanexpensify Could you help with QA on this PR? |
|
🚀 Deployed to production by https://github.com/grgia in version: 9.4.27-2 🚀
Bundle Size Analysis (Sentry): |
|
Yep! @izarutskaya my thinking is you were able to test everything besides test cases 4 and 6. Is that right? I'm proceeding as if that is the case right now, but please let me know if you need help testing any others. |
|
Test cases 4 and 6 pass. |
|
Only issue I ran into is I'm getting an error on the magic code when trying to update personal details from the profile page. We throw an error, but the code works. I'm unsure if it's related to this PR, though. Curious what others think? 2026-07-06_16-09-13.mp4 |
|
Hmm, that seems too fast to be a backend response. Did you recently enter an incorrect code in a previous step? Maybe we're showing a stale error message that stuck around in Onyx?. CC @DylanDylann |
|
It's working well on my side. In case we enter the wrong magic code, the error message is displayed at the bottom 
@joekaufmanexpensify Could you reset the cache and try again? I have the same thought as @chuckdries, this may be caused by some stale data |
|
Sounds good. I will retest. |
|
@trjExpensify also flagged an issue in Slack where he's being prompted to add his personal details to view his virtual card on the home page, even though his personal details are already on file. |
|
After signing out and back in I can't reproduce the magic code error anymore, so I think we're good there 👍 |
Explanation of Change
Fixed Issues
$ #91461
PROPOSAL:
Tests
Offline tests
QA Steps
Test accounts required
1. Home time-sensitive task appears (missing details)
2. Wallet "Add details" row appears (missing details)
3. Reveal-details flow starts personal-details prompt (US card)
4. Reveal-details flow — SCA path (UK/EU card)
5. Reveal-details flow — no personal details needed (US)
6. Reveal-details flow — no personal details needed (UK/EU)
7. Reveal-details flow — incomplete address (edge case)
legalFirstName,legalLastName,dob,phoneNumberpopulated but an incomplete address (e.g.addresses[0]exists butcityis empty).8. Delegate/copilot access is not prompted
9. Home task clears after details filled from a different flow
PR Author Checklist
### Fixed Issuessection aboveTestssectionOffline stepssectionQA stepssectiontoggleReportand notonIconClick)src/languages/*files and using the translation methodSTYLE.md) were followedAvatar, I verified the components usingAvatarare working as expected)StyleUtils.getBackgroundAndBorderStyle(theme.componentBG))npm run compress-svg)Avataris modified, I verified thatAvataris working as expected in all cases)Designlabel and/or tagged@Expensify/designso the design team can review the changes.ScrollViewcomponent to make it scrollable when more elements are added to the page.mainbranch was merged into this PR after a review, I tested again and verified the outcome was still expected according to theTeststeps.Screenshots/Videos
EU/UK virtual card
Screen.Recording.2026-06-26.at.17.24.58.mov
US virtual card
Screen.Recording.2026-06-26.at.17.28.21.mov