diff --git a/src/components/VideoPlayer/BaseVideoPlayer.tsx b/src/components/VideoPlayer/BaseVideoPlayer.tsx index b0d9bcc44485..bad9a1a169c9 100644 --- a/src/components/VideoPlayer/BaseVideoPlayer.tsx +++ b/src/components/VideoPlayer/BaseVideoPlayer.tsx @@ -20,7 +20,7 @@ import VideoPopoverMenu from '@components/VideoPopoverMenu'; import useNetwork from '@hooks/useNetwork'; import useThemeStyles from '@hooks/useThemeStyles'; import addEncryptedAuthTokenToURL from '@libs/addEncryptedAuthTokenToURL'; -import * as DeviceCapabilities from '@libs/DeviceCapabilities'; +import {canUseTouchScreen as canUseTouchScreenLib} from '@libs/DeviceCapabilities'; import CONST from '@src/CONST'; import shouldReplayVideo from './shouldReplayVideo'; import type {VideoPlayerProps, VideoWithOnFullScreenUpdate} from './types'; @@ -86,12 +86,12 @@ function BaseVideoPlayer({ const videoPlayerElementParentRef = useRef(null); const videoPlayerElementRef = useRef(null); const sharedVideoPlayerParentRef = useRef(null); - const canUseTouchScreen = DeviceCapabilities.canUseTouchScreen(); + const canUseTouchScreen = canUseTouchScreenLib(); const isCurrentlyURLSet = currentlyPlayingURL === url; const isUploading = CONST.ATTACHMENT_LOCAL_URL_PREFIX.some((prefix) => url.startsWith(prefix)); const videoStateRef = useRef(null); const {updateVolume, lastNonZeroVolume} = useVolumeContext(); - const {videoPopoverMenuPlayerRef, currentPlaybackSpeed, setCurrentPlaybackSpeed} = useVideoPopoverMenuContext(); + const {videoPopoverMenuPlayerRef, currentPlaybackSpeed, setCurrentPlaybackSpeed, setSource: setPopoverMenuSource} = useVideoPopoverMenuContext(); const {source} = videoPopoverMenuPlayerRef.current?.props ?? {}; const shouldUseNewRate = typeof source === 'number' || !source || source.uri !== sourceURL; @@ -163,6 +163,7 @@ function BaseVideoPlayer({ } setIsPopoverVisible(true); }); + setPopoverMenuSource(url); if (!event || !('nativeEvent' in event)) { return; } diff --git a/src/components/VideoPlayerContexts/VideoPopoverMenuContext.tsx b/src/components/VideoPlayerContexts/VideoPopoverMenuContext.tsx index 42373da91789..310563114849 100644 --- a/src/components/VideoPlayerContexts/VideoPopoverMenuContext.tsx +++ b/src/components/VideoPlayerContexts/VideoPopoverMenuContext.tsx @@ -4,20 +4,20 @@ import type {PopoverMenuItem} from '@components/PopoverMenu'; import type {VideoWithOnFullScreenUpdate} from '@components/VideoPlayer/types'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import addEncryptedAuthTokenToURL from '@libs/addEncryptedAuthTokenToURL'; import fileDownload from '@libs/fileDownload'; import CONST from '@src/CONST'; import type ChildrenProps from '@src/types/utils/ChildrenProps'; -import {usePlaybackContext} from './PlaybackContext'; import type {PlaybackSpeed, VideoPopoverMenuContext} from './types'; const Context = React.createContext(null); function VideoPopoverMenuContextProvider({children}: ChildrenProps) { - const {currentlyPlayingURL} = usePlaybackContext(); const {translate} = useLocalize(); + const [source, setSource] = useState(''); const [currentPlaybackSpeed, setCurrentPlaybackSpeed] = useState(CONST.VIDEO_PLAYER.PLAYBACK_SPEEDS[3]); const {isOffline} = useNetwork(); - const isLocalFile = currentlyPlayingURL && CONST.ATTACHMENT_LOCAL_URL_PREFIX.some((prefix) => currentlyPlayingURL.startsWith(prefix)); + const isLocalFile = source && CONST.ATTACHMENT_LOCAL_URL_PREFIX.some((prefix) => source.startsWith(prefix)); const videoPopoverMenuPlayerRef = useRef(null); const updatePlaybackSpeed = useCallback( @@ -29,15 +29,11 @@ function VideoPopoverMenuContextProvider({children}: ChildrenProps) { ); const downloadAttachment = useCallback(() => { - if (videoPopoverMenuPlayerRef.current === null) { - return; - } - const {source} = videoPopoverMenuPlayerRef.current?.props ?? {}; if (typeof source === 'number' || !source) { return; } - fileDownload(source.uri); - }, [videoPopoverMenuPlayerRef]); + fileDownload(addEncryptedAuthTokenToURL(source)); + }, [source]); const menuItems = useMemo(() => { const items: PopoverMenuItem[] = []; @@ -70,8 +66,8 @@ function VideoPopoverMenuContextProvider({children}: ChildrenProps) { }, [currentPlaybackSpeed, downloadAttachment, translate, updatePlaybackSpeed, isOffline, isLocalFile]); const contextValue = useMemo( - () => ({menuItems, videoPopoverMenuPlayerRef, currentPlaybackSpeed, updatePlaybackSpeed, setCurrentPlaybackSpeed}), - [menuItems, videoPopoverMenuPlayerRef, currentPlaybackSpeed, updatePlaybackSpeed, setCurrentPlaybackSpeed], + () => ({menuItems, videoPopoverMenuPlayerRef, currentPlaybackSpeed, updatePlaybackSpeed, setCurrentPlaybackSpeed, setSource}), + [menuItems, videoPopoverMenuPlayerRef, currentPlaybackSpeed, updatePlaybackSpeed, setCurrentPlaybackSpeed, setSource], ); return {children}; } diff --git a/src/components/VideoPlayerContexts/types.ts b/src/components/VideoPlayerContexts/types.ts index b376e9dd5f14..532d3a0131d3 100644 --- a/src/components/VideoPlayerContexts/types.ts +++ b/src/components/VideoPlayerContexts/types.ts @@ -35,6 +35,7 @@ type VideoPopoverMenuContext = { currentPlaybackSpeed: PlaybackSpeed; updatePlaybackSpeed: (speed: PlaybackSpeed) => void; setCurrentPlaybackSpeed: (speed: PlaybackSpeed) => void; + setSource: (source: string) => void; }; type FullScreenContext = {