Merge branch 'master' into tma756-bugfix-onpress-tagg-on-sp

# Conflicts:
#	src/components/taggs/TaggsBar.tsx

4 files changed, 38 insertions, 40 deletions

diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx
index 9c33eabc..05098d14 100644
--- a/src/components/profile/Content.tsx
+++ b/src/components/profile/Content.tsx
@@ -1,14 +1,10 @@
 import React, {useCallback, useEffect, useRef, useState} from 'react';
-import {
-  LayoutChangeEvent,
-  NativeScrollEvent,
-  NativeSyntheticEvent,
-  RefreshControl,
-  StyleSheet,
-} from 'react-native';
-import Animated from 'react-native-reanimated';
+import {LayoutChangeEvent, RefreshControl, StyleSheet} from 'react-native';
+import Animated, {
+  useSharedValue,
+  useAnimatedScrollHandler,
+} from 'react-native-reanimated';
 import {useDispatch, useSelector, useStore} from 'react-redux';
-import {COVER_HEIGHT} from '../../constants';
 import {
   blockUnblockUser,
   loadFriendsData,
@@ -20,12 +16,11 @@ import {
   NO_USER,
 } from '../../store/initialStates';
 import {RootState} from '../../store/rootreducer';
-import {ContentProps} from '../../types';
+import {ScreenType} from '../../types';
 import {
   canViewProfile,
   fetchUserX,
   getUserAsProfilePreviewType,
-  SCREEN_HEIGHT,
   userLogin,
 } from '../../utils';
 import TaggsBar from '../taggs/TaggsBar';
@@ -35,8 +30,13 @@ import ProfileBody from './ProfileBody';
 import ProfileCutout from './ProfileCutout';
 import ProfileHeader from './ProfileHeader';
 import PublicProfile from './PublicProfile';
+import {useScrollToTop} from '@react-navigation/native';
 
-const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
+interface ContentProps {
+  userXId: string | undefined;
+  screenType: ScreenType;
+}
+const Content: React.FC<ContentProps> = ({userXId, screenType}) => {
   const dispatch = useDispatch();
   const {
     user = NO_USER,
@@ -60,12 +60,14 @@ const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
    * If scrolling is enabled. Set to false before scrolling up for the tutorial.
    */
   const [scrollEnabled, setScrollEnabled] = useState<boolean>(true);
+  const y = useSharedValue<number>(0);
 
   /**
    * States
    */
   const [isBlocked, setIsBlocked] = useState<boolean>(false);
   const [profileBodyHeight, setProfileBodyHeight] = useState(0);
+  const [socialsBarHeight, setSocialsBarHeight] = useState(0);
   const [shouldBounce, setShouldBounce] = useState<boolean>(true);
   const [refreshing, setRefreshing] = useState<boolean>(false);
 
@@ -88,6 +90,11 @@ const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
     setProfileBodyHeight(height);
   };
 
+  const onSocialsBarLayout = (e: LayoutChangeEvent) => {
+    const {height} = e.nativeEvent.layout;
+    setSocialsBarHeight(height);
+  };
+
   useEffect(() => {
     const isActuallyBlocked = blockedUsers.some(
       (cur_user) => user.username === cur_user.username,
@@ -103,45 +110,32 @@ const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
    * updateUserXFriends updates friends list for the user.
    */
   const handleBlockUnblock = async (callback?: () => void) => {
-    await dispatch(
+    dispatch(
       blockUnblockUser(
         loggedInUser,
         getUserAsProfilePreviewType(user, profile),
         isBlocked,
       ),
     );
-    await dispatch(loadFriendsData(loggedInUser.userId));
-    await dispatch(updateUserXFriends(user.userId, state));
+    dispatch(loadFriendsData(loggedInUser.userId));
+    dispatch(updateUserXFriends(user.userId, state));
     if (callback) {
       callback();
     }
   };
 
-  const handleScroll = (e: NativeSyntheticEvent<NativeScrollEvent>) => {
-    /**
-     * Set the new y position
-     */
-    const newY = e.nativeEvent.contentOffset.y;
-    y.setValue(newY);
+  const scrollHandler = useAnimatedScrollHandler((event) => {
+    y.value = event.contentOffset.y;
+  });
 
-    /**
-     * Do not allow overflow of scroll on bottom of the screen
-     * SCREEN_HEIGHT - COVER_HEIGHT = Height of the scroll view
-     */
-    if (newY >= SCREEN_HEIGHT - COVER_HEIGHT) {
-      setShouldBounce(false);
-    } else if (newY === 0) {
-      setShouldBounce(true);
-    }
-  };
+  useScrollToTop(scrollViewRef);
 
   return (
     <Animated.ScrollView
       ref={scrollViewRef}
       contentContainerStyle={styles.contentContainer}
       style={styles.container}
-      onScroll={(e) => handleScroll(e)}
-      bounces={shouldBounce}
+      onScroll={scrollHandler}
       showsVerticalScrollIndicator={false}
       scrollEventThrottle={1}
       stickyHeaderIndices={[4]}
@@ -165,7 +159,7 @@ const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
       />
       <TaggsBar
         {...{y, profileBodyHeight, userXId, screenType}}
-        whiteRing={undefined}
+        onLayout={onSocialsBarLayout}
       />
       {canViewProfile(state, userXId, screenType) ? (
         <PublicProfile
@@ -175,6 +169,7 @@ const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
             screenType,
             setScrollEnabled,
             profileBodyHeight,
+            socialsBarHeight,
             scrollViewRef,
           }}
         />
diff --git a/src/components/profile/Cover.tsx b/src/components/profile/Cover.tsx
index ee804ff3..27777b64 100644
--- a/src/components/profile/Cover.tsx
+++ b/src/components/profile/Cover.tsx
@@ -27,7 +27,7 @@ const Cover: React.FC<CoverProps> = ({userXId, screenType}) => {
 
 const styles = StyleSheet.create({
   container: {
-    position: 'absolute',
+    ...StyleSheet.absoluteFillObject,
   },
   image: {
     width: IMAGE_WIDTH,
diff --git a/src/components/profile/Friends.tsx b/src/components/profile/Friends.tsx
index 44f6bb48..c1dca755 100644
--- a/src/components/profile/Friends.tsx
+++ b/src/components/profile/Friends.tsx
@@ -27,7 +27,7 @@ interface FriendsProps {
 const Friends: React.FC<FriendsProps> = ({result, screenType, userId}) => {
   const state: RootState = useStore().getState();
   const dispatch = useDispatch();
-  const {user: loggedInUser = NO_USER} = state;
+  const {user: loggedInUser = NO_USER} = state.user;
   const navigation = useNavigation();
   const [usersFromContacts, setUsersFromContacts] = useState<
     ProfilePreviewType[]
@@ -39,7 +39,7 @@ const Friends: React.FC<FriendsProps> = ({result, screenType, userId}) => {
         const permission = await checkPermission();
         if (permission === 'authorized') {
           let response = await usersFromContactsService(contacts);
-          await setUsersFromContacts(response.existing_tagg_users);
+          setUsersFromContacts(response.existing_tagg_users);
         } else {
           console.log('Authorize access to contacts');
         }
@@ -84,10 +84,10 @@ const Friends: React.FC<FriendsProps> = ({result, screenType, userId}) => {
 
   return (
     <>
-      {loggedInUser.userId === 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>
diff --git a/src/components/profile/PublicProfile.tsx b/src/components/profile/PublicProfile.tsx
index 88e0ecd1..1c49bff5 100644
--- a/src/components/profile/PublicProfile.tsx
+++ b/src/components/profile/PublicProfile.tsx
@@ -35,6 +35,7 @@ const PublicProfile: React.FC<ContentProps> = ({
   screenType,
   setScrollEnabled,
   profileBodyHeight,
+  socialsBarHeight,
   scrollViewRef,
 }) => {
   const dispatch = useDispatch();
@@ -99,11 +100,12 @@ const PublicProfile: React.FC<ContentProps> = ({
               scrollViewRef.current
             ) {
               setScrollEnabled(false);
-              scrollViewRef.current.getNode().scrollTo({y: 0});
+              scrollViewRef.current.scrollTo({y: 0});
               navigation.navigate('MomentUploadPrompt', {
                 screenType,
                 momentCategory: momentCategories[0],
                 profileBodyHeight,
+                socialsBarHeight,
               });
               setIsStageOnePromptClosed(true);
             }
@@ -133,6 +135,7 @@ const PublicProfile: React.FC<ContentProps> = ({
       navigation,
       screenType,
       profileBodyHeight,
+      socialsBarHeight,
       scrollViewRef,
     ]),
   );