-
Notifications
You must be signed in to change notification settings - Fork 3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'Expensify:main' into prefer-shouldUseNarrowLayout-inste…
…ad-of-isSmallScreenWidth-eslint-rule
- Loading branch information
Showing
67 changed files
with
2,163 additions
and
1,051 deletions.
There are no files selected for viewing
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
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,109 +1,17 @@ | ||
import React from 'react'; | ||
import {StyleSheet, View} from 'react-native'; | ||
import type {OnyxCollection, OnyxEntry} from 'react-native-onyx'; | ||
import {useOnyx, withOnyx} from 'react-native-onyx'; | ||
import useTheme from '@hooks/useTheme'; | ||
import useIndicatorStatus from '@hooks/useIndicatorStatus'; | ||
import useThemeStyles from '@hooks/useThemeStyles'; | ||
import {isConnectionInProgress} from '@libs/actions/connections'; | ||
import * as PolicyUtils from '@libs/PolicyUtils'; | ||
import * as SubscriptionUtils from '@libs/SubscriptionUtils'; | ||
import * as UserUtils from '@libs/UserUtils'; | ||
import * as PaymentMethods from '@userActions/PaymentMethods'; | ||
import ONYXKEYS from '@src/ONYXKEYS'; | ||
import type {BankAccountList, FundList, LoginList, Policy, ReimbursementAccount, UserWallet, WalletTerms} from '@src/types/onyx'; | ||
|
||
type CheckingMethod = () => boolean; | ||
|
||
type IndicatorOnyxProps = { | ||
/** All the user's policies (from Onyx via withFullPolicy) */ | ||
policies: OnyxCollection<Policy>; | ||
|
||
/** List of bank accounts */ | ||
bankAccountList: OnyxEntry<BankAccountList>; | ||
|
||
/** List of user cards */ | ||
fundList: OnyxEntry<FundList>; | ||
|
||
/** The user's wallet (coming from Onyx) */ | ||
userWallet: OnyxEntry<UserWallet>; | ||
|
||
/** Bank account attached to free plan */ | ||
reimbursementAccount: OnyxEntry<ReimbursementAccount>; | ||
|
||
/** Information about the user accepting the terms for payments */ | ||
walletTerms: OnyxEntry<WalletTerms>; | ||
|
||
/** Login list for the user that is signed in */ | ||
loginList: OnyxEntry<LoginList>; | ||
}; | ||
|
||
type IndicatorProps = IndicatorOnyxProps; | ||
|
||
function Indicator({reimbursementAccount, policies, bankAccountList, fundList, userWallet, walletTerms, loginList}: IndicatorOnyxProps) { | ||
const theme = useTheme(); | ||
function Indicator() { | ||
const styles = useThemeStyles(); | ||
const [allConnectionSyncProgresses] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_CONNECTION_SYNC_PROGRESS}`); | ||
|
||
// If a policy was just deleted from Onyx, then Onyx will pass a null value to the props, and | ||
// those should be cleaned out before doing any error checking | ||
const cleanPolicies = Object.fromEntries(Object.entries(policies ?? {}).filter(([, policy]) => policy?.id)); | ||
|
||
// All of the error & info-checking methods are put into an array. This is so that using _.some() will return | ||
// early as soon as the first error / info condition is returned. This makes the checks very efficient since | ||
// we only care if a single error / info condition exists anywhere. | ||
const errorCheckingMethods: CheckingMethod[] = [ | ||
() => Object.keys(userWallet?.errors ?? {}).length > 0, | ||
() => PaymentMethods.hasPaymentMethodError(bankAccountList, fundList), | ||
() => Object.values(cleanPolicies).some(PolicyUtils.hasPolicyError), | ||
() => Object.values(cleanPolicies).some(PolicyUtils.hasCustomUnitsError), | ||
() => Object.values(cleanPolicies).some(PolicyUtils.hasEmployeeListError), | ||
() => | ||
Object.values(cleanPolicies).some((cleanPolicy) => | ||
PolicyUtils.hasSyncError( | ||
cleanPolicy, | ||
isConnectionInProgress(allConnectionSyncProgresses?.[`${ONYXKEYS.COLLECTION.POLICY_CONNECTION_SYNC_PROGRESS}${cleanPolicy?.id}`], cleanPolicy), | ||
), | ||
), | ||
() => SubscriptionUtils.hasSubscriptionRedDotError(), | ||
() => Object.keys(reimbursementAccount?.errors ?? {}).length > 0, | ||
() => !!loginList && UserUtils.hasLoginListError(loginList), | ||
|
||
// Wallet term errors that are not caused by an IOU (we show the red brick indicator for those in the LHN instead) | ||
() => Object.keys(walletTerms?.errors ?? {}).length > 0 && !walletTerms?.chatReportID, | ||
]; | ||
const infoCheckingMethods: CheckingMethod[] = [() => !!loginList && UserUtils.hasLoginListInfo(loginList), () => SubscriptionUtils.hasSubscriptionGreenDotInfo()]; | ||
const shouldShowErrorIndicator = errorCheckingMethods.some((errorCheckingMethod) => errorCheckingMethod()); | ||
const shouldShowInfoIndicator = !shouldShowErrorIndicator && infoCheckingMethods.some((infoCheckingMethod) => infoCheckingMethod()); | ||
const {indicatorColor, status} = useIndicatorStatus(); | ||
|
||
const indicatorColor = shouldShowErrorIndicator ? theme.danger : theme.success; | ||
const indicatorStyles = [styles.alignItemsCenter, styles.justifyContentCenter, styles.statusIndicator(indicatorColor)]; | ||
|
||
return (shouldShowErrorIndicator || shouldShowInfoIndicator) && <View style={StyleSheet.flatten(indicatorStyles)} />; | ||
return !!status && <View style={StyleSheet.flatten(indicatorStyles)} />; | ||
} | ||
|
||
Indicator.displayName = 'Indicator'; | ||
|
||
export default withOnyx<IndicatorProps, IndicatorOnyxProps>({ | ||
policies: { | ||
key: ONYXKEYS.COLLECTION.POLICY, | ||
}, | ||
bankAccountList: { | ||
key: ONYXKEYS.BANK_ACCOUNT_LIST, | ||
}, | ||
// @ts-expect-error: ONYXKEYS.REIMBURSEMENT_ACCOUNT is conflicting with ONYXKEYS.FORMS.REIMBURSEMENT_ACCOUNT_FORM | ||
reimbursementAccount: { | ||
key: ONYXKEYS.REIMBURSEMENT_ACCOUNT, | ||
}, | ||
fundList: { | ||
key: ONYXKEYS.FUND_LIST, | ||
}, | ||
userWallet: { | ||
key: ONYXKEYS.USER_WALLET, | ||
}, | ||
walletTerms: { | ||
key: ONYXKEYS.WALLET_TERMS, | ||
}, | ||
loginList: { | ||
key: ONYXKEYS.LOGIN_LIST, | ||
}, | ||
})(Indicator); | ||
export default Indicator; |
Oops, something went wrong.