use tag to disable interactions on livestreams
This commit is contained in:
parent
213c336192
commit
28a3db28b7
7 changed files with 34 additions and 7 deletions
|
@ -6,7 +6,9 @@ import {
|
||||||
doPrepareEdit,
|
doPrepareEdit,
|
||||||
selectMyChannelClaims,
|
selectMyChannelClaims,
|
||||||
makeSelectClaimIsStreamPlaceholder,
|
makeSelectClaimIsStreamPlaceholder,
|
||||||
|
makeSelectTagInClaimOrChannelForUri,
|
||||||
} from 'lbry-redux';
|
} from 'lbry-redux';
|
||||||
|
import { DISABLE_COMMENTS_TAG } from 'constants/tags';
|
||||||
import { makeSelectCostInfoForUri } from 'lbryinc';
|
import { makeSelectCostInfoForUri } from 'lbryinc';
|
||||||
import { doSetPlayingUri } from 'redux/actions/content';
|
import { doSetPlayingUri } from 'redux/actions/content';
|
||||||
import { doToast } from 'redux/actions/notifications';
|
import { doToast } from 'redux/actions/notifications';
|
||||||
|
@ -23,6 +25,7 @@ const select = (state, props) => ({
|
||||||
costInfo: makeSelectCostInfoForUri(props.uri)(state),
|
costInfo: makeSelectCostInfoForUri(props.uri)(state),
|
||||||
myChannels: selectMyChannelClaims(state),
|
myChannels: selectMyChannelClaims(state),
|
||||||
isLivestreamClaim: makeSelectClaimIsStreamPlaceholder(props.uri)(state),
|
isLivestreamClaim: makeSelectClaimIsStreamPlaceholder(props.uri)(state),
|
||||||
|
reactionsDisabled: makeSelectTagInClaimOrChannelForUri(props.uri, DISABLE_COMMENTS_TAG)(state),
|
||||||
});
|
});
|
||||||
|
|
||||||
const perform = (dispatch) => ({
|
const perform = (dispatch) => ({
|
||||||
|
|
|
@ -26,6 +26,7 @@ type Props = {
|
||||||
doToast: ({ message: string }) => void,
|
doToast: ({ message: string }) => void,
|
||||||
clearPlayingUri: () => void,
|
clearPlayingUri: () => void,
|
||||||
isLivestreamClaim: boolean,
|
isLivestreamClaim: boolean,
|
||||||
|
reactionsDisabled: boolean,
|
||||||
};
|
};
|
||||||
|
|
||||||
function FileActions(props: Props) {
|
function FileActions(props: Props) {
|
||||||
|
@ -42,6 +43,7 @@ function FileActions(props: Props) {
|
||||||
clearPlayingUri,
|
clearPlayingUri,
|
||||||
doToast,
|
doToast,
|
||||||
isLivestreamClaim,
|
isLivestreamClaim,
|
||||||
|
reactionsDisabled,
|
||||||
} = props;
|
} = props;
|
||||||
const {
|
const {
|
||||||
push,
|
push,
|
||||||
|
@ -82,7 +84,7 @@ function FileActions(props: Props) {
|
||||||
|
|
||||||
const lhsSection = (
|
const lhsSection = (
|
||||||
<>
|
<>
|
||||||
{ENABLE_FILE_REACTIONS && <FileReactions uri={uri} />}
|
{ENABLE_FILE_REACTIONS && !reactionsDisabled && <FileReactions uri={uri} />}
|
||||||
<ClaimSupportButton uri={uri} fileAction />
|
<ClaimSupportButton uri={uri} fileAction />
|
||||||
<Button
|
<Button
|
||||||
button="alt"
|
button="alt"
|
||||||
|
|
|
@ -1,10 +1,12 @@
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import { makeSelectClaimForUri, makeSelectThumbnailForUri } from 'lbry-redux';
|
import { makeSelectClaimForUri, makeSelectTagInClaimOrChannelForUri, makeSelectThumbnailForUri } from 'lbry-redux';
|
||||||
import LivestreamLayout from './view';
|
import LivestreamLayout from './view';
|
||||||
|
import { DISABLE_COMMENTS_TAG } from 'constants/tags';
|
||||||
|
|
||||||
const select = (state, props) => ({
|
const select = (state, props) => ({
|
||||||
claim: makeSelectClaimForUri(props.uri)(state),
|
claim: makeSelectClaimForUri(props.uri)(state),
|
||||||
thumbnail: makeSelectThumbnailForUri(props.uri)(state),
|
thumbnail: makeSelectThumbnailForUri(props.uri)(state),
|
||||||
|
chatDisabled: makeSelectTagInClaimOrChannelForUri(props.uri, DISABLE_COMMENTS_TAG)(state),
|
||||||
});
|
});
|
||||||
|
|
||||||
export default connect(select)(LivestreamLayout);
|
export default connect(select)(LivestreamLayout);
|
||||||
|
|
|
@ -10,10 +10,11 @@ type Props = {
|
||||||
claim: ?StreamClaim,
|
claim: ?StreamClaim,
|
||||||
isLive: boolean,
|
isLive: boolean,
|
||||||
activeViewers: number,
|
activeViewers: number,
|
||||||
|
chatDisabled: boolean,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function LivestreamLayout(props: Props) {
|
export default function LivestreamLayout(props: Props) {
|
||||||
const { claim, uri, isLive, activeViewers } = props;
|
const { claim, uri, isLive, activeViewers, chatDisabled } = props;
|
||||||
const isMobile = useIsMobile();
|
const isMobile = useIsMobile();
|
||||||
|
|
||||||
if (!claim || !claim.signing_channel) {
|
if (!claim || !claim.signing_channel) {
|
||||||
|
@ -36,6 +37,14 @@ export default function LivestreamLayout(props: Props) {
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{Boolean(chatDisabled) && (
|
||||||
|
<div className="help--notice">
|
||||||
|
{__('%channel% has disabled chat for this stream. Enjoy!', {
|
||||||
|
channel: channelName || __('This channel'),
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
{!isLive && (
|
{!isLive && (
|
||||||
<div className="help--notice">
|
<div className="help--notice">
|
||||||
{__("%channel% isn't live right now, but the chat is! Check back later to watch the stream.", {
|
{__("%channel% isn't live right now, but the chat is! Check back later to watch the stream.", {
|
||||||
|
|
|
@ -29,6 +29,7 @@ type Props = {
|
||||||
videoTheaterMode: boolean,
|
videoTheaterMode: boolean,
|
||||||
isMarkdown?: boolean,
|
isMarkdown?: boolean,
|
||||||
livestream?: boolean,
|
livestream?: boolean,
|
||||||
|
chatDisabled: boolean,
|
||||||
rightSide?: Node,
|
rightSide?: Node,
|
||||||
backout: {
|
backout: {
|
||||||
backLabel?: string,
|
backLabel?: string,
|
||||||
|
@ -53,6 +54,7 @@ function Page(props: Props) {
|
||||||
isMarkdown = false,
|
isMarkdown = false,
|
||||||
livestream,
|
livestream,
|
||||||
rightSide,
|
rightSide,
|
||||||
|
chatDisabled,
|
||||||
} = props;
|
} = props;
|
||||||
|
|
||||||
const {
|
const {
|
||||||
|
@ -112,7 +114,7 @@ function Page(props: Props) {
|
||||||
'main--file-page': filePage,
|
'main--file-page': filePage,
|
||||||
'main--markdown': isMarkdown,
|
'main--markdown': isMarkdown,
|
||||||
'main--theater-mode': isOnFilePage && videoTheaterMode && !livestream,
|
'main--theater-mode': isOnFilePage && videoTheaterMode && !livestream,
|
||||||
'main--livestream': livestream,
|
'main--livestream': livestream && !chatDisabled,
|
||||||
})}
|
})}
|
||||||
>
|
>
|
||||||
{children}
|
{children}
|
||||||
|
|
|
@ -1,15 +1,17 @@
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import { doResolveUri, makeSelectClaimForUri } from 'lbry-redux';
|
import { doResolveUri, makeSelectTagInClaimOrChannelForUri, makeSelectClaimForUri } from 'lbry-redux';
|
||||||
import { doSetPlayingUri } from 'redux/actions/content';
|
import { doSetPlayingUri } from 'redux/actions/content';
|
||||||
import { doUserSetReferrer } from 'redux/actions/user';
|
import { doUserSetReferrer } from 'redux/actions/user';
|
||||||
import { selectUserVerifiedEmail } from 'redux/selectors/user';
|
import { selectUserVerifiedEmail } from 'redux/selectors/user';
|
||||||
import { selectHasUnclaimedRefereeReward } from 'redux/selectors/rewards';
|
import { selectHasUnclaimedRefereeReward } from 'redux/selectors/rewards';
|
||||||
|
import { DISABLE_COMMENTS_TAG } from 'constants/tags';
|
||||||
import LivestreamPage from './view';
|
import LivestreamPage from './view';
|
||||||
|
|
||||||
const select = (state, props) => ({
|
const select = (state, props) => ({
|
||||||
hasUnclaimedRefereeReward: selectHasUnclaimedRefereeReward(state),
|
hasUnclaimedRefereeReward: selectHasUnclaimedRefereeReward(state),
|
||||||
isAuthenticated: selectUserVerifiedEmail(state),
|
isAuthenticated: selectUserVerifiedEmail(state),
|
||||||
channelClaim: makeSelectClaimForUri(props.uri)(state),
|
channelClaim: makeSelectClaimForUri(props.uri)(state),
|
||||||
|
chatDisabled: makeSelectTagInClaimOrChannelForUri(props.uri, DISABLE_COMMENTS_TAG)(state),
|
||||||
});
|
});
|
||||||
|
|
||||||
export default connect(select, {
|
export default connect(select, {
|
||||||
|
|
|
@ -14,10 +14,11 @@ type Props = {
|
||||||
isAuthenticated: boolean,
|
isAuthenticated: boolean,
|
||||||
doUserSetReferrer: (string) => void,
|
doUserSetReferrer: (string) => void,
|
||||||
channelClaim: ChannelClaim,
|
channelClaim: ChannelClaim,
|
||||||
|
chatDisabled: boolean,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function LivestreamPage(props: Props) {
|
export default function LivestreamPage(props: Props) {
|
||||||
const { uri, claim, doSetPlayingUri, isAuthenticated, doUserSetReferrer, channelClaim } = props;
|
const { uri, claim, doSetPlayingUri, isAuthenticated, doUserSetReferrer, channelClaim, chatDisabled } = props;
|
||||||
const [activeViewers, setActiveViewers] = React.useState(0);
|
const [activeViewers, setActiveViewers] = React.useState(0);
|
||||||
const [isLive, setIsLive] = React.useState(false);
|
const [isLive, setIsLive] = React.useState(false);
|
||||||
const livestreamChannelId = channelClaim && channelClaim.signing_channel && channelClaim.signing_channel.claim_id;
|
const livestreamChannelId = channelClaim && channelClaim.signing_channel && channelClaim.signing_channel.claim_id;
|
||||||
|
@ -112,7 +113,13 @@ export default function LivestreamPage(props: Props) {
|
||||||
}, [doSetPlayingUri]);
|
}, [doSetPlayingUri]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Page className="file-page" noFooter livestream rightSide={<LivestreamComments uri={uri} />}>
|
<Page
|
||||||
|
className="file-page"
|
||||||
|
noFooter
|
||||||
|
livestream
|
||||||
|
chatDisabled={chatDisabled}
|
||||||
|
rightSide={!chatDisabled && <LivestreamComments uri={uri} />}
|
||||||
|
>
|
||||||
<LivestreamLayout uri={uri} activeViewers={activeViewers} isLive={isLive} />
|
<LivestreamLayout uri={uri} activeViewers={activeViewers} isLive={isLive} />
|
||||||
</Page>
|
</Page>
|
||||||
);
|
);
|
||||||
|
|
Loading…
Reference in a new issue