adolforeyna/EMI-ExpoAPP
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Prevent post delete swipe from intercepting media gestures

Browse Source
This commit is contained in:
Adolfo Reyna
2026-02-21 21:31:29 -05:00
parent f9d4457b5a
commit 270e4e1c2d
1 changed files with 50 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
components/Post.js
View File

@@ -26,6 +26,7 @@ let Post = (props) => {
let [bookmarked, changeBookmarked] = useState(post.bookmarks && post.bookmarks.includes(viewer._id)); let [bookmarked, changeBookmarked] = useState(post.bookmarks && post.bookmarks.includes(viewer._id));
const isOwner = String(post.profileid || '') === String(viewer?._id || ''); const isOwner = String(post.profileid || '') === String(viewer?._id || '');
const swipeX = useRef(new Animated.Value(0)).current; const swipeX = useRef(new Animated.Value(0)).current;
const mediaGestureActiveRef = useRef(false);
const SWIPE_WIDTH = 86; const SWIPE_WIDTH = 86;
let toProfileText = post.toProfile && post.toProfile !== post.profileid ? let toProfileText = post.toProfile && post.toProfile !== post.profileid ?
<ProfilePhotoCircle profileid={post.toProfile} small={true} /> : undefined; <ProfilePhotoCircle profileid={post.toProfile} small={true} /> : undefined;
@@ -118,6 +119,7 @@ let Post = (props) => {
const panResponder = useMemo(() => PanResponder.create({ const panResponder = useMemo(() => PanResponder.create({
onMoveShouldSetPanResponder: (_, gestureState) => onMoveShouldSetPanResponder: (_, gestureState) =>
isOwner && isOwner &&
!mediaGestureActiveRef.current &&
Math.abs(gestureState.dx) > 8 && Math.abs(gestureState.dx) > 8 &&
Math.abs(gestureState.dx) > Math.abs(gestureState.dy), Math.abs(gestureState.dx) > Math.abs(gestureState.dy),
onPanResponderMove: (_, gestureState) => { onPanResponderMove: (_, gestureState) => {
@@ -171,13 +173,59 @@ let Post = (props) => {
</ParsedText> </ParsedText>
</Pressable> </Pressable>
<View
onStartShouldSetResponderCapture={() => {
mediaGestureActiveRef.current = true;
return false;
}}
onMoveShouldSetResponderCapture={() => {
mediaGestureActiveRef.current = true;
return false;
}}
onResponderRelease={() => {
mediaGestureActiveRef.current = false;
}}
onResponderTerminate={() => {
mediaGestureActiveRef.current = false;
}}
onTouchEnd={() => {
mediaGestureActiveRef.current = false;
}}
onTouchCancel={() => {
mediaGestureActiveRef.current = false;
}}
>
<Media content={post.content} postId={post._id} post={post} style={{ paddingTop: 2 }} /> <Media content={post.content} postId={post._id} post={post} style={{ paddingTop: 2 }} />
</View>
</View> : </View> :
<View> <View>
<Chip icon="new-releases" style={{ width: 100 }} >{i18n.t("message.news")}</Chip> <Chip icon="new-releases" style={{ width: 100 }} >{i18n.t("message.news")}</Chip>
<Text style={{ fontSize: 18 }}>{cleanContent}</Text> <Text style={{ fontSize: 18 }}>{cleanContent}</Text>
<View
onStartShouldSetResponderCapture={() => {
mediaGestureActiveRef.current = true;
return false;
}}
onMoveShouldSetResponderCapture={() => {
mediaGestureActiveRef.current = true;
return false;
}}
onResponderRelease={() => {
mediaGestureActiveRef.current = false;
}}
onResponderTerminate={() => {
mediaGestureActiveRef.current = false;
}}
onTouchEnd={() => {
mediaGestureActiveRef.current = false;
}}
onTouchCancel={() => {
mediaGestureActiveRef.current = false;
}}
>
<Media content={post.content} /> <Media content={post.content} />
</View> </View>
</View>
} }
</Card.Content> </Card.Content>
<Card.Actions style={{ flexDirection: "row", flow: 4, fontSize: 16, marginLeft: 36, marginTop: -10 }}> <Card.Actions style={{ flexDirection: "row", flow: 4, fontSize: 16, marginLeft: 36, marginTop: -10 }}>