Fix autoplay-next not working on mobile
## Why The playing URI was being cleared every time we leave the File Page, I believe to prevent the floating from continue playing outside of the File Page. ## Approach Close FileRenderMobile by checking playingUri/primaryURI instead. For the case of livestreams, just display it.
This commit is contained in:
parent
cb441ef5f4
commit
95f90d8a84
4 changed files with 8 additions and 20 deletions
|
@ -5,7 +5,7 @@ import {
|
|||
makeSelectNextUrlForCollectionAndUrl,
|
||||
makeSelectPreviousUrlForCollectionAndUrl,
|
||||
} from 'redux/selectors/collections';
|
||||
import { selectPlayingUri, makeSelectFileRenderModeForUri } from 'redux/selectors/content';
|
||||
import { selectPlayingUri, makeSelectFileRenderModeForUri, selectPrimaryUri } from 'redux/selectors/content';
|
||||
import { selectCostInfoForUri } from 'lbryinc';
|
||||
import { doPlayUri } from 'redux/actions/content';
|
||||
import { doSetMobilePlayerDimensions } from 'redux/actions/app';
|
||||
|
@ -17,6 +17,7 @@ import { selectMobilePlayerDimensions } from 'redux/selectors/app';
|
|||
|
||||
const select = (state, props) => {
|
||||
const playingUri = selectPlayingUri(state);
|
||||
const primaryUri = selectPrimaryUri(state);
|
||||
const uri = playingUri && playingUri.uri;
|
||||
const collectionId = playingUri && playingUri.collectionId;
|
||||
|
||||
|
@ -37,6 +38,7 @@ const select = (state, props) => {
|
|||
claimId,
|
||||
channelClaimId,
|
||||
mobilePlayerDimensions: selectMobilePlayerDimensions(state),
|
||||
primaryUri,
|
||||
playingUri,
|
||||
};
|
||||
};
|
||||
|
|
|
@ -29,6 +29,7 @@ type Props = {
|
|||
activeLivestreamForChannel?: any,
|
||||
channelClaimId?: any,
|
||||
playingUri?: PlayingUri,
|
||||
primaryUri: ?string,
|
||||
mobilePlayerDimensions?: any,
|
||||
doPlayUri: (string) => void,
|
||||
doSetMobilePlayerDimensions: (height: number, width: number) => void,
|
||||
|
@ -48,6 +49,7 @@ export default function FileRenderMobile(props: Props) {
|
|||
activeLivestreamForChannel,
|
||||
channelClaimId,
|
||||
playingUri,
|
||||
primaryUri,
|
||||
mobilePlayerDimensions,
|
||||
doPlayUri,
|
||||
doSetMobilePlayerDimensions,
|
||||
|
@ -145,6 +147,7 @@ export default function FileRenderMobile(props: Props) {
|
|||
!isPlayable ||
|
||||
!uri ||
|
||||
countdownCanceled ||
|
||||
(!isCurrentClaimLive && primaryUri !== playingUri?.uri) || // No floating player on mobile as of now
|
||||
(collectionId && !canViewFile && !nextListUri)
|
||||
) {
|
||||
return null;
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { doSetContentHistoryItem, doSetPrimaryUri, clearPosition, doClearPlayingUri } from 'redux/actions/content';
|
||||
import { doSetContentHistoryItem, doSetPrimaryUri, clearPosition } from 'redux/actions/content';
|
||||
import { withRouter } from 'react-router-dom';
|
||||
import {
|
||||
selectClaimIsNsfwForUri,
|
||||
|
@ -13,11 +13,7 @@ import * as COLLECTIONS_CONSTS from 'constants/collections';
|
|||
import * as SETTINGS from 'constants/settings';
|
||||
import { selectCostInfoForUri, doFetchCostInfoForUri } from 'lbryinc';
|
||||
import { selectShowMatureContent, selectClientSetting } from 'redux/selectors/settings';
|
||||
import {
|
||||
makeSelectFileRenderModeForUri,
|
||||
makeSelectContentPositionForUri,
|
||||
makeSelectIsUriCurrentlyPlaying,
|
||||
} from 'redux/selectors/content';
|
||||
import { makeSelectFileRenderModeForUri, makeSelectContentPositionForUri } from 'redux/selectors/content';
|
||||
import { makeSelectCommentsListTitleForUri, selectSettingsByChannelId } from 'redux/selectors/comments';
|
||||
import { DISABLE_COMMENTS_TAG } from 'constants/tags';
|
||||
import { doSetMobilePlayerDimensions } from 'redux/actions/app';
|
||||
|
@ -49,7 +45,6 @@ const select = (state, props) => {
|
|||
collectionId,
|
||||
position: makeSelectContentPositionForUri(uri)(state),
|
||||
commentsListTitle: makeSelectCommentsListTitleForUri(uri)(state),
|
||||
isPlaying: makeSelectIsUriCurrentlyPlaying(uri)(state),
|
||||
};
|
||||
};
|
||||
|
||||
|
@ -59,7 +54,6 @@ const perform = {
|
|||
doSetPrimaryUri,
|
||||
clearPosition,
|
||||
doSetMobilePlayerDimensions,
|
||||
doClearPlayingUri,
|
||||
};
|
||||
|
||||
export default withRouter(connect(select, perform)(FilePage));
|
||||
|
|
|
@ -70,12 +70,10 @@ export default function FilePage(props: Props) {
|
|||
position,
|
||||
commentsListTitle,
|
||||
settingsByChannelId,
|
||||
isPlaying,
|
||||
doFetchCostInfoForUri,
|
||||
doSetContentHistoryItem,
|
||||
doSetPrimaryUri,
|
||||
clearPosition,
|
||||
doClearPlayingUri,
|
||||
} = props;
|
||||
|
||||
const isMobile = useIsMobile();
|
||||
|
@ -126,15 +124,6 @@ export default function FilePage(props: Props) {
|
|||
doSetPrimaryUri,
|
||||
]);
|
||||
|
||||
React.useEffect(() => {
|
||||
// No floating player on mobile as of now, so clear the playing uri
|
||||
return () => {
|
||||
if (isMobile && isPlaying && RENDER_MODES.FLOATING_MODES.includes(renderMode)) {
|
||||
doClearPlayingUri();
|
||||
}
|
||||
};
|
||||
}, [doClearPlayingUri, isMobile, isPlaying, renderMode]);
|
||||
|
||||
function renderFilePageLayout() {
|
||||
if (RENDER_MODES.FLOATING_MODES.includes(renderMode)) {
|
||||
return (
|
||||
|
|
Loading…
Reference in a new issue