feat(in-128): match videofix

keep-around/9d11a525a1ee745f785976389c40d7a0601133e1
Rita 3 years ago
parent 52c5619b54
commit ef3e40de61
  1. 2
      src/features/MatchPage/store/hooks/useMatchData.tsx
  2. 7
      src/features/MatchPage/store/hooks/useMatchPlaylists.tsx
  3. 11
      src/features/StreamPlayer/hooks/index.tsx
  4. 3
      src/features/StreamPlayer/hooks/useHlsPlayer.tsx

@ -31,7 +31,7 @@ export const useMatchData = (profile: MatchInfo) => {
selectedPlaylist, selectedPlaylist,
setFullMatchPlaylistDuration, setFullMatchPlaylistDuration,
setSelectedPlaylist, setSelectedPlaylist,
} = useMatchPlaylists() } = useMatchPlaylists(profile)
const { events, fetchMatchEvents } = useEvents() const { events, fetchMatchEvents } = useEvents()
const fetchPlaylistsDebounced = useMemo( const fetchPlaylistsDebounced = useMemo(

@ -7,6 +7,7 @@ import isEmpty from 'lodash/isEmpty'
import type { SportTypes } from 'config/sportTypes' import type { SportTypes } from 'config/sportTypes'
import { MatchInfo } from 'requests/getMatchInfo'
import { getMatchPlaylists } from 'requests/getMatchPlaylists' import { getMatchPlaylists } from 'requests/getMatchPlaylists'
import type { Playlists } from 'features/MatchPage/types' import type { Playlists } from 'features/MatchPage/types'
@ -23,7 +24,7 @@ type ArgsFetchMatchPlaylists = {
const initialPlaylists = buildPlaylists(null) const initialPlaylists = buildPlaylists(null)
export const useMatchPlaylists = () => { export const useMatchPlaylists = (profile: MatchInfo) => {
const [matchPlaylists, setMatchPlaylists] = useState<Playlists>(initialPlaylists) const [matchPlaylists, setMatchPlaylists] = useState<Playlists>(initialPlaylists)
const { fetchLexics } = usePlaylistLexics() const { fetchLexics } = usePlaylistLexics()
@ -35,13 +36,13 @@ export const useMatchPlaylists = () => {
const setInitialSeletedPlaylist = useCallback((playlists: Playlists) => { const setInitialSeletedPlaylist = useCallback((playlists: Playlists) => {
setSelectedPlaylist((playlist) => { setSelectedPlaylist((playlist) => {
if (!playlist && !isEmpty(playlists.match)) { if ((!playlist && !isEmpty(playlists.match)) || profile?.live) {
return playlists.match[0] return playlists.match[0]
} }
return playlist return playlist
}) })
return playlists return playlists
}, [setSelectedPlaylist]) }, [profile, setSelectedPlaylist])
const fetchMatchPlaylists = useCallback(({ const fetchMatchPlaylists = useCallback(({
fullMatchDuration, fullMatchDuration,

@ -87,7 +87,6 @@ export const useVideoPlayer = ({
playNextEpisode, playNextEpisode,
selectedPlaylist, selectedPlaylist,
} = useLiveMatch() } = useLiveMatch()
const { lang } = useLexicsStore() const { lang } = useLexicsStore()
const { url } = chapters[0] ?? { url: '' } const { url } = chapters[0] ?? { url: '' }
@ -310,6 +309,16 @@ export const useVideoPlayer = ({
const regURL = /\d{6,20}/gi const regURL = /\d{6,20}/gi
useEffect(() => {
if (isLive) {
setPlayerState({
...initialState,
chapters: chaptersProps,
})
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [isLive])
useEffect(() => { useEffect(() => {
if (((isLive || chapters[0].duration === chaptersProps[0].duration) if (((isLive || chapters[0].duration === chaptersProps[0].duration)
&& chapters[0]?.endOffsetMs === chaptersProps[0]?.endOffsetMs && chapters[0]?.endOffsetMs === chaptersProps[0]?.endOffsetMs

@ -18,7 +18,8 @@ export const useHlsPlayer = (src: string, resumeFrom?: number) => {
newStreamConfig.startPosition = resumeFrom newStreamConfig.startPosition = resumeFrom
} }
return new Hls(newStreamConfig) return new Hls(newStreamConfig)
}, [resumeFrom]) // eslint-disable-next-line react-hooks/exhaustive-deps
}, [resumeFrom, src])
const videoRef = useRef<HTMLVideoElement>(null) const videoRef = useRef<HTMLVideoElement>(null)

Loading…
Cancel
Save