Skip to content
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

Handle error in workspace's bank account page #15394

Merged
merged 32 commits into from
Apr 20, 2023
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
32 commits
Select commit Hold shift + click to select a range
99df6d7
Show error in workspace's bank account page
aldo-expensify Feb 23, 2023
426694b
Disable disconnect button on pending action
aldo-expensify Feb 23, 2023
7fb58c1
Merge branch 'main' of github.com:Expensify/App into aldo_fix-disconn…
aldo-expensify Feb 23, 2023
b64bfc3
Move error to reimbursementAccount.errors
aldo-expensify Feb 24, 2023
814df41
Don't clear errors when reloading VBA
aldo-expensify Feb 24, 2023
5a2fb89
Add red dot in avatar when error in reimbursementAccount.errors
aldo-expensify Feb 24, 2023
c502f90
Add red dot in Settings when error in reimbursementAccount.errors
aldo-expensify Feb 24, 2023
5ef05fc
Add RBR error indicator in initial workspace page
aldo-expensify Feb 24, 2023
623e3a7
Add red dot to workspaces list
aldo-expensify Feb 27, 2023
8aea1c2
Handle errors when restarting a VBBA setup
aldo-expensify Feb 27, 2023
654d582
Remove unused prop
aldo-expensify Feb 27, 2023
3e15034
Remove unused import
aldo-expensify Feb 27, 2023
0bd46f8
Resolve conflicts / merge with main
aldo-expensify Mar 4, 2023
a93784b
Merge branch 'main' of github.com:Expensify/App into aldo_fix-disconn…
aldo-expensify Mar 10, 2023
5218695
Remove `pendingAction` on failure
aldo-expensify Mar 10, 2023
ed12f80
Recalculate state.shouldHideContinueSetupButton after pendingAction=d…
aldo-expensify Mar 10, 2023
c1b12d0
Update misspell
aldo-expensify Mar 11, 2023
f9a0e34
Disable button if there are errors
aldo-expensify Mar 11, 2023
5425565
Merge branch 'main' of github.com:Expensify/App into aldo_fix-disconn…
aldo-expensify Mar 15, 2023
2e0bc5d
Update continue with setup state
aldo-expensify Mar 15, 2023
777f086
Update route even when showing continue/starto over button
aldo-expensify Mar 15, 2023
332d464
Fix initial step param
aldo-expensify Mar 15, 2023
81ab0f4
Remove unused import
aldo-expensify Mar 15, 2023
f51f032
Keep url /bank-account is we get choice to continue
aldo-expensify Mar 15, 2023
6914f4c
Update logic clearing errors
aldo-expensify Mar 17, 2023
c957618
Fix edge cases in relation to showing options continue/start over
aldo-expensify Mar 18, 2023
42dac27
Resolve conflicts
aldo-expensify Mar 18, 2023
7e36149
Style
aldo-expensify Mar 18, 2023
85888a7
Remove unused variable
aldo-expensify Mar 20, 2023
48585ef
Merge main / Resolve conflicts
aldo-expensify Apr 14, 2023
bd11b4c
Merge branch 'aldo_fix-disconnect-workspace-bankaccount' of github.co…
aldo-expensify Apr 14, 2023
270dc00
Add new line at end of file (style)
aldo-expensify Apr 14, 2023
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
50 changes: 33 additions & 17 deletions src/libs/actions/ReimbursementAccount/resetFreePlanBankAccount.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,26 @@ function resetFreePlanBankAccount(bankAccountID) {
},
{
optimisticData: [
// This bank account is present in ONYXKEYS.BANK_ACCOUNT_LIST
{
onyxMethod: CONST.ONYX.METHOD.MERGE,
key: ONYXKEYS.BANK_ACCOUNT_LIST,
value: {[bankAccountID]: {pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE}},
},
{
onyxMethod: CONST.ONYX.METHOD.MERGE,
key: ONYXKEYS.REIMBURSEMENT_ACCOUNT,
value: {shouldShowResetModal: false},
},

// TODO: What is this loading state? doesn't seem to be used
// {
// onyxMethod: CONST.ONYX.METHOD.MERGE,
// key: ONYXKEYS.REIMBURSEMENT_ACCOUNT,
// value: {isLoading: true},
// },
],
successData: [
{
onyxMethod: CONST.ONYX.METHOD.SET,
key: ONYXKEYS.ONFIDO_TOKEN,
Expand All @@ -44,30 +64,26 @@ function resetFreePlanBankAccount(bankAccountID) {
key: ONYXKEYS.REIMBURSEMENT_ACCOUNT,
value: ReimbursementAccountProps.reimbursementAccountDefaultProps,
},
{
onyxMethod: CONST.ONYX.METHOD.MERGE,
key: ONYXKEYS.REIMBURSEMENT_ACCOUNT,
value: {isLoading: true},
},
{
onyxMethod: CONST.ONYX.METHOD.SET,
key: ONYXKEYS.REIMBURSEMENT_ACCOUNT_DRAFT,
value: {},
},
],
successData: [
{
onyxMethod: CONST.ONYX.METHOD.MERGE,
key: ONYXKEYS.REIMBURSEMENT_ACCOUNT,
value: {isLoading: false},
},

// TODO: What is this loading state? doesn't seem to be used
// {
// onyxMethod: CONST.ONYX.METHOD.MERGE,
// key: ONYXKEYS.REIMBURSEMENT_ACCOUNT,
// value: {isLoading: false},
// },
],
failureData: [
{
onyxMethod: CONST.ONYX.METHOD.MERGE,
key: ONYXKEYS.REIMBURSEMENT_ACCOUNT,
value: {isLoading: false},
},
// TODO: What is this loading state? doesn't seem to be used
// {
// onyxMethod: CONST.ONYX.METHOD.MERGE,
// key: ONYXKEYS.REIMBURSEMENT_ACCOUNT,
// value: {isLoading: false},
// },
],
});
}
Expand Down
92 changes: 57 additions & 35 deletions src/pages/ReimbursementAccount/EnableStep.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import React from 'react';
import PropTypes from 'prop-types';
import {ScrollView} from 'react-native';
import {withOnyx} from 'react-native-onyx';
import lodashGet from 'lodash/get';
Expand All @@ -13,6 +14,8 @@ import CONST from '../../CONST';
import Button from '../../components/Button';
import * as Expensicons from '../../components/Icon/Expensicons';
import MenuItem from '../../components/MenuItem';
import OfflineWithFeedback from '../../components/OfflineWithFeedback';
import bankAccountPropTypes from '../../components/bankAccountPropTypes';
import getBankIcon from '../../components/Icon/BankIcons';
import * as ReimbursementAccountProps from './reimbursementAccountPropTypes';
import userPropTypes from '../settings/userPropTypes';
Expand All @@ -23,11 +26,15 @@ import * as User from '../../libs/actions/User';
import ScreenWrapper from '../../components/ScreenWrapper';
import * as BankAccounts from '../../libs/actions/ReimbursementAccount';
import WorkspaceResetBankAccountModal from '../workspace/WorkspaceResetBankAccountModal';
import * as PaymentMethods from '../../libs/actions/PaymentMethods';

