aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/components/comments/CommentTile.tsx9
-rw-r--r--src/components/profile/Friends.tsx28
-rw-r--r--src/routes/main/MainStackNavigator.tsx11
-rw-r--r--src/routes/main/MainStackScreen.tsx8
-rw-r--r--src/screens/profile/CommentReactionScreen.tsx66
-rw-r--r--src/screens/profile/FriendsListScreen.tsx4
-rw-r--r--src/screens/profile/index.ts1
7 files changed, 106 insertions, 21 deletions
diff --git a/src/components/comments/CommentTile.tsx b/src/components/comments/CommentTile.tsx
index 8074a015..688a16e6 100644
--- a/src/components/comments/CommentTile.tsx
+++ b/src/components/comments/CommentTile.tsx
@@ -169,7 +169,14 @@ const CommentTile: React.FC<CommentTileProps> = ({
<Text style={styles.date_time}>{' ' + timePosted}</Text>
</View>
<View style={styles.row}>
- <TouchableOpacity style={styles.row} onPress={() => {}}>
+ <TouchableOpacity
+ style={styles.row}
+ onPress={() => {
+ navigation.navigate('CommentReactionScreen', {
+ comment: commentObject,
+ screenType: screenType,
+ });
+ }}>
<Text style={[styles.date_time, styles.likeCount]}>
{commentObject.reaction_count}
</Text>
diff --git a/src/components/profile/Friends.tsx b/src/components/profile/Friends.tsx
index a7a06567..c9d8e6ae 100644
--- a/src/components/profile/Friends.tsx
+++ b/src/components/profile/Friends.tsx
@@ -21,9 +21,15 @@ interface FriendsProps {
result: Array<ProfilePreviewType>;
screenType: ScreenType;
userId: string | undefined;
+ hideSubheader?: boolean;
}
-const Friends: React.FC<FriendsProps> = ({result, screenType, userId}) => {
+const Friends: React.FC<FriendsProps> = ({
+ result,
+ screenType,
+ userId,
+ hideSubheader,
+}) => {
const state: RootState = useStore().getState();
const dispatch = useDispatch();
const {user: loggedInUser = NO_USER} = state.user;
@@ -85,14 +91,16 @@ const Friends: React.FC<FriendsProps> = ({result, screenType, userId}) => {
{loggedInUser.userId === userId && usersFromContacts.length !== 0 && (
<View style={styles.subheader}>
<View style={styles.addFriendHeaderContainer}>
- <Text style={[styles.subheaderText]}>Contacts on Tagg</Text>
+ <Text style={styles.subheaderText}>Contacts on Tagg</Text>
</View>
<UsersFromContacts />
</View>
)}
- <Text style={[styles.subheaderText, styles.friendsSubheaderText]}>
- Friends
- </Text>
+ {!hideSubheader && (
+ <Text style={[styles.subheaderText, styles.friendsSubheaderText]}>
+ Friends
+ </Text>
+ )}
<ScrollView
keyboardShouldPersistTaps={'always'}
style={styles.scrollView}
@@ -129,7 +137,6 @@ const styles = StyleSheet.create({
alignSelf: 'center',
width: SCREEN_WIDTH * 0.85,
},
- firstScrollView: {},
scrollViewContent: {
alignSelf: 'center',
paddingBottom: SCREEN_HEIGHT / 7,
@@ -142,7 +149,6 @@ const styles = StyleSheet.create({
marginBottom: '3%',
marginTop: '2%',
},
- header: {flexDirection: 'row'},
subheader: {
alignSelf: 'center',
width: SCREEN_WIDTH * 0.85,
@@ -154,20 +160,12 @@ const styles = StyleSheet.create({
fontWeight: '600',
lineHeight: normalize(14.32),
},
- findFriendsButton: {flexDirection: 'row'},
friendsSubheaderText: {
alignSelf: 'center',
width: SCREEN_WIDTH * 0.85,
marginVertical: '1%',
marginBottom: '2%',
},
- findFriendsSubheaderText: {
- marginLeft: '5%',
- color: '#08E2E2',
- fontSize: normalize(12),
- fontWeight: '600',
- lineHeight: normalize(14.32),
- },
container: {
alignSelf: 'center',
flexDirection: 'row',
diff --git a/src/routes/main/MainStackNavigator.tsx b/src/routes/main/MainStackNavigator.tsx
index 1f173569..3b183cc0 100644
--- a/src/routes/main/MainStackNavigator.tsx
+++ b/src/routes/main/MainStackNavigator.tsx
@@ -3,7 +3,12 @@
*/
import {createStackNavigator} from '@react-navigation/stack';
import {Image} from 'react-native-image-crop-picker';
-import {MomentType, ScreenType, SearchCategoryType} from '../../types';
+import {
+ CommentBaseType,
+ MomentType,
+ ScreenType,
+ SearchCategoryType,
+} from '../../types';
export type MainStackParams = {
SuggestedPeople: {
@@ -46,6 +51,10 @@ export type MainStackParams = {
screenType: ScreenType;
comment_id?: string;
};
+ CommentReactionScreen: {
+ comment: CommentBaseType;
+ screenType: ScreenType;
+ };
FriendsListScreen: {
userXId: string | undefined;
screenType: ScreenType;
diff --git a/src/routes/main/MainStackScreen.tsx b/src/routes/main/MainStackScreen.tsx
index f5100e58..d76f9137 100644
--- a/src/routes/main/MainStackScreen.tsx
+++ b/src/routes/main/MainStackScreen.tsx
@@ -12,6 +12,7 @@ import {
CategorySelection,
ChatListScreen,
ChatScreen,
+ CommentReactionScreen,
CreateCustomCategory,
DiscoverUsers,
EditProfile,
@@ -217,6 +218,13 @@ const MainStackScreen: React.FC<MainStackProps> = ({route}) => {
}}
/>
<MainStack.Screen
+ name="CommentReactionScreen"
+ component={CommentReactionScreen}
+ options={{
+ ...headerBarOptions('black', 'Likes'),
+ }}
+ />
+ <MainStack.Screen
name="MomentUploadPrompt"
component={MomentUploadPromptScreen}
initialParams={{screenType}}
diff --git a/src/screens/profile/CommentReactionScreen.tsx b/src/screens/profile/CommentReactionScreen.tsx
new file mode 100644
index 00000000..1bda2a65
--- /dev/null
+++ b/src/screens/profile/CommentReactionScreen.tsx
@@ -0,0 +1,66 @@
+import {RouteProp} from '@react-navigation/native';
+import React, {useEffect, useState} from 'react';
+import {ScrollView, StatusBar, StyleSheet, View} from 'react-native';
+import {SafeAreaView} from 'react-native-safe-area-context';
+import {useSelector, useStore} from 'react-redux';
+import {Friends} from '../../components';
+import {MainStackParams} from '../../routes/main';
+import {RootState} from '../../store/rootReducer';
+import {ProfilePreviewType, ScreenType} from '../../types';
+import {HeaderHeight, SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
+
+/**
+ * Comments Screen for an image uploaded
+ * Displays all comments for a particular moment uploaded by the user followed by a text area to add the comment.
+ * Comment is posted when return is pressed on the keypad.
+ */
+
+type CommentReactionScreenRouteProps = RouteProp<
+ MainStackParams,
+ 'CommentReactionScreen'
+>;
+
+interface CommentReactionScreenProps {
+ route: CommentReactionScreenRouteProps;
+}
+
+const CommentReactionScreen: React.FC<CommentReactionScreenProps> = ({
+ route,
+}) => {
+ const {comment, screenType} = route.params;
+ // const [users, setUsers] = useState<ProfilePreviewType[]>([]);
+ const {friends: users} = useSelector((state: RootState) => state.friends);
+
+ useEffect(() => {}, []);
+
+ console.log(screenType);
+
+ return (
+ <View style={styles.background}>
+ <SafeAreaView>
+ <ScrollView style={styles.container}>
+ <Friends
+ result={users}
+ screenType={screenType}
+ userId={undefined}
+ hideSubheader
+ />
+ </ScrollView>
+ </SafeAreaView>
+ </View>
+ );
+};
+
+const styles = StyleSheet.create({
+ background: {
+ backgroundColor: 'white',
+ width: SCREEN_WIDTH,
+ height: SCREEN_HEIGHT,
+ },
+ container: {
+ marginTop: HeaderHeight,
+ height: SCREEN_HEIGHT - HeaderHeight,
+ },
+});
+
+export default CommentReactionScreen;
diff --git a/src/screens/profile/FriendsListScreen.tsx b/src/screens/profile/FriendsListScreen.tsx
index 1d10bc86..73364f3b 100644
--- a/src/screens/profile/FriendsListScreen.tsx
+++ b/src/screens/profile/FriendsListScreen.tsx
@@ -36,10 +36,6 @@ const FriendsListScreen: React.FC<FriendsListScreenProps> = ({route}) => {
};
const styles = StyleSheet.create({
- background: {
- backgroundColor: 'white',
- height: '100%',
- },
backButton: {
marginLeft: 10,
},
diff --git a/src/screens/profile/index.ts b/src/screens/profile/index.ts
index d5377494..ea0505a2 100644
--- a/src/screens/profile/index.ts
+++ b/src/screens/profile/index.ts
@@ -12,3 +12,4 @@ export {default as PrivacyScreen} from './PrivacyScreen';
export {default as AccountType} from './AccountType';
export {default as CategorySelection} from './CategorySelection';
export {default as CreateCustomCategory} from './CreateCustomCategory';
+export {default as CommentReactionScreen} from './CommentReactionScreen';