diff --git a/src/components/Player.js b/src/components/Player.js index 488245c..9cc616f 100644 --- a/src/components/Player.js +++ b/src/components/Player.js @@ -15,21 +15,18 @@ export default function Player(props) { function onError() { const internalPlayer = props.playerRef.current?.getInternalPlayer() const videoUrl = internalPlayer.getVideoUrl() - if (!videoUrl) return - const videoId = getVideoId(videoUrl) - const currentVideoIndex = internalPlayer.getPlaylistIndex() + const currentVideoIndex = internalPlayer.getPlaylistIndex() // use JS destructuring syntax to exclude the `description` property from the rest of the object, it can be too long const { description, ...destructuredVideo } = props.videos[currentVideoIndex] - const errorMessage = `BROKEN VIDEO: ${videoId}, videoUrl: ${videoUrl}, video: ${JSON.stringify(destructuredVideo)}` + const errorMessage = `BROKEN VIDEO: ${videoId}, index: ${currentVideoIndex}, videoUrl: ${videoUrl}, video: ${JSON.stringify(destructuredVideo)}` console.log(errorMessage) Honeybadger.notify(errorMessage); - if (currentVideoIndex === 0) { - console.log("Recovering from broken first video...") - props.onErrorRecovery() + if (currentVideoIndex === 0 || !videoUrl) { + window.location.reload() } else { internalPlayer.nextVideo() } diff --git a/src/hooks/UseVideoDataFetcher.js b/src/hooks/UseVideoDataFetcher.js index e30e816..7a7e376 100644 --- a/src/hooks/UseVideoDataFetcher.js +++ b/src/hooks/UseVideoDataFetcher.js @@ -12,18 +12,13 @@ const initialFetchResult = { export default function useVideoDataFetcher(selectedPlaylistIds) { const [playlistIds, setPlaylistIds] = useState(selectedPlaylistIds) const [fetchResult, setFetchResult] = useState(initialFetchResult) - const [refetchTrigger, setRefetchTrigger] = useState(false) // Effect hook for fetching data when playlist IDs change useEffect(() => { fetchData(playlistIds, setFetchResult) - }, [playlistIds, refetchTrigger]) + }, [playlistIds]) - function triggerRefetch() { - setRefetchTrigger(!refetchTrigger) - } - - return [fetchResult, setPlaylistIds, triggerRefetch] + return [fetchResult, setPlaylistIds] } async function fetchData(playlistIds, setFetchResult) { diff --git a/src/hooks/UseVideoPlayer.js b/src/hooks/UseVideoPlayer.js index 0452725..5ee3544 100644 --- a/src/hooks/UseVideoPlayer.js +++ b/src/hooks/UseVideoPlayer.js @@ -3,7 +3,7 @@ import useVideoDataFetcher from '../hooks/UseVideoDataFetcher' export default function useVideoPlayer(selectedPlaylistIds) { const [currentVideos, setCurrentVideos] = useState([]) - const [videoFetchResult, setVideoFetchPlaylistIds, triggerRefetch] = useVideoDataFetcher(selectedPlaylistIds) + const [videoFetchResult, setVideoFetchPlaylistIds] = useVideoDataFetcher(selectedPlaylistIds) useEffect(shuffleVideos, [videoFetchResult]) @@ -27,7 +27,6 @@ export default function useVideoPlayer(selectedPlaylistIds) { return { currentVideos, setVideoFetchPlaylistIds, - triggerRefetch, isLoaded: videoFetchResult.isLoaded } } \ No newline at end of file diff --git a/src/pages/ShufflePlayer.js b/src/pages/ShufflePlayer.js index ddf351b..d9575f8 100644 --- a/src/pages/ShufflePlayer.js +++ b/src/pages/ShufflePlayer.js @@ -19,7 +19,7 @@ export default function ShufflePlayer() { const [selectedPlaylistIds, setSelectedPlaylistIds] = useLocalStorage(AppConstants.SelectedPlaylistIdsKey, []) const [playlists, setPlaylists] = usePlaylistDataFetcher(selectedPlaylistIds) - const { currentVideos, setVideoFetchPlaylistIds, triggerRefetch, isLoaded } = useVideoPlayer(selectedPlaylistIds) + const { currentVideos, setVideoFetchPlaylistIds, isLoaded } = useVideoPlayer(selectedPlaylistIds) if (!isLoaded) { return @@ -32,7 +32,6 @@ export default function ShufflePlayer() { hideVideo={hideVideo} playerRef={playerRef} setCurrentVideo={setCurrentVideo} - onErrorRecovery={triggerRefetch} />