Merge pull request #16602 from PrashantMangukiya/prashant-15779

Add Placeholder text and No results found message on Pronouns Search Page
Expensify · Mar 28, 2023 · f67d5df · f67d5df
2 parents 7003d95 + bfc93c7
commit f67d5df
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 0 deletions.
diff --git a/src/languages/en.js b/src/languages/en.js
@@ -348,6 +348,7 @@ export default {
     pronounsPage: {
         pronouns: 'Pronouns',
         isShownOnProfile: 'Your pronouns are shown on your profile.',
+        placeholderText: 'Search to see options',
     },
     contacts: {
         contactMethod: 'Contact method',

diff --git a/src/languages/es.js b/src/languages/es.js
@@ -347,6 +347,7 @@ export default {
     pronounsPage: {
         pronouns: 'Pronombres',
         isShownOnProfile: 'Tus pronombres se muestran en tu perfil.',
+        placeholderText: 'Buscar para ver opciones',
     },
     contacts: {
         contactMethod: 'Método de contacto',

diff --git a/src/pages/settings/Profile/PronounsPage.js b/src/pages/settings/Profile/PronounsPage.js
@@ -106,6 +106,7 @@ class PronounsPage extends Component {
 
     render() {
         const filteredPronounsList = this.getFilteredPronouns();
+        const headerMessage = this.state.searchValue.trim() && !filteredPronounsList.length ? this.props.translate('common.noResultsFound') : '';
 
         return (
             <ScreenWrapper includeSafeAreaPaddingBottom={false}>
@@ -122,6 +123,8 @@ class PronounsPage extends Component {
                         </Text>
                         <OptionsSelector
                             textInputLabel={this.props.translate('pronounsPage.pronouns')}
+                            placeholderText={this.props.translate('pronounsPage.placeholderText')}
+                            headerMessage={headerMessage}
                             sections={[{data: filteredPronounsList}]}
                             value={this.state.searchValue}
                             onSelectRow={this.updatePronouns}