diff options
| -rw-r--r-- | src/components/comments/AddComment.tsx | 2 | ||||
| -rw-r--r-- | src/components/common/TaggTypeahead.tsx | 8 | ||||
| -rw-r--r-- | src/utils/comments.tsx | 5 |
3 files changed, 10 insertions, 5 deletions
diff --git a/src/components/comments/AddComment.tsx b/src/components/comments/AddComment.tsx index 9cf10b5e..7e440daf 100644 --- a/src/components/comments/AddComment.tsx +++ b/src/components/comments/AddComment.tsx @@ -123,7 +123,7 @@ const AddComment: React.FC<AddCommentProps> = ({momentId, placeholderText}) => { ); }} inputRef={ref} - partTypes={mentionPartTypes('blue')} + partTypes={mentionPartTypes('blue', ref)} /> <View style={styles.submitButton}> <TouchableOpacity style={styles.submitButton} onPress={addComment}> diff --git a/src/components/common/TaggTypeahead.tsx b/src/components/common/TaggTypeahead.tsx index 7cd99278..bef72851 100644 --- a/src/components/common/TaggTypeahead.tsx +++ b/src/components/common/TaggTypeahead.tsx @@ -8,6 +8,7 @@ import {SCREEN_WIDTH} from '../../utils'; import TaggUserRowCell from './TaggUserRowCell'; const TaggTypeahead: React.FC<MentionSuggestionsProps> = ({ + textRef, keyword, onSuggestionPress, }) => { @@ -19,7 +20,7 @@ const TaggTypeahead: React.FC<MentionSuggestionsProps> = ({ }, [keyword]); const getQuerySuggested = async () => { - if (!keyword || keyword.length < 3) { + if (!keyword) { setResults([]); return; } @@ -41,7 +42,9 @@ const TaggTypeahead: React.FC<MentionSuggestionsProps> = ({ showsVerticalScrollIndicator={false} onLayout={(event) => { setHeight(event.nativeEvent.layout.height); - }}> + }} + keyboardShouldPersistTaps={'always'} + > {results.map((user) => ( <TaggUserRowCell onPress={() => { @@ -50,6 +53,7 @@ const TaggTypeahead: React.FC<MentionSuggestionsProps> = ({ name: user.username, }); setResults([]); + textRef.current.focus(); }} user={user} /> diff --git a/src/utils/comments.tsx b/src/utils/comments.tsx index 0d551682..d7091d1e 100644 --- a/src/utils/comments.tsx +++ b/src/utils/comments.tsx @@ -78,13 +78,14 @@ export const renderTextWithMentions: React.FC<RenderProps> = ({ ); }; -export const mentionPartTypes: (style: 'blue' | 'white') => PartType[] = ( +export const mentionPartTypes: (style: 'blue' | 'white', textRef: any) => PartType[] = ( style, + textRef ) => { return [ { trigger: '@', - renderSuggestions: (props) => <TaggTypeahead {...props} />, + renderSuggestions: (props) => <TaggTypeahead textRef={textRef} {...props} />, allowedSpacesCount: 0, isInsertSpaceAfterMention: true, textStyle: |