From 547f132b2ee4de00d96c03b24fb6ef72d78af7bc Mon Sep 17 00:00:00 2001
From: Ionatan Wiznia <ionatan@expensify.com>
Date: Wed, 21 Feb 2024 16:36:21 +0100
Subject: [PATCH] Merge pull request #36940 from tienifr/fix/36868

Fix: Context menu not appear on long press video
(cherry picked from commit 57071143a76910f236c44ce8b4b89e2dccbf3d12)
---
 .../VideoPlayerThumbnail.js                   | 45 ++++++++++++-------
 1 file changed, 29 insertions(+), 16 deletions(-)

diff --git a/src/components/VideoPlayerPreview/VideoPlayerThumbnail.js b/src/components/VideoPlayerPreview/VideoPlayerThumbnail.js
index 9e6069e4d979..595442c317d5 100644
--- a/src/components/VideoPlayerPreview/VideoPlayerThumbnail.js
+++ b/src/components/VideoPlayerPreview/VideoPlayerThumbnail.js
@@ -5,7 +5,11 @@ import Icon from '@components/Icon';
 import * as Expensicons from '@components/Icon/Expensicons';
 import Image from '@components/Image';
 import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback';
+import {ShowContextMenuContext, showContextMenuForReport} from '@components/ShowContextMenuContext';
 import useThemeStyles from '@hooks/useThemeStyles';
+import ControlSelection from '@libs/ControlSelection';
+import * as DeviceCapabilities from '@libs/DeviceCapabilities';
+import * as ReportUtils from '@libs/ReportUtils';
 import variables from '@styles/variables';
 import CONST from '@src/CONST';
 
@@ -35,22 +39,31 @@ function VideoPlayerThumbnail({thumbnailUrl, onPress, accessibilityLabel}) {
                     />
                 </View>
             )}
-            <PressableWithoutFeedback
-                style={[styles.videoThumbnailContainer]}
-                accessibilityLabel={accessibilityLabel}
-                accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON}
-                onPress={onPress}
-            >
-                <View style={[styles.videoThumbnailPlayButton]}>
-                    <Icon
-                        src={Expensicons.Play}
-                        fill="white"
-                        width={variables.iconSizeXLarge}
-                        height={variables.iconSizeXLarge}
-                        additionalStyles={[styles.ml1]}
-                    />
-                </View>
-            </PressableWithoutFeedback>
+            <ShowContextMenuContext.Consumer>
+                {({anchor, report, action, checkIfContextMenuActive}) => (
+                    <PressableWithoutFeedback
+                        style={[styles.videoThumbnailContainer]}
+                        accessibilityLabel={accessibilityLabel}
+                        accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON}
+                        onPress={onPress}
+                        onPressIn={() => DeviceCapabilities.canUseTouchScreen() && ControlSelection.block()}
+                        onPressOut={() => ControlSelection.unblock()}
+                        onLongPress={(event) =>
+                            showContextMenuForReport(event, anchor, (report && report.reportID) || '', action, checkIfContextMenuActive, ReportUtils.isArchivedRoom(report))
+                        }
+                    >
+                        <View style={[styles.videoThumbnailPlayButton]}>
+                            <Icon
+                                src={Expensicons.Play}
+                                fill="white"
+                                width={variables.iconSizeXLarge}
+                                height={variables.iconSizeXLarge}
+                                additionalStyles={[styles.ml1]}
+                            />
+                        </View>
+                    </PressableWithoutFeedback>
+                )}
+            </ShowContextMenuContext.Consumer>
         </View>
     );
 }