From 96fda980905d0c7a30813c364c6623dda695012f Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Fri, 29 Jan 2021 15:14:26 -0800 Subject: full screen; with button; needs refresh&alignment; --- src/screens/profile/FriendsListScreen.tsx | 67 ++++++++++++++++++++++++------- 1 file changed, 52 insertions(+), 15 deletions(-) (limited to 'src/screens') diff --git a/src/screens/profile/FriendsListScreen.tsx b/src/screens/profile/FriendsListScreen.tsx index f7192d10..ac3504d5 100644 --- a/src/screens/profile/FriendsListScreen.tsx +++ b/src/screens/profile/FriendsListScreen.tsx @@ -1,14 +1,21 @@ import React, {useState} from 'react'; -import {RouteProp} from '@react-navigation/native'; +import {RouteProp, useNavigation} from '@react-navigation/native'; import {TabsGradient, Friends, CenteredView} from '../../components'; import {ScrollView} from 'react-native-gesture-handler'; -import {SCREEN_HEIGHT} from '../../utils'; -import {StyleSheet, View} from 'react-native'; +import {SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils'; +import { + SafeAreaView, + StyleSheet, + Text, + TouchableOpacity, + View, +} from 'react-native'; import {ProfileStackParams} from '../../routes'; import {ProfilePreviewType} from '../../types'; import {EMPTY_PROFILE_PREVIEW_LIST} from '../../store/initialStates'; import {useSelector} from 'react-redux'; import {RootState} from '../../store/rootReducer'; +import BackIcon from '../../assets/icons/back-arrow.svg'; type FriendsListScreenRouteProp = RouteProp< ProfileStackParams, @@ -20,28 +27,39 @@ interface FriendsListScreenProps { const FriendsListScreen: React.FC = ({route}) => { const {userXId, screenType} = route.params; + const navigation = useNavigation(); const {friends} = userXId ? useSelector((state: RootState) => state.userX[screenType][userXId]) : useSelector((state: RootState) => state.friends); return ( - - - - - - - - + + + + { + navigation.pop(); + }}> + + + Friends + + + + + + + ); }; const styles = StyleSheet.create({ + background: { + backgroundColor: 'white', + height: '100%', + }, contentContainer: { paddingBottom: SCREEN_HEIGHT / 15, paddingHorizontal: 15, @@ -66,6 +84,25 @@ const styles = StyleSheet.create({ modalScrollView: { marginBottom: 10, }, + header: {justifyContent: 'center', padding: '3%'}, + headerText: { + position: 'absolute', + alignSelf: 'center', + fontSize: 20.5, + fontWeight: '600', + }, + headerButton: { + width: '5%', + aspectRatio: 1, + padding: 0, + marginLeft: '5%', + alignSelf: 'flex-start', + }, + body: { + width: SCREEN_WIDTH, + height: SCREEN_HEIGHT * 0.8, + paddingTop: '3%', + }, }); export default FriendsListScreen; -- cgit v1.2.3-70-g09d2 From 7361492c3d25f71bb444f5f7e35b3113647318f9 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Mon, 1 Feb 2021 22:02:25 -0800 Subject: fullscreen friends + unfriend button --- src/components/profile/Content.tsx | 2 -- src/components/profile/Friends.tsx | 46 ++++++++++++++----------------- src/components/profile/ProfilePreview.tsx | 12 ++++++-- src/screens/profile/FriendsListScreen.tsx | 13 ++++----- src/store/actions/userFriends.ts | 2 +- src/utils/friends.ts | 3 +- 6 files changed, 36 insertions(+), 42 deletions(-) (limited to 'src/screens') diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx index 56ae1e51..28000dd7 100644 --- a/src/components/profile/Content.tsx +++ b/src/components/profile/Content.tsx @@ -25,11 +25,9 @@ import { import { blockUnblockUser, deleteUserMomentsForCategory, - friendUnfriendUser, loadFriendsData, updateMomentCategories, updateUserXFriends, - updateUserXProfileAllScreens, } from '../../store/actions'; import { EMPTY_MOMENTS_LIST, diff --git a/src/components/profile/Friends.tsx b/src/components/profile/Friends.tsx index ec2b6a68..44ce4e63 100644 --- a/src/components/profile/Friends.tsx +++ b/src/components/profile/Friends.tsx @@ -1,27 +1,27 @@ import React from 'react'; -import {View, StyleSheet, Text, ScrollView} from 'react-native'; +import {View, StyleSheet, ScrollView} from 'react-native'; import {ProfilePreviewType, ScreenType} from '../../types'; import {ProfilePreview} from '..'; -import {useNavigation} from '@react-navigation/native'; import {Button} from 'react-native-elements'; -import {SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils'; +import {normalize, SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils'; import {TAGG_LIGHT_BLUE} from '../../constants'; import {RootState} from '../../store/rootReducer'; import {useDispatch, useStore} from 'react-redux'; import {handleUnfriend} from '../../utils/friends'; +import {NO_USER} from '../../store/initialStates'; interface FriendsProps { result: Array; screenType: ScreenType; - userXId: string; + userId: string; } -const Friends: React.FC = ({result, screenType, userXId}) => { - const navigation = useNavigation(); - +const Friends: React.FC = ({result, screenType, userId}) => { const state: RootState = useStore().getState(); const dispatch = useDispatch(); + const {user: loggedInUser = NO_USER} = state; + return ( = ({result, screenType, userXId}) => { previewType={'Friend'} screenType={screenType} /> -