Fix empty comments disabled message

ui/component/channelDiscussion/index.js

@@ -2,15 +2,23 @@ import { connect } from 'react-redux';
 import { withRouter } from 'react-router';
 import { DISABLE_COMMENTS_TAG } from 'constants/tags';
 import ChannelDiscussion from './view';
-import { makeSelectTagInClaimOrChannelForUri } from 'redux/selectors/claims';
+import { makeSelectTagInClaimOrChannelForUri, selectClaimForUri } from 'redux/selectors/claims';
+import { selectSettingsByChannelId } from 'redux/selectors/comments';
+import { getChannelIdFromClaim } from 'util/claim';
 
 const select = (state, props) => {
   const { search } = props.location;
   const urlParams = new URLSearchParams(search);
 
+  const claim = selectClaimForUri(state, props.uri);
+  const channelId = getChannelIdFromClaim(claim);
+  const settingsByChannelId = selectSettingsByChannelId(state);
+  const channelSettings = channelId ? settingsByChannelId[channelId] : undefined;
+
   return {
     linkedCommentId: urlParams.get('lc'),
     commentsDisabled: makeSelectTagInClaimOrChannelForUri(props.uri, DISABLE_COMMENTS_TAG)(state),
+    commentSettingDisabled: channelSettings && !channelSettings.comments_enabled,
   };
 };
 

ui/component/channelDiscussion/view.jsx

