diff options
author | Ivan Chen <ivan@tagg.id> | 2021-04-29 19:34:10 -0400 |
---|---|---|
committer | Ivan Chen <ivan@tagg.id> | 2021-05-04 20:48:05 -0400 |
commit | bdc7186d869ff969c3e19cb9a4a8839df51a7f32 (patch) | |
tree | d4db2e472baa37f62785422df5d2a6d530bc6d96 /src/components/common/TaggUserRowCell.tsx | |
parent | f0c5a226d4ae02cd92d92372708056f63d3cd976 (diff) |
completed typeahead
missed import
Diffstat (limited to 'src/components/common/TaggUserRowCell.tsx')
-rw-r--r-- | src/components/common/TaggUserRowCell.tsx | 55 |
1 files changed, 55 insertions, 0 deletions
diff --git a/src/components/common/TaggUserRowCell.tsx b/src/components/common/TaggUserRowCell.tsx new file mode 100644 index 00000000..446f5e87 --- /dev/null +++ b/src/components/common/TaggUserRowCell.tsx @@ -0,0 +1,55 @@ +import React from 'react'; +import {Image, StyleSheet, Text, TouchableOpacity, View} from 'react-native'; +import {ProfilePreviewType} from '../../types'; +import {defaultUserProfile, normalize} from '../../utils'; + +type TaggUserRowCellProps = { + onPress: () => void; + user: ProfilePreviewType; +}; +const TaggUserRowCell: React.FC<TaggUserRowCellProps> = ({onPress, user}) => { + return ( + <TouchableOpacity onPress={onPress} style={styles.container}> + <Image + defaultSource={defaultUserProfile()} + source={{uri: user.thumbnail_url}} + style={styles.image} + /> + <View style={styles.textContent}> + <Text style={styles.username}>{`@${user.username}`}</Text> + <Text style={styles.name}> + {user.first_name} {user.last_name} + </Text> + </View> + </TouchableOpacity> + ); +}; + +const styles = StyleSheet.create({ + container: { + flexDirection: 'row', + paddingHorizontal: 25, + paddingVertical: 15, + width: '100%', + }, + image: { + width: normalize(30), + height: normalize(30), + borderRadius: 30, + }, + textContent: { + flexDirection: 'column', + justifyContent: 'space-between', + marginLeft: 20, + }, + username: { + fontWeight: '500', + fontSize: normalize(14), + }, + name: { + fontWeight: '500', + fontSize: normalize(12), + color: '#828282', + }, +}); +export default TaggUserRowCell; |