Add c:disable-comments control tag (#3178)

Co-authored-by: miko <[email protected]>

ui/component/channelEdit/view.jsx

@@ -1,6 +1,7 @@
 // @flow
 import * as MODALS from 'constants/modal_types';
 import * as ICONS from 'constants/icons';
+import * as TAGS from 'constants/tags';
 import React from 'react';
 import classnames from 'classnames';
 import { FormField } from 'component/common/form';
@@ -482,6 +483,7 @@ function ChannelForm(props: Props) {
                       disableAutoFocus
                       limitSelect={MAX_TAG_SELECT}
                       tagsPassedIn={params.tags || []}
+                      excludedControlTags={[TAGS.DISABLE_COMMENTS_TAG]}
                       label={__('Selected Tags')}
                       onRemove={(clickedTag) => {
                         const newTags = params.tags.slice().filter((tag) => tag.name !== clickedTag.name);

ui/component/tagsSearch/view.jsx

@@ -44,6 +44,7 @@ type Props = {
   user: User,
   disableControlTags?: boolean,
   help?: string,
+  excludedControlTags?: Array<string>,
 };
 
 const UNALLOWED_TAGS = ['lbry-first'];
@@ -78,6 +79,7 @@ export default function TagsSearch(props: Props) {
     limitShow = 5,
     disableControlTags,
     help,
+    excludedControlTags = [],
   } = props;
   const [newTag, setNewTag] = useState('');
   const doesTagMatch = (name) => {
@@ -112,8 +114,10 @@ export default function TagsSearch(props: Props) {
     });
   }
 
+  const FILTERED_CONTROL_TAGS = CONTROL_TAGS.filter((tag) => !excludedControlTags.includes(tag));
+
   const controlTagLabels = {};
-  CONTROL_TAGS.map((t) => {
+  FILTERED_CONTROL_TAGS.map((t) => {
     let label;
     if (t === DISABLE_SUPPORT_TAG) {
       label = __('Disable Tipping and Boosting');
@@ -283,7 +287,7 @@ export default function TagsSearch(props: Props) {
           onSelect && ( // onSelect ensures this does not appear on TagFollow
             <fieldset-section>
               <label>{__('Control Tags')}</label>
-              {CONTROL_TAGS.map((t) => (
+              {FILTERED_CONTROL_TAGS.map((t) => (
                 <FormField
                   key={t}
                   name={t}

ui/constants/tags.js

@@ -20,6 +20,7 @@ export const DISABLE_SUPPORT_TAG = 'disable-support';
 export const PREFERENCE_EMBED = 'c:preference-embed';
 export const SCHEDULED_LIVESTREAM_TAG = 'c:scheduled-livestream'; // Deprecated; use 'SCHEDULED_TAGS.LIVE'
 export const LBRY_FIRST_TAG = 'c:lbry-first';
+export const DISABLE_COMMENTS_TAG = 'c:disable-comments';
 export const DISABLE_DOWNLOAD_BUTTON_TAG = 'c:disable-download';
 export const DISABLE_REACTIONS_ALL_TAG = 'c:disable-reactions-all';
 export const DISABLE_REACTIONS_VIDEO_TAG = 'c:disable-reactions-video';
@@ -51,6 +52,7 @@ export const SCHEDULED_TAGS = Object.freeze({
 // Control tags are special tags that are available to the user in some situations.
 export const CONTROL_TAGS = [
   DISABLE_SUPPORT_TAG,
+  DISABLE_COMMENTS_TAG,
   DISABLE_DOWNLOAD_BUTTON_TAG,
   DISABLE_REACTIONS_VIDEO_TAG,
   DISABLE_REACTIONS_COMMENTS_TAG,

ui/page/claim/internal/claimPageComponent/internal/streamClaimPage/index.js

@@ -8,6 +8,7 @@ import {
   selectIsStreamPlaceholderForUri,
   selectCostInfoForUri,
   selectThumbnailForUri,
+  makeSelectTagInClaimOrChannelForUri,
 } from 'redux/selectors/claims';
 import { selectIsClaimBlackListedForUri } from 'lbryinc';
 import { LINKED_COMMENT_QUERY_PARAM, THREAD_COMMENT_QUERY_PARAM } from 'constants/comment';
@@ -16,6 +17,8 @@ import { selectCommentsListTitleForUri, selectCommentsDisabledSettingForChannelI
 import { doToggleAppDrawer } from 'redux/actions/app';
 import { getChannelIdFromClaim } from 'util/claim';
 
+import * as TAGS from 'constants/tags';
+
 import { selectNoRestrictionOrUserIsMemberForContentClaimId } from 'redux/selectors/memberships';
 
 import StreamClaimPage from './view';
@@ -30,14 +33,17 @@ const select = (state, props) => {
 
   const claimId = claim.claim_id;
 
+  const commentSettingDisabled = selectCommentsDisabledSettingForChannelId(state, channelId);
+
   return {
     commentsListTitle: selectCommentsListTitleForUri(state, uri),
     costInfo: selectCostInfoForUri(state, uri),
     thumbnail: selectThumbnailForUri(state, props.uri),
     isMature: selectClaimIsNsfwForUri(state, uri),
     linkedCommentId: urlParams.get(LINKED_COMMENT_QUERY_PARAM),
     renderMode: makeSelectFileRenderModeForUri(uri)(state),
-    commentSettingDisabled: selectCommentsDisabledSettingForChannelId(state, channelId),
+    commentsDisabled:
+      commentSettingDisabled || makeSelectTagInClaimOrChannelForUri(uri, TAGS.DISABLE_COMMENTS_TAG)(state),
     threadCommentId: urlParams.get(THREAD_COMMENT_QUERY_PARAM),
     isProtectedContent: Boolean(selectProtectedContentTagForUri(state, uri)),
     contentUnlocked: claimId && selectNoRestrictionOrUserIsMemberForContentClaimId(state, claimId),

ui/page/claim/internal/claimPageComponent/internal/streamClaimPage/internal/markdownPost/index.js

@@ -2,8 +2,14 @@ import { connect } from 'react-redux';
 
 import { LINKED_COMMENT_QUERY_PARAM, THREAD_COMMENT_QUERY_PARAM } from 'constants/comment';
 
+import * as TAGS from 'constants/tags';
+
 import { selectCommentsDisabledSettingForChannelId } from 'redux/selectors/comments';
-import { selectClaimIsNsfwForUri, selectClaimForUri } from 'redux/selectors/claims';
+import {
+  selectClaimIsNsfwForUri,
+  selectClaimForUri,
+  makeSelectTagInClaimOrChannelForUri,
+} from 'redux/selectors/claims';
 import { selectNoRestrictionOrUserIsMemberForContentClaimId } from 'redux/selectors/memberships';
 import { getChannelIdFromClaim } from 'util/claim';
 
@@ -18,12 +24,15 @@ const select = (state, props) => {
 
   const claimId = claim.claim_id;
 
+  const commentSettingDisabled = selectCommentsDisabledSettingForChannelId(state, getChannelIdFromClaim(claim));
+
   return {
     isMature: selectClaimIsNsfwForUri(state, uri),
     linkedCommentId: urlParams.get(LINKED_COMMENT_QUERY_PARAM),
     threadCommentId: urlParams.get(THREAD_COMMENT_QUERY_PARAM),
     contentUnlocked: claimId && selectNoRestrictionOrUserIsMemberForContentClaimId(state, claimId),
-    commentSettingDisabled: selectCommentsDisabledSettingForChannelId(state, getChannelIdFromClaim(claim)),
+    commentsDisabled:
+      commentSettingDisabled || makeSelectTagInClaimOrChannelForUri(uri, TAGS.DISABLE_COMMENTS_TAG)(state),
   };
 };
 

ui/page/claim/internal/claimPageComponent/internal/streamClaimPage/internal/markdownPost/view.jsx

@@ -14,7 +14,7 @@ type Props = {
   isMature: boolean,
   linkedCommentId?: string,
   threadCommentId?: string,
-  commentSettingDisabled: ?boolean,
+  commentsDisabled: ?boolean,
   contentUnlocked: boolean,
 };
 
@@ -26,7 +26,7 @@ export default function MarkdownPostPage(props: Props) {
     isMature,
     linkedCommentId,
     threadCommentId,
-    commentSettingDisabled,
+    commentsDisabled,
     contentUnlocked,
   } = props;
 
@@ -47,7 +47,7 @@ export default function MarkdownPostPage(props: Props) {
       </PostWrapper>
 
       <div className="file-page__post-comments">
-        {commentSettingDisabled ? (
+        {commentsDisabled ? (
           <Empty text={__('The creator of this content has disabled comments.')} />
         ) : contentUnlocked ? (
           <React.Suspense fallback={null}>

ui/page/claim/internal/claimPageComponent/internal/streamClaimPage/internal/videoPlayers/index.js

@@ -2,11 +2,16 @@ import { connect } from 'react-redux';
 import { withRouter } from 'react-router-dom';
 
 import * as SETTINGS from 'constants/settings';
+import * as TAGS from 'constants/tags';
 
 import { getChannelIdFromClaim } from 'util/claim';
 import { LINKED_COMMENT_QUERY_PARAM, THREAD_COMMENT_QUERY_PARAM } from 'constants/comment';
 
-import { selectClaimIsNsfwForUri, selectClaimForUri } from 'redux/selectors/claims';
+import {
+  selectClaimIsNsfwForUri,
+  selectClaimForUri,
+  makeSelectTagInClaimOrChannelForUri,
+} from 'redux/selectors/claims';
 import { makeSelectFileInfoForUri } from 'redux/selectors/file_info';
 import { selectClientSetting } from 'redux/selectors/settings';
 import {
@@ -32,6 +37,8 @@ const select = (state, props) => {
 
   const claimId = claim.claim_id;
 
+  const commentSettingDisabled = selectCommentsDisabledSettingForChannelId(state, channelId);
+
   return {
     commentsListTitle: selectCommentsListTitleForUri(state, uri),
     fileInfo: makeSelectFileInfoForUri(uri)(state),
@@ -41,7 +48,8 @@ const select = (state, props) => {
     threadCommentId: urlParams.get(THREAD_COMMENT_QUERY_PARAM),
     playingCollectionId,
     position: selectContentPositionForUri(state, uri),
-    commentSettingDisabled: selectCommentsDisabledSettingForChannelId(state, channelId),
+    commentsDisabled:
+      commentSettingDisabled || makeSelectTagInClaimOrChannelForUri(uri, TAGS.DISABLE_COMMENTS_TAG)(state),
     videoTheaterMode: selectClientSetting(state, SETTINGS.VIDEO_THEATER_MODE),
     contentUnlocked: claimId && selectNoRestrictionOrUserIsMemberForContentClaimId(state, claimId),
     isAutoplayCountdownForUri: selectIsAutoplayCountdownForUri(state, uri),

ui/page/claim/internal/claimPageComponent/internal/streamClaimPage/internal/videoPlayers/view.jsx

@@ -34,7 +34,7 @@ type Props = {
   location: { search: string },
   playingCollectionId: ?string,
   position: number,
-  commentSettingDisabled: ?boolean,
+  commentsDisabled: ?boolean,
   videoTheaterMode: boolean,
   contentUnlocked: boolean,
   isAutoplayCountdownForUri: ?boolean,
@@ -52,7 +52,7 @@ export default function VideoPlayersPage(props: Props) {
     linkedCommentId,
     threadCommentId,
     videoTheaterMode,
-    commentSettingDisabled,
+    commentsDisabled,
     audioVideoDuration,
     commentsListTitle,
     isUriPlaying,
@@ -139,7 +139,7 @@ export default function VideoPlayersPage(props: Props) {
             <FileTitleSection uri={uri} accessStatus={accessStatus} />
 
             {contentUnlocked &&
-              (commentSettingDisabled ? (
+              (commentsDisabled ? (
                 <Empty padded={!isMobile} text={__('The creator of this content has disabled comments.')} />
               ) : isMobile && !isLandscapeRotated ? (
                 <React.Fragment>

ui/page/claim/internal/claimPageComponent/internal/streamClaimPage/view.jsx

@@ -30,7 +30,7 @@ type Props = {
   isMature: boolean,
   linkedCommentId?: string,
   renderMode: string,
-  commentSettingDisabled: ?boolean,
+  commentsDisabled: ?boolean,
   threadCommentId?: string,
   isProtectedContent?: boolean,
   contentUnlocked: boolean,
@@ -51,7 +51,7 @@ const StreamClaimPage = (props: Props) => {
     isMature,
     linkedCommentId,
     renderMode,
-    commentSettingDisabled,
+    commentsDisabled,
     threadCommentId,
     isProtectedContent,
     contentUnlocked,
@@ -190,7 +190,7 @@ const StreamClaimPage = (props: Props) => {
           <div className="file-page__secondary-content">
             <section className="file-page__media-actions">
               <React.Suspense fallback={null}>
-                {commentSettingDisabled ? (
+                {commentsDisabled ? (
                   <Empty {...emptyMsgProps} text={__('The creator of this content has disabled comments.')} />
                 ) : isMobile && !isLandscapeRotated ? (
                   <React.Fragment>

ui/redux/selectors/livestream.js

@@ -5,6 +5,8 @@ import { createSelector } from 'reselect';
 import { createCachedSelector } from 're-reselect';
 import { LIVESTREAM_STARTS_SOON_BUFFER, LIVESTREAM_STARTED_RECENTLY_BUFFER } from 'constants/livestream';
 
+import * as TAGS from 'constants/tags';
+
 import {
   selectMyClaims,
   selectPendingClaims,
@@ -14,6 +16,7 @@ import {
   selectClaimReleaseInFutureForUri,
   selectClaimReleaseInPastForUri,
   selectClaimIdForUri,
+  makeSelectTagInClaimOrChannelForUri,
 } from 'redux/selectors/claims';
 import { selectCommentsDisabledSettingForChannelId } from 'redux/selectors/comments';
 
@@ -306,6 +309,8 @@ export const selectChatCommentsDisabledForUri = (state: State, uri: string) => {
   const channelId = selectChannelClaimIdForUri(state, uri);
   if (!channelId) return channelId;
 
-  const commentsDisabled = selectCommentsDisabledSettingForChannelId(state, channelId);
-  return commentsDisabled;
+  const commentSettingDisabled = selectCommentsDisabledSettingForChannelId(state, channelId);
+  const commentsDisabled = makeSelectTagInClaimOrChannelForUri(uri, TAGS.DISABLE_COMMENTS_TAG)(state);
+
+  return commentSettingDisabled || commentsDisabled;
 };