From 44b2f77bf8da76724c22d7e54cc1c220fa6bc798 Mon Sep 17 00:00:00 2001 From: Sachin Chavda Date: Thu, 21 Nov 2024 15:54:36 +0530 Subject: [PATCH 1/2] Onyx Migration For #50796 --- .../PersonalDetails/DateOfBirthPage.tsx | 25 ++++-------------- .../Profile/PersonalDetails/LegalNamePage.tsx | 26 +++++-------------- .../settings/Security/CloseAccountPage.tsx | 22 +++------------- 3 files changed, 14 insertions(+), 59 deletions(-) diff --git a/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.tsx b/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.tsx index e91093731c03..07d65c710429 100644 --- a/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.tsx +++ b/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.tsx @@ -1,7 +1,6 @@ import {subYears} from 'date-fns'; import React, {useCallback} from 'react'; -import type {OnyxEntry} from 'react-native-onyx'; -import {withOnyx} from 'react-native-onyx'; +import {useOnyx} from 'react-native-onyx'; import DatePicker from '@components/DatePicker'; import FormProvider from '@components/Form/FormProvider'; import InputWrapper from '@components/Form/InputWrapper'; @@ -17,17 +16,10 @@ import * as PersonalDetails from '@userActions/PersonalDetails'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import INPUT_IDS from '@src/types/form/DateOfBirthForm'; -import type {PrivatePersonalDetails} from '@src/types/onyx'; -type DateOfBirthPageOnyxProps = { - /** User's private personal details */ - privatePersonalDetails: OnyxEntry; - /** Whether app is loading */ - isLoadingApp: OnyxEntry; -}; -type DateOfBirthPageProps = DateOfBirthPageOnyxProps; - -function DateOfBirthPage({privatePersonalDetails, isLoadingApp = true}: DateOfBirthPageProps) { +function DateOfBirthPage() { + const [privatePersonalDetails] = useOnyx(ONYXKEYS.PRIVATE_PERSONAL_DETAILS); + const [isLoadingApp] = useOnyx(ONYXKEYS.IS_LOADING_APP, {initialValue: true}); const {translate} = useLocalize(); const styles = useThemeStyles(); @@ -85,11 +77,4 @@ function DateOfBirthPage({privatePersonalDetails, isLoadingApp = true}: DateOfBi DateOfBirthPage.displayName = 'DateOfBirthPage'; -export default withOnyx({ - privatePersonalDetails: { - key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS, - }, - isLoadingApp: { - key: ONYXKEYS.IS_LOADING_APP, - }, -})(DateOfBirthPage); +export default DateOfBirthPage; diff --git a/src/pages/settings/Profile/PersonalDetails/LegalNamePage.tsx b/src/pages/settings/Profile/PersonalDetails/LegalNamePage.tsx index 99e9c910cbdf..505ee55a1ec5 100644 --- a/src/pages/settings/Profile/PersonalDetails/LegalNamePage.tsx +++ b/src/pages/settings/Profile/PersonalDetails/LegalNamePage.tsx @@ -1,7 +1,6 @@ import React, {useCallback} from 'react'; import {View} from 'react-native'; -import type {OnyxEntry} from 'react-native-onyx'; -import {withOnyx} from 'react-native-onyx'; +import {useOnyx} from 'react-native-onyx'; import FormProvider from '@components/Form/FormProvider'; import InputWrapper from '@components/Form/InputWrapper'; import type {FormOnyxValues} from '@components/Form/types'; @@ -21,20 +20,14 @@ import INPUT_IDS from '@src/types/form/LegalNameForm'; import type {PrivatePersonalDetails} from '@src/types/onyx'; import type {Errors} from '@src/types/onyx/OnyxCommon'; -type LegalNamePageOnyxProps = { - /** User's private personal details */ - privatePersonalDetails: OnyxEntry; - /** Whether app is loading */ - isLoadingApp: OnyxEntry; -}; - -type LegalNamePageProps = LegalNamePageOnyxProps; - const updateLegalName = (values: PrivatePersonalDetails) => { PersonalDetails.updateLegalName(values.legalFirstName?.trim() ?? '', values.legalLastName?.trim() ?? ''); }; -function LegalNamePage({privatePersonalDetails, isLoadingApp = true}: LegalNamePageProps) { +function LegalNamePage() { + const [privatePersonalDetails] = useOnyx(ONYXKEYS.PRIVATE_PERSONAL_DETAILS); + const [isLoadingApp] = useOnyx(ONYXKEYS.IS_LOADING_APP, {initialValue: true}); + const styles = useThemeStyles(); const {translate} = useLocalize(); const legalFirstName = privatePersonalDetails?.legalFirstName ?? ''; @@ -136,11 +129,4 @@ function LegalNamePage({privatePersonalDetails, isLoadingApp = true}: LegalNameP LegalNamePage.displayName = 'LegalNamePage'; -export default withOnyx({ - privatePersonalDetails: { - key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS, - }, - isLoadingApp: { - key: ONYXKEYS.IS_LOADING_APP, - }, -})(LegalNamePage); +export default LegalNamePage; diff --git a/src/pages/settings/Security/CloseAccountPage.tsx b/src/pages/settings/Security/CloseAccountPage.tsx index 1da4436ca810..ef2829b05d6d 100644 --- a/src/pages/settings/Security/CloseAccountPage.tsx +++ b/src/pages/settings/Security/CloseAccountPage.tsx @@ -1,9 +1,7 @@ -import type {StackScreenProps} from '@react-navigation/stack'; import {Str} from 'expensify-common'; import React, {useEffect, useState} from 'react'; import {View} from 'react-native'; -import {withOnyx} from 'react-native-onyx'; -import type {OnyxEntry} from 'react-native-onyx'; +import {useOnyx} from 'react-native-onyx'; import ConfirmModal from '@components/ConfirmModal'; import FormProvider from '@components/Form/FormProvider'; import InputWrapper from '@components/Form/InputWrapper'; @@ -16,24 +14,16 @@ import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; -import type {SettingsNavigatorParamList} from '@navigation/types'; import variables from '@styles/variables'; import * as CloseAccount from '@userActions/CloseAccount'; import * as User from '@userActions/User'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; -import type SCREENS from '@src/SCREENS'; import INPUT_IDS from '@src/types/form/CloseAccountForm'; -import type {Session} from '@src/types/onyx'; -type CloseAccountPageOnyxProps = { - /** Session of currently logged in user */ - session: OnyxEntry; -}; +function CloseAccountPage() { + const [session] = useOnyx(ONYXKEYS.SESSION); -type CloseAccountPageProps = CloseAccountPageOnyxProps & StackScreenProps; - -function CloseAccountPage({session}: CloseAccountPageProps) { const styles = useThemeStyles(); const {translate, formatPhoneNumber} = useLocalize(); @@ -141,9 +131,3 @@ function CloseAccountPage({session}: CloseAccountPageProps) { } CloseAccountPage.displayName = 'CloseAccountPage'; - -export default withOnyx({ - session: { - key: ONYXKEYS.SESSION, - }, -})(CloseAccountPage); From 8f69f9a2aa2b023617627d467a939f22000d0634 Mon Sep 17 00:00:00 2001 From: Sachin Chavda Date: Thu, 21 Nov 2024 16:12:55 +0530 Subject: [PATCH 2/2] Correction --- src/pages/settings/Security/CloseAccountPage.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/pages/settings/Security/CloseAccountPage.tsx b/src/pages/settings/Security/CloseAccountPage.tsx index ef2829b05d6d..6036512df169 100644 --- a/src/pages/settings/Security/CloseAccountPage.tsx +++ b/src/pages/settings/Security/CloseAccountPage.tsx @@ -131,3 +131,5 @@ function CloseAccountPage() { } CloseAccountPage.displayName = 'CloseAccountPage'; + +export default CloseAccountPage;