From 1080adb75c18f6da6b91be4264c69a9bf908ff0d Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Thu, 18 Mar 2021 02:06:02 -0700 Subject: works --- src/components/friends/InviteFriendTile.tsx | 86 +++++++++++++++++++++++++++++ src/components/friends/index.ts | 1 + 2 files changed, 87 insertions(+) create mode 100644 src/components/friends/InviteFriendTile.tsx create mode 100644 src/components/friends/index.ts (limited to 'src/components/friends') diff --git a/src/components/friends/InviteFriendTile.tsx b/src/components/friends/InviteFriendTile.tsx new file mode 100644 index 00000000..2d2b8e04 --- /dev/null +++ b/src/components/friends/InviteFriendTile.tsx @@ -0,0 +1,86 @@ +import React, {useState} from 'react'; +import { + StyleSheet, + Text, + TouchableOpacity, + TouchableWithoutFeedback, + View, +} from 'react-native'; +import {useSelector} from 'react-redux'; +import {RootState} from '../../store/rootReducer'; +import {TAGG_LIGHT_BLUE} from '../../constants'; +import {inviteFriendService} from '../../services'; +import {normalize} from '../../utils'; + +interface InviteFriendTileProps { + item: Object; +} + +const InviteFriendTile: React.FC = ({item}) => { + const [invited, setInvited] = useState(false); + const {profile} = useSelector((state: RootState) => state.user); + const handleInviteFriend = async () => { + const response = await inviteFriendService( + item.phoneNumber, + item.firstName, + item.lastName, + profile.name, + ); + if (response) { + setInvited(response); + } + }; + + return ( + + + {item.firstName + ' ' + item.lastName} + + + {invited ? 'Invited' : 'Invite'} + + + + + ); +}; + +const styles = StyleSheet.create({ + container: { + flexDirection: 'row', + alignItems: 'center', + justifyContent: 'space-between', + height: normalize(42), + backgroundColor: 'thistle', + }, + label: { + fontWeight: '500', + fontSize: normalize(14), + }, + button: { + alignSelf: 'center', + justifyContent: 'center', + alignItems: 'center', + width: 82, + height: 25, + borderColor: TAGG_LIGHT_BLUE, + borderWidth: 2, + borderRadius: 2, + padding: 0, + backgroundColor: 'transparent', + }, + buttonTitle: { + color: TAGG_LIGHT_BLUE, + padding: 0, + fontSize: normalize(11), + fontWeight: '700', + lineHeight: normalize(13.13), + letterSpacing: normalize(0.6), + paddingHorizontal: '3.8%', + }, +}); + +export default InviteFriendTile; diff --git a/src/components/friends/index.ts b/src/components/friends/index.ts new file mode 100644 index 00000000..42727784 --- /dev/null +++ b/src/components/friends/index.ts @@ -0,0 +1 @@ +export {default as InviteFriendTile} from './InviteFriendTile'; -- cgit v1.2.3-70-g09d2 From ab97d0e0f0dff6ac4fc334fe12b9b93f0c8fc8c4 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Thu, 18 Mar 2021 12:13:40 -0700 Subject: removed thistle color --- src/components/friends/InviteFriendTile.tsx | 1 - 1 file changed, 1 deletion(-) (limited to 'src/components/friends') diff --git a/src/components/friends/InviteFriendTile.tsx b/src/components/friends/InviteFriendTile.tsx index 2d2b8e04..96b73378 100644 --- a/src/components/friends/InviteFriendTile.tsx +++ b/src/components/friends/InviteFriendTile.tsx @@ -54,7 +54,6 @@ const styles = StyleSheet.create({ alignItems: 'center', justifyContent: 'space-between', height: normalize(42), - backgroundColor: 'thistle', }, label: { fontWeight: '500', -- cgit v1.2.3-70-g09d2 From 30916f3809a3712593b45968ba560914d43f3564 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Thu, 18 Mar 2021 12:33:59 -0700 Subject: styling invite friend tile + ph_no unformatted --- src/components/friends/InviteFriendTile.tsx | 21 ++++++++++++++++++++- 1 file changed, 20 insertions(+), 1 deletion(-) (limited to 'src/components/friends') diff --git a/src/components/friends/InviteFriendTile.tsx b/src/components/friends/InviteFriendTile.tsx index 96b73378..0110fb74 100644 --- a/src/components/friends/InviteFriendTile.tsx +++ b/src/components/friends/InviteFriendTile.tsx @@ -34,7 +34,25 @@ const InviteFriendTile: React.FC = ({item}) => { return ( - {item.firstName + ' ' + item.lastName} + + + {item.firstName + ' ' + item.lastName} + + + {item.phoneNumber} + + Date: Thu, 18 Mar 2021 12:49:24 -0700 Subject: added format phone number function --- src/components/friends/InviteFriendTile.tsx | 20 ++++++++++++++++++-- 1 file changed, 18 insertions(+), 2 deletions(-) (limited to 'src/components/friends') diff --git a/src/components/friends/InviteFriendTile.tsx b/src/components/friends/InviteFriendTile.tsx index 0110fb74..c49792f9 100644 --- a/src/components/friends/InviteFriendTile.tsx +++ b/src/components/friends/InviteFriendTile.tsx @@ -1,4 +1,4 @@ -import React, {useState} from 'react'; +import React, {useEffect, useState} from 'react'; import { StyleSheet, Text, @@ -18,6 +18,7 @@ interface InviteFriendTileProps { const InviteFriendTile: React.FC = ({item}) => { const [invited, setInvited] = useState(false); + const [formatedPhoneNumber, setFormattedPhoneNumber] = useState(''); const {profile} = useSelector((state: RootState) => state.user); const handleInviteFriend = async () => { const response = await inviteFriendService( @@ -31,6 +32,21 @@ const InviteFriendTile: React.FC = ({item}) => { } }; + useEffect(() => { + const formatPhoneNumer = () => { + const unformatted_number: string = item.phoneNumber; + const part_one: string = unformatted_number.substring(2, 5); + const part_two: string = unformatted_number.substring(5, 8); + const part_three: string = unformatted_number.substring( + 8, + unformatted_number.length, + ); + const temp = '(' + part_one + ')' + part_two + '-' + part_three; + setFormattedPhoneNumber(temp); + }; + formatPhoneNumer(); + }); + return ( @@ -50,7 +66,7 @@ const InviteFriendTile: React.FC = ({item}) => { color: '#6C6C6C', letterSpacing: normalize(0.1), }}> - {item.phoneNumber} + {formatedPhoneNumber} Date: Thu, 18 Mar 2021 13:44:19 -0700 Subject: Support modified endpoints + refactoring --- src/components/friends/InviteFriendTile.tsx | 2 -- src/components/profile/Friends.tsx | 23 ++++++++------------- src/screens/profile/InviteFriendsScreen.tsx | 32 +++++++++-------------------- src/services/UserFriendsService.ts | 10 +++++---- src/utils/common.ts | 21 ++++++++++++++++++- 5 files changed, 44 insertions(+), 44 deletions(-) (limited to 'src/components/friends') diff --git a/src/components/friends/InviteFriendTile.tsx b/src/components/friends/InviteFriendTile.tsx index c49792f9..f56d3514 100644 --- a/src/components/friends/InviteFriendTile.tsx +++ b/src/components/friends/InviteFriendTile.tsx @@ -19,13 +19,11 @@ interface InviteFriendTileProps { const InviteFriendTile: React.FC = ({item}) => { const [invited, setInvited] = useState(false); const [formatedPhoneNumber, setFormattedPhoneNumber] = useState(''); - const {profile} = useSelector((state: RootState) => state.user); const handleInviteFriend = async () => { const response = await inviteFriendService( item.phoneNumber, item.firstName, item.lastName, - profile.name, ); if (response) { setInvited(response); diff --git a/src/components/profile/Friends.tsx b/src/components/profile/Friends.tsx index 36e0ef8a..7d57177c 100644 --- a/src/components/profile/Friends.tsx +++ b/src/components/profile/Friends.tsx @@ -9,7 +9,12 @@ import {usersFromContactsService} from '../../services'; import {NO_USER} from '../../store/initialStates'; import {RootState} from '../../store/rootReducer'; import {ProfilePreviewType, ScreenType} from '../../types'; -import {normalize, SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils'; +import { + extractContacts, + normalize, + SCREEN_HEIGHT, + SCREEN_WIDTH, +} from '../../utils'; import {handleAddFriend, handleUnfriend} from '../../utils/friends'; import {ProfilePreview} from '../profile'; import FindFriendsBlueIcon from '../../assets/icons/findFriends/find-friends-blue-icon.svg'; @@ -31,24 +36,12 @@ const Friends: React.FC = ({result, screenType, userId}) => { ProfilePreviewType[] >([]); - const extractPhoneNumbers = async () => { - let phoneNumbers: Array = []; - await getAll().then((contacts) => { - contacts.map((contact) => { - contact.phoneNumbers.map(async (phoneNumber) => { - phoneNumbers.push(await phoneNumber.number); - }); - }); - }); - return phoneNumbers; - }; - useEffect(() => { const handleFindFriends = () => { - extractPhoneNumbers().then(async (phoneNumbers) => { + extractContacts().then(async (contacts) => { const permission = await checkPermission(); if (permission === 'authorized') { - let response = await usersFromContactsService(phoneNumbers); + let response = await usersFromContactsService(contacts); await setUsersFromContacts(response.existing_tagg_users); usersFromContacts.map((user) => console.log('user: ', user.username)); } else if (permission === 'undefined') { diff --git a/src/screens/profile/InviteFriendsScreen.tsx b/src/screens/profile/InviteFriendsScreen.tsx index 1a5de1ce..53215d8a 100644 --- a/src/screens/profile/InviteFriendsScreen.tsx +++ b/src/screens/profile/InviteFriendsScreen.tsx @@ -15,6 +15,7 @@ import { import {useDispatch, useStore} from 'react-redux'; import {ContactType, ProfilePreviewType, ScreenType} from '../../types'; import { + extractContacts, handleAddFriend, HeaderHeight, normalize, @@ -53,24 +54,6 @@ const InviteFriendsScreen: React.FC = ({ }); const [query, setQuery] = useState(''); - const extractContacts = async () => { - let retrievedContacts: Array = []; - await getAll().then((contacts) => { - contacts.map((contact) => { - let obj: ContactType = { - first_name: contact.givenName, - last_name: contact.familyName, - }; - contact.phoneNumbers.map(async (phoneNumber) => { - obj.phone_number = phoneNumber.number; - retrievedContacts.push(obj); - console.log('contact: ', obj); - }); - }); - }); - return retrievedContacts; - }; - useEffect(() => { const handleFindFriends = () => { extractContacts().then(async (retrievedContacts) => { @@ -190,7 +173,13 @@ const InviteFriendsScreen: React.FC = ({ - + Sharing is caring, invite friends, and create moments together! @@ -224,9 +213,7 @@ const InviteFriendsScreen: React.FC = ({ - - Add Friends - + Add Friends @@ -257,6 +244,7 @@ const styles = StyleSheet.create({ fontSize: normalize(12), fontWeight: '600', lineHeight: normalize(14.32), + marginBottom: '5%', }, container: { alignSelf: 'center', diff --git a/src/services/UserFriendsService.ts b/src/services/UserFriendsService.ts index 86339868..c6679bef 100644 --- a/src/services/UserFriendsService.ts +++ b/src/services/UserFriendsService.ts @@ -8,7 +8,10 @@ import { INVITE_FRIEND_ENDPOINT, USERS_FROM_CONTACTS_ENDPOINT, } from '../constants'; -import {ERROR_SOMETHING_WENT_WRONG_REFRESH} from '../constants/strings'; +import { + ERROR_SOMETHING_WENT_WRONG, + ERROR_SOMETHING_WENT_WRONG_REFRESH, +} from '../constants/strings'; export const loadFriends = async (userId: string, token: string) => { try { @@ -223,7 +226,6 @@ export const inviteFriendService = async ( phoneNumber: string, inviteeFirstName: string, inviteeLastName: string, - inviterFullName: string, ) => { const token = await AsyncStorage.getItem('token'); const response = await fetch(INVITE_FRIEND_ENDPOINT, { @@ -232,15 +234,15 @@ export const inviteFriendService = async ( Authorization: 'Token ' + token, }, body: JSON.stringify({ - phone_number: phoneNumber, + invitee_phone_number: phoneNumber, invitee_first_name: inviteeFirstName, invitee_last_name: inviteeLastName, - inviter_full_name: inviterFullName, }), }); if (response.status === 201) { const response_body = await response.json(); return response_body; } + Alert.alert(ERROR_SOMETHING_WENT_WRONG); return false; }; diff --git a/src/utils/common.ts b/src/utils/common.ts index c1049c42..5f0e26ba 100644 --- a/src/utils/common.ts +++ b/src/utils/common.ts @@ -1,8 +1,9 @@ -import {NotificationType} from './../types/types'; +import {ContactType, NotificationType} from './../types/types'; import moment from 'moment'; import {Linking} from 'react-native'; import {BROWSABLE_SOCIAL_URLS, TOGGLE_BUTTON_TYPE} from '../constants'; import AsyncStorage from '@react-native-community/async-storage'; +import {getAll} from 'react-native-contacts'; export const getToggleButtonText: ( buttonType: string, @@ -115,3 +116,21 @@ export const shuffle = (array: any[]) => { return array; }; + +export const extractContacts = async () => { + let retrievedContacts: Array = []; + await getAll().then((contacts) => { + contacts.map((contact) => { + let obj: ContactType = { + first_name: contact.givenName, + last_name: contact.familyName, + }; + contact.phoneNumbers.map(async (phoneNumber) => { + obj.phone_number = phoneNumber.number; + retrievedContacts.push(obj); + console.log('contact: ', obj); + }); + }); + }); + return retrievedContacts; +}; -- cgit v1.2.3-70-g09d2 From 8d243eef5db576c053d521d082feb87a1a834558 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Thu, 18 Mar 2021 15:23:18 -0700 Subject: cleaned lint erros --- src/components/friends/InviteFriendTile.tsx | 30 ++++++++++++--------------- src/components/profile/Friends.tsx | 5 +++-- src/screens/profile/InviteFriendsScreen.tsx | 32 ++++++++++++++++++----------- 3 files changed, 36 insertions(+), 31 deletions(-) (limited to 'src/components/friends') diff --git a/src/components/friends/InviteFriendTile.tsx b/src/components/friends/InviteFriendTile.tsx index f56d3514..9613b1ac 100644 --- a/src/components/friends/InviteFriendTile.tsx +++ b/src/components/friends/InviteFriendTile.tsx @@ -6,8 +6,6 @@ import { TouchableWithoutFeedback, View, } from 'react-native'; -import {useSelector} from 'react-redux'; -import {RootState} from '../../store/rootReducer'; import {TAGG_LIGHT_BLUE} from '../../constants'; import {inviteFriendService} from '../../services'; import {normalize} from '../../utils'; @@ -48,24 +46,11 @@ const InviteFriendTile: React.FC = ({item}) => { return ( - + {item.firstName + ' ' + item.lastName} - - {formatedPhoneNumber} - + {formatedPhoneNumber} = ({result, screenType, userId}) => { Add Friends navigation.navigate('InviteFriendsScreen', { screenType: ScreenType.Profile, @@ -176,6 +176,7 @@ const styles = StyleSheet.create({ fontWeight: '600', lineHeight: normalize(14.32), }, + findFriendsButton: {flexDirection: 'row'}, friendsSubheaderText: { alignSelf: 'center', width: SCREEN_WIDTH * 0.85, diff --git a/src/screens/profile/InviteFriendsScreen.tsx b/src/screens/profile/InviteFriendsScreen.tsx index 53215d8a..c98b90f8 100644 --- a/src/screens/profile/InviteFriendsScreen.tsx +++ b/src/screens/profile/InviteFriendsScreen.tsx @@ -13,7 +13,7 @@ import { TouchableWithoutFeedback, } from 'react-native'; import {useDispatch, useStore} from 'react-redux'; -import {ContactType, ProfilePreviewType, ScreenType} from '../../types'; +import {ProfilePreviewType, ScreenType} from '../../types'; import { extractContacts, handleAddFriend, @@ -22,7 +22,7 @@ import { SCREEN_HEIGHT, SCREEN_WIDTH, } from '../../utils'; -import {checkPermission, getAll} from 'react-native-contacts'; +import {checkPermission} from 'react-native-contacts'; import {usersFromContactsService} from '../../services/UserFriendsService'; import {ProfilePreview, TabsGradient} from '../../components'; import Animated from 'react-native-reanimated'; @@ -158,7 +158,7 @@ const InviteFriendsScreen: React.FC = ({ const NonUsersFromContacts = () => ( <> item.phoneNumber} @@ -168,19 +168,13 @@ const InviteFriendsScreen: React.FC = ({ ); return ( - + - - + + Sharing is caring, invite friends, and create moments together! @@ -229,11 +223,25 @@ const InviteFriendsScreen: React.FC = ({ }; const styles = StyleSheet.create({ + mainContainer: {backgroundColor: 'white', height: SCREEN_HEIGHT}, body: { paddingTop: HeaderHeight * 1.3, height: SCREEN_HEIGHT * 0.8, backgroundColor: '#fff', }, + headerContainer: { + width: 319, + height: 42, + alignSelf: 'center', + marginBottom: '2%', + }, + headerText: { + alignSelf: 'center', + width: SCREEN_WIDTH * 0.85, + marginBottom: '5%', + textAlign: 'center', + }, + nonUsersFlatListContainer: {paddingBottom: 130}, subheader: { alignSelf: 'center', width: SCREEN_WIDTH * 0.85, -- cgit v1.2.3-70-g09d2 From ccd7d12fa20591b19ac8c8df0c9146740667f90f Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Thu, 18 Mar 2021 19:35:38 -0400 Subject: scroll view fix, search for case insensitive --- src/components/friends/InviteFriendTile.tsx | 4 ++ src/screens/profile/InviteFriendsScreen.tsx | 62 +++++++++++++---------------- src/services/UserFriendsService.ts | 6 +-- 3 files changed, 34 insertions(+), 38 deletions(-) (limited to 'src/components/friends') diff --git a/src/components/friends/InviteFriendTile.tsx b/src/components/friends/InviteFriendTile.tsx index 9613b1ac..3fbf2e73 100644 --- a/src/components/friends/InviteFriendTile.tsx +++ b/src/components/friends/InviteFriendTile.tsx @@ -1,5 +1,6 @@ import React, {useEffect, useState} from 'react'; import { + Alert, StyleSheet, Text, TouchableOpacity, @@ -7,6 +8,7 @@ import { View, } from 'react-native'; import {TAGG_LIGHT_BLUE} from '../../constants'; +import {ERROR_SOMETHING_WENT_WRONG} from '../../constants/strings'; import {inviteFriendService} from '../../services'; import {normalize} from '../../utils'; @@ -25,6 +27,8 @@ const InviteFriendTile: React.FC = ({item}) => { ); if (response) { setInvited(response); + } else { + Alert.alert(ERROR_SOMETHING_WENT_WRONG); } }; diff --git a/src/screens/profile/InviteFriendsScreen.tsx b/src/screens/profile/InviteFriendsScreen.tsx index a57b72b6..06e98b90 100644 --- a/src/screens/profile/InviteFriendsScreen.tsx +++ b/src/screens/profile/InviteFriendsScreen.tsx @@ -11,6 +11,7 @@ import { Linking, StatusBar, TouchableWithoutFeedback, + ScrollView, } from 'react-native'; import {useDispatch, useStore} from 'react-redux'; import {ProfilePreviewType, ScreenType} from '../../types'; @@ -21,6 +22,7 @@ import { normalize, SCREEN_HEIGHT, SCREEN_WIDTH, + StatusBarHeight, } from '../../utils'; import {checkPermission} from 'react-native-contacts'; import {usersFromContactsService} from '../../services/UserFriendsService'; @@ -79,24 +81,20 @@ const InviteFriendsScreen: React.FC = ({ * Main handler for changes in query. */ useEffect(() => { + console.log('query is now ', query); const search = async () => { if (query.length > 0) { const searchResultsUsers = usersFromContacts.filter( - (item: ProfilePreviewType) => { - if ( - item.first_name.includes(query) || - item.last_name.includes(query) || - item.username.includes(query) - ) { - return item; - } - }, + (item: ProfilePreviewType) => + item.first_name.toLowerCase().includes(query) || + item.last_name.toLowerCase().includes(query) || + item.username.toLowerCase().includes(query), + ); + const searchResultsNonUsers = nonUsersFromContacts.filter( + (item) => + item.firstName.toLowerCase().includes(query) || + item.lastName.toLowerCase().includes(query), ); - const searchResultsNonUsers = nonUsersFromContacts.filter((item) => { - if (item.firstName.includes(query) || item.lastName.includes(query)) { - return item; - } - }); const sanitizedResult = { usersFromContacts: searchResultsUsers, nonUsersFromContacts: searchResultsNonUsers, @@ -138,7 +136,6 @@ const InviteFriendsScreen: React.FC = ({ const filteredUsers = users.filter( (user) => user.username !== item.username, ); - console.log('filteredUsers: ', filteredUsers); setResults({ ...results, usersFromContacts: filteredUsers, @@ -155,24 +152,14 @@ const InviteFriendsScreen: React.FC = ({ ); - const NonUsersFromContacts = () => ( - <> - item.phoneNumber} - renderItem={({item}) => } - /> - - ); - return ( - + - + Sharing is caring, invite friends, and create moments together! @@ -193,7 +180,7 @@ const InviteFriendsScreen: React.FC = ({ autoCapitalize="none" autoCorrect={false} onChangeText={(text) => { - setQuery(text); + setQuery(text.toLowerCase()); }} onBlur={() => { Keyboard.dismiss(); @@ -212,9 +199,16 @@ const InviteFriendsScreen: React.FC = ({ Invite your friends! - + item.phoneNumber} + renderItem={({item}) => } + /> - + @@ -225,8 +219,8 @@ const InviteFriendsScreen: React.FC = ({ const styles = StyleSheet.create({ mainContainer: {backgroundColor: 'white', height: SCREEN_HEIGHT}, body: { - paddingTop: HeaderHeight * 1.3, - height: SCREEN_HEIGHT * 0.8, + paddingTop: 10, + height: SCREEN_HEIGHT, backgroundColor: '#fff', }, headerContainer: { diff --git a/src/services/UserFriendsService.ts b/src/services/UserFriendsService.ts index c6679bef..cea20fbe 100644 --- a/src/services/UserFriendsService.ts +++ b/src/services/UserFriendsService.ts @@ -239,10 +239,8 @@ export const inviteFriendService = async ( invitee_last_name: inviteeLastName, }), }); - if (response.status === 201) { - const response_body = await response.json(); - return response_body; + if (response.status === 201 || response.status === 200) { + return await response.json(); } - Alert.alert(ERROR_SOMETHING_WENT_WRONG); return false; }; -- cgit v1.2.3-70-g09d2