-
Notifications
You must be signed in to change notification settings - Fork 3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Setup "Connect bank account" workspace flow #5703
Merged
tgolen
merged 31 commits into
tgolen-workspace-settings
from
marcaaron-connectBankAccount2
Oct 8, 2021
Merged
Changes from 3 commits
Commits
Show all changes
31 commits
Select commit
Hold shift + click to select a range
73ff6ab
Move bank-account flow into workspace flow
marcaaron a7727f4
adding the basically done thing page but bank icons need a bankName a…
marcaaron 16a458e
Create interstitial page to redirect or show continue button
marcaaron 9e03ec0
fix subStep logic so that we remember the option selected;
marcaaron 8519ad3
Fix bankName stuff
marcaaron 74e4a55
add initial english translations
marcaaron 235b3d9
clean up getPaymentMethods
marcaaron 93e9d35
use initWithStoredValues
marcaaron d87cfc8
Remove add work email and replace with Concierge
marcaaron 1038edf
Add noop onPress
marcaaron 72fb8d7
dont show the continue setup screen if we are in an open state
marcaaron 8db44a0
fix weird bug that silently breaks navigating to a new step
marcaaron cd2d639
pop the WorkspaceBankAccountPage before navigating to /bank-account
marcaaron 10e27c7
remove unneeded link out to olddot
marcaaron 62a5191
Navigate to correct next step
marcaaron 183903a
add missing propTypes
marcaaron 81dea7f
add translations
marcaaron ac85502
add translations and assets
marcaaron 665da6d
Merge branch 'tgolen-workspace-settings' into marcaaron-connectBankAc…
marcaaron 18b05d3
remove unneeded import
marcaaron 6dce153
update copy
marcaaron 89a326f
change icon
marcaaron 198a064
remove assets
marcaaron c06423f
remove unused things
marcaaron 87271a8
fix conflicts
marcaaron 78da1f0
update route
marcaaron 50ab411
move loading false so ACHContractStep does not reshow
marcaaron 075fc07
add workaround for navigation
marcaaron d8a9be7
fix conflicts
marcaaron d68da52
remove pop
marcaaron a409a59
Remove extra dismissModal as it is no longer needed. Add a dismissMod…
marcaaron File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,56 +1,118 @@ | ||
| import _ from 'underscore'; | ||
| import React from 'react'; | ||
| import {Image, View} from 'react-native'; | ||
| import {View} from 'react-native'; | ||
| import {withOnyx} from 'react-native-onyx'; | ||
| import styles from '../../styles/styles'; | ||
| import withLocalize, {withLocalizePropTypes} from '../../components/withLocalize'; | ||
| import {navigateToConciergeChat} from '../../libs/actions/Report'; | ||
| import HeaderWithCloseButton from '../../components/HeaderWithCloseButton'; | ||
| import Navigation from '../../libs/Navigation/Navigation'; | ||
| import Text from '../../components/Text'; | ||
| import CONST from '../../CONST'; | ||
| import TextLink from '../../components/TextLink'; | ||
| import compose from '../../libs/compose'; | ||
| import ONYXKEYS from '../../ONYXKEYS'; | ||
| import Icon from '../../components/Icon'; | ||
| import {Bank, Pencil} from '../../components/Icon/Expensicons'; | ||
| import colors from '../../styles/colors'; | ||
| import variables from '../../styles/variables'; | ||
| import MenuItem from '../../components/MenuItem'; | ||
| import {openSignedInLink} from '../../libs/actions/App'; | ||
| import getBankIcon from '../../components/Icon/BankIcons'; | ||
| import {getPaymentMethods} from '../../libs/actions/PaymentMethods'; | ||
| import FullScreenLoadingIndicator from '../../components/FullscreenLoadingIndicator'; | ||
|
|
||
| const propTypes = { | ||
| ...withLocalizePropTypes, | ||
| }; | ||
|
|
||
| const EnableStep = ({translate}) => { | ||
| const verifyingUrl = `${CONST.CLOUDFRONT_URL}/images/icons/emptystates/emptystate_reviewing.gif`; | ||
| return ( | ||
| <View style={[styles.flex1, styles.justifyContentBetween]}> | ||
| <HeaderWithCloseButton | ||
| title={translate('validationStep.headerTitle')} | ||
| onCloseButtonPress={Navigation.dismissModal} | ||
| /> | ||
| <View style={[styles.flex1]}> | ||
| <Image | ||
| source={{uri: verifyingUrl}} | ||
| style={[styles.workspaceInviteWelcome]} | ||
| resizeMode="center" | ||
| class EnableStep extends React.Component { | ||
| constructor(props) { | ||
| super(props); | ||
| this.state = { | ||
| isLoadingPaymentMethods: true, | ||
| }; | ||
| } | ||
|
|
||
| componentDidMount() { | ||
| getPaymentMethods().then(() => { | ||
| this.setState({isLoadingPaymentMethods: false}); | ||
| }); | ||
marcaaron marked this conversation as resolved.
Show resolved
Hide resolved
|
||
| } | ||
|
|
||
| render() { | ||
| if (this.state.isLoadingPaymentMethods) { | ||
| return ( | ||
| <FullScreenLoadingIndicator visible /> | ||
marcaaron marked this conversation as resolved.
Show resolved
Hide resolved
|
||
| ); | ||
| } | ||
|
|
||
| const { | ||
| user, reimbursementAccount, translate, bankAccountList, | ||
| } = this.props; | ||
| const isUsingExpensifyCard = user.isUsingExpensifyCard; | ||
| const account = _.find(bankAccountList, bankAccount => bankAccount.bankAccountID === reimbursementAccount.achData.bankAccountID); | ||
| if (!account) { | ||
| throw new Error('Account not found in EnableStep'); | ||
marcaaron marked this conversation as resolved.
Show resolved
Hide resolved
|
||
| } | ||
|
|
||
| const {icon} = getBankIcon(account.additionalData.bankName); | ||
| const formattedBankAccountNumber = account.accountNumber | ||
| ? `${translate('paymentMethodList.accountLastFour')} ${ | ||
| account.accountNumber.slice(-4) | ||
| }` | ||
| : ''; | ||
| const bankName = account.addressName; | ||
| return ( | ||
| <View style={[styles.flex1, styles.justifyContentBetween]}> | ||
| <HeaderWithCloseButton | ||
| title={translate('workspace.common.bankAccount')} | ||
| onCloseButtonPress={Navigation.dismissModal} | ||
| shouldShowBackButton | ||
| onBackButtonPress={() => Navigation.goBack()} | ||
| /> | ||
| <Text style={[styles.mh5, styles.mb5]}> | ||
| {translate('validationStep.reviewingInfo')} | ||
| <TextLink | ||
| onPress={() => { | ||
| // There are two modals that must be dismissed before we can reveal the Concierge | ||
| // chat underneath these screens | ||
| Navigation.dismissModal(); | ||
| Navigation.dismissModal(); | ||
| navigateToConciergeChat(); | ||
| }} | ||
| > | ||
| {translate('common.here')} | ||
| </TextLink> | ||
| {translate('validationStep.forNextSteps')} | ||
| </Text> | ||
| <View style={[styles.flex1]}> | ||
| <View style={[styles.mh5, styles.mb5, styles.flexRow, styles.justifyContentBetween, styles.alignItemsCenter]}> | ||
| <Text style={[styles.textLarge, styles.textStrong]}>{!isUsingExpensifyCard ? 'Basically done!' : 'All set!'}</Text> | ||
| <Icon src={Bank} fill={colors.yellow} height={variables.componentSizeNormal} width={variables.componentSizeNormal} /> | ||
| </View> | ||
| <MenuItem | ||
| title={bankName} | ||
| description={formattedBankAccountNumber} | ||
| icon={icon} | ||
| /> | ||
| <Text style={[styles.mh5, styles.mb5]}> | ||
| {!isUsingExpensifyCard | ||
| ? 'This bank account will be used to reimburse expenses, collect invoices, and pay bills all from the same account. To enable the Expensify Card, please add a work email address.' | ||
| : 'This bank account will be used to issue corporate cards, reimburse expenses, collect invoices, and pay bills all from the same account.'} | ||
| </Text> | ||
| {!isUsingExpensifyCard && ( | ||
| <MenuItem | ||
| title="Add work email" | ||
| icon={Pencil} | ||
| onPress={() => { | ||
| openSignedInLink('settings?param={“section”:”account”,”openModal”:”secondaryLogin”}'); | ||
| }} | ||
| shouldShowRightIcon | ||
| /> | ||
| )} | ||
| </View> | ||
| </View> | ||
| </View> | ||
| ); | ||
| }; | ||
| ); | ||
| } | ||
| } | ||
|
|
||
| EnableStep.propTypes = propTypes; | ||
| EnableStep.displayName = 'EnableStep'; | ||
|
|
||
| export default compose( | ||
| withLocalize, | ||
| withOnyx({ | ||
| user: { | ||
| key: ONYXKEYS.USER, | ||
| }, | ||
| reimbursementAccount: { | ||
| key: ONYXKEYS.REIMBURSEMENT_ACCOUNT, | ||
| }, | ||
| bankAccountList: { | ||
| key: ONYXKEYS.BANK_ACCOUNT_LIST, | ||
| }, | ||
| }), | ||
| )(EnableStep); | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is showing error when
subStepis nullThere was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
propTypeswarning maybe? probably we should be passing eitherundefinedor anObject. I don't think it will affect the code, but should be cleaned up.There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
App/src/components/HeaderWithCloseButton.js
Lines 43 to 47 in a860c59
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yeah, I cleaned this up already.