From c9a8f87a29e12bfb78939fa9a94b6f8919b04836 Mon Sep 17 00:00:00 2001
From: Ivan Chen <ivan@tagg.id>
Date: Thu, 4 Feb 2021 16:58:40 -0500
Subject: refactored header styles

# Conflicts:
#	src/components/common/FriendsButton.tsx
#	src/screens/profile/FriendsListScreen.tsx
#	src/screens/profile/MomentCommentsScreen.tsx
---
 src/screens/profile/MomentCommentsScreen.tsx | 27 ++++++++++++++-------------
 1 file changed, 14 insertions(+), 13 deletions(-)

(limited to 'src/screens/profile/MomentCommentsScreen.tsx')

diff --git a/src/screens/profile/MomentCommentsScreen.tsx b/src/screens/profile/MomentCommentsScreen.tsx
index ec193db5..4a902e9e 100644
--- a/src/screens/profile/MomentCommentsScreen.tsx
+++ b/src/screens/profile/MomentCommentsScreen.tsx
@@ -1,5 +1,5 @@
 import {RouteProp, useNavigation} from '@react-navigation/native';
-import React, {useState} from 'react';
+import React, {useEffect, useState} from 'react';
 import {StyleSheet, Text, TouchableOpacity, View} from 'react-native';
 import {SafeAreaView} from 'react-native-safe-area-context';
 import BackIcon from '../../assets/icons/back-arrow.svg';
@@ -7,9 +7,14 @@ import {TabsGradient} from '../../components';
 import {AddComment} from '../../components/';
 import CommentsContainer from '../../components/comments/CommentsContainer';
 import {ADD_COMMENT_TEXT} from '../../constants/strings';
-import {MainStackParams} from '../../routes/main';
+import {headerBarOptions, MainStackParams} from '../../routes/main';
 import {CommentType} from '../../types';
