feat: channel level blacklisting

Adds awareness to the channel page and also makes the channel level check on the file page.

src/ui/component/channelContent/view.jsx

@@ -5,6 +5,7 @@ import HiddenNsfwClaims from 'component/hiddenNsfwClaims';
 import { withRouter } from 'react-router-dom';
 import Paginate from 'component/common/paginate';
 import Spinner from 'component/spinner';
+import Button from 'component/button';
 
 type Props = {
   uri: string,
@@ -15,10 +16,20 @@ type Props = {
   channelIsBlocked: boolean,
   channelIsMine: boolean,
   fetchClaims: (string, number) => void,
+  channelIsBlackListed: boolean,
 };
 
 function ChannelContent(props: Props) {
-  const { uri, fetching, claimsInChannel, totalPages, channelIsMine, channelIsBlocked, fetchClaims } = props;
+  const {
+    uri,
+    fetching,
+    claimsInChannel,
+    totalPages,
+    channelIsMine,
+    channelIsBlocked,
+    fetchClaims,
+    channelIsBlackListed,
+  } = props;
   const hasContent = Boolean(claimsInChannel && claimsInChannel.length);
   return (
     <Fragment>
@@ -28,12 +39,25 @@ function ChannelContent(props: Props) {
         </section>
       )}
 
-      {!fetching && !hasContent && !channelIsBlocked && (
+      {!fetching && !hasContent && !channelIsBlocked && !channelIsBlackListed && (
         <div className="card--section">
           <h2 className="help">{__("This channel hasn't uploaded anything.")}</h2>
         </div>
       )}
 
+      {!fetching && channelIsBlackListed && (
+        <section className="card card--section">
+          <p>
+            {__(
+              'In response to a complaint we received under the US Digital Millennium Copyright Act, we have blocked access to this channel from our applications.'
+            )}
+          </p>
+          <div className="card__actions">
+            <Button button="link" href="https://lbry.com/faq/dmca" label={__('Read More')} />
+          </div>
+        </section>
+      )}
+
       {!fetching && channelIsBlocked && (
         <div className="card--section">
           <h2 className="help">{__('You have blocked this channel content.')}</h2>
@@ -42,10 +66,10 @@ function ChannelContent(props: Props) {
 
       {!channelIsMine && <HiddenNsfwClaims className="card__subtitle" uri={uri} />}
 
-      {hasContent && !channelIsBlocked && (
+      {hasContent && !channelIsBlocked && !channelIsBlackListed && (
         <ClaimList header={false} uris={claimsInChannel.map(claim => claim.canonical_url)} />
       )}
-      {!channelIsBlocked && (
+      {!channelIsBlocked && !channelIsBlackListed && (
         <Paginate
           onPageChange={page => fetchClaims(uri, page)}
           totalPages={totalPages}

src/ui/component/claimLink/view.jsx

@@ -40,17 +40,15 @@ class ClaimLink extends React.Component<Props> {
 
   isClaimBlackListed() {
     const { claim, blackListedOutpoints } = this.props;
-
+    const signingChannel = claim && claim.signing_channel;
     if (claim && blackListedOutpoints) {
       let blackListed = false;
 
-      for (let i = 0; i < blackListedOutpoints.length; i += 1) {
-        const outpoint = blackListedOutpoints[i];
-        if (outpoint.txid === claim.txid && outpoint.nout === claim.nout) {
-          blackListed = true;
-          break;
-        }
-      }
+      blackListed = blackListedOutpoints.some(
+        outpoint =>
+          (signingChannel && outpoint.txid === signingChannel.txid && outpoint.nout === signingChannel.nout) ||
+          (outpoint.txid === claim.txid && outpoint.nout === claim.nout)
+      );
       return blackListed;
     }
   }

src/ui/component/claimPreview/view.jsx

@@ -96,7 +96,11 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
 
   // This will be replaced once blocking is done at the wallet server level
   if (claim && !shouldHide && blackListedOutpoints) {
-    shouldHide = blackListedOutpoints.some(outpoint => outpoint.txid === claim.txid && outpoint.nout === claim.nout);
+    shouldHide = blackListedOutpoints.some(
+      outpoint =>
+        (signingChannel && outpoint.txid === signingChannel.txid && outpoint.nout === signingChannel.nout) ||
+        (outpoint.txid === claim.txid && outpoint.nout === claim.nout)
+    );
   }
   // We're checking to see if the stream outpoint
   // or signing channel outpoint is in the filter list

src/ui/page/channel/index.js

@@ -8,6 +8,7 @@ import {
   makeSelectClaimForUri,
   selectChannelIsBlocked,
 } from 'lbry-redux';
+import { selectBlackListedOutpoints } from 'lbryinc';
 import { makeSelectIsSubscribed } from 'redux/selectors/subscriptions';
 import ChannelPage from './view';
 
@@ -20,6 +21,7 @@ const select = (state, props) => ({
   claim: makeSelectClaimForUri(props.uri)(state),
   isSubscribed: makeSelectIsSubscribed(props.uri, true)(state),
   channelIsBlocked: selectChannelIsBlocked(props.uri)(state),
+  blackListedOutpoints: selectBlackListedOutpoints(state),
 });
 
 export default connect(

src/ui/page/channel/view.jsx

@@ -33,6 +33,10 @@ type Props = {
   channelIsMine: boolean,
   isSubscribed: boolean,
   channelIsBlocked: boolean,
+  blackListedOutpoints: Array<{
+    txid: string,
+    nout: number,
+  }>,
 };
 
 function ChannelPage(props: Props) {
@@ -48,6 +52,7 @@ function ChannelPage(props: Props) {
     claim,
     isSubscribed,
     channelIsBlocked,
+    blackListedOutpoints,
   } = props;
   const { channelName } = parseURI(uri);
   const { search } = location;
@@ -74,6 +79,14 @@ function ChannelPage(props: Props) {
     history.push(`${url}${search}`);
   };
 
+  let channelIsBlackListed = false;
+
+  if (claim && blackListedOutpoints) {
+    channelIsBlackListed = blackListedOutpoints.some(
+      outpoint => outpoint.txid === claim.txid && outpoint.nout === claim.nout
+    );
+  }
+
   return (
     <Page>
       <div className="card">
@@ -113,15 +126,15 @@ function ChannelPage(props: Props) {
             <Tab disabled={editing}>{__('Content')}</Tab>
             <Tab>{editing ? __('Editing Your Channel') : __('About')}</Tab>
             <div className="card__actions--inline">
-              <ShareButton uri={uri} />
-              {!channelIsBlocked && <SubscribeButton uri={permanentUrl} />}
+              {!channelIsBlocked && !channelIsBlackListed && <ShareButton uri={uri} />}
+              {!channelIsBlocked && !channelIsBlackListed && <SubscribeButton uri={permanentUrl} />}
               {!isSubscribed && <BlockButton uri={permanentUrl} />}
             </div>
           </TabList>
 
           <TabPanels>
             <TabPanel>
-              <ChannelContent uri={uri} />
+              <ChannelContent uri={uri} channelIsBlackListed={channelIsBlackListed} />
             </TabPanel>
             <TabPanel>
               {editing ? (

src/ui/page/show/view.jsx

@@ -42,6 +42,7 @@ class ShowPage extends React.PureComponent<Props> {
   render() {
     const { claim, isResolvingUri, uri, blackListedOutpoints, location } = this.props;
     const { channelName, channelClaimId, streamName, streamClaimId } = parseURI(uri);
+    const signingChannel = claim && claim.signing_channel;
 
     // @routinghax
     if (channelName && !channelClaimId && streamName && !streamClaimId && !isResolvingUri && !claim) {
@@ -70,13 +71,11 @@ class ShowPage extends React.PureComponent<Props> {
     } else if (claim && blackListedOutpoints) {
       let isClaimBlackListed = false;
 
-      for (let i = 0; i < blackListedOutpoints.length; i += 1) {
-        const outpoint = blackListedOutpoints[i];
-        if (outpoint.txid === claim.txid && outpoint.nout === claim.nout) {
-          isClaimBlackListed = true;
-          break;
-        }
-      }
+      isClaimBlackListed = blackListedOutpoints.some(
+        outpoint =>
+          (signingChannel && outpoint.txid === signingChannel.txid && outpoint.nout === signingChannel.nout) ||
+          (outpoint.txid === claim.txid && outpoint.nout === claim.nout)
+      );
 
       if (isClaimBlackListed) {
         innerContent = (