From e04eabe6aa598dd11328586fad98e17d762eee46 Mon Sep 17 00:00:00 2001 From: Sachin Chavda Date: Fri, 11 Oct 2024 17:57:58 +0530 Subject: [PATCH 1/3] Show No access Modal when Copilot tries to add new contact method on behalf of owner --- src/components/DelegateNoAccessModal.tsx | 4 +- src/languages/en.ts | 3 +- src/languages/es.ts | 3 +- .../Profile/Contacts/ContactMethodsPage.tsx | 19 +++- .../Profile/Contacts/NewContactMethodPage.tsx | 103 +++++++++--------- 5 files changed, 74 insertions(+), 58 deletions(-) diff --git a/src/components/DelegateNoAccessModal.tsx b/src/components/DelegateNoAccessModal.tsx index 8b708459c122..442c3ec9c4e2 100644 --- a/src/components/DelegateNoAccessModal.tsx +++ b/src/components/DelegateNoAccessModal.tsx @@ -15,13 +15,11 @@ export default function DelegateNoAccessModal({isNoDelegateAccessMenuVisible = f const {translate} = useLocalize(); const noDelegateAccessPromptStart = translate('delegate.notAllowedMessageStart', {accountOwnerEmail: delegatorEmail}); const noDelegateAccessHyperLinked = translate('delegate.notAllowedMessageHyperLinked'); - const noDelegateAccessPromptEnd = translate('delegate.notAllowedMessageEnd'); const delegateNoAccessPrompt = ( {noDelegateAccessPromptStart} - {noDelegateAccessHyperLinked} - {noDelegateAccessPromptEnd} + {noDelegateAccessHyperLinked}. ); diff --git a/src/languages/en.ts b/src/languages/en.ts index fa2d39cc29dd..ae197927761c 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -4933,8 +4933,7 @@ const translations = { enterMagicCode: ({contactMethod}: EnterMagicCodeParams) => `Please enter the magic code sent to ${contactMethod} to add a copilot.`, notAllowed: 'Not so fast...', notAllowedMessageStart: ({accountOwnerEmail}: AccountOwnerParams) => `You don't have permission to take this action for ${accountOwnerEmail} as a`, - notAllowedMessageHyperLinked: ' limited access', - notAllowedMessageEnd: ' copilot', + notAllowedMessageHyperLinked: ' copilot', }, debug: { debug: 'Debug', diff --git a/src/languages/es.ts b/src/languages/es.ts index 2a7a9864c17f..d0ca986bdc13 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -5445,8 +5445,7 @@ const translations = { enterMagicCode: ({contactMethod}: EnterMagicCodeParams) => `Por favor, introduce el código mágico enviado a ${contactMethod} para agregar un copiloto.`, notAllowed: 'No tan rápido...', notAllowedMessageStart: ({accountOwnerEmail}: AccountOwnerParams) => `No tienes permiso para realizar esta acción para ${accountOwnerEmail}`, - notAllowedMessageHyperLinked: ' copiloto con acceso', - notAllowedMessageEnd: ' limitado', + notAllowedMessageHyperLinked: ' copiloto', }, debug: { debug: 'Depuración', diff --git a/src/pages/settings/Profile/Contacts/ContactMethodsPage.tsx b/src/pages/settings/Profile/Contacts/ContactMethodsPage.tsx index 3f23b3a802be..1b11f3709435 100644 --- a/src/pages/settings/Profile/Contacts/ContactMethodsPage.tsx +++ b/src/pages/settings/Profile/Contacts/ContactMethodsPage.tsx @@ -1,11 +1,12 @@ import type {StackScreenProps} from '@react-navigation/stack'; import {Str} from 'expensify-common'; -import React, {useCallback} from 'react'; +import React, {useCallback, useState} from 'react'; import {View} from 'react-native'; import type {OnyxEntry} from 'react-native-onyx'; -import {withOnyx} from 'react-native-onyx'; +import {useOnyx, withOnyx} from 'react-native-onyx'; import Button from '@components/Button'; import CopyTextToClipboard from '@components/CopyTextToClipboard'; +import DelegateNoAccessModal from '@components/DelegateNoAccessModal'; import FixedFooter from '@components/FixedFooter'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import MenuItem from '@components/MenuItem'; @@ -13,6 +14,7 @@ import OfflineWithFeedback from '@components/OfflineWithFeedback'; import ScreenWrapper from '@components/ScreenWrapper'; import ScrollView from '@components/ScrollView'; import Text from '@components/Text'; +import useDelegateUserDetails from '@hooks/useDelegateUserDetails'; import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; @@ -40,6 +42,10 @@ function ContactMethodsPage({loginList, session, route}: ContactMethodsPageProps const {formatPhoneNumber, translate} = useLocalize(); const loginNames = Object.keys(loginList ?? {}); const navigateBackTo = route?.params?.backTo; + const [account] = useOnyx(ONYXKEYS.ACCOUNT); + const isActingAsDelegate = !!account?.delegatedAccess?.delegate; + const [isNoDelegateAccessMenuVisible, setIsNoDelegateAccessMenuVisible] = useState(false); + const {delegatorEmail} = useDelegateUserDetails(); // Sort the login names by placing the one corresponding to the default contact method as the first item before displaying the contact methods. // The default contact method is determined by checking against the session email (the current login). @@ -97,6 +103,10 @@ function ContactMethodsPage({loginList, session, route}: ContactMethodsPageProps }); const onNewContactMethodButtonPress = useCallback(() => { + if (isActingAsDelegate) { + setIsNoDelegateAccessMenuVisible(true); + return; + } Navigation.navigate(ROUTES.SETTINGS_NEW_CONTACT_METHOD.getRoute(navigateBackTo)); }, [navigateBackTo]); @@ -131,6 +141,11 @@ function ContactMethodsPage({loginList, session, route}: ContactMethodsPageProps /> + setIsNoDelegateAccessMenuVisible(false)} + delegatorEmail={delegatorEmail ?? ''} + /> ); } diff --git a/src/pages/settings/Profile/Contacts/NewContactMethodPage.tsx b/src/pages/settings/Profile/Contacts/NewContactMethodPage.tsx index fe07dcc8c99b..42ab49e2ed50 100644 --- a/src/pages/settings/Profile/Contacts/NewContactMethodPage.tsx +++ b/src/pages/settings/Profile/Contacts/NewContactMethodPage.tsx @@ -20,6 +20,7 @@ import * as LoginUtils from '@libs/LoginUtils'; import Navigation from '@libs/Navigation/Navigation'; import type {SettingsNavigatorParamList} from '@libs/Navigation/types'; import * as UserUtils from '@libs/UserUtils'; +import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper'; import * as User from '@userActions/User'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; @@ -40,6 +41,8 @@ function NewContactMethodPage({route}: NewContactMethodPageProps) { const [loginList] = useOnyx(ONYXKEYS.LOGIN_LIST); const loginData = loginList?.[pendingContactAction?.contactMethod ?? contactMethod]; const validateLoginError = ErrorUtils.getEarliestErrorField(loginData, 'validateLogin'); + const [account] = useOnyx(ONYXKEYS.ACCOUNT); + const isActingAsDelegate = !!account?.delegatedAccess?.delegate; const navigateBackTo = route?.params?.backTo ?? ROUTES.SETTINGS_PROFILE; @@ -100,56 +103,58 @@ function NewContactMethodPage({route}: NewContactMethodPageProps) { }, [navigateBackTo]); return ( - loginInputRef.current?.focus()} - includeSafeAreaPaddingBottom={false} - shouldEnableMaxHeight - testID={NewContactMethodPage.displayName} - > - - + loginInputRef.current?.focus()} + includeSafeAreaPaddingBottom={false} + shouldEnableMaxHeight + testID={NewContactMethodPage.displayName} > - {translate('common.pleaseEnterEmailOrPhoneNumber')} - - - - {hasFailedToSendVerificationCode && ( - - )} - - User.clearContactMethodErrors(contactMethod, 'validateLogin')} - onClose={() => setIsValidateCodeActionModalVisible(false)} - isVisible={isValidateCodeActionModalVisible} - title={contactMethod} - description={translate('contacts.enterMagicCode', {contactMethod})} - /> - + + + {translate('common.pleaseEnterEmailOrPhoneNumber')} + + + + {hasFailedToSendVerificationCode && ( + + )} + + User.clearContactMethodErrors(contactMethod, 'validateLogin')} + onClose={() => setIsValidateCodeActionModalVisible(false)} + isVisible={isValidateCodeActionModalVisible} + title={contactMethod} + description={translate('contacts.enterMagicCode', {contactMethod})} + /> + + ); } From 841379ce3d19892894486f38ed8dcc0f979e4eca Mon Sep 17 00:00:00 2001 From: Sachin Chavda Date: Fri, 11 Oct 2024 18:40:30 +0530 Subject: [PATCH 2/3] Eslint fix --- src/pages/settings/Profile/Contacts/ContactMethodsPage.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/pages/settings/Profile/Contacts/ContactMethodsPage.tsx b/src/pages/settings/Profile/Contacts/ContactMethodsPage.tsx index 1b11f3709435..a8d6bb6ea880 100644 --- a/src/pages/settings/Profile/Contacts/ContactMethodsPage.tsx +++ b/src/pages/settings/Profile/Contacts/ContactMethodsPage.tsx @@ -108,7 +108,7 @@ function ContactMethodsPage({loginList, session, route}: ContactMethodsPageProps return; } Navigation.navigate(ROUTES.SETTINGS_NEW_CONTACT_METHOD.getRoute(navigateBackTo)); - }, [navigateBackTo]); + }, [navigateBackTo,isActingAsDelegate]); return ( ({ loginList: { key: ONYXKEYS.LOGIN_LIST, From 16037255c9f028ea48eff947f38212b77ddb8cab Mon Sep 17 00:00:00 2001 From: Sachin Chavda Date: Fri, 11 Oct 2024 18:52:55 +0530 Subject: [PATCH 3/3] Prettier --- src/pages/settings/Profile/Contacts/ContactMethodsPage.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/pages/settings/Profile/Contacts/ContactMethodsPage.tsx b/src/pages/settings/Profile/Contacts/ContactMethodsPage.tsx index a8d6bb6ea880..893a54c5ccfd 100644 --- a/src/pages/settings/Profile/Contacts/ContactMethodsPage.tsx +++ b/src/pages/settings/Profile/Contacts/ContactMethodsPage.tsx @@ -108,7 +108,7 @@ function ContactMethodsPage({loginList, session, route}: ContactMethodsPageProps return; } Navigation.navigate(ROUTES.SETTINGS_NEW_CONTACT_METHOD.getRoute(navigateBackTo)); - }, [navigateBackTo,isActingAsDelegate]); + }, [navigateBackTo, isActingAsDelegate]); return ( ({ loginList: { key: ONYXKEYS.LOGIN_LIST,