diff --git a/src/CONST.js b/src/CONST.js index 2888611097d3..d6483e91fa9a 100644 --- a/src/CONST.js +++ b/src/CONST.js @@ -59,7 +59,7 @@ const CONST = { }, MESSAGES: { // eslint-disable-next-line max-len - NO_CONTACTS_FOUND: 'Don\'t see who you\'re looking for? Type their email or phone number to invite them to chat.', + NO_PHONE_NUMBER: 'Please enter a phone number including the country code e.g +447814266907', MAXIMUM_PARTICIPANTS_REACHED: 'You\'ve reached the maximum number of participants for a group chat.', }, PRIORITY_MODE: { @@ -81,7 +81,7 @@ const CONST = { PRIORITY_MODE: 'priorityMode', TIMEZONE: 'timeZone', }, - DEFAULT_TIME_ZONE: {automatic: true, selected: 'America/Los_Angeles'}, + DEFAULT_TIME_ZONE: { automatic: true, selected: 'America/Los_Angeles' }, PRONOUNS: { THEY_THEM_THEIRS: 'They/them/theirs', SHE_HER_HERS: 'She/her/hers', @@ -100,4 +100,4 @@ const CONST = { PASSWORD_COMPLEXITY_REGEX_STRING: '^(?=.*[A-Z])(?=.*[0-9])(?=.*[a-z]).{8,}$', }; -export default CONST; +export default CONST; \ No newline at end of file diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index 143203a45ba2..8385d16aadf0 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -4,10 +4,10 @@ import Onyx from 'react-native-onyx'; import lodashGet from 'lodash/get'; import lodashOrderBy from 'lodash/orderBy'; import Str from 'expensify-common/lib/str'; -import {getDefaultAvatar} from './actions/PersonalDetails'; +import { getDefaultAvatar } from './actions/PersonalDetails'; import ONYXKEYS from '../ONYXKEYS'; import CONST from '../CONST'; -import {getReportParticipantsTitle} from './reportUtils'; +import { getReportParticipantsTitle } from './reportUtils'; /** * OptionsListUtils is used to build a list options passed to the OptionsList component. Several different UI views can @@ -78,7 +78,7 @@ function getSearchText(report, personalDetailList) { * @param {Boolean} showChatPreviewLine * @returns {Object} */ -function createOption(personalDetailList, report, draftComments, activeReportID, {showChatPreviewLine = false}) { +function createOption(personalDetailList, report, draftComments, activeReportID, { showChatPreviewLine = false }) { const hasMultipleParticipants = personalDetailList.length > 1; const personalDetail = personalDetailList[0]; const hasDraftComment = report @@ -86,7 +86,7 @@ function createOption(personalDetailList, report, draftComments, activeReportID, && draftComments && lodashGet(draftComments, `${ONYXKEYS.COLLECTION.REPORT_DRAFT_COMMENT}${report.reportID}`, '').length > 0; - const lastActorDetails = report ? _.find(personalDetailList, {login: report.lastActorEmail}) : null; + const lastActorDetails = report ? _.find(personalDetailList, { login: report.lastActorEmail }) : null; const lastMessageText = report ? (hasMultipleParticipants && lastActorDetails ? `${lastActorDetails.displayName}: ` @@ -213,7 +213,7 @@ function getOptions(reports, personalDetails, draftComments, activeReportID, { )); // Always exclude already selected options and the currently logged in user - const loginOptionsToExclude = [...selectedOptions, {login: currentUserLogin}]; + const loginOptionsToExclude = [...selectedOptions, { login: currentUserLogin }]; if (includeRecentReports) { for (let i = 0; i < allReportOptions.length; i++) { // Stop adding options to the recentReports array when we reach the maxRecentReportsToShow value @@ -248,7 +248,7 @@ function getOptions(reports, personalDetails, draftComments, activeReportID, { // Add this login to the exclude list so it won't appear when we process the personal details if (reportOption.login) { - loginOptionsToExclude.push({login: reportOption.login}); + loginOptionsToExclude.push({ login: reportOption.login }); } } } @@ -263,8 +263,8 @@ function getOptions(reports, personalDetails, draftComments, activeReportID, { // Next loop over all personal details removing any that are selectedUsers or recentChats _.each(allPersonalDetailsOptions, (personalDetailOption) => { if (_.some(loginOptionsToExclude, loginOptionToExclude => ( - loginOptionToExclude.login === personalDetailOption.login - ))) { + loginOptionToExclude.login === personalDetailOption.login + ))) { return; } @@ -407,16 +407,21 @@ function getSidebarOptions(reports, personalDetails, draftComments, activeReport * * @param {Boolean} hasSelectableOptions * @param {Boolean} hasUserToInvite + * @param {String} searchValue * @param {Boolean} [maxParticipantsReached] * @return {String} */ -function getHeaderMessage(hasSelectableOptions, hasUserToInvite, maxParticipantsReached = false) { +function getHeaderMessage(hasSelectableOptions, hasUserToInvite, searchValue, maxParticipantsReached = false) { if (maxParticipantsReached) { return CONST.MESSAGES.MAXIMUM_PARTICIPANTS_REACHED; } if (!hasSelectableOptions && !hasUserToInvite) { - return CONST.MESSAGES.NO_CONTACTS_FOUND; + if (/^\d+$/.test(searchValue)) { + return CONST.MESSAGES.NO_PHONE_NUMBER; + } + + return searchValue; } return ''; @@ -429,4 +434,4 @@ export { getSidebarOptions, getHeaderMessage, getPersonalDetailsForLogins, -}; +}; \ No newline at end of file diff --git a/src/pages/NewChatPage.js b/src/pages/NewChatPage.js index 9a428e7d71b6..01862777d905 100644 --- a/src/pages/NewChatPage.js +++ b/src/pages/NewChatPage.js @@ -1,14 +1,14 @@ -import React, {Component} from 'react'; -import {View} from 'react-native'; +import React, { Component } from 'react'; +import { View } from 'react-native'; import PropTypes from 'prop-types'; -import {withOnyx} from 'react-native-onyx'; +import { withOnyx } from 'react-native-onyx'; import OptionsSelector from '../components/OptionsSelector'; -import {getNewChatOptions, getHeaderMessage} from '../libs/OptionsListUtils'; +import { getNewChatOptions, getHeaderMessage } from '../libs/OptionsListUtils'; import ONYXKEYS from '../ONYXKEYS'; import styles from '../styles/styles'; -import {fetchOrCreateChatReport} from '../libs/actions/Report'; +import { fetchOrCreateChatReport } from '../libs/actions/Report'; import KeyboardSpacer from '../components/KeyboardSpacer'; -import withWindowDimensions, {windowDimensionsPropTypes} from '../components/withWindowDimensions'; +import withWindowDimensions, { windowDimensionsPropTypes } from '../components/withWindowDimensions'; import HeaderWithCloseButton from '../components/HeaderWithCloseButton'; import Navigation from '../libs/Navigation/Navigation'; import ScreenWrapper from '../components/ScreenWrapper'; @@ -77,7 +77,7 @@ class NewChatPage extends Component { title: 'CONTACTS', data: this.state.personalDetails, shouldShow: this.state.personalDetails.length > 0, - indexOffset: sections.reduce((prev, {data}) => prev + data.length, 0), + indexOffset: sections.reduce((prev, { data }) => prev + data.length, 0), }); if (this.state.userToInvite) { @@ -108,6 +108,7 @@ class NewChatPage extends Component { const headerMessage = getHeaderMessage( this.state.personalDetails.length !== 0, Boolean(this.state.userToInvite), + this.state.searchValue ); return ( @@ -119,24 +120,24 @@ class NewChatPage extends Component { { - const { - personalDetails, - userToInvite, - } = getNewChatOptions( - this.props.reports, - this.props.personalDetails, - searchValue, - ); - this.setState({ - searchValue, - userToInvite, - personalDetails, - }); + const { + personalDetails, + userToInvite, + } = getNewChatOptions( + this.props.reports, + this.props.personalDetails, + searchValue, + ); + this.setState({ + searchValue, + userToInvite, + personalDetails, + }); }} - headerMessage={headerMessage} + headerMessage = { headerMessage } hideSectionHeaders disableArrowKeysActions hideAdditionalOptionStates @@ -161,4 +162,4 @@ export default withWindowDimensions(withOnyx({ session: { key: ONYXKEYS.SESSION, }, -})(NewChatPage)); +})(NewChatPage)); \ No newline at end of file