From 64ee851eba5d64406233e138e5d9cb214be2465a Mon Sep 17 00:00:00 2001 From: Linh Date: Tue, 15 Jul 2025 08:52:37 +0700 Subject: [PATCH 1/5] chore: remove withOnyx HOCs batch 2 --- src/pages/workspace/WorkspaceAvatar.tsx | 25 ++++++------------- .../members/WorkspaceOwnerChangeCheck.tsx | 21 ++++++---------- 2 files changed, 14 insertions(+), 32 deletions(-) diff --git a/src/pages/workspace/WorkspaceAvatar.tsx b/src/pages/workspace/WorkspaceAvatar.tsx index 3b4fd7b7a51f..760c0712d0d7 100644 --- a/src/pages/workspace/WorkspaceAvatar.tsx +++ b/src/pages/workspace/WorkspaceAvatar.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import type {OnyxEntry} from 'react-native-onyx'; -import {withOnyx} from 'react-native-onyx'; import AttachmentModal from '@components/AttachmentModal'; +import useOnyx from '@hooks/useOnyx'; +import usePolicy from '@hooks/usePolicy'; import Navigation from '@libs/Navigation/Navigation'; import type {PlatformStackScreenProps} from '@libs/Navigation/PlatformStackNavigation/types'; import type {AuthScreensParamList} from '@libs/Navigation/types'; @@ -9,16 +9,12 @@ import * as ReportUtils from '@libs/ReportUtils'; import * as UserUtils from '@libs/UserUtils'; import ONYXKEYS from '@src/ONYXKEYS'; import type SCREENS from '@src/SCREENS'; -import type {Policy} from '@src/types/onyx'; -type WorkspaceAvatarOnyxProps = { - policy: OnyxEntry; - isLoadingApp: OnyxEntry; -}; +type WorkspaceAvatarProps = PlatformStackScreenProps; -type WorkspaceAvatarProps = WorkspaceAvatarOnyxProps & PlatformStackScreenProps; - -function WorkspaceAvatar({policy, isLoadingApp = true}: WorkspaceAvatarProps) { +function WorkspaceAvatar({route}: WorkspaceAvatarProps) { + const policy = usePolicy(route?.params?.policyID); + const [isLoadingApp = true] = useOnyx(ONYXKEYS.IS_LOADING_APP, {canBeMissing: true}); const avatarURL = (policy?.avatarURL ?? '') ? (policy?.avatarURL ?? '') : ReportUtils.getDefaultWorkspaceAvatar(policy?.name ?? ''); return ( @@ -38,11 +34,4 @@ function WorkspaceAvatar({policy, isLoadingApp = true}: WorkspaceAvatarProps) { WorkspaceAvatar.displayName = 'WorkspaceAvatar'; -export default withOnyx({ - policy: { - key: ({route}) => `${ONYXKEYS.COLLECTION.POLICY}${route.params.policyID ?? '-1'}`, - }, - isLoadingApp: { - key: ONYXKEYS.IS_LOADING_APP, - }, -})(WorkspaceAvatar); +export default WorkspaceAvatar; diff --git a/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx b/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx index 83458c3ad74a..d519601069fd 100644 --- a/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx +++ b/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx @@ -1,11 +1,11 @@ import React, {useCallback, useEffect, useState} from 'react'; import {View} from 'react-native'; import type {OnyxEntry} from 'react-native-onyx'; -import {withOnyx} from 'react-native-onyx'; import type {ValueOf} from 'type-fest'; import Button from '@components/Button'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; +import useOnyx from '@hooks/useOnyx'; import useThemeStyles from '@hooks/useThemeStyles'; import * as WorkspaceSettingsUtils from '@libs/WorkspacesSettingsUtils'; import Navigation from '@navigation/Navigation'; @@ -15,12 +15,7 @@ import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type * as OnyxTypes from '@src/types/onyx'; -type WorkspaceOwnerChangeCheckOnyxProps = { - /** Personal details of all users */ - personalDetails: OnyxEntry; -}; - -type WorkspaceOwnerChangeCheckProps = WorkspaceOwnerChangeCheckOnyxProps & { +type WorkspaceOwnerChangeCheckProps = { /** The policy */ policy: OnyxEntry; @@ -31,7 +26,7 @@ type WorkspaceOwnerChangeCheckProps = WorkspaceOwnerChangeCheckOnyxProps & { error: ValueOf; }; -function WorkspaceOwnerChangeCheck({personalDetails, policy, accountID, error}: WorkspaceOwnerChangeCheckProps) { +function WorkspaceOwnerChangeCheck({policy, accountID, error}: WorkspaceOwnerChangeCheckProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); const [displayTexts, setDisplayTexts] = useState({ @@ -39,7 +34,9 @@ function WorkspaceOwnerChangeCheck({personalDetails, policy, accountID, error}: text: '', buttonText: '', }); - + const [personalDetails] = useOnyx(ONYXKEYS.PERSONAL_DETAILS_LIST, { + canBeMissing: true, + }); const policyID = policy?.id ?? '-1'; const updateDisplayTexts = useCallback(() => { @@ -86,8 +83,4 @@ function WorkspaceOwnerChangeCheck({personalDetails, policy, accountID, error}: WorkspaceOwnerChangeCheck.displayName = 'WorkspaceOwnerChangeCheckPage'; -export default withOnyx({ - personalDetails: { - key: ONYXKEYS.PERSONAL_DETAILS_LIST, - }, -})(WorkspaceOwnerChangeCheck); +export default WorkspaceOwnerChangeCheck; From 4d7679b6767a1e41df012b8b11ad7d98bdfc0b6b Mon Sep 17 00:00:00 2001 From: Linh Date: Tue, 15 Jul 2025 09:03:29 +0700 Subject: [PATCH 2/5] chore: eslint fail --- src/pages/workspace/WorkspaceAvatar.tsx | 8 ++++---- .../members/WorkspaceOwnerChangeCheck.tsx | 15 +++++++++------ 2 files changed, 13 insertions(+), 10 deletions(-) diff --git a/src/pages/workspace/WorkspaceAvatar.tsx b/src/pages/workspace/WorkspaceAvatar.tsx index 760c0712d0d7..ab59aa183b26 100644 --- a/src/pages/workspace/WorkspaceAvatar.tsx +++ b/src/pages/workspace/WorkspaceAvatar.tsx @@ -5,8 +5,8 @@ import usePolicy from '@hooks/usePolicy'; import Navigation from '@libs/Navigation/Navigation'; import type {PlatformStackScreenProps} from '@libs/Navigation/PlatformStackNavigation/types'; import type {AuthScreensParamList} from '@libs/Navigation/types'; -import * as ReportUtils from '@libs/ReportUtils'; -import * as UserUtils from '@libs/UserUtils'; +import {getDefaultWorkspaceAvatar} from '@libs/ReportUtils'; +import {getFullSizeAvatar} from '@libs/UserUtils'; import ONYXKEYS from '@src/ONYXKEYS'; import type SCREENS from '@src/SCREENS'; @@ -15,13 +15,13 @@ type WorkspaceAvatarProps = PlatformStackScreenProps { const changeOwnerErrors = Object.keys(policy?.errorFields?.changeOwner ?? {}); @@ -45,7 +45,7 @@ function WorkspaceOwnerChangeCheck({policy, accountID, error}: WorkspaceOwnerCha return; } - const texts = WorkspaceSettingsUtils.getOwnershipChecksDisplayText(error, translate, policy, personalDetails?.[accountID]?.login); + const texts = getOwnershipChecksDisplayText(error, translate, policy, personalDetails?.[accountID]?.login); setDisplayTexts(texts); }, [accountID, error, personalDetails, policy, translate]); @@ -54,15 +54,18 @@ function WorkspaceOwnerChangeCheck({policy, accountID, error}: WorkspaceOwnerCha }, [updateDisplayTexts]); const confirm = useCallback(() => { + if (!policyID) { + return; + } 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 - MemberActions.clearWorkspaceOwnerChangeFlow(policyID); + clearWorkspaceOwnerChangeFlow(policyID); Navigation.goBack(); Navigation.navigate(ROUTES.WORKSPACE_MEMBER_DETAILS.getRoute(policyID, accountID)); return; } - MemberActions.requestWorkspaceOwnerChange(policyID); + requestWorkspaceOwnerChange(policyID); }, [accountID, error, policyID]); return ( From f1cab7603e002360881d382568845c7393d4330f Mon Sep 17 00:00:00 2001 From: Linh Date: Tue, 15 Jul 2025 17:53:51 +0700 Subject: [PATCH 3/5] chore: use usePersonalDetails instead usOnyx --- src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx b/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx index 8e5d3fb276a1..b7c569ba39d9 100644 --- a/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx +++ b/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx @@ -3,15 +3,14 @@ import {View} from 'react-native'; import type {OnyxEntry} from 'react-native-onyx'; import type {ValueOf} from 'type-fest'; import Button from '@components/Button'; +import {usePersonalDetails} from '@components/OnyxProvider'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; -import useOnyx from '@hooks/useOnyx'; import useThemeStyles from '@hooks/useThemeStyles'; import {clearWorkspaceOwnerChangeFlow, requestWorkspaceOwnerChange} from '@libs/actions/Policy/Member'; import {getOwnershipChecksDisplayText} from '@libs/WorkspacesSettingsUtils'; import Navigation from '@navigation/Navigation'; import CONST from '@src/CONST'; -import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type * as OnyxTypes from '@src/types/onyx'; @@ -34,9 +33,8 @@ function WorkspaceOwnerChangeCheck({policy, accountID, error}: WorkspaceOwnerCha text: '', buttonText: '', }); - const [personalDetails] = useOnyx(ONYXKEYS.PERSONAL_DETAILS_LIST, { - canBeMissing: true, - }); + const personalDetails = usePersonalDetails(); + const policyID = policy?.id; const updateDisplayTexts = useCallback(() => { From d96d275fb80d93d11fabdbff8195be03ef596ed9 Mon Sep 17 00:00:00 2001 From: Linh Date: Mon, 21 Jul 2025 06:17:00 +0700 Subject: [PATCH 4/5] chore: ts fail after merge main --- src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx b/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx index b7c569ba39d9..4d1be70f65d7 100644 --- a/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx +++ b/src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx @@ -3,7 +3,7 @@ import {View} from 'react-native'; import type {OnyxEntry} from 'react-native-onyx'; import type {ValueOf} from 'type-fest'; import Button from '@components/Button'; -import {usePersonalDetails} from '@components/OnyxProvider'; +import {usePersonalDetails} from '@components/OnyxListItemProvider'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; From 2af6cc6ad2a5d252a5abb8ca31e1fdb79e9f41a5 Mon Sep 17 00:00:00 2001 From: Linh Date: Thu, 24 Jul 2025 09:42:01 +0700 Subject: [PATCH 5/5] chore: resolve reviewer request --- src/pages/workspace/WorkspaceAvatar.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/workspace/WorkspaceAvatar.tsx b/src/pages/workspace/WorkspaceAvatar.tsx index ab59aa183b26..5247d13e9f48 100644 --- a/src/pages/workspace/WorkspaceAvatar.tsx +++ b/src/pages/workspace/WorkspaceAvatar.tsx @@ -14,7 +14,7 @@ type WorkspaceAvatarProps = PlatformStackScreenProps