From 627bdf2ce86072b9b531ebfa389e2ce481b2e545 Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Wed, 21 Feb 2024 11:58:29 -0800 Subject: [PATCH 01/18] Remove unnecssary calls to OpenPrivatePersonalDetailsPage --- .../Profile/PersonalDetails/AddressPage.js | 10 ------ .../PersonalDetails/DateOfBirthPage.js | 9 ----- .../Profile/PersonalDetails/LegalNamePage.js | 8 ----- src/pages/settings/Profile/ProfilePage.js | 36 +++++++------------ 4 files changed, 12 insertions(+), 51 deletions(-) diff --git a/src/pages/settings/Profile/PersonalDetails/AddressPage.js b/src/pages/settings/Profile/PersonalDetails/AddressPage.js index 55d221085fcb..b8bbf0d4fad2 100644 --- a/src/pages/settings/Profile/PersonalDetails/AddressPage.js +++ b/src/pages/settings/Profile/PersonalDetails/AddressPage.js @@ -3,12 +3,9 @@ import PropTypes from 'prop-types'; import React, {useCallback, useEffect, useMemo, useState} from 'react'; import {withOnyx} from 'react-native-onyx'; import AddressForm from '@components/AddressForm'; -import FullscreenLoadingIndicator from '@components/FullscreenLoadingIndicator'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import useLocalize from '@hooks/useLocalize'; -import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; -import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; import * as PersonalDetails from '@userActions/PersonalDetails'; import ONYXKEYS from '@src/ONYXKEYS'; @@ -59,13 +56,10 @@ function updateAddress(values) { } function AddressPage({privatePersonalDetails, route}) { - const styles = useThemeStyles(); - usePrivatePersonalDetails(); const {translate} = useLocalize(); const address = useMemo(() => lodashGet(privatePersonalDetails, 'address') || {}, [privatePersonalDetails]); const countryFromUrl = lodashGet(route, 'params.country'); const [currentCountry, setCurrentCountry] = useState(address.country); - const isLoadingPersonalDetails = lodashGet(privatePersonalDetails, 'isLoading', true); const [street1, street2] = (address.street || '').split('\n'); const [state, setState] = useState(address.state); const [city, setCity] = useState(address.city); @@ -123,9 +117,6 @@ function AddressPage({privatePersonalDetails, route}) { shouldShowBackButton onBackButtonPress={() => Navigation.goBack()} /> - {isLoadingPersonalDetails ? ( - - ) : ( - )} ); } diff --git a/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js b/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js index 943d9fe0bab7..7861b2486c49 100644 --- a/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js +++ b/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js @@ -1,16 +1,13 @@ import {subYears} from 'date-fns'; -import lodashGet from 'lodash/get'; import PropTypes from 'prop-types'; import React, {useCallback} from 'react'; import {withOnyx} from 'react-native-onyx'; import DatePicker from '@components/DatePicker'; import FormProvider from '@components/Form/FormProvider'; import InputWrapper from '@components/Form/InputWrapper'; -import FullscreenLoadingIndicator from '@components/FullscreenLoadingIndicator'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; @@ -39,8 +36,6 @@ const defaultProps = { function DateOfBirthPage({translate, privatePersonalDetails}) { const styles = useThemeStyles(); - usePrivatePersonalDetails(); - const isLoadingPersonalDetails = lodashGet(privatePersonalDetails, 'isLoading', true); /** * @param {Object} values @@ -71,9 +66,6 @@ function DateOfBirthPage({translate, privatePersonalDetails}) { title={translate('common.dob')} onBackButtonPress={() => Navigation.goBack()} /> - {isLoadingPersonalDetails ? ( - - ) : ( - )} ); } diff --git a/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js b/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js index 0e81ea5194c1..5152982a3c6f 100644 --- a/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js +++ b/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js @@ -6,12 +6,10 @@ import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import FormProvider from '@components/Form/FormProvider'; import InputWrapper from '@components/Form/InputWrapper'; -import FullscreenLoadingIndicator from '@components/FullscreenLoadingIndicator'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import TextInput from '@components/TextInput'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; @@ -47,10 +45,8 @@ const updateLegalName = (values) => { function LegalNamePage(props) { const styles = useThemeStyles(); - usePrivatePersonalDetails(); const legalFirstName = lodashGet(props.privatePersonalDetails, 'legalFirstName', ''); const legalLastName = lodashGet(props.privatePersonalDetails, 'legalLastName', ''); - const isLoadingPersonalDetails = lodashGet(props.privatePersonalDetails, 'isLoading', true); const validate = useCallback((values) => { const errors = {}; @@ -90,9 +86,6 @@ function LegalNamePage(props) { title={props.translate('privatePersonalDetails.legalName')} onBackButtonPress={() => Navigation.goBack()} /> - {isLoadingPersonalDetails ? ( - - ) : ( - )} ); } diff --git a/src/pages/settings/Profile/ProfilePage.js b/src/pages/settings/Profile/ProfilePage.js index 2872fae5b511..7572db87f4b9 100755 --- a/src/pages/settings/Profile/ProfilePage.js +++ b/src/pages/settings/Profile/ProfilePage.js @@ -4,7 +4,6 @@ import React, {useEffect} from 'react'; import {ScrollView, View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; -import FullscreenLoadingIndicator from '@components/FullscreenLoadingIndicator'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import * as Illustrations from '@components/Icon/Illustrations'; import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; @@ -13,9 +12,6 @@ import Section from '@components/Section'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; -import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; -import useStyleUtils from '@hooks/useStyleUtils'; -import useTheme from '@hooks/useTheme'; import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import compose from '@libs/compose'; @@ -82,9 +78,7 @@ const defaultProps = { }; function ProfilePage(props) { - const theme = useTheme(); const styles = useThemeStyles(); - const StyleUtils = useStyleUtils(); const getPronouns = () => { let pronounsKey = lodashGet(props.currentUserPersonalDetails, 'pronouns', ''); if (pronounsKey.startsWith(CONST.PRONOUNS.PREFIX)) { @@ -100,10 +94,8 @@ function ProfilePage(props) { const contactMethodBrickRoadIndicator = UserUtils.getLoginListBrickRoadIndicator(props.loginList); const emojiCode = lodashGet(props, 'currentUserPersonalDetails.status.emojiCode', ''); const {isSmallScreenWidth} = useWindowDimensions(); - usePrivatePersonalDetails(); const privateDetails = props.privatePersonalDetails || {}; const legalName = `${privateDetails.legalFirstName || ''} ${privateDetails.legalLastName || ''}`.trim(); - const isLoadingPersonalDetails = lodashGet(props.privatePersonalDetails, 'isLoading', true); const publicOptions = [ { @@ -198,22 +190,18 @@ function ProfilePage(props) { childrenStyles={styles.pt3} titleStyles={styles.accountSettingsSectionTitle} > - {isLoadingPersonalDetails ? ( - - ) : ( - <> - {_.map(privateOptions, (detail, index) => ( - Navigation.navigate(detail.pageRoute)} - /> - ))} - - )} + <> + {_.map(privateOptions, (detail, index) => ( + Navigation.navigate(detail.pageRoute)} + /> + ))} + From e5b5536a176f3c113760cfa24888111bf8945c38 Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Wed, 21 Feb 2024 12:04:06 -0800 Subject: [PATCH 02/18] remaining uses --- src/components/CardPreview.tsx | 2 -- src/hooks/usePrivatePersonalDetails.ts | 20 ------------------- .../settings/Wallet/ReportCardLostPage.js | 2 -- .../Wallet/WalletPage/CardDetails.tsx | 2 -- 4 files changed, 26 deletions(-) delete mode 100644 src/hooks/usePrivatePersonalDetails.ts diff --git a/src/components/CardPreview.tsx b/src/components/CardPreview.tsx index 3ac56d6b26a8..acdf8a92fb5e 100644 --- a/src/components/CardPreview.tsx +++ b/src/components/CardPreview.tsx @@ -3,7 +3,6 @@ import {View} from 'react-native'; import type {OnyxEntry} from 'react-native-onyx'; import {withOnyx} from 'react-native-onyx'; import ExpensifyCardImage from '@assets/images/expensify-card.svg'; -import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import ONYXKEYS from '@src/ONYXKEYS'; @@ -22,7 +21,6 @@ type CardPreviewProps = CardPreviewOnyxProps; function CardPreview({privatePersonalDetails, session}: CardPreviewProps) { const styles = useThemeStyles(); - usePrivatePersonalDetails(); const {legalFirstName, legalLastName} = privatePersonalDetails ?? {}; const cardHolder = legalFirstName && legalLastName ? `${legalFirstName} ${legalLastName}` : session?.email ?? ''; diff --git a/src/hooks/usePrivatePersonalDetails.ts b/src/hooks/usePrivatePersonalDetails.ts deleted file mode 100644 index f17600e9878f..000000000000 --- a/src/hooks/usePrivatePersonalDetails.ts +++ /dev/null @@ -1,20 +0,0 @@ -import {useContext, useEffect} from 'react'; -import {NetworkContext} from '@components/OnyxProvider'; -import * as PersonalDetails from '@userActions/PersonalDetails'; - -/** - * Hook for fetching private personal details - */ -export default function usePrivatePersonalDetails() { - const network = useContext(NetworkContext); - - useEffect(() => { - const personalDetails = PersonalDetails.getPrivatePersonalDetails(); - // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing - if (network?.isOffline || (Boolean(personalDetails) && personalDetails?.isLoading !== undefined)) { - return; - } - - PersonalDetails.openPersonalDetails(); - }, [network?.isOffline]); -} diff --git a/src/pages/settings/Wallet/ReportCardLostPage.js b/src/pages/settings/Wallet/ReportCardLostPage.js index b78c0b6bdc21..ff33fbd73099 100644 --- a/src/pages/settings/Wallet/ReportCardLostPage.js +++ b/src/pages/settings/Wallet/ReportCardLostPage.js @@ -11,7 +11,6 @@ import SingleOptionSelector from '@components/SingleOptionSelector'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; import usePrevious from '@hooks/usePrevious'; -import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; import useThemeStyles from '@hooks/useThemeStyles'; import * as CardUtils from '@libs/CardUtils'; import Navigation from '@libs/Navigation/Navigation'; @@ -91,7 +90,6 @@ function ReportCardLostPage({ formData, }) { const styles = useThemeStyles(); - usePrivatePersonalDetails(); const domainCards = CardUtils.getDomainCards(cardList)[domain]; const physicalCard = CardUtils.findPhysicalCard(domainCards); diff --git a/src/pages/settings/Wallet/WalletPage/CardDetails.tsx b/src/pages/settings/Wallet/WalletPage/CardDetails.tsx index 77458384c214..4cce60cfa5c0 100644 --- a/src/pages/settings/Wallet/WalletPage/CardDetails.tsx +++ b/src/pages/settings/Wallet/WalletPage/CardDetails.tsx @@ -7,7 +7,6 @@ import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; import PressableWithDelayToggle from '@components/Pressable/PressableWithDelayToggle'; import TextLink from '@components/TextLink'; import useLocalize from '@hooks/useLocalize'; -import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; import useThemeStyles from '@hooks/useThemeStyles'; import Clipboard from '@libs/Clipboard'; import Navigation from '@libs/Navigation/Navigation'; @@ -47,7 +46,6 @@ type CardDetailsProps = CardDetailsOnyxProps & { function CardDetails({pan = '', expiration = '', cvv = '', privatePersonalDetails, domain}: CardDetailsProps) { const styles = useThemeStyles(); - usePrivatePersonalDetails(); const {translate} = useLocalize(); const handleCopyToClipboard = () => { From ed012d5ad9ae9effc8af71235dd9c296ead00120 Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Wed, 21 Feb 2024 12:09:52 -0800 Subject: [PATCH 03/18] prettier --- .../Profile/PersonalDetails/AddressPage.js | 24 +++---- .../PersonalDetails/DateOfBirthPage.js | 34 +++++----- .../Profile/PersonalDetails/LegalNamePage.js | 66 +++++++++---------- 3 files changed, 62 insertions(+), 62 deletions(-) diff --git a/src/pages/settings/Profile/PersonalDetails/AddressPage.js b/src/pages/settings/Profile/PersonalDetails/AddressPage.js index b8bbf0d4fad2..89650f978e05 100644 --- a/src/pages/settings/Profile/PersonalDetails/AddressPage.js +++ b/src/pages/settings/Profile/PersonalDetails/AddressPage.js @@ -117,18 +117,18 @@ function AddressPage({privatePersonalDetails, route}) { shouldShowBackButton onBackButtonPress={() => Navigation.goBack()} /> - + ); } diff --git a/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js b/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js index 7861b2486c49..ba7db33bb070 100644 --- a/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js +++ b/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js @@ -66,23 +66,23 @@ function DateOfBirthPage({translate, privatePersonalDetails}) { title={translate('common.dob')} onBackButtonPress={() => Navigation.goBack()} /> - - - + + + ); } diff --git a/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js b/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js index 5152982a3c6f..ec1a48148687 100644 --- a/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js +++ b/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js @@ -86,39 +86,39 @@ function LegalNamePage(props) { title={props.translate('privatePersonalDetails.legalName')} onBackButtonPress={() => Navigation.goBack()} /> - - - - - - - - + + + + + + + + ); } From 8410d344f4c9de1a45410d76dcb6572da3e190a7 Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Wed, 21 Feb 2024 16:31:59 -0800 Subject: [PATCH 04/18] fix LegalNamePage loading --- .../Profile/PersonalDetails/LegalNamePage.js | 80 +++++++++++-------- 1 file changed, 45 insertions(+), 35 deletions(-) diff --git a/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js b/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js index ec1a48148687..0bd7f4b70d34 100644 --- a/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js +++ b/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js @@ -6,6 +6,7 @@ import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import FormProvider from '@components/Form/FormProvider'; import InputWrapper from '@components/Form/InputWrapper'; +import FullscreenLoadingIndicator from '@components/FullscreenLoadingIndicator'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import TextInput from '@components/TextInput'; @@ -20,15 +21,16 @@ import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import INPUT_IDS from '@src/types/form/LegalNameForm'; + const propTypes = { /* Onyx Props */ - - /** User's private personal details */ privatePersonalDetails: PropTypes.shape({ legalFirstName: PropTypes.string, legalLastName: PropTypes.string, }), + isLoadingApp: PropTypes.bool, + ...withLocalizePropTypes, }; @@ -37,6 +39,7 @@ const defaultProps = { legalFirstName: '', legalLastName: '', }, + isLoadingApp: true, }; const updateLegalName = (values) => { @@ -86,39 +89,43 @@ function LegalNamePage(props) { title={props.translate('privatePersonalDetails.legalName')} onBackButtonPress={() => Navigation.goBack()} /> - - - - - - - - + {props.isLoadingApp ? ( + + ) : ( + + + + + + + + + )} ); } @@ -133,5 +140,8 @@ export default compose( privatePersonalDetails: { key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS, }, + isLoadingApp: { + key: ONYXKEYS.IS_LOADING_APP, + }, }), )(LegalNamePage); From e33dc8554f4a0cecc3cdb26bed85e7c7432b3dca Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Wed, 21 Feb 2024 16:36:19 -0800 Subject: [PATCH 05/18] fix direct link loading for AddressPage --- .../Profile/PersonalDetails/AddressPage.js | 39 ++++++++++++------- 1 file changed, 26 insertions(+), 13 deletions(-) diff --git a/src/pages/settings/Profile/PersonalDetails/AddressPage.js b/src/pages/settings/Profile/PersonalDetails/AddressPage.js index 89650f978e05..2df72e1958bc 100644 --- a/src/pages/settings/Profile/PersonalDetails/AddressPage.js +++ b/src/pages/settings/Profile/PersonalDetails/AddressPage.js @@ -3,9 +3,11 @@ import PropTypes from 'prop-types'; import React, {useCallback, useEffect, useMemo, useState} from 'react'; import {withOnyx} from 'react-native-onyx'; import AddressForm from '@components/AddressForm'; +import FullscreenLoadingIndicator from '@components/FullscreenLoadingIndicator'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; import * as PersonalDetails from '@userActions/PersonalDetails'; import ONYXKEYS from '@src/ONYXKEYS'; @@ -25,6 +27,8 @@ const propTypes = { }), }), + isLoadingApp: PropTypes.bool, + /** Route from navigation */ route: PropTypes.shape({ /** Params from the route */ @@ -45,6 +49,7 @@ const defaultProps = { country: '', }, }, + isLoadingApp: true, }; /** @@ -55,7 +60,8 @@ function updateAddress(values) { PersonalDetails.updateAddress(values.addressLine1.trim(), values.addressLine2.trim(), values.city.trim(), values.state.trim(), values.zipPostCode.trim().toUpperCase(), values.country); } -function AddressPage({privatePersonalDetails, route}) { +function AddressPage({privatePersonalDetails, route, isLoadingApp}) { + const styles = useThemeStyles(); const {translate} = useLocalize(); const address = useMemo(() => lodashGet(privatePersonalDetails, 'address') || {}, [privatePersonalDetails]); const countryFromUrl = lodashGet(route, 'params.country'); @@ -117,18 +123,22 @@ function AddressPage({privatePersonalDetails, route}) { shouldShowBackButton onBackButtonPress={() => Navigation.goBack()} /> - + {isLoadingApp ? ( + + ) : ( + + )} ); } @@ -141,4 +151,7 @@ export default withOnyx({ privatePersonalDetails: { key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS, }, + isLoadingApp: { + key: ONYXKEYS.IS_LOADING_APP, + }, })(AddressPage); From 3d31a5e28963a52fb252d4b2c84285366740ad8e Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Wed, 21 Feb 2024 16:42:23 -0800 Subject: [PATCH 06/18] Loading pages --- .../PersonalDetails/DateOfBirthPage.js | 47 ++++++++++++------- src/pages/settings/Profile/ProfilePage.js | 36 +++++++++----- 2 files changed, 53 insertions(+), 30 deletions(-) diff --git a/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js b/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js index ba7db33bb070..b10c768e3df2 100644 --- a/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js +++ b/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js @@ -5,6 +5,7 @@ import {withOnyx} from 'react-native-onyx'; import DatePicker from '@components/DatePicker'; import FormProvider from '@components/Form/FormProvider'; import InputWrapper from '@components/Form/InputWrapper'; +import FullscreenLoadingIndicator from '@components/FullscreenLoadingIndicator'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; @@ -25,6 +26,8 @@ const propTypes = { dob: PropTypes.string, }), + isLoadingApp: PropTypes.bool, + ...withLocalizePropTypes, }; @@ -32,9 +35,10 @@ const defaultProps = { privatePersonalDetails: { dob: '', }, + isLoadingApp: true, }; -function DateOfBirthPage({translate, privatePersonalDetails}) { +function DateOfBirthPage({translate, privatePersonalDetails, isLoadingApp}) { const styles = useThemeStyles(); /** @@ -66,23 +70,27 @@ function DateOfBirthPage({translate, privatePersonalDetails}) { title={translate('common.dob')} onBackButtonPress={() => Navigation.goBack()} /> - - - + {isLoadingApp ? ( + + ) : ( + + + + )} ); } @@ -97,5 +105,8 @@ export default compose( privatePersonalDetails: { key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS, }, + isLoadingApp: { + key: ONYXKEYS.IS_LOADING_APP, + }, }), )(DateOfBirthPage); diff --git a/src/pages/settings/Profile/ProfilePage.js b/src/pages/settings/Profile/ProfilePage.js index 7572db87f4b9..fd8b15404a42 100755 --- a/src/pages/settings/Profile/ProfilePage.js +++ b/src/pages/settings/Profile/ProfilePage.js @@ -4,6 +4,7 @@ import React, {useEffect} from 'react'; import {ScrollView, View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; +import FullscreenLoadingIndicator from '@components/FullscreenLoadingIndicator'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import * as Illustrations from '@components/Icon/Illustrations'; import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; @@ -14,6 +15,8 @@ import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; import compose from '@libs/compose'; import {translatableTextPropTypes} from '@libs/Localize'; import Navigation from '@libs/Navigation/Navigation'; @@ -78,7 +81,9 @@ const defaultProps = { }; function ProfilePage(props) { + const theme = useTheme(); const styles = useThemeStyles(); + const StyleUtils = useStyleUtils(); const getPronouns = () => { let pronounsKey = lodashGet(props.currentUserPersonalDetails, 'pronouns', ''); if (pronounsKey.startsWith(CONST.PRONOUNS.PREFIX)) { @@ -190,18 +195,22 @@ function ProfilePage(props) { childrenStyles={styles.pt3} titleStyles={styles.accountSettingsSectionTitle} > - <> - {_.map(privateOptions, (detail, index) => ( - Navigation.navigate(detail.pageRoute)} - /> - ))} - + {props.isLoadingApp ? ( + + ) : ( + <> + {_.map(privateOptions, (detail, index) => ( + Navigation.navigate(detail.pageRoute)} + /> + ))} + + )} @@ -227,5 +236,8 @@ export default compose( user: { key: ONYXKEYS.USER, }, + isLoadingApp: { + key: ONYXKEYS.IS_LOADING_APP, + }, }), )(ProfilePage); From 26d1f573504218836f360c6b65d19cdf3855007e Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Wed, 21 Feb 2024 16:45:21 -0800 Subject: [PATCH 07/18] prettier --- src/pages/settings/Profile/PersonalDetails/LegalNamePage.js | 1 - src/pages/settings/Profile/ProfilePage.js | 4 ++-- src/types/onyx/PrivatePersonalDetails.ts | 3 --- 3 files changed, 2 insertions(+), 6 deletions(-) diff --git a/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js b/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js index 0bd7f4b70d34..f79882620077 100644 --- a/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js +++ b/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js @@ -21,7 +21,6 @@ import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import INPUT_IDS from '@src/types/form/LegalNameForm'; - const propTypes = { /* Onyx Props */ privatePersonalDetails: PropTypes.shape({ diff --git a/src/pages/settings/Profile/ProfilePage.js b/src/pages/settings/Profile/ProfilePage.js index fd8b15404a42..ed2c47f0ad4b 100755 --- a/src/pages/settings/Profile/ProfilePage.js +++ b/src/pages/settings/Profile/ProfilePage.js @@ -13,10 +13,10 @@ import Section from '@components/Section'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; -import useThemeStyles from '@hooks/useThemeStyles'; -import useWindowDimensions from '@hooks/useWindowDimensions'; import useStyleUtils from '@hooks/useStyleUtils'; import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; +import useWindowDimensions from '@hooks/useWindowDimensions'; import compose from '@libs/compose'; import {translatableTextPropTypes} from '@libs/Localize'; import Navigation from '@libs/Navigation/Navigation'; diff --git a/src/types/onyx/PrivatePersonalDetails.ts b/src/types/onyx/PrivatePersonalDetails.ts index 4d0dedf16ea7..3c0110416404 100644 --- a/src/types/onyx/PrivatePersonalDetails.ts +++ b/src/types/onyx/PrivatePersonalDetails.ts @@ -14,9 +14,6 @@ type PrivatePersonalDetails = { /** User's home address */ address?: Address; - - /** Whether we are loading the data via the API */ - isLoading?: boolean; }; export default PrivatePersonalDetails; From 5b33277fc7c14a597ad173170926a35c447f4ef0 Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Wed, 21 Feb 2024 17:19:57 -0800 Subject: [PATCH 08/18] remove unused function --- src/libs/actions/PersonalDetails.ts | 38 ----------------------------- 1 file changed, 38 deletions(-) diff --git a/src/libs/actions/PersonalDetails.ts b/src/libs/actions/PersonalDetails.ts index 5ae37bb85f10..f976003dea66 100644 --- a/src/libs/actions/PersonalDetails.ts +++ b/src/libs/actions/PersonalDetails.ts @@ -239,43 +239,6 @@ function updateSelectedTimezone(selectedTimezone: SelectedTimezone) { Navigation.goBack(ROUTES.SETTINGS_TIMEZONE); } -/** - * Fetches additional personal data like legal name, date of birth, address - */ -function openPersonalDetails() { - const optimisticData: OnyxUpdate[] = [ - { - onyxMethod: Onyx.METHOD.MERGE, - key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS, - value: { - isLoading: true, - }, - }, - ]; - - const successData: OnyxUpdate[] = [ - { - onyxMethod: Onyx.METHOD.MERGE, - key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS, - value: { - isLoading: false, - }, - }, - ]; - - const failureData: OnyxUpdate[] = [ - { - onyxMethod: Onyx.METHOD.MERGE, - key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS, - value: { - isLoading: false, - }, - }, - ]; - - API.read(READ_COMMANDS.OPEN_PERSONAL_DETAILS, {}, {optimisticData, successData, failureData}); -} - /** * Fetches public profile info about a given user. * The API will only return the accountID, displayName, and avatar for the user @@ -456,7 +419,6 @@ export { clearAvatarErrors, deleteAvatar, getPrivatePersonalDetails, - openPersonalDetails, openPublicProfilePage, updateAddress, updateAutomaticTimezone, From d968e0b8b36d1678ea9fd302e5f09efe5f6619e1 Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Wed, 21 Feb 2024 17:45:47 -0800 Subject: [PATCH 09/18] add default props to profilepage --- src/pages/settings/Profile/ProfilePage.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/pages/settings/Profile/ProfilePage.js b/src/pages/settings/Profile/ProfilePage.js index ed2c47f0ad4b..fe317a1fddc9 100755 --- a/src/pages/settings/Profile/ProfilePage.js +++ b/src/pages/settings/Profile/ProfilePage.js @@ -57,6 +57,8 @@ const propTypes = { }), }), + isLoadingApp: PropTypes.bool, + ...withLocalizePropTypes, ...windowDimensionsPropTypes, ...withCurrentUserPersonalDetailsPropTypes, @@ -78,6 +80,7 @@ const defaultProps = { country: '', }, }, + isLoadingApp: true, }; function ProfilePage(props) { From dd90ad3838c36a0d8fb73f37266007770bcd727b Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Wed, 28 Feb 2024 14:41:04 +0000 Subject: [PATCH 10/18] use hook --- src/hooks/usePrivatePersonalDetails.ts | 20 ++++++++++++ src/libs/actions/PersonalDetails.ts | 38 +++++++++++++++++++++++ src/pages/settings/Profile/ProfilePage.js | 2 ++ 3 files changed, 60 insertions(+) create mode 100644 src/hooks/usePrivatePersonalDetails.ts diff --git a/src/hooks/usePrivatePersonalDetails.ts b/src/hooks/usePrivatePersonalDetails.ts new file mode 100644 index 000000000000..f17600e9878f --- /dev/null +++ b/src/hooks/usePrivatePersonalDetails.ts @@ -0,0 +1,20 @@ +import {useContext, useEffect} from 'react'; +import {NetworkContext} from '@components/OnyxProvider'; +import * as PersonalDetails from '@userActions/PersonalDetails'; + +/** + * Hook for fetching private personal details + */ +export default function usePrivatePersonalDetails() { + const network = useContext(NetworkContext); + + useEffect(() => { + const personalDetails = PersonalDetails.getPrivatePersonalDetails(); + // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing + if (network?.isOffline || (Boolean(personalDetails) && personalDetails?.isLoading !== undefined)) { + return; + } + + PersonalDetails.openPersonalDetails(); + }, [network?.isOffline]); +} diff --git a/src/libs/actions/PersonalDetails.ts b/src/libs/actions/PersonalDetails.ts index f976003dea66..5ae37bb85f10 100644 --- a/src/libs/actions/PersonalDetails.ts +++ b/src/libs/actions/PersonalDetails.ts @@ -239,6 +239,43 @@ function updateSelectedTimezone(selectedTimezone: SelectedTimezone) { Navigation.goBack(ROUTES.SETTINGS_TIMEZONE); } +/** + * Fetches additional personal data like legal name, date of birth, address + */ +function openPersonalDetails() { + const optimisticData: OnyxUpdate[] = [ + { + onyxMethod: Onyx.METHOD.MERGE, + key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS, + value: { + isLoading: true, + }, + }, + ]; + + const successData: OnyxUpdate[] = [ + { + onyxMethod: Onyx.METHOD.MERGE, + key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS, + value: { + isLoading: false, + }, + }, + ]; + + const failureData: OnyxUpdate[] = [ + { + onyxMethod: Onyx.METHOD.MERGE, + key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS, + value: { + isLoading: false, + }, + }, + ]; + + API.read(READ_COMMANDS.OPEN_PERSONAL_DETAILS, {}, {optimisticData, successData, failureData}); +} + /** * Fetches public profile info about a given user. * The API will only return the accountID, displayName, and avatar for the user @@ -419,6 +456,7 @@ export { clearAvatarErrors, deleteAvatar, getPrivatePersonalDetails, + openPersonalDetails, openPublicProfilePage, updateAddress, updateAutomaticTimezone, diff --git a/src/pages/settings/Profile/ProfilePage.js b/src/pages/settings/Profile/ProfilePage.js index fe317a1fddc9..e0b4edaa205d 100755 --- a/src/pages/settings/Profile/ProfilePage.js +++ b/src/pages/settings/Profile/ProfilePage.js @@ -17,6 +17,7 @@ import useStyleUtils from '@hooks/useStyleUtils'; import useTheme from '@hooks/useTheme'; import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; +import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; import compose from '@libs/compose'; import {translatableTextPropTypes} from '@libs/Localize'; import Navigation from '@libs/Navigation/Navigation'; @@ -87,6 +88,7 @@ function ProfilePage(props) { const theme = useTheme(); const styles = useThemeStyles(); const StyleUtils = useStyleUtils(); + usePrivatePersonalDetails(); const getPronouns = () => { let pronounsKey = lodashGet(props.currentUserPersonalDetails, 'pronouns', ''); if (pronounsKey.startsWith(CONST.PRONOUNS.PREFIX)) { From 96a20faf40ed3bbb852e3e19f2052df2b6f74daf Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Mon, 4 Mar 2024 11:58:28 +0000 Subject: [PATCH 11/18] remove weird merge file creation --- src/pages/settings/Profile/PersonalDetails/LegalNamePage.js | 0 1 file changed, 0 insertions(+), 0 deletions(-) delete mode 100644 src/pages/settings/Profile/PersonalDetails/LegalNamePage.js diff --git a/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js b/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js deleted file mode 100644 index e69de29bb2d1..000000000000 From cc9b06a2811369be4d5754c5e0b6a9d739f29708 Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Mon, 4 Mar 2024 12:02:14 +0000 Subject: [PATCH 12/18] Clean up --- src/pages/ProfilePage.js | 2 -- src/pages/settings/Profile/ProfilePage.js | 4 ++-- src/pages/settings/Wallet/WalletPage/CardDetails.tsx | 4 ++-- 3 files changed, 4 insertions(+), 6 deletions(-) diff --git a/src/pages/ProfilePage.js b/src/pages/ProfilePage.js index 80d5515d45d3..cf05b8e4ab28 100755 --- a/src/pages/ProfilePage.js +++ b/src/pages/ProfilePage.js @@ -20,7 +20,6 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import UserDetailsTooltip from '@components/UserDetailsTooltip'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; @@ -94,7 +93,6 @@ const getPhoneNumber = (details) => { }; function ProfilePage(props) { - usePrivatePersonalDetails(); const styles = useThemeStyles(); const accountID = Number(lodashGet(props.route.params, 'accountID', 0)); const isCurrentUser = props.session.accountID === accountID; diff --git a/src/pages/settings/Profile/ProfilePage.js b/src/pages/settings/Profile/ProfilePage.js index 81fca0fab16c..34a1e15df15f 100755 --- a/src/pages/settings/Profile/ProfilePage.js +++ b/src/pages/settings/Profile/ProfilePage.js @@ -14,11 +14,11 @@ import Section from '@components/Section'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; +import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; import useStyleUtils from '@hooks/useStyleUtils'; import useTheme from '@hooks/useTheme'; import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; -import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; import compose from '@libs/compose'; import {translatableTextPropTypes} from '@libs/Localize'; import Navigation from '@libs/Navigation/Navigation'; @@ -89,7 +89,6 @@ function ProfilePage(props) { const theme = useTheme(); const styles = useThemeStyles(); const StyleUtils = useStyleUtils(); - usePrivatePersonalDetails(); const getPronouns = () => { let pronounsKey = lodashGet(props.currentUserPersonalDetails, 'pronouns', ''); if (pronounsKey.startsWith(CONST.PRONOUNS.PREFIX)) { @@ -105,6 +104,7 @@ function ProfilePage(props) { const contactMethodBrickRoadIndicator = UserUtils.getLoginListBrickRoadIndicator(props.loginList); const emojiCode = lodashGet(props, 'currentUserPersonalDetails.status.emojiCode', ''); const {isSmallScreenWidth} = useWindowDimensions(); + usePrivatePersonalDetails(); const privateDetails = props.privatePersonalDetails || {}; const legalName = `${privateDetails.legalFirstName || ''} ${privateDetails.legalLastName || ''}`.trim(); diff --git a/src/pages/settings/Wallet/WalletPage/CardDetails.tsx b/src/pages/settings/Wallet/WalletPage/CardDetails.tsx index d5645e5f379f..77458384c214 100644 --- a/src/pages/settings/Wallet/WalletPage/CardDetails.tsx +++ b/src/pages/settings/Wallet/WalletPage/CardDetails.tsx @@ -7,8 +7,8 @@ import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; import PressableWithDelayToggle from '@components/Pressable/PressableWithDelayToggle'; import TextLink from '@components/TextLink'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@hooks/useThemeStyles'; import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; +import useThemeStyles from '@hooks/useThemeStyles'; import Clipboard from '@libs/Clipboard'; import Navigation from '@libs/Navigation/Navigation'; import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils'; @@ -47,8 +47,8 @@ type CardDetailsProps = CardDetailsOnyxProps & { function CardDetails({pan = '', expiration = '', cvv = '', privatePersonalDetails, domain}: CardDetailsProps) { const styles = useThemeStyles(); - const {translate} = useLocalize(); usePrivatePersonalDetails(); + const {translate} = useLocalize(); const handleCopyToClipboard = () => { Clipboard.setString(pan); From c79637c6d47fb09b0eaa230954ebb59be5859ff5 Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Mon, 4 Mar 2024 12:40:26 +0000 Subject: [PATCH 13/18] leave TS type --- src/types/onyx/PrivatePersonalDetails.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/types/onyx/PrivatePersonalDetails.ts b/src/types/onyx/PrivatePersonalDetails.ts index 7219bcaf4f84..5a9dae0a5523 100644 --- a/src/types/onyx/PrivatePersonalDetails.ts +++ b/src/types/onyx/PrivatePersonalDetails.ts @@ -18,6 +18,9 @@ type PrivatePersonalDetails = { /** User's home address */ address?: Address; + + /** Whether we are loading the data via the API */ + isLoading?: boolean; }; export default PrivatePersonalDetails; From 1bd4b0a9dd0a9598f7110af0707a18c4b7c1f851 Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Tue, 5 Mar 2024 15:47:59 +0000 Subject: [PATCH 14/18] remove hook and calls to to get private personal details --- src/hooks/usePrivatePersonalDetails.ts | 20 ------------------- src/libs/actions/PersonalDetails.ts | 7 ------- .../Profile/PersonalDetails/AddressPage.tsx | 2 -- .../PersonalDetails/DateOfBirthPage.tsx | 2 -- .../Profile/PersonalDetails/LegalNamePage.tsx | 2 -- src/pages/settings/Profile/ProfilePage.js | 2 -- .../Wallet/WalletPage/CardDetails.tsx | 2 -- 7 files changed, 37 deletions(-) delete mode 100644 src/hooks/usePrivatePersonalDetails.ts diff --git a/src/hooks/usePrivatePersonalDetails.ts b/src/hooks/usePrivatePersonalDetails.ts deleted file mode 100644 index f17600e9878f..000000000000 --- a/src/hooks/usePrivatePersonalDetails.ts +++ /dev/null @@ -1,20 +0,0 @@ -import {useContext, useEffect} from 'react'; -import {NetworkContext} from '@components/OnyxProvider'; -import * as PersonalDetails from '@userActions/PersonalDetails'; - -/** - * Hook for fetching private personal details - */ -export default function usePrivatePersonalDetails() { - const network = useContext(NetworkContext); - - useEffect(() => { - const personalDetails = PersonalDetails.getPrivatePersonalDetails(); - // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing - if (network?.isOffline || (Boolean(personalDetails) && personalDetails?.isLoading !== undefined)) { - return; - } - - PersonalDetails.openPersonalDetails(); - }, [network?.isOffline]); -} diff --git a/src/libs/actions/PersonalDetails.ts b/src/libs/actions/PersonalDetails.ts index 5becaee1593c..1396ac17f047 100644 --- a/src/libs/actions/PersonalDetails.ts +++ b/src/libs/actions/PersonalDetails.ts @@ -446,17 +446,10 @@ function clearAvatarErrors() { }); } -/** - * Get private personal details value - */ -function getPrivatePersonalDetails(): OnyxEntry { - return privatePersonalDetails; -} export { clearAvatarErrors, deleteAvatar, - getPrivatePersonalDetails, openPersonalDetails, openPublicProfilePage, updateAddress, diff --git a/src/pages/settings/Profile/PersonalDetails/AddressPage.tsx b/src/pages/settings/Profile/PersonalDetails/AddressPage.tsx index 5552f1dd3b15..78ee6f969355 100644 --- a/src/pages/settings/Profile/PersonalDetails/AddressPage.tsx +++ b/src/pages/settings/Profile/PersonalDetails/AddressPage.tsx @@ -7,7 +7,6 @@ import FullscreenLoadingIndicator from '@components/FullscreenLoadingIndicator'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import useLocalize from '@hooks/useLocalize'; -import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; import type {SettingsNavigatorParamList} from '@libs/Navigation/types'; @@ -45,7 +44,6 @@ function updateAddress(values: FormOnyxValues privatePersonalDetails?.address, [privatePersonalDetails]); const countryFromUrl = route.params?.country; diff --git a/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.tsx b/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.tsx index 34f351982416..e91093731c03 100644 --- a/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.tsx +++ b/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.tsx @@ -10,7 +10,6 @@ import FullscreenLoadingIndicator from '@components/FullscreenLoadingIndicator'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import useLocalize from '@hooks/useLocalize'; -import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; @@ -31,7 +30,6 @@ type DateOfBirthPageProps = DateOfBirthPageOnyxProps; function DateOfBirthPage({privatePersonalDetails, isLoadingApp = true}: DateOfBirthPageProps) { const {translate} = useLocalize(); const styles = useThemeStyles(); - usePrivatePersonalDetails(); /** * @returns An object containing the errors for each inputID diff --git a/src/pages/settings/Profile/PersonalDetails/LegalNamePage.tsx b/src/pages/settings/Profile/PersonalDetails/LegalNamePage.tsx index 776524b6794d..a957740e81d0 100644 --- a/src/pages/settings/Profile/PersonalDetails/LegalNamePage.tsx +++ b/src/pages/settings/Profile/PersonalDetails/LegalNamePage.tsx @@ -10,7 +10,6 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import TextInput from '@components/TextInput'; import useLocalize from '@hooks/useLocalize'; -import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; import useThemeStyles from '@hooks/useThemeStyles'; import * as ErrorUtils from '@libs/ErrorUtils'; import Navigation from '@libs/Navigation/Navigation'; @@ -38,7 +37,6 @@ const updateLegalName = (values: PrivatePersonalDetails) => { function LegalNamePage({privatePersonalDetails, isLoadingApp = true}: LegalNamePageProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); - usePrivatePersonalDetails(); const legalFirstName = privatePersonalDetails?.legalFirstName ?? ''; const legalLastName = privatePersonalDetails?.legalLastName ?? ''; diff --git a/src/pages/settings/Profile/ProfilePage.js b/src/pages/settings/Profile/ProfilePage.js index 34a1e15df15f..982123dc4d6c 100755 --- a/src/pages/settings/Profile/ProfilePage.js +++ b/src/pages/settings/Profile/ProfilePage.js @@ -14,7 +14,6 @@ import Section from '@components/Section'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; -import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; import useStyleUtils from '@hooks/useStyleUtils'; import useTheme from '@hooks/useTheme'; import useThemeStyles from '@hooks/useThemeStyles'; @@ -104,7 +103,6 @@ function ProfilePage(props) { const contactMethodBrickRoadIndicator = UserUtils.getLoginListBrickRoadIndicator(props.loginList); const emojiCode = lodashGet(props, 'currentUserPersonalDetails.status.emojiCode', ''); const {isSmallScreenWidth} = useWindowDimensions(); - usePrivatePersonalDetails(); const privateDetails = props.privatePersonalDetails || {}; const legalName = `${privateDetails.legalFirstName || ''} ${privateDetails.legalLastName || ''}`.trim(); diff --git a/src/pages/settings/Wallet/WalletPage/CardDetails.tsx b/src/pages/settings/Wallet/WalletPage/CardDetails.tsx index 77458384c214..4cce60cfa5c0 100644 --- a/src/pages/settings/Wallet/WalletPage/CardDetails.tsx +++ b/src/pages/settings/Wallet/WalletPage/CardDetails.tsx @@ -7,7 +7,6 @@ import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; import PressableWithDelayToggle from '@components/Pressable/PressableWithDelayToggle'; import TextLink from '@components/TextLink'; import useLocalize from '@hooks/useLocalize'; -import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; import useThemeStyles from '@hooks/useThemeStyles'; import Clipboard from '@libs/Clipboard'; import Navigation from '@libs/Navigation/Navigation'; @@ -47,7 +46,6 @@ type CardDetailsProps = CardDetailsOnyxProps & { function CardDetails({pan = '', expiration = '', cvv = '', privatePersonalDetails, domain}: CardDetailsProps) { const styles = useThemeStyles(); - usePrivatePersonalDetails(); const {translate} = useLocalize(); const handleCopyToClipboard = () => { From d6f6d2f7ba087f98f829e63b0bbc1660e3f8aa9e Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Thu, 7 Mar 2024 09:55:13 +0000 Subject: [PATCH 15/18] lint --- src/libs/actions/PersonalDetails.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/libs/actions/PersonalDetails.ts b/src/libs/actions/PersonalDetails.ts index 1396ac17f047..d08f3787942e 100644 --- a/src/libs/actions/PersonalDetails.ts +++ b/src/libs/actions/PersonalDetails.ts @@ -446,7 +446,6 @@ function clearAvatarErrors() { }); } - export { clearAvatarErrors, deleteAvatar, From 970229ab40d46d19fc801b1a07cf3772282716fb Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Mon, 11 Mar 2024 14:40:38 +0000 Subject: [PATCH 16/18] fix lint --- src/libs/actions/PersonalDetails.ts | 6 ------ 1 file changed, 6 deletions(-) diff --git a/src/libs/actions/PersonalDetails.ts b/src/libs/actions/PersonalDetails.ts index d08f3787942e..6ebdd778e9b8 100644 --- a/src/libs/actions/PersonalDetails.ts +++ b/src/libs/actions/PersonalDetails.ts @@ -43,12 +43,6 @@ Onyx.connect({ callback: (val) => (allPersonalDetails = val), }); -let privatePersonalDetails: OnyxEntry = null; -Onyx.connect({ - key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS, - callback: (val) => (privatePersonalDetails = val), -}); - function updatePronouns(pronouns: string) { if (currentUserAccountID) { const parameters: UpdatePronounsParams = {pronouns}; From b3bc58956f7d5a5f9ca4d03cc86b8aeb7129d6fe Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Mon, 11 Mar 2024 15:43:05 +0000 Subject: [PATCH 17/18] TS error --- src/libs/actions/PersonalDetails.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/libs/actions/PersonalDetails.ts b/src/libs/actions/PersonalDetails.ts index 6ebdd778e9b8..d91fea3543d0 100644 --- a/src/libs/actions/PersonalDetails.ts +++ b/src/libs/actions/PersonalDetails.ts @@ -23,7 +23,7 @@ import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type {DateOfBirthForm} from '@src/types/form'; -import type {PersonalDetails, PersonalDetailsList, PrivatePersonalDetails} from '@src/types/onyx'; +import type {PersonalDetails, PersonalDetailsList} from '@src/types/onyx'; import type {SelectedTimezone, Timezone} from '@src/types/onyx/PersonalDetails'; import * as Session from './Session'; From bfd8fb9835bc06c5a59ad9b0cf7152e2fc4ef461 Mon Sep 17 00:00:00 2001 From: Georgia Monahan Date: Fri, 5 Apr 2024 09:07:26 +0100 Subject: [PATCH 18/18] remove openPersonalDetails, update test to call openPublicProfilePage instead --- src/libs/actions/PersonalDetails.ts | 38 ------------------------ src/types/onyx/PrivatePersonalDetails.ts | 3 -- tests/unit/NetworkTest.ts | 20 ++++++------- 3 files changed, 10 insertions(+), 51 deletions(-) diff --git a/src/libs/actions/PersonalDetails.ts b/src/libs/actions/PersonalDetails.ts index 589ac583020f..60aff19223bc 100644 --- a/src/libs/actions/PersonalDetails.ts +++ b/src/libs/actions/PersonalDetails.ts @@ -234,43 +234,6 @@ function updateSelectedTimezone(selectedTimezone: SelectedTimezone) { Navigation.goBack(ROUTES.SETTINGS_TIMEZONE); } -/** - * Fetches additional personal data like legal name, date of birth, address - */ -function openPersonalDetails() { - const optimisticData: OnyxUpdate[] = [ - { - onyxMethod: Onyx.METHOD.MERGE, - key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS, - value: { - isLoading: true, - }, - }, - ]; - - const successData: OnyxUpdate[] = [ - { - onyxMethod: Onyx.METHOD.MERGE, - key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS, - value: { - isLoading: false, - }, - }, - ]; - - const failureData: OnyxUpdate[] = [ - { - onyxMethod: Onyx.METHOD.MERGE, - key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS, - value: { - isLoading: false, - }, - }, - ]; - - API.read(READ_COMMANDS.OPEN_PERSONAL_DETAILS, {}, {optimisticData, successData, failureData}); -} - /** * Fetches public profile info about a given user. * The API will only return the accountID, displayName, and avatar for the user @@ -443,7 +406,6 @@ function clearAvatarErrors() { export { clearAvatarErrors, deleteAvatar, - openPersonalDetails, openPublicProfilePage, updateAddress, updateAutomaticTimezone, diff --git a/src/types/onyx/PrivatePersonalDetails.ts b/src/types/onyx/PrivatePersonalDetails.ts index 68199cf16e6e..3f0014bc96ff 100644 --- a/src/types/onyx/PrivatePersonalDetails.ts +++ b/src/types/onyx/PrivatePersonalDetails.ts @@ -20,9 +20,6 @@ type PrivatePersonalDetails = { /** User's home address */ address?: Address; - - /** Whether we are loading the data via the API */ - isLoading?: boolean; }; export default PrivatePersonalDetails; diff --git a/tests/unit/NetworkTest.ts b/tests/unit/NetworkTest.ts index 63b275a1a6b6..01689de89037 100644 --- a/tests/unit/NetworkTest.ts +++ b/tests/unit/NetworkTest.ts @@ -108,7 +108,7 @@ describe('NetworkTests', () => { HttpUtils.xhr = mockedXhr; // This should first trigger re-authentication and then a Failed to fetch - PersonalDetails.openPersonalDetails(); + PersonalDetails.openPublicProfilePage(TEST_USER_ACCOUNT_ID); return waitForBatchedUpdates() .then(() => Onyx.set(ONYXKEYS.NETWORK, {isOffline: false})) .then(() => { @@ -119,11 +119,11 @@ describe('NetworkTests', () => { return waitForBatchedUpdates(); }) .then(() => { - // Then we will eventually have 1 call to OpenPersonalDetailsPage and 1 calls to Authenticate - const callsToOpenPersonalDetails = (HttpUtils.xhr as Mock).mock.calls.filter(([command]) => command === 'OpenPersonalDetailsPage'); + // Then we will eventually have 1 call to OpenPublicProfilePage and 1 calls to Authenticate + const callsToOpenPublicProfilePage = (HttpUtils.xhr as Mock).mock.calls.filter(([command]) => command === 'OpenPublicProfilePage'); const callsToAuthenticate = (HttpUtils.xhr as Mock).mock.calls.filter(([command]) => command === 'Authenticate'); - expect(callsToOpenPersonalDetails.length).toBe(1); + expect(callsToOpenPublicProfilePage.length).toBe(1); expect(callsToAuthenticate.length).toBe(1); }); }); @@ -143,7 +143,7 @@ describe('NetworkTests', () => { const mockedXhr = jest.fn(); mockedXhr - // And mock the first call to openPersonalDetails return with an expired session code + // And mock the first call to openPublicProfilePage return with an expired session code .mockImplementationOnce(() => Promise.resolve({ jsonCode: CONST.JSON_CODE.NOT_AUTHENTICATED, @@ -176,17 +176,17 @@ describe('NetworkTests', () => { // And then make 3 API READ requests in quick succession with an expired authToken and handle the response // It doesn't matter which requests these are really as all the response is mocked we just want to see // that we get re-authenticated - PersonalDetails.openPersonalDetails(); - PersonalDetails.openPersonalDetails(); - PersonalDetails.openPersonalDetails(); + PersonalDetails.openPublicProfilePage(TEST_USER_ACCOUNT_ID); + PersonalDetails.openPublicProfilePage(TEST_USER_ACCOUNT_ID); + PersonalDetails.openPublicProfilePage(TEST_USER_ACCOUNT_ID); return waitForBatchedUpdates(); }) .then(() => { // We should expect to see the three calls to OpenApp, but only one call to Authenticate. // And we should also see the reconnection callbacks triggered. - const callsToOpenPersonalDetails = (HttpUtils.xhr as Mock).mock.calls.filter(([command]) => command === 'OpenPersonalDetailsPage'); + const callsToopenPublicProfilePage = (HttpUtils.xhr as Mock).mock.calls.filter(([command]) => command === 'OpenPublicProfilePage'); const callsToAuthenticate = (HttpUtils.xhr as Mock).mock.calls.filter(([command]) => command === 'Authenticate'); - expect(callsToOpenPersonalDetails.length).toBe(3); + expect(callsToopenPublicProfilePage.length).toBe(3); expect(callsToAuthenticate.length).toBe(1); expect(reconnectionCallbacksSpy.mock.calls.length).toBe(3); });