From a3c9a688cf693dbe8929715a17a68eb21676d6f5 Mon Sep 17 00:00:00 2001
From: Nicolay Arefyeu <n.arefyev91@gmail.com>
Date: Mon, 18 Nov 2024 17:33:32 +0200
Subject: [PATCH 1/2] Update copy on custom feed details page
---
src/languages/en.ts | 4 +++-
src/languages/es.ts | 2 ++
.../addNew/CardInstructionsStep.tsx | 17 ++++++++++++++++-
3 files changed, 21 insertions(+), 2 deletions(-)
diff --git a/src/languages/en.ts b/src/languages/en.ts
index 1a703f1bea1b..00c158c978e7 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -3198,7 +3198,9 @@ const translations = {
enableFeed: {
title: ({provider}: GoBackMessageParams) => `Enable your ${provider} feed`,
heading: 'We have a direct integration with your card issuer and can import your transaction data into Expensify quickly and accurately.\n\nTo get started, simply:',
- vcf: `1. Visit [this help article](${CONST.COMPANY_CARDS_HELP}) for detailed instructions on how to set up your Visa Commercial Cards.\n\n2. [Contact your bank](${CONST.COMPANY_CARDS_HELP}) to verify they support a custom feed for your program, and ask them toenable it.\n\n3. *Once the feed is enabled and you have its details, continue to the next screen.*`,
+ visa: 'We have global integrations with Visa, though eligibility varies by bank and card program.\n\nTo get started, simply:',
+ mastercard: 'We have global integrations with Mastercard, though eligibility varies by bank and card program.\n\nTo get started, simply:',
+ vcf: `1. Visit [this help article](${CONST.COMPANY_CARDS_HELP}) for detailed instructions on how to set up your Visa Commercial Cards.\n\n2. [Contact your bank](${CONST.COMPANY_CARDS_HELP}) to verify they support a custom feed for your program, and ask them to enable it.\n\n3. *Once the feed is enabled and you have its details, continue to the next screen.*`,
gl1025: `1. Visit [this help article](${CONST.COMPANY_CARDS_HELP}) to find out if American Express can enable a custom feed for your program.\n\n2. Once the feed is enabled, Amex will send you a production letter.\n\n3. *Once you have the feed information, continue to the next screen.*`,
cdf: `1. Visit [this help article](${CONST.COMPANY_CARDS_HELP}) for detailed instructions on how to set up your Mastercard Commercial Cards.\n\n 2. [Contact your bank](${CONST.COMPANY_CARDS_HELP}) to verify they support a custom feed for your program, and ask them to enable it.\n\n3. *Once the feed is enabled and you have its details, continue to the next screen.*`,
stripe: `1. Visit Stripe’s Dashboard, and go to [Settings](${CONST.COMPANY_CARDS_STRIPE_HELP}).\n\n2. Under Product Integrations, click Enable next to Expensify.\n\n3. Once the feed is enabled, click Submit below and we’ll work on adding it.`,
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 2bb66cec6548..96cd4c0e7ab4 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -3239,6 +3239,8 @@ const translations = {
title: ({provider}: GoBackMessageParams) => `Habilita tu feed ${provider}`,
heading:
'Tenemos una integración directa con el emisor de su tarjeta y podemos importar los datos de sus transacciones a Expensify de forma rápida y precisa.\n\nPara empezar, simplemente:',
+ visa: 'Contamos con integraciones globales con Visa, aunque la elegibilidad varía según el banco y el programa de la tarjeta.\n\nTPara empezar, simplemente:',
+ mastercard: 'Contamos con integraciones globales con Mastercard, aunque la elegibilidad varía según el banco y el programa de la tarjeta.\n\nPara empezar, simplemente:',
vcf: `1. Visite [este artículo de ayuda](${CONST.COMPANY_CARDS_HELP}) para obtener instrucciones detalladas sobre cómo configurar sus tarjetas comerciales Visa.\n\n2. [Póngase en contacto con su banco](${CONST.COMPANY_CARDS_HELP}) para comprobar que admiten un feed personalizado para su programa, y pídales que lo activen.\n\n3. *Una vez que el feed esté habilitado y tengas sus datos, pasa a la siguiente pantalla.*`,
gl1025: `1. Visite [este artículo de ayuda](${CONST.COMPANY_CARDS_HELP}) para saber si American Express puede habilitar un feed personalizado para su programa.\n\n2. Una vez activada la alimentación, Amex le enviará una carta de producción.\n\n3. *Una vez que tenga la información de alimentación, continúe con la siguiente pantalla.*`,
cdf: `1. Visite [este artículo de ayuda](${CONST.NETSUITE_IMPORT.HELP_LINKS.CUSTOM_SEGMENTS}) para obtener instrucciones detalladas sobre cómo configurar sus tarjetas comerciales Mastercard.\n\n 2. [Póngase en contacto con su banco](${CONST.COMPANY_CARDS_HELP}) para verificar que admiten un feed personalizado para su programa, y pídales que lo habiliten.\n\n3. *Una vez que el feed esté habilitado y tengas sus datos, pasa a la siguiente pantalla.*`,
diff --git a/src/pages/workspace/companyCards/addNew/CardInstructionsStep.tsx b/src/pages/workspace/companyCards/addNew/CardInstructionsStep.tsx
index 969625b224d6..67307501e4ab 100644
--- a/src/pages/workspace/companyCards/addNew/CardInstructionsStep.tsx
+++ b/src/pages/workspace/companyCards/addNew/CardInstructionsStep.tsx
@@ -21,6 +21,18 @@ import ONYXKEYS from '@src/ONYXKEYS';
type CardInstructionsStepProps = {
policyID?: string;
};
+
+function getCardInstructionHeader(isVisaFeedProvider: boolean, isMastedCardFeedProvider: boolean) {
+ if (isVisaFeedProvider) {
+ return 'workspace.companyCards.addNewCard.enableFeed.visa';
+ }
+ if (isMastedCardFeedProvider) {
+ return 'workspace.companyCards.addNewCard.enableFeed.mastercard';
+ }
+
+ return 'workspace.companyCards.addNewCard.enableFeed.heading';
+}
+
function CardInstructionsStep({policyID}: CardInstructionsStepProps) {
const {translate} = useLocalize();
const styles = useThemeStyles();
@@ -34,6 +46,9 @@ function CardInstructionsStep({policyID}: CardInstructionsStepProps) {
const isStripeFeedProvider = feedProvider === CONST.COMPANY_CARD.FEED_BANK_NAME.STRIPE;
const isAmexFeedProvider = feedProvider === CONST.COMPANY_CARD.FEED_BANK_NAME.AMEX;
const isOtherBankSelected = bank === CONST.COMPANY_CARDS.BANKS.OTHER;
+ const isVisaFeedProvider = feedProvider === CONST.COMPANY_CARD.FEED_BANK_NAME.VISA;
+ const isMastedCardFeedProvider = feedProvider === CONST.COMPANY_CARD.FEED_BANK_NAME.MASTER_CARD;
+ const translationKey = getCardInstructionHeader(isVisaFeedProvider, isMastedCardFeedProvider);
const buttonTranslation = isStripeFeedProvider ? translate('common.submit') : translate('common.next');
@@ -86,7 +101,7 @@ function CardInstructionsStep({policyID}: CardInstructionsStepProps) {
<Text style={[styles.textHeadlineLineHeightXXL, styles.ph5, styles.mv3]}>
{translate('workspace.companyCards.addNewCard.enableFeed.title', {provider: CardUtils.getCardFeedName(feedProvider)})}
</Text>
- <Text style={[styles.ph5, styles.mb3]}>{translate('workspace.companyCards.addNewCard.enableFeed.heading')}</Text>
+ <Text style={[styles.ph5, styles.mb3]}>{translate(translationKey)}</Text>
<View style={[styles.ph5]}>
<RenderHTML html={Parser.replace(feedProvider ? translate(`workspace.companyCards.addNewCard.enableFeed.${feedProvider}`) : '')} />
</View>
From d82f7a4b98cd2fe9839d80c38763b9cd66d960b4 Mon Sep 17 00:00:00 2001
From: Nicolay Arefyeu <n.arefyev91@gmail.com>
Date: Wed, 20 Nov 2024 13:31:24 +0200
Subject: [PATCH 2/2] clean up after review
---
.../companyCards/addNew/CardInstructionsStep.tsx | 11 +++++------
1 file changed, 5 insertions(+), 6 deletions(-)
diff --git a/src/pages/workspace/companyCards/addNew/CardInstructionsStep.tsx b/src/pages/workspace/companyCards/addNew/CardInstructionsStep.tsx
index 67307501e4ab..808cacd0f4ea 100644
--- a/src/pages/workspace/companyCards/addNew/CardInstructionsStep.tsx
+++ b/src/pages/workspace/companyCards/addNew/CardInstructionsStep.tsx
@@ -17,16 +17,17 @@ import * as Card from '@userActions/Card';
import * as CompanyCards from '@userActions/CompanyCards';
import CONST from '@src/CONST';
import ONYXKEYS from '@src/ONYXKEYS';
+import type {CardFeedProvider} from '@src/types/onyx/CardFeeds';
type CardInstructionsStepProps = {
policyID?: string;
};
-function getCardInstructionHeader(isVisaFeedProvider: boolean, isMastedCardFeedProvider: boolean) {
- if (isVisaFeedProvider) {
+function getCardInstructionHeader(feedProvider: CardFeedProvider) {
+ if (feedProvider === CONST.COMPANY_CARD.FEED_BANK_NAME.VISA) {
return 'workspace.companyCards.addNewCard.enableFeed.visa';
}
- if (isMastedCardFeedProvider) {
+ if (feedProvider === CONST.COMPANY_CARD.FEED_BANK_NAME.MASTER_CARD) {
return 'workspace.companyCards.addNewCard.enableFeed.mastercard';
}
@@ -46,9 +47,7 @@ function CardInstructionsStep({policyID}: CardInstructionsStepProps) {
const isStripeFeedProvider = feedProvider === CONST.COMPANY_CARD.FEED_BANK_NAME.STRIPE;
const isAmexFeedProvider = feedProvider === CONST.COMPANY_CARD.FEED_BANK_NAME.AMEX;
const isOtherBankSelected = bank === CONST.COMPANY_CARDS.BANKS.OTHER;
- const isVisaFeedProvider = feedProvider === CONST.COMPANY_CARD.FEED_BANK_NAME.VISA;
- const isMastedCardFeedProvider = feedProvider === CONST.COMPANY_CARD.FEED_BANK_NAME.MASTER_CARD;
- const translationKey = getCardInstructionHeader(isVisaFeedProvider, isMastedCardFeedProvider);
+ const translationKey = getCardInstructionHeader(feedProvider);
const buttonTranslation = isStripeFeedProvider ? translate('common.submit') : translate('common.next');