fix render of toggle. (#819)

Co-authored-by: Thomas Zarebczan <thomas.zarebczan@gmail.com>
This commit is contained in:
AsadUmar 2022-02-07 23:35:17 +05:00 committed by GitHub
parent c67893815b
commit d73504d69c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -135,6 +135,16 @@ function VideoViewer(props: Props) {
breaks because some browsers (e.g. Firefox) block autoplay but leave the player.play Promise pending */
const [replay, setReplay] = useState(false);
const [videoNode, setVideoNode] = useState();
const [localAutoplayNext, setLocalAutoplayNext] = useState(autoplayNext);
const isFirstRender = React.useRef(true);
useEffect(() => {
if (isFirstRender.current) {
isFirstRender.current = false;
return;
}
toggleAutoplayNext();
}, [localAutoplayNext]);
const updateVolumeState = React.useCallback(
debounce((volume, muted) => {
@ -325,7 +335,13 @@ function VideoViewer(props: Props) {
addPlayNextButton(player, doPlayNext);
addPlayPreviousButton(player, doPlayPrevious);
} else {
addAutoplayNextButton(player, toggleAutoplayNext, autoplayNext);
addAutoplayNextButton(
player,
() => {
setLocalAutoplayNext((e) => !e);
},
autoplayNext
);
}
}
}
@ -464,7 +480,7 @@ function VideoViewer(props: Props) {
startMuted={autoplayIfEmbedded}
toggleVideoTheaterMode={toggleVideoTheaterMode}
autoplay={!embedded || autoplayIfEmbedded}
autoplaySetting={autoplayNext}
autoplaySetting={localAutoplayNext}
claimId={claimId}
title={claim && ((claim.value && claim.value.title) || claim.name)}
channelName={channelName}