diff --git a/src/languages/en.js b/src/languages/en.js index deb4bba810b4..bde8d96d6b5d 100755 --- a/src/languages/en.js +++ b/src/languages/en.js @@ -675,13 +675,13 @@ export default { headerWithEcard: 'Cards are ready!', noVBACopy: 'Connect a bank account to issue unlimited Expensify Cards for your workspace members and access all of these incredible benefits:', VBANoECardCopy: 'Add a work email address to issue unlimited Expensify Cards for your workspace members, as well as all of these incredible benefits:', - conciergeCanHelp: 'Concierge can help you add a work email address to enable the Expensify Card.', VBAWithECardCopy: 'Enjoy all these incredible benefits:', benefit1: 'Up to 2% cash back', benefit2: 'Digital and physical cards', benefit3: 'No personal liability', benefit4: 'Customizable limits', - chatWithConcierge: 'Chat with Concierge', + addWorkEmail: 'Add work email address', + checkingDomain: 'Hang tight! We are still working on enabling your Expensify Cards. Check back here in a few minutes.', }, reimburse: { captureReceipts: 'Capture receipts', @@ -745,9 +745,9 @@ export default { streamlinePayments: 'Streamline payments', oneMoreThing: 'One more thing!', allSet: 'You\'re all set!', - accountDescriptionNoCards: 'This bank account will be used to reimburse expenses, collect invoices, and pay bills all from the same account.\n\nConcierge can help you add a work email address to enable the Expensify Card.', + accountDescriptionNoCards: 'This bank account will be used to reimburse expenses, collect invoices, and pay bills all from the same account.\n\nPlease add a work email address as a secondary login to enable the Expensify Card.', accountDescriptionWithCards: 'This bank account will be used to issue corporate cards, reimburse expenses, collect invoices, and pay bills all from the same account.', - chatWithConcierge: 'Chat with Concierge', + addWorkEmail: 'Add work email address', letsFinishInChat: 'Let\'s finish in chat!', almostDone: 'Almost done!', disconnectBankAccount: 'Disconnect bank account', diff --git a/src/languages/es.js b/src/languages/es.js index b40c910075b1..2e66e634201e 100644 --- a/src/languages/es.js +++ b/src/languages/es.js @@ -677,13 +677,13 @@ export default { headerWithEcard: '¡Tus tarjetas están listas!', noVBACopy: 'Conecta una cuenta bancaria para emitir Tarjetas Expensify ilimitadas para los miembros de tu espacio de trabajo y acceder a todas estas increíbles ventajas:', VBANoECardCopy: 'Agrega tu correo electrónico de trabajo para emitir Tarjetas Expensify ilimitadas para los miembros de tu espacio de trabajo y acceder a todas estas increíbles ventajas:', - conciergeCanHelp: 'Concierge te puede ayudar a añadir un correo electrónico de trabajo para activar la Tarjeta Expensify.', VBAWithECardCopy: 'Disfruta de todas estas increíbles ventajas:', benefit1: 'Hasta un 2% de devolución en tus gastos', benefit2: 'Tarjetas digitales y físicas', benefit3: 'Sin responsabilidad personal', benefit4: 'Límites personalizables', - chatWithConcierge: 'Chatea con Concierge', + addWorkEmail: 'Añadir correo electrónico de trabajo', + checkingDomain: '¡Un momento! Estamos todavía trabajando para habilitar tu Tarjeta Expensify. Vuelve aquí en unos minutos.', }, reimburse: { captureReceipts: 'Captura recibos', @@ -747,9 +747,9 @@ export default { streamlinePayments: 'Optimiza pagos', oneMoreThing: '¡Una cosa más!', allSet: '¡Todo listo!', - accountDescriptionNoCards: 'Esta cuenta bancaria se utilizará para reembolsar gastos y cobrar y pagar facturas, todo desde la misma cuenta. Concierge puede ayudarte a añadir tu correo de trabajo para activar la Tarjeta Expensify.', + accountDescriptionNoCards: 'Esta cuenta bancaria se utilizará para reembolsar gastos y cobrar y pagar facturas, todo desde la misma cuenta.\n\nPor favor añade un correo electrónico de trabajo como tu nombre de usuario secundario para activar la Tarjeta Expensify.', accountDescriptionWithCards: 'Esta cuenta bancaria se utilizará para emitir tarjetas corporativas, reembolsar gastos y cobrar y pagar facturas, todo desde la misma cuenta.', - chatWithConcierge: 'Chat con Concierge', + addWorkEmail: 'Añadir correo electrónico de trabajo', letsFinishInChat: '¡Continuemos en el chat!', almostDone: '¡Casi listo!', disconnectBankAccount: 'Desconectar cuenta bancaria', diff --git a/src/libs/Pusher/EventType.js b/src/libs/Pusher/EventType.js index 8eb739869fd2..76cb1b354c1d 100644 --- a/src/libs/Pusher/EventType.js +++ b/src/libs/Pusher/EventType.js @@ -7,4 +7,5 @@ export default { REPORT_COMMENT_EDIT: 'reportCommentEdit', REPORT_TOGGLE_PINNED: 'reportTogglePinned', PREFERRED_LOCALE: 'preferredLocale', + EXPENSIFY_CARD_UPDATE: 'expensifyCardUpdate', }; diff --git a/src/libs/actions/User.js b/src/libs/actions/User.js index 4a5d60e4badd..3eb7bd106c3f 100644 --- a/src/libs/actions/User.js +++ b/src/libs/actions/User.js @@ -284,6 +284,37 @@ function subscribeToUserEvents() { }); } +/** + * Subscribes to Expensify Card updates when checking loginList for private domains + */ +function subscribeToExpensifyCardUpdates() { + if (!currentUserAccountID) { + return; + } + + const pusherChannelName = `private-user-accountID-${currentUserAccountID}`; + + // Handle Expensify Card approval flow updates + Pusher.subscribe(pusherChannelName, Pusher.TYPE.EXPENSIFY_CARD_UPDATE, (pushJSON) => { + if (pushJSON.isUsingExpensifyCard) { + Onyx.merge(ONYXKEYS.USER, {isUsingExpensifyCard: pushJSON.isUsingExpensifyCard, isCheckingDomain: null}); + Pusher.unsubscribe(pusherChannelName, Pusher.TYPE.EXPENSIFY_CARD_UPDATE); + } else { + Onyx.merge(ONYXKEYS.USER, {isCheckingDomain: pushJSON.isCheckingDomain}); + } + }, false, + () => { + NetworkConnection.triggerReconnectionCallbacks('pusher re-subscribed to private user channel'); + }) + .catch((error) => { + Log.info( + '[User] Failed to subscribe to Pusher channel', + false, + {error, pusherChannelName, eventName: Pusher.TYPE.EXPENSIFY_CARD_UPDATE}, + ); + }); +} + /** * Sync preferredSkinTone with Onyx and Server * @param {String} skinTone @@ -318,4 +349,5 @@ export { setPreferredSkinTone, setShouldUseSecureStaging, clearUserErrorMessage, + subscribeToExpensifyCardUpdates, }; diff --git a/src/pages/ReimbursementAccount/EnableStep.js b/src/pages/ReimbursementAccount/EnableStep.js index d3e1366b7b2c..a2dbefbae0df 100644 --- a/src/pages/ReimbursementAccount/EnableStep.js +++ b/src/pages/ReimbursementAccount/EnableStep.js @@ -10,18 +10,19 @@ import Navigation from '../../libs/Navigation/Navigation'; import Text from '../../components/Text'; import compose from '../../libs/compose'; import ONYXKEYS from '../../ONYXKEYS'; -import {ChatBubble, Close} from '../../components/Icon/Expensicons'; +import {Mail, Close} from '../../components/Icon/Expensicons'; import MenuItem from '../../components/MenuItem'; import getBankIcon from '../../components/Icon/BankIcons'; import {getPaymentMethods} from '../../libs/actions/PaymentMethods'; import FullScreenLoadingIndicator from '../../components/FullscreenLoadingIndicator'; import bankAccountPropTypes from '../../components/bankAccountPropTypes'; -import {navigateToConciergeChat} from '../../libs/actions/Report'; import confettiPop from '../../../assets/images/confetti-pop.gif'; import Icon from '../../components/Icon'; import WorkspaceSection from '../workspace/WorkspaceSection'; import {ConciergeBlue} from '../../components/Icon/Illustrations'; import {requestResetFreePlanBankAccount} from '../../libs/actions/BankAccounts'; +import {openOldDotLink} from '../../libs/actions/Link'; +import {subscribeToExpensifyCardUpdates} from '../../libs/actions/User'; const propTypes = { /** Are we loading payment methods? */ @@ -72,10 +73,11 @@ class EnableStep extends React.Component { }]; if (!isUsingExpensifyCard) { menuItems.unshift({ - title: this.props.translate('workspace.bankAccount.chatWithConcierge'), - icon: ChatBubble, + title: this.props.translate('workspace.bankAccount.addWorkEmail'), + icon: Mail, onPress: () => { - navigateToConciergeChat(); + openOldDotLink('settings?param={"section":"account","openModal":"secondaryLogin"}'); + subscribeToExpensifyCardUpdates(); }, shouldShowRightIcon: true, }); @@ -111,6 +113,11 @@ class EnableStep extends React.Component { : this.props.translate('workspace.bankAccount.accountDescriptionWithCards')} + {this.props.user.isCheckingDomain && ( + + {this.props.translate('workspace.card.checkingDomain')} + + )} ); diff --git a/src/pages/workspace/card/WorkspaceCardVBANoECardView.js b/src/pages/workspace/card/WorkspaceCardVBANoECardView.js index a0b158532edb..b0a143519c0e 100644 --- a/src/pages/workspace/card/WorkspaceCardVBANoECardView.js +++ b/src/pages/workspace/card/WorkspaceCardVBANoECardView.js @@ -1,55 +1,70 @@ import React from 'react'; import {View} from 'react-native'; +import {withOnyx} from 'react-native-onyx'; import Text from '../../../components/Text'; import styles from '../../../styles/styles'; import withLocalize, {withLocalizePropTypes} from '../../../components/withLocalize'; -import {Concierge} from '../../../components/Icon/Expensicons'; +import {Mail} from '../../../components/Icon/Expensicons'; import {JewelBoxBlue} from '../../../components/Icon/Illustrations'; import UnorderedList from '../../../components/UnorderedList'; import WorkspaceSection from '../WorkspaceSection'; -import {navigateToConciergeChat} from '../../../libs/actions/Report'; import Navigation from '../../../libs/Navigation/Navigation'; +import {openOldDotLink} from '../../../libs/actions/Link'; +import {subscribeToExpensifyCardUpdates} from '../../../libs/actions/User'; +import ONYXKEYS from '../../../ONYXKEYS'; +import compose from '../../../libs/compose'; const propTypes = { ...withLocalizePropTypes, }; const WorkspaceCardVBANoECardView = props => ( - { - Navigation.dismissModal(); - navigateToConciergeChat(); + <> + { + Navigation.dismissModal(); + openOldDotLink('settings?param={"section":"account","openModal":"secondaryLogin"}'); + subscribeToExpensifyCardUpdates(); + }, + icon: Mail, + shouldShowRightIcon: true, }, - icon: Concierge, - shouldShowRightIcon: true, - }, - ]} - > - - {props.translate('workspace.card.VBANoECardCopy')} - - - + > + + {props.translate('workspace.card.VBANoECardCopy')} + - - {props.translate('workspace.card.conciergeCanHelp')} - - + + + {props.user.isCheckingDomain && ( + + {props.translate('workspace.card.checkingDomain')} + + )} + ); WorkspaceCardVBANoECardView.propTypes = propTypes; WorkspaceCardVBANoECardView.displayName = 'WorkspaceCardVBANoECardView'; -export default withLocalize(WorkspaceCardVBANoECardView); +export default compose( + withLocalize, + withOnyx({ + user: { + key: ONYXKEYS.USER, + }, + }), +)(WorkspaceCardVBANoECardView);