From 0122355c5a490f78e7d859e9c14fac9e57fdda01 Mon Sep 17 00:00:00 2001 From: nkdengineer Date: Wed, 9 Oct 2024 11:44:41 +0700 Subject: [PATCH 1/3] fix: Plural Remove Members on the workspace when we only have one --- src/languages/en.ts | 5 ++++- src/languages/es.ts | 5 ++++- src/pages/ReportParticipantsPage.tsx | 8 +++++--- src/pages/RoomMembersPage.tsx | 10 ++++++---- src/pages/workspace/WorkspaceMembersPage.tsx | 9 +++++---- 5 files changed, 24 insertions(+), 13 deletions(-) diff --git a/src/languages/en.ts b/src/languages/en.ts index c44ac6f2cedfa..8aedaa2c660c8 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -3367,7 +3367,10 @@ const translations = { removeMembersPrompt: 'Are you sure you want to remove these members?', removeMembersWarningPrompt: ({memberName, ownerName}: RemoveMembersWarningPrompt) => `${memberName} is an approver in this workspace. When you unshare this workspace with them, we’ll replace them in the approval workflow with the workspace owner, ${ownerName}`, - removeMembersTitle: 'Remove members', + removeMembersTitle: () => ({ + one: 'Remove member', + other: 'Remove members', + }), removeWorkspaceMemberButtonTitle: 'Remove from workspace', removeGroupMemberButtonTitle: 'Remove from group', removeRoomMemberButtonTitle: 'Remove from chat', diff --git a/src/languages/es.ts b/src/languages/es.ts index 76cb22772f88f..8f453378075d1 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -3408,7 +3408,10 @@ const translations = { removeMembersPrompt: '¿Estás seguro de que deseas eliminar a estos miembros?', removeMembersWarningPrompt: ({memberName, ownerName}: RemoveMembersWarningPrompt) => `${memberName} es un aprobador en este espacio de trabajo. Cuando lo elimine de este espacio de trabajo, los sustituiremos en el flujo de trabajo de aprobación por el propietario del espacio de trabajo, ${ownerName}`, - removeMembersTitle: 'Eliminar miembros', + removeMembersTitle: () => ({ + one: 'Eliminar miembro', + other: 'Eliminar miembros', + }), removeWorkspaceMemberButtonTitle: 'Eliminar del espacio de trabajo', removeGroupMemberButtonTitle: 'Eliminar del grupo', removeRoomMemberButtonTitle: 'Eliminar del chat', diff --git a/src/pages/ReportParticipantsPage.tsx b/src/pages/ReportParticipantsPage.tsx index 8835d7c8d5cc2..dba1798f4813b 100755 --- a/src/pages/ReportParticipantsPage.tsx +++ b/src/pages/ReportParticipantsPage.tsx @@ -209,9 +209,11 @@ function ReportParticipantsPage({report, route}: ReportParticipantsPageProps) { const accountIDsToRemove = selectedMembers.filter((id) => id !== currentUserAccountID); Report.removeFromGroupChat(report.reportID, accountIDsToRemove); setSearchValue(''); - UserSearchPhraseActions.clearUserSearchPhrase(); setSelectedMembers([]); setRemoveMembersConfirmModalVisible(false); + InteractionManager.runAfterInteractions(() => { + UserSearchPhraseActions.clearUserSearchPhrase(); + }); }; const changeUserRole = useCallback( @@ -266,7 +268,7 @@ function ReportParticipantsPage({report, route}: ReportParticipantsPageProps) { const bulkActionsButtonOptions = useMemo(() => { const options: Array> = [ { - text: translate('workspace.people.removeMembersTitle'), + text: translate('workspace.people.removeMembersTitle', {count: selectedMembers.length}), value: CONST.POLICY.MEMBERS_BULK_ACTION_TYPES.REMOVE, icon: Expensicons.RemoveMembers, onSelected: () => setRemoveMembersConfirmModalVisible(true), @@ -390,7 +392,7 @@ function ReportParticipantsPage({report, route}: ReportParticipantsPageProps) { {headerButtons} setRemoveMembersConfirmModalVisible(false)} diff --git a/src/pages/RoomMembersPage.tsx b/src/pages/RoomMembersPage.tsx index f8c07e5b0a673..288256ccbe9d3 100644 --- a/src/pages/RoomMembersPage.tsx +++ b/src/pages/RoomMembersPage.tsx @@ -2,7 +2,7 @@ import type {RouteProp} from '@react-navigation/native'; import {useIsFocused, useRoute} from '@react-navigation/native'; import type {StackScreenProps} from '@react-navigation/stack'; import React, {useCallback, useEffect, useMemo, useState} from 'react'; -import {View} from 'react-native'; +import {InteractionManager, View} from 'react-native'; import {useOnyx, withOnyx} from 'react-native-onyx'; import type {OnyxEntry} from 'react-native-onyx'; import FullPageNotFoundView from '@components/BlockingViews/FullPageNotFoundView'; @@ -128,9 +128,11 @@ function RoomMembersPage({report, session, policies}: RoomMembersPageProps) { Report.removeFromRoom(report.reportID, selectedMembers); } setSearchValue(''); - UserSearchPhraseActions.clearUserSearchPhrase(); setSelectedMembers([]); setRemoveMembersConfirmModalVisible(false); + InteractionManager.runAfterInteractions(() => { + UserSearchPhraseActions.clearUserSearchPhrase(); + }); }; /** @@ -273,7 +275,7 @@ function RoomMembersPage({report, session, policies}: RoomMembersPageProps) { const bulkActionsButtonOptions = useMemo(() => { const options: Array> = [ { - text: translate('workspace.people.removeMembersTitle'), + text: translate('workspace.people.removeMembersTitle', {count: selectedMembers.length}), value: CONST.POLICY.MEMBERS_BULK_ACTION_TYPES.REMOVE, icon: Expensicons.RemoveMembers, onSelected: () => setRemoveMembersConfirmModalVisible(true), @@ -368,7 +370,7 @@ function RoomMembersPage({report, session, policies}: RoomMembersPageProps) { {headerButtons} setRemoveMembersConfirmModalVisible(false)} diff --git a/src/pages/workspace/WorkspaceMembersPage.tsx b/src/pages/workspace/WorkspaceMembersPage.tsx index 52b8a06ba931b..5b6ffa9ab4755 100644 --- a/src/pages/workspace/WorkspaceMembersPage.tsx +++ b/src/pages/workspace/WorkspaceMembersPage.tsx @@ -206,10 +206,11 @@ function WorkspaceMembersPage({personalDetails, route, policy, currentUserPerson // Remove the admin from the list const accountIDsToRemove = session?.accountID ? selectedEmployees.filter((id) => id !== session.accountID) : selectedEmployees; - - Member.removeMembers(accountIDsToRemove, route.params.policyID); setSelectedEmployees([]); setRemoveMembersConfirmModalVisible(false); + InteractionManager.runAfterInteractions(() => { + Member.removeMembers(accountIDsToRemove, route.params.policyID); + }); }; /** @@ -477,7 +478,7 @@ function WorkspaceMembersPage({personalDetails, route, policy, currentUserPerson const getBulkActionsButtonOptions = () => { const options: Array> = [ { - text: translate('workspace.people.removeMembersTitle'), + text: translate('workspace.people.removeMembersTitle', {count: selectedEmployees.length}), value: CONST.POLICY.MEMBERS_BULK_ACTION_TYPES.REMOVE, icon: Expensicons.RemoveMembers, onSelected: askForConfirmationToRemove, @@ -637,7 +638,7 @@ function WorkspaceMembersPage({personalDetails, route, policy, currentUserPerson setRemoveMembersConfirmModalVisible(false)} From 9747bf9d774893f9fd221ee3478bf9fcdbf9bca5 Mon Sep 17 00:00:00 2001 From: nkdengineer Date: Wed, 9 Oct 2024 14:37:04 +0700 Subject: [PATCH 2/3] fix lint --- src/pages/RoomMembersPage.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/RoomMembersPage.tsx b/src/pages/RoomMembersPage.tsx index 288256ccbe9d3..19ec8b06b91d5 100644 --- a/src/pages/RoomMembersPage.tsx +++ b/src/pages/RoomMembersPage.tsx @@ -282,7 +282,7 @@ function RoomMembersPage({report, session, policies}: RoomMembersPageProps) { }, ]; return options; - }, [translate, setRemoveMembersConfirmModalVisible]); + }, [translate, selectedMembers.length]); const headerButtons = useMemo(() => { return ( From 6e7ed01e063c5135a6da730e1600885f58190564 Mon Sep 17 00:00:00 2001 From: nkdengineer Date: Wed, 9 Oct 2024 15:21:16 +0700 Subject: [PATCH 3/3] fix: change prompt modal delete member --- src/languages/en.ts | 10 ++++++-- src/languages/es.ts | 10 ++++++-- src/pages/ReportParticipantsPage.tsx | 5 +++- src/pages/RoomMembersPage.tsx | 24 ++++++++------------ src/pages/workspace/WorkspaceMembersPage.tsx | 8 +++++-- 5 files changed, 36 insertions(+), 21 deletions(-) diff --git a/src/languages/en.ts b/src/languages/en.ts index 8aedaa2c660c8..3d63e9b72b21a 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -3364,7 +3364,10 @@ const translations = { }, people: { genericFailureMessage: 'An error occurred removing a user from the workspace, please try again.', - removeMembersPrompt: 'Are you sure you want to remove these members?', + removeMembersPrompt: ({memberName}: {memberName: string}) => ({ + one: `Are you sure you want to remove ${memberName}?`, + other: 'Are you sure you want to remove these members?', + }), removeMembersWarningPrompt: ({memberName, ownerName}: RemoveMembersWarningPrompt) => `${memberName} is an approver in this workspace. When you unshare this workspace with them, we’ll replace them in the approval workflow with the workspace owner, ${ownerName}`, removeMembersTitle: () => ({ @@ -4057,7 +4060,10 @@ const translations = { memberNotFound: 'Member not found.', useInviteButton: 'To invite a new member to the chat, please use the invite button above.', notAuthorized: `You don't have access to this page. If you're trying to join this room, just ask a room member to add you. Something else? Reach out to ${CONST.EMAIL.CONCIERGE}`, - removeMembersPrompt: 'Are you sure you want to remove the selected members from the room?', + removeMembersPrompt: ({memberName}: {memberName: string}) => ({ + one: `Are you sure you want to remove ${memberName} from the room?`, + other: 'Are you sure you want to remove the selected members from the room?', + }), error: { genericAdd: 'There was a problem adding this room member.', }, diff --git a/src/languages/es.ts b/src/languages/es.ts index 8f453378075d1..48d068fa46243 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -3405,7 +3405,10 @@ const translations = { }, people: { genericFailureMessage: 'Se ha producido un error al intentar eliminar a un miembro del espacio de trabajo. Por favor, inténtalo más tarde.', - removeMembersPrompt: '¿Estás seguro de que deseas eliminar a estos miembros?', + removeMembersPrompt: ({memberName}: {memberName: string}) => ({ + one: `¿Estás seguro de que deseas eliminar ${memberName}`, + other: '¿Estás seguro de que deseas eliminar a estos miembros?', + }), removeMembersWarningPrompt: ({memberName, ownerName}: RemoveMembersWarningPrompt) => `${memberName} es un aprobador en este espacio de trabajo. Cuando lo elimine de este espacio de trabajo, los sustituiremos en el flujo de trabajo de aprobación por el propietario del espacio de trabajo, ${ownerName}`, removeMembersTitle: () => ({ @@ -4102,7 +4105,10 @@ const translations = { memberNotFound: 'Miembro no encontrado.', useInviteButton: 'Para invitar a un nuevo miembro al chat, por favor, utiliza el botón invitar que está más arriba.', notAuthorized: `No tienes acceso a esta página. Si estás intentando unirte a esta sala, pide a un miembro de la sala que te añada. ¿Necesitas algo más? Comunícate con ${CONST.EMAIL.CONCIERGE}`, - removeMembersPrompt: '¿Estás seguro de que quieres eliminar a los miembros seleccionados de la sala de chat?', + removeMembersPrompt: ({memberName}: {memberName: string}) => ({ + one: `¿Estás seguro de que quieres eliminar ${memberName} de la sala de chat?`, + other: '¿Estás seguro de que quieres eliminar a los miembros seleccionados de la sala de chat?', + }), error: { genericAdd: 'Hubo un problema al añadir este miembro a la sala de chat.', }, diff --git a/src/pages/ReportParticipantsPage.tsx b/src/pages/ReportParticipantsPage.tsx index dba1798f4813b..b4eebb9b76f70 100755 --- a/src/pages/ReportParticipantsPage.tsx +++ b/src/pages/ReportParticipantsPage.tsx @@ -396,7 +396,10 @@ function ReportParticipantsPage({report, route}: ReportParticipantsPageProps) { isVisible={removeMembersConfirmModalVisible} onConfirm={removeUsers} onCancel={() => setRemoveMembersConfirmModalVisible(false)} - prompt={translate('workspace.people.removeMembersPrompt')} + prompt={translate('workspace.people.removeMembersPrompt', { + count: selectedMembers.length, + memberName: PersonalDetailsUtils.getPersonalDetailsByIDs(selectedMembers, currentUserAccountID).at(0)?.displayName ?? '', + })} confirmText={translate('common.remove')} cancelText={translate('common.cancel')} onModalHide={() => { diff --git a/src/pages/RoomMembersPage.tsx b/src/pages/RoomMembersPage.tsx index 19ec8b06b91d5..f212eb5fd75a7 100644 --- a/src/pages/RoomMembersPage.tsx +++ b/src/pages/RoomMembersPage.tsx @@ -3,8 +3,7 @@ import {useIsFocused, useRoute} from '@react-navigation/native'; import type {StackScreenProps} from '@react-navigation/stack'; import React, {useCallback, useEffect, useMemo, useState} from 'react'; import {InteractionManager, View} from 'react-native'; -import {useOnyx, withOnyx} from 'react-native-onyx'; -import type {OnyxEntry} from 'react-native-onyx'; +import {useOnyx} from 'react-native-onyx'; import FullPageNotFoundView from '@components/BlockingViews/FullPageNotFoundView'; import Button from '@components/Button'; import ButtonWithDropdownMenu from '@components/ButtonWithDropdownMenu'; @@ -41,23 +40,17 @@ import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type SCREENS from '@src/SCREENS'; -import type {Session} from '@src/types/onyx'; import {isEmptyObject} from '@src/types/utils/EmptyObject'; import type {WithReportOrNotFoundProps} from './home/report/withReportOrNotFound'; import withReportOrNotFound from './home/report/withReportOrNotFound'; -type RoomMembersPageOnyxProps = { - session: OnyxEntry; -}; +type RoomMembersPageProps = WithReportOrNotFoundProps & WithCurrentUserPersonalDetailsProps & StackScreenProps; -type RoomMembersPageProps = WithReportOrNotFoundProps & - WithCurrentUserPersonalDetailsProps & - RoomMembersPageOnyxProps & - StackScreenProps; - -function RoomMembersPage({report, session, policies}: RoomMembersPageProps) { +function RoomMembersPage({report, policies}: RoomMembersPageProps) { const route = useRoute>(); const styles = useThemeStyles(); + const [session] = useOnyx(ONYXKEYS.SESSION); + const currentUserAccountID = Number(session?.accountID); const {formatPhoneNumber, translate} = useLocalize(); const [selectedMembers, setSelectedMembers] = useState([]); const [removeMembersConfirmModalVisible, setRemoveMembersConfirmModalVisible] = useState(false); @@ -374,7 +367,10 @@ function RoomMembersPage({report, session, policies}: RoomMembersPageProps) { isVisible={removeMembersConfirmModalVisible} onConfirm={removeUsers} onCancel={() => setRemoveMembersConfirmModalVisible(false)} - prompt={translate('roomMembersPage.removeMembersPrompt')} + prompt={translate('roomMembersPage.removeMembersPrompt', { + count: selectedMembers.length, + memberName: PersonalDetailsUtils.getPersonalDetailsByIDs(selectedMembers, currentUserAccountID).at(0)?.displayName ?? '', + })} confirmText={translate('common.remove')} cancelText={translate('common.cancel')} /> @@ -411,4 +407,4 @@ function RoomMembersPage({report, session, policies}: RoomMembersPageProps) { RoomMembersPage.displayName = 'RoomMembersPage'; -export default withReportOrNotFound()(withCurrentUserPersonalDetails(withOnyx({session: {key: ONYXKEYS.SESSION}})(RoomMembersPage))); +export default withReportOrNotFound()(withCurrentUserPersonalDetails(RoomMembersPage)); diff --git a/src/pages/workspace/WorkspaceMembersPage.tsx b/src/pages/workspace/WorkspaceMembersPage.tsx index 5b6ffa9ab4755..027a7509ec0d0 100644 --- a/src/pages/workspace/WorkspaceMembersPage.tsx +++ b/src/pages/workspace/WorkspaceMembersPage.tsx @@ -93,6 +93,7 @@ function WorkspaceMembersPage({personalDetails, route, policy, currentUserPerson const [invitedEmailsToAccountIDsDraft] = useOnyx(`${ONYXKEYS.COLLECTION.WORKSPACE_INVITE_MEMBERS_DRAFT}${route.params.policyID.toString()}`); const {selectionMode} = useMobileSelectionMode(); const [session] = useOnyx(ONYXKEYS.SESSION); + const currentUserAccountID = Number(session?.accountID); const selectionListRef = useRef(null); const isFocused = useIsFocused(); const policyID = route.params.policyID; @@ -102,13 +103,16 @@ function WorkspaceMembersPage({personalDetails, route, policy, currentUserPerson const confirmModalPrompt = useMemo(() => { const approverAccountID = selectedEmployees.find((selectedEmployee) => Member.isApprover(policy, selectedEmployee)); if (!approverAccountID) { - return translate('workspace.people.removeMembersPrompt'); + return translate('workspace.people.removeMembersPrompt', { + count: selectedEmployees.length, + memberName: PersonalDetailsUtils.getPersonalDetailsByIDs(selectedEmployees, currentUserAccountID).at(0)?.displayName ?? '', + }); } return translate('workspace.people.removeMembersWarningPrompt', { memberName: getDisplayNameForParticipant(approverAccountID), ownerName: getDisplayNameForParticipant(policy?.ownerAccountID), }); - }, [selectedEmployees, policy, translate]); + }, [selectedEmployees, translate, policy, currentUserAccountID]); /** * Get filtered personalDetails list with current employeeList */