Skip to content
5 changes: 4 additions & 1 deletion src/ROUTES.ts
Original file line number Diff line number Diff line change
Expand Up @@ -130,7 +130,10 @@ const ROUTES = {
route: 'settings/profile/contact-methods/:contactMethod/details',
getRoute: (contactMethod: string) => `settings/profile/contact-methods/${encodeURIComponent(contactMethod)}/details` as const,
},
SETTINGS_NEW_CONTACT_METHOD: 'settings/profile/contact-methods/new',
SETTINGS_NEW_CONTACT_METHOD: {
route: 'settings/profile/contact-methods/new',
getRoute: (backTo?: string) => getUrlWithBackToParam('settings/profile/contact-methods/new', backTo),
},
SETTINGS_2FA: {
route: 'settings/security/two-factor-auth',
getRoute: (backTo?: string) => getUrlWithBackToParam('settings/security/two-factor-auth', backTo),
Expand Down
2 changes: 1 addition & 1 deletion src/libs/Navigation/linkingConfig.ts
Original file line number Diff line number Diff line change
Expand Up @@ -171,7 +171,7 @@ const linkingConfig: LinkingOptions<RootStackParamList> = {
path: ROUTES.SETTINGS_LOUNGE_ACCESS,
},
Settings_NewContactMethod: {
path: ROUTES.SETTINGS_NEW_CONTACT_METHOD,
path: ROUTES.SETTINGS_NEW_CONTACT_METHOD.route,
exact: true,
},
Settings_PersonalDetails_Initial: {
Expand Down
12 changes: 10 additions & 2 deletions src/pages/settings/Profile/Contacts/ContactMethodsPage.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import Str from 'expensify-common/lib/str';
import lodashGet from 'lodash/get';
import PropTypes from 'prop-types';
import React from 'react';
import React, {useCallback} from 'react';
import {ScrollView, View} from 'react-native';
import {withOnyx} from 'react-native-onyx';
import _ from 'underscore';
Expand Down Expand Up @@ -111,6 +111,14 @@ function ContactMethodsPage(props) {
);
});

const onNewContactMethodButtonPress = useCallback(() => {
if (navigateBackTo === ROUTES.SETTINGS_PROFILE) {
Navigation.navigate(ROUTES.SETTINGS_NEW_CONTACT_METHOD.route);
return;
Comment on lines +115 to +117
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@shubham1206agra can I have context why this change was necessary?
This code is being removed in #38308 to fix #38296.
So I'd like to confirm if this doesn't cause any side effect.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure now, as this code is old. Just run the steps in this PR to verify no problem occurs.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Here is a little explanation of why this was done
#32065 (comment)

Copy link
Copy Markdown
Contributor

@abzokhattab abzokhattab Mar 14, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks, @ZhenjaHorbach and @shubham1206agra for the reply.

@mkhutornyi @akinwale I reproduced the current PR test steps on the changes I made and the output is still the same:

Screen.Recording.2024-03-14.at.5.52.01.PM.mov

}
Navigation.navigate(ROUTES.SETTINGS_NEW_CONTACT_METHOD.getRoute(navigateBackTo));
}, [navigateBackTo]);

return (
<ScreenWrapper
shouldEnableKeyboardAvoidingView={false}
Expand All @@ -136,7 +144,7 @@ function ContactMethodsPage(props) {
<Button
success
text={props.translate('contacts.newContactMethod')}
onPress={() => Navigation.navigate(ROUTES.SETTINGS_NEW_CONTACT_METHOD)}
onPress={onNewContactMethodButtonPress}
pressOnEnter
/>
</FixedFooter>
Expand Down
14 changes: 12 additions & 2 deletions src/pages/settings/Profile/Contacts/NewContactMethodPage.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import Str from 'expensify-common/lib/str';
import lodashGet from 'lodash/get';
import PropTypes from 'prop-types';
import React, {useRef} from 'react';
import React, {useCallback, useRef} from 'react';
import {View} from 'react-native';
import {withOnyx} from 'react-native-onyx';
import _ from 'underscore';
Expand Down Expand Up @@ -61,6 +61,8 @@ function NewContactMethodPage(props) {
const styles = useThemeStyles();
const loginInputRef = useRef(null);

const navigateBackTo = lodashGet(props.route, 'params.backTo', ROUTES.SETTINGS_PROFILE);

const validate = React.useCallback(
(values) => {
const phoneLogin = LoginUtils.getPhoneLogin(values.phoneOrEmail);
Expand Down Expand Up @@ -89,6 +91,14 @@ function NewContactMethodPage(props) {
[],
);

const onBackButtonPress = useCallback(() => {
if (navigateBackTo === ROUTES.SETTINGS_PROFILE) {
Navigation.goBack(ROUTES.SETTINGS_CONTACT_METHODS.route);
return;
}
Navigation.goBack(ROUTES.SETTINGS_CONTACT_METHODS.getRoute(navigateBackTo));
}, [navigateBackTo]);

return (
<ScreenWrapper
onEntryTransitionEnd={() => {
Expand All @@ -104,7 +114,7 @@ function NewContactMethodPage(props) {
>
<HeaderWithBackButton
title={props.translate('contacts.newContactMethod')}
onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_CONTACT_METHODS.route)}
onBackButtonPress={onBackButtonPress}
/>
<FormProvider
formID={ONYXKEYS.FORMS.NEW_CONTACT_METHOD_FORM}
Expand Down