diff --git a/src/libs/WorkspacesSettingsUtils.ts b/src/libs/WorkspacesSettingsUtils.ts index 00e8a96e56b4..30820fc0c48b 100644 --- a/src/libs/WorkspacesSettingsUtils.ts +++ b/src/libs/WorkspacesSettingsUtils.ts @@ -247,7 +247,7 @@ function getOwnershipChecksDisplayText( title = translate('workspace.changeOwner.ownerOwesAmountTitle'); text = translate('workspace.changeOwner.ownerOwesAmountText', { email: ownerOwesAmount?.ownerEmail, - amount: CurrencyUtils.convertAmountToDisplayString(ownerOwesAmount?.amount, ownerOwesAmount?.currency), + amount: CurrencyUtils.convertToDisplayString(ownerOwesAmount?.amount, ownerOwesAmount?.currency), }); buttonText = translate('workspace.changeOwner.ownerOwesAmountButtonText'); break; diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts index 9e6a50f3f7d6..f773c28d43f2 100644 --- a/src/libs/actions/Policy.ts +++ b/src/libs/actions/Policy.ts @@ -1131,6 +1131,8 @@ function addBillingCardAndRequestPolicyOwnerChange( value: { errorFields: null, isLoading: true, + isChangeOwnerSuccessful: false, + isChangeOwnerFailed: false, }, }, ]; @@ -1141,6 +1143,8 @@ function addBillingCardAndRequestPolicyOwnerChange( key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`, value: { isLoading: false, + isChangeOwnerSuccessful: true, + isChangeOwnerFailed: false, }, }, ]; @@ -1151,6 +1155,8 @@ function addBillingCardAndRequestPolicyOwnerChange( key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`, value: { isLoading: false, + isChangeOwnerSuccessful: false, + isChangeOwnerFailed: true, }, }, ]; diff --git a/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx b/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx index fea6457824da..83bc3a1d1b4d 100644 --- a/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx +++ b/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx @@ -1,4 +1,4 @@ -import React, {useCallback} from 'react'; +import React, {useCallback, useEffect, useState} from 'react'; import type {OnyxEntry} from 'react-native-onyx'; import {withOnyx} from 'react-native-onyx'; import type {ValueOf} from 'type-fest'; @@ -33,9 +33,33 @@ type WorkspaceOwnerChangeCheckProps = WorkspaceOwnerChangeCheckOnyxProps & { function WorkspaceOwnerChangeCheck({personalDetails, policy, accountID, error}: WorkspaceOwnerChangeCheckProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); + const [displayTexts, setDisplayTexts] = useState({ + title: '', + text: '', + buttonText: '', + }); const policyID = policy?.id ?? ''; + const updateDisplayTexts = useCallback(() => { + const changeOwnerErrors = Object.keys(policy?.errorFields?.changeOwner ?? {}); + if (error !== changeOwnerErrors[0]) { + return; + } + + const texts = WorkspaceSettingsUtils.getOwnershipChecksDisplayText(error, translate, policy, personalDetails?.[accountID]?.login); + setDisplayTexts(texts); + }, [accountID, error, personalDetails, policy, translate]); + + useEffect(() => { + updateDisplayTexts(); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, []); + + useEffect(() => { + updateDisplayTexts(); + }, [updateDisplayTexts]); + const confirm = useCallback(() => { if (error === CONST.POLICY.OWNERSHIP_ERRORS.HAS_FAILED_SETTLEMENTS || error === CONST.POLICY.OWNERSHIP_ERRORS.FAILED_TO_CLEAR_BALANCE) { // cannot transfer ownership if there are failed settlements, or we cannot clear the balance @@ -47,17 +71,15 @@ function WorkspaceOwnerChangeCheck({personalDetails, policy, accountID, error}: PolicyActions.requestWorkspaceOwnerChange(policyID); }, [accountID, error, policyID]); - const {title, text, buttonText} = WorkspaceSettingsUtils.getOwnershipChecksDisplayText(error, translate, policy, personalDetails?.[accountID]?.login); - return ( <> - {title} - {text} + {displayTexts.title} + {displayTexts.text}