@@ -9,14 +9,20 @@ type Props = {
   uri: string,
   linkedCommentId?: string,
   commentsDisabled: boolean,
+  commentSettingDisabled?: boolean,
 };
 
 function ChannelDiscussion(props: Props) {
-  const { uri, linkedCommentId, commentsDisabled } = props;
+  const { uri, linkedCommentId, commentsDisabled, commentSettingDisabled } = props;
 
   if (commentsDisabled) {
+    return <Empty text={__('The creator of this content has disabled comments.')} />;
+  }
+
+  if (commentSettingDisabled) {
     return <Empty text={__('This channel has disabled comments on their page.')} />;
   }
+
   return (
     <section className="section">
       <React.Suspense fallback={null}>

ui/component/commentCreate/view.jsx

@@ -16,7 +16,6 @@ import * as MODALS from 'constants/modal_types';
 import Button from 'component/button';
 import classnames from 'classnames';
 import CommentSelectors from './comment-selectors';
-import Empty from 'component/common/empty';
 import React from 'react';
 import type { ElementRef } from 'react';
 import usePersistedState from 'effects/use-persisted-state';
@@ -430,10 +429,6 @@ export function CommentCreate(props: Props) {
   // Render
   // **************************************************************************
 
-  if (channelSettings && !channelSettings.comments_enabled) {
-    return <Empty padded text={__('This channel has disabled comments on their page.')} />;
-  }
-
   if (!isFetchingChannels && !hasChannels) {
     return (
       <div

ui/page/file/index.js

@@ -5,6 +5,7 @@ import {
   selectClaimIsNsfwForUri,
   makeSelectTagInClaimOrChannelForUri,
   selectIsStreamPlaceholderForUri,
+  selectClaimForUri,
 } from 'redux/selectors/claims';
 import { makeSelectFileInfoForUri } from 'redux/selectors/file_info';
 import { makeSelectCollectionForId } from 'redux/selectors/collections';
@@ -13,9 +14,10 @@ import * as SETTINGS from 'constants/settings';
 import { selectCostInfoForUri, doFetchCostInfoForUri } from 'lbryinc';
 import { selectShowMatureContent, selectClientSetting } from 'redux/selectors/settings';
 import { makeSelectFileRenderModeForUri, makeSelectContentPositionForUri } from 'redux/selectors/content';
-import { makeSelectCommentsListTitleForUri } from 'redux/selectors/comments';
+import { makeSelectCommentsListTitleForUri, selectSettingsByChannelId } from 'redux/selectors/comments';
 import { DISABLE_COMMENTS_TAG } from 'constants/tags';
 import { doSetMobilePlayerDimensions } from 'redux/actions/app';
+import { getChannelIdFromClaim } from 'util/claim';
 
 import FilePage from './view';
 
@@ -25,8 +27,10 @@ const select = (state, props) => {
 
   const urlParams = new URLSearchParams(search);
   const collectionId = urlParams.get(COLLECTIONS_CONSTS.COLLECTION_ID);
+  const claim = selectClaimForUri(state, uri);
 
   return {
+    channelId: getChannelIdFromClaim(claim),
     linkedCommentId: urlParams.get('lc'),
     costInfo: selectCostInfoForUri(state, uri),
     obscureNsfw: !selectShowMatureContent(state),
@@ -34,7 +38,8 @@ const select = (state, props) => {
     fileInfo: makeSelectFileInfoForUri(uri)(state),
     renderMode: makeSelectFileRenderModeForUri(uri)(state),
     videoTheaterMode: selectClientSetting(state, SETTINGS.VIDEO_THEATER_MODE),
-    commentsDisabled: makeSelectTagInClaimOrChannelForUri(uri, DISABLE_COMMENTS_TAG)(state),
+    contentCommentsDisabled: makeSelectTagInClaimOrChannelForUri(uri, DISABLE_COMMENTS_TAG)(state),
+    settingsByChannelId: selectSettingsByChannelId(state),
     isLivestream: selectIsStreamPlaceholderForUri(state, uri),
     hasCollectionById: Boolean(makeSelectCollectionForId(collectionId)(state)),
     collectionId,

ui/page/file/view.jsx

@@ -28,6 +28,7 @@ type Props = {
   costInfo: ?{ includesData: boolean, cost: number },
   fileInfo: FileListItem,
   uri: string,
+  channelId?: string,
   renderMode: string,
   obscureNsfw: boolean,
   isMature: boolean,
@@ -36,10 +37,11 @@ type Props = {
   collectionId: string,
   videoTheaterMode: boolean,
   claimIsMine: boolean,
-  commentsDisabled: boolean,
+  contentCommentsDisabled: boolean,
   isLivestream: boolean,
   position: number,
   commentsListTitle: string,
+  settingsByChannelId: { [channelId: string]: PerChannelSettings },
   doFetchCostInfoForUri: (uri: string) => void,
   doSetContentHistoryItem: (uri: string) => void,
   doSetPrimaryUri: (uri: ?string) => void,
@@ -49,6 +51,7 @@ type Props = {
 export default function FilePage(props: Props) {
   const {
     uri,
+    channelId,
     renderMode,
     fileInfo,
     obscureNsfw,
@@ -58,12 +61,13 @@ export default function FilePage(props: Props) {
     videoTheaterMode,
 
     claimIsMine,
-    commentsDisabled,
+    contentCommentsDisabled,
     hasCollectionById,
     collectionId,
     isLivestream,
     position,
     commentsListTitle,
+    settingsByChannelId,
     doFetchCostInfoForUri,
     doSetContentHistoryItem,
     doSetPrimaryUri,
@@ -75,6 +79,8 @@ export default function FilePage(props: Props) {
   // Auto-open the drawer on Mobile view if there is a linked comment
   const [showComments, setShowComments] = React.useState(linkedCommentId);
 
+  const channelSettings = channelId ? settingsByChannelId[channelId] : undefined;
+  const commentSettingDisabled = channelSettings && !channelSettings.comments_enabled;
   const cost = costInfo ? costInfo.cost : null;
   const hasFileInfo = fileInfo !== undefined;
   const isMarkdown = renderMode === RENDER_MODES.MARKDOWN;
@@ -188,6 +194,7 @@ export default function FilePage(props: Props) {
   }
 
   const commentsListProps = { uri, linkedCommentId };
+  const emptyMsgProps = { padded: !isMobile };
 
   return (
     <Page className="file-page" filePage isMarkdown={isMarkdown}>
@@ -213,8 +220,10 @@ export default function FilePage(props: Props) {
               {RENDER_MODES.FLOATING_MODES.includes(renderMode) && <FileTitleSection uri={uri} />}
 
               <React.Suspense fallback={null}>
-                {commentsDisabled ? (
-                  <Empty text={__('The creator of this content has disabled comments.')} />
+                {contentCommentsDisabled ? (
+                  <Empty {...emptyMsgProps} text={__('The creator of this content has disabled comments.')} />
+                ) : commentSettingDisabled ? (
+                  <Empty {...emptyMsgProps} text={__('This channel has disabled comments on their page.')} />
                 ) : isMobile ? (
                   <>
                     <SwipeableDrawer
@@ -240,7 +249,7 @@ export default function FilePage(props: Props) {
 
       {!isMarkdown
         ? !videoTheaterMode && <RightSideContent {...rightSideProps} />
-        : !commentsDisabled && (
+        : !contentCommentsDisabled && (
             <div className="file-page__post-comments">
               <React.Suspense fallback={null}>
                 <CommentsList uri={uri} linkedCommentId={linkedCommentId} commentsAreExpanded />