Fix positioning

2 files changed, 9 insertions, 14 deletions

diff --git a/src/components/common/MomentTags.tsx b/src/components/common/MomentTags.tsx
index 9fe451a1..defd4b4b 100644
--- a/src/components/common/MomentTags.tsx
+++ b/src/components/common/MomentTags.tsx
@@ -8,7 +8,6 @@ interface MomentTagsProps {
   tags: MomentTagType[];
   imageRef: MutableRefObject<null>;
   deleteFromList?: (user: ProfilePreviewType) => void;
-  onPress?: () => void;
 }
 
 const MomentTags: React.FC<MomentTagsProps> = ({
diff --git a/src/components/moments/MomentPostContent.tsx b/src/components/moments/MomentPostContent.tsx
index a20249e6..6953dca4 100644
--- a/src/components/moments/MomentPostContent.tsx
+++ b/src/components/moments/MomentPostContent.tsx
@@ -1,13 +1,7 @@
 import {useNavigation} from '@react-navigation/native';
 import React, {useEffect, useRef, useState} from 'react';
-import {
-  Image,
-  StyleSheet,
-  Text,
-  TouchableOpacity,
-  View,
-  ViewProps,
-} from 'react-native';
+import {Image, StyleSheet, Text, View, ViewProps} from 'react-native';
+import {TouchableWithoutFeedback} from 'react-native-gesture-handler';
 import Animated, {Easing} from 'react-native-reanimated';
 import {useDispatch, useStore} from 'react-redux';
 import {getCommentsCount, loadMomentTags} from '../../services';
@@ -75,7 +69,7 @@ const MomentPostContent: React.FC<MomentPostContentProps> = ({
     const fade = async () => {
       Animated.timing(fadeValue, {
         toValue: 1,
-        duration: 1000,
+        duration: 250,
         easing: Easing.linear,
       }).start();
     };
@@ -84,8 +78,7 @@ const MomentPostContent: React.FC<MomentPostContentProps> = ({
 
   return (
     <View style={[styles.container, style]}>
-      <TouchableOpacity
-        activeOpacity={1}
+      <TouchableWithoutFeedback
         onPress={() => {
           setVisible(!visible);
           setFadeValue(new Animated.Value(0));
@@ -96,9 +89,9 @@ const MomentPostContent: React.FC<MomentPostContentProps> = ({
           source={{uri: pathHash}}
           resizeMode={'cover'}
         />
-      </TouchableOpacity>
+      </TouchableWithoutFeedback>
       {visible && (
-        <Animated.View style={{opacity: fadeValue}}>
+        <Animated.View style={[styles.tapTag, {opacity: fadeValue}]}>
           <MomentTags editing={false} tags={tags} imageRef={imageRef} />
         </Animated.View>
       )}
@@ -130,6 +123,9 @@ const styles = StyleSheet.create({
     aspectRatio: 1,
     marginBottom: '3%',
   },
+  tapTag: {
+    position: 'absolute',
+  },
   footerContainer: {
     flexDirection: 'row',
     justifyContent: 'space-between',