Skip to content

Commit

Permalink
Merge pull request #21281 from allroundexperts/fix-20610
Browse files Browse the repository at this point in the history
feat: wrap contact method validate function inside a callback
  • Loading branch information
aldo-expensify authored Jun 24, 2023
2 parents 70bf90d + a455bfd commit 820fa93
Showing 1 changed file with 46 additions and 39 deletions.
85 changes: 46 additions & 39 deletions src/pages/settings/Profile/Contacts/NewContactMethodPage.js
Original file line number Diff line number Diff line change
Expand Up @@ -54,59 +54,66 @@ const defaultProps = {
loginList: {},
};

function NewContactMethodPage(props) {
const loginInputRef = useRef(null);
const getPhoneLogin = (phoneOrEmail) => {
if (_.isEmpty(phoneOrEmail)) {
return '';
}

const getPhoneLogin = (phoneOrEmail) => {
if (_.isEmpty(phoneOrEmail)) {
return '';
}
return LoginUtils.appendCountryCode(LoginUtils.getPhoneNumberWithoutSpecialChars(phoneOrEmail));
};

return LoginUtils.appendCountryCode(LoginUtils.getPhoneNumberWithoutSpecialChars(phoneOrEmail));
};
const validateNumber = (values) => {
const parsedPhoneNumber = parsePhoneNumber(values);

const validateNumber = (values) => {
const parsedPhoneNumber = parsePhoneNumber(values);
if (parsedPhoneNumber.possible) {
return parsedPhoneNumber.number.e164 + CONST.SMS.DOMAIN;
}

if (parsedPhoneNumber.possible) {
return parsedPhoneNumber.number.e164 + CONST.SMS.DOMAIN;
}
return '';
};

return '';
};
const addNewContactMethod = (values) => {
const phoneLogin = getPhoneLogin(values.phoneOrEmail);
const validateIfnumber = validateNumber(phoneLogin);
const submitDetail = (validateIfnumber || values.phoneOrEmail).trim().toLowerCase();

const validate = (values) => {
const phoneLogin = getPhoneLogin(values.phoneOrEmail);
const validateIfnumber = validateNumber(phoneLogin);
User.addNewContactMethodAndNavigate(submitDetail, values.password);
};

const errors = {};
function NewContactMethodPage(props) {
const loginInputRef = useRef(null);

if (_.isEmpty(values.phoneOrEmail)) {
ErrorUtils.addErrorMessage(errors, 'phoneOrEmail', 'contacts.genericFailureMessages.contactMethodRequired');
}
const validate = React.useCallback(
(values) => {
const phoneLogin = getPhoneLogin(values.phoneOrEmail);
const validateIfnumber = validateNumber(phoneLogin);

if (!_.isEmpty(values.phoneOrEmail) && !(parsePhoneNumber(phoneLogin).possible || Str.isValidEmail(values.phoneOrEmail))) {
ErrorUtils.addErrorMessage(errors, 'phoneOrEmail', 'contacts.genericFailureMessages.invalidContactMethod');
}
const errors = {};

if (!_.isEmpty(values.phoneOrEmail) && lodashGet(props.loginList, validateIfnumber || values.phoneOrEmail.toLowerCase())) {
ErrorUtils.addErrorMessage(errors, 'phoneOrEmail', 'contacts.genericFailureMessages.enteredMethodIsAlreadySubmited');
}
if (_.isEmpty(values.phoneOrEmail)) {
ErrorUtils.addErrorMessage(errors, 'phoneOrEmail', 'contacts.genericFailureMessages.contactMethodRequired');
}

if (!Permissions.canUsePasswordlessLogins(props.betas) && _.isEmpty(values.password)) {
errors.password = 'contacts.genericFailureMessages.passwordRequired';
}
if (!_.isEmpty(values.phoneOrEmail) && !(parsePhoneNumber(phoneLogin).possible || Str.isValidEmail(values.phoneOrEmail))) {
ErrorUtils.addErrorMessage(errors, 'phoneOrEmail', 'contacts.genericFailureMessages.invalidContactMethod');
}

return errors;
};
if (!_.isEmpty(values.phoneOrEmail) && lodashGet(props.loginList, validateIfnumber || values.phoneOrEmail.toLowerCase())) {
ErrorUtils.addErrorMessage(errors, 'phoneOrEmail', 'contacts.genericFailureMessages.enteredMethodIsAlreadySubmited');
}

const addNewContactMethod = (values) => {
const phoneLogin = getPhoneLogin(values.phoneOrEmail);
const validateIfnumber = validateNumber(phoneLogin);
const submitDetail = (validateIfnumber || values.phoneOrEmail).trim().toLowerCase();
if (!Permissions.canUsePasswordlessLogins(props.betas) && _.isEmpty(values.password)) {
errors.password = 'contacts.genericFailureMessages.passwordRequired';
}

User.addNewContactMethodAndNavigate(submitDetail, values.password);
};
return errors;
},
// We don't need `props.loginList` because when submitting this form
// the props.loginList gets updated, causing this function to run again.
// https://github.com/Expensify/App/issues/20610
// eslint-disable-next-line react-hooks/exhaustive-deps
[],
);

return (
<ScreenWrapper
Expand Down

0 comments on commit 820fa93

Please sign in to comment.