-import {normalize, SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
+import {
+  HeaderHeight,
+  normalize,
+  SCREEN_HEIGHT,
+  SCREEN_WIDTH,
+} from '../../utils';
 
 /**
  * Comments Screen for an image uploaded
@@ -39,19 +44,15 @@ const MomentCommentsScreen: React.FC<MomentCommentsScreenProps> = ({route}) => {
     CommentType | undefined
   >(undefined);
 
+  useEffect(() => {
+    navigation.setOptions({
+      ...headerBarOptions('black', `${commentsLength} Comments`),
+    });
+  }, [commentsLength, navigation]);
+
   return (
     <View style={styles.background}>
       <SafeAreaView>
-        <View style={styles.header}>
-          <TouchableOpacity
-            style={styles.headerButton}
-            onPress={() => {
-              navigation.pop();
-            }}>
-            <BackIcon height={'100%'} width={'100%'} color={'white'} />
-          </TouchableOpacity>
-          <Text style={styles.headerText}>{commentsLength + ' Comments'}</Text>
-        </View>
         <View style={styles.body}>
           <CommentsContainer
             objectId={moment_id}
-- 
cgit v1.2.3-70-g09d2


From c5e4bfbba73090b9fa3d422ddf31aaa915d032df Mon Sep 17 00:00:00 2001
From: Ivan Chen <ivan@tagg.id>
Date: Tue, 9 Feb 2021 14:43:11 -0500
Subject: fixed header styles in several screens

---
 src/routes/main/MainStackScreen.tsx          |  7 +++--
 src/screens/profile/FriendsListScreen.tsx    | 38 +++++++---------------------
 src/screens/profile/MomentCommentsScreen.tsx |  4 +--
 3 files changed, 14 insertions(+), 35 deletions(-)

(limited to 'src/screens/profile/MomentCommentsScreen.tsx')

diff --git a/src/routes/main/MainStackScreen.tsx b/src/routes/main/MainStackScreen.tsx
index b8b471c2..f8f93eb0 100644
--- a/src/routes/main/MainStackScreen.tsx
+++ b/src/routes/main/MainStackScreen.tsx
@@ -2,6 +2,9 @@ import AsyncStorage from '@react-native-community/async-storage';
 import {RouteProp} from '@react-navigation/native';
 import {StackNavigationOptions} from '@react-navigation/stack';
 import React, {useState} from 'react';
+import {StyleSheet, Text} from 'react-native';
+import {normalize} from 'react-native-elements';
+import BackIcon from '../../assets/icons/back-arrow.svg';
 import {
   CaptionScreen,
   CategorySelection,
@@ -20,10 +23,6 @@ import {
 import {ScreenType} from '../../types';
 import {AvatarHeaderHeight, SCREEN_WIDTH} from '../../utils';
 import {MainStack, MainStackParams} from './MainStackNavigator';
-import BackIcon from '../../assets/icons/back-arrow.svg';
-import {StyleSheet, Text} from 'react-native';
-import {normalize} from 'react-native-elements';
-import {StackHeaderOptions} from '@react-navigation/stack/lib/typescript/src/types';
 
 /**
  * Profile : To display the logged in user's profile when the userXId passed in to it is (undefined | null | empty string) else displays profile of the user being visited.
diff --git a/src/screens/profile/FriendsListScreen.tsx b/src/screens/profile/FriendsListScreen.tsx
index 7abe289f..1cfef058 100644
--- a/src/screens/profile/FriendsListScreen.tsx
+++ b/src/screens/profile/FriendsListScreen.tsx
@@ -1,26 +1,14 @@
-import React, {Fragment, useEffect} from 'react';
-import {RouteProp, useNavigation} from '@react-navigation/native';
-import {TabsGradient, Friends} from '../../components';
-import {
-  HeaderHeight,
-  normalize,
-  SCREEN_HEIGHT,
-  SCREEN_WIDTH,
-} from '../../utils';
-import {
-  SafeAreaView,
-  StyleSheet,
-  Text,
-  TouchableOpacity,
-  View,
-} from 'react-native';
-import {ProfileStackParams} from '../../routes';
+import {RouteProp} from '@react-navigation/native';
+import React from 'react';
+import {SafeAreaView, StyleSheet, View} from 'react-native';
 import {useSelector} from 'react-redux';
+import {Friends, TabsGradient} from '../../components';
+import {MainStackParams} from '../../routes';
 import {RootState} from '../../store/rootReducer';
-import BackIcon from '../../assets/icons/back-arrow.svg';
+import {HeaderHeight, SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
 
 type FriendsListScreenRouteProp = RouteProp<
-  ProfileStackParams,
+  MainStackParams,
   'FriendsListScreen'
 >;
 interface FriendsListScreenProps {
@@ -37,17 +25,9 @@ const FriendsListScreen: React.FC<FriendsListScreenProps> = ({route}) => {
   return (
     <>
       <SafeAreaView>
-        <View style={styles.header}>
-          <TouchableOpacity
-            style={styles.headerButton}
-            onPress={() => {
-              navigation.pop();
-            }}>
-            <BackIcon height={'100%'} width={'100%'} color={'white'} />
-          </TouchableOpacity>
-          <Text style={styles.headerText}>Friends</Text>
+        <View style={styles.body}>
+          <Friends result={friends} screenType={screenType} userId={userXId} />
         </View>
-        <Friends result={friends} screenType={screenType} userId={userXId} />
       </SafeAreaView>
       <TabsGradient />
     </>
diff --git a/src/screens/profile/MomentCommentsScreen.tsx b/src/screens/profile/MomentCommentsScreen.tsx
index 4a902e9e..b0208f6f 100644
--- a/src/screens/profile/MomentCommentsScreen.tsx
+++ b/src/screens/profile/MomentCommentsScreen.tsx
@@ -1,8 +1,7 @@
 import {RouteProp, useNavigation} from '@react-navigation/native';
 import React, {useEffect, useState} from 'react';
-import {StyleSheet, Text, TouchableOpacity, View} from 'react-native';
+import {StyleSheet, View} from 'react-native';
 import {SafeAreaView} from 'react-native-safe-area-context';
-import BackIcon from '../../assets/icons/back-arrow.svg';
 import {TabsGradient} from '../../components';
 import {AddComment} from '../../components/';
 import CommentsContainer from '../../components/comments/CommentsContainer';
@@ -111,6 +110,7 @@ const styles = StyleSheet.create({
     fontWeight: '400',
   },
   body: {
+    marginTop: HeaderHeight,
     width: SCREEN_WIDTH * 0.9,
     height: SCREEN_HEIGHT * 0.8,
     paddingTop: '3%',
-- 
cgit v1.2.3-70-g09d2

