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));
const isOwner = String(post.profileid || '') === String(viewer?._id || '');
const swipeX = useRef(new Animated.Value(0)).current;
const mediaGestureActiveRef = useRef(false);
const SWIPE_WIDTH = 86;
let toProfileText = post.toProfile && post.toProfile !== post.profileid ?
<ProfilePhotoCircle profileid={post.toProfile} small={true} /> : undefined;
@@ -118,6 +119,7 @@ let Post = (props) => {
const panResponder = useMemo(() => PanResponder.create({
onMoveShouldSetPanResponder: (_, gestureState) =>
isOwner &&
!mediaGestureActiveRef.current &&
Math.abs(gestureState.dx) > 8 &&
Math.abs(gestureState.dx) > Math.abs(gestureState.dy),
onPanResponderMove: (_, gestureState) => {
@@ -171,13 +173,59 @@ let Post = (props) => {
</ParsedText>
</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 }} />
</View>
</View> :
<View>
<Chip icon="new-releases" style={{ width: 100 }} >{i18n.t("message.news")}</Chip>
<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} />
</View>
</View>
}
</Card.Content>
<Card.Actions style={{ flexDirection: "row", flow: 4, fontSize: 16, marginLeft: 36, marginTop: -10 }}>