const propTypes = {
/** Bank account currently in setup */
reimbursementAccount: ReimbursementAccountProps.reimbursementAccountPropTypes.isRequired,

/** List of bank accounts */
bankAccountList: PropTypes.objectOf(bankAccountPropTypes).isRequired,

/* Onyx Props */
user: userPropTypes.isRequired,

Expand All @@ -45,6 +52,8 @@ const EnableStep = (props) => {
: '';
const bankName = achData.addressName;

const errors = lodashGet(props.bankAccountList, [achData.bankAccountID, 'errors'], {});
const pendingAction = lodashGet(props.bankAccountList, [achData.bankAccountID, 'pendingAction'], {});
return (
<ScreenWrapper style={[styles.flex1, styles.justifyContentBetween]} includeSafeAreaPaddingBottom={false}>
<HeaderWithCloseButton
Expand All @@ -60,42 +69,52 @@ const EnableStep = (props) => {
title={!isUsingExpensifyCard ? props.translate('workspace.bankAccount.oneMoreThing') : props.translate('workspace.bankAccount.allSet')}
icon={!isUsingExpensifyCard ? Illustrations.ConciergeNew : Illustrations.ThumbsUpStars}
>
<MenuItem
title={bankName}
description={formattedBankAccountNumber}
icon={icon}
iconWidth={iconSize}
iconHeight={iconSize}
disabled
interactive={false}
wrapperStyle={[styles.cardMenuItem, styles.mv3]}
/>
<Text style={[styles.mv3]}>
{!isUsingExpensifyCard
? props.translate('workspace.bankAccount.accountDescriptionNoCards')
: props.translate('workspace.bankAccount.accountDescriptionWithCards')}
</Text>
{!isUsingExpensifyCard && (
<Button
text={props.translate('workspace.bankAccount.addWorkEmail')}
onPress={() => {
Link.openOldDotLink(CONST.ADD_SECONDARY_LOGIN_URL);
User.subscribeToExpensifyCardUpdates();
}}
icon={Expensicons.Mail}
style={[styles.mt4]}
iconStyles={[styles.buttonCTAIcon]}
shouldShowRightIcon
large
success

<OfflineWithFeedback
pendingAction={pendingAction}
errors={errors}
shouldShowErrorMessage
onClose={() => {
PaymentMethods.clearDeletePaymentMethodError(ONYXKEYS.BANK_ACCOUNT_LIST, achData.bankAccountID);
}}
>
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks like a lot of changes because of the change of level of indentation

<MenuItem
title={bankName}
description={formattedBankAccountNumber}
icon={icon}
iconWidth={iconSize}
iconHeight={iconSize}
disabled
interactive={false}
wrapperStyle={[styles.cardMenuItem, styles.mv3]}
/>
)}
<MenuItem
title={props.translate('workspace.bankAccount.disconnectBankAccount')}
icon={Expensicons.Close}
onPress={BankAccounts.requestResetFreePlanBankAccount}
wrapperStyle={[styles.cardMenuItem, styles.mv3]}
/>
<Text style={[styles.mv3]}>
{!isUsingExpensifyCard
? props.translate('workspace.bankAccount.accountDescriptionNoCards')
: props.translate('workspace.bankAccount.accountDescriptionWithCards')}
</Text>
{!isUsingExpensifyCard && (
<Button
text={props.translate('workspace.bankAccount.addWorkEmail')}
onPress={() => {
Link.openOldDotLink(CONST.ADD_SECONDARY_LOGIN_URL);
User.subscribeToExpensifyCardUpdates();
}}
icon={Expensicons.Mail}
style={[styles.mt4]}
iconStyles={[styles.buttonCTAIcon]}
shouldShowRightIcon
large
success
/>
)}
<MenuItem
title={props.translate('workspace.bankAccount.disconnectBankAccount')}
icon={Expensicons.Close}
onPress={BankAccounts.requestResetFreePlanBankAccount}
wrapperStyle={[styles.cardMenuItem, styles.mv3]}
/>
</OfflineWithFeedback>
</Section>
{props.user.isCheckingDomain && (
<Text style={[styles.formError, styles.mh5]}>
Expand All @@ -121,5 +140,8 @@ export default compose(
user: {
key: ONYXKEYS.USER,
},
bankAccountList: {
key: ONYXKEYS.BANK_ACCOUNT_LIST,
},
}),
)(EnableStep);