[Due for payment 2025-07-25] [$250] Remove remaining withOnyx HOCs from the project | Batch 7

[fabioh8010]

Parent issue: #64225

Let's refactor the following files to use useOnyx instead of withOnyx. All the work must be done in one PR.

After refactor please test them extensively and provide test steps in your PR. In case of questions please ask in #expensify-open-source channel.

• src/pages/EnablePayments/EnablePaymentsPage.tsx
• src/pages/EnablePayments/OnfidoPrivacy.tsx
• src/pages/EnablePayments/OnfidoStep.tsx
• src/pages/EnablePayments/AddBankAccount/substeps/ConfirmationStep.tsx

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021944840359649772614
• Upwork Job ID: 1944840359649772614
• Last Price Increase: 2025-07-14
• Automatic offers:
• linhvovan29546 | Contributor | 108043543

[linhvovan29546]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Let's refactor the following files to use useOnyx instead of withOnyx

What is the root cause of that problem?

Improvement

What changes do you think we should make in order to solve the problem?

Remove withOnyx from these components as described in the OP and replace it with the useOnyx hook.
For example remove this HOC

App/src/pages/EnablePayments/EnablePaymentsPage.tsx

Line 95 in d9fe9ee

export default withOnyx<EnablePaymentsPageProps, EnablePaymentsPageOnyxProps>({

The update

App/src/pages/EnablePayments/EnablePaymentsPage.tsx

Line 33 in d9fe9ee

    const [userWallet] = useOnyx(ONYXKEYS.USER_WALLET, {initWithStoredValues: false, canBeMissing: true});
    

Apply similar updates to the remaining components.

App/src/pages/EnablePayments/OnfidoPrivacy.tsx

Line 38 in d9fe9ee

function OnfidoPrivacy({walletOnfidoData = DEFAULT_WALLET_ONFIDO_DATA}: OnfidoPrivacyProps) {

        const [walletOnfidoData=DEFAULT_WALLET_ONFIDO_DATA] = useOnyx(ONYXKEYS.WALLET_ONFIDO, {initWithStoredValues: false});

App/src/pages/EnablePayments/OnfidoStep.tsx

Line 32 in d9fe9ee

        const [walletOnfidoData=DEFAULT_WALLET_ONFIDO_DATA] = useOnyx(ONYXKEYS.WALLET_ONFIDO, {initWithStoredValues: false});

App/src/pages/EnablePayments/AddBankAccount/substeps/ConfirmationStep.tsx

Line 38 in d9fe9ee

    const [personalBankAccountDraft] = useOnyx(ONYXKEYS.FORMS.PERSONAL_BANK_ACCOUNT_FORM_DRAFT,{canBeMissing: true});
    const [personalBankAccount] = useOnyx(ONYXKEYS.PERSONAL_BANK_ACCOUNT,{canBeMissing: true});
   // We are not using userWallet, so it can be removed.
    const [userWallet] = useOnyx(ONYXKEYS.USER_WALLET,{canBeMissing: true});

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

This is just an improvement, so no tests are necessary.

What alternative solutions did you explore? (Optional)

N/A

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~021944840359649772614

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @allroundexperts (External)

[melvin-bot]

📣 @linhvovan29546 🎉 An offer has been automatically sent to your Upwork account for the Contributor role 🎉 Thanks for contributing to the Expensify app!

Offer link
Upwork job
Please accept the offer and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻
Keep in mind: Code of Conduct | Contributing 📖