show blocked message for blacklisted content

app/src/index.js

@@ -10,6 +10,7 @@ import {
 } from 'react-native';
 import {
   Lbry,
+  blacklistReducer,
   claimsReducer,
   costInfoReducer,
   fileInfoReducer,
@@ -68,6 +69,7 @@ const navigatorReducer = (state = initialNavState, action) => {
 
 const reducers = combineReducers({
   auth: authReducer,
+  blacklist: blacklistReducer,
   claims: claimsReducer,
   costInfo: costInfoReducer,
   fileInfo: fileInfoReducer,

app/src/page/file/view.js

@@ -329,6 +329,31 @@ class FilePage extends React.PureComponent {
         <ChannelPage uri={uri} navigation={navigation} />
       );
     } else if (claim) {
+      let isClaimBlackListed = false;
+
+      if (blackListedOutpoints) {
+        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;
+          }
+        }
+      }
+
+      if (isClaimBlackListed) {
+        innerContent = (
+          <View style={filePageStyle.pageContainer}>
+            <View style={filePageStyle.dmcaContainer}>
+              <Text style={filePageStyle.dmcaText}>
+                In response to a complaint we received under the US Digital Millennium Copyright Act, we have blocked access to this content from our applications.
+              </Text>
+              <Link style={filePageStyle.dmcaLink} href="https://lbry.io/faq/dmca" text="Read More" />
+            </View>
+            <UriBar value={uri} navigation={navigation} />
+          </View>
+        );
+      } else {
         const completed = fileInfo && fileInfo.completed;
         const title = metadata.title;
         const isRewardContent = rewardedContentClaimIds.includes(claim.claim_id);
@@ -468,6 +493,7 @@ class FilePage extends React.PureComponent {
           </View>
         );
       }
+    }
 
     return innerContent;
   }

app/src/page/splash/index.js

@@ -1,5 +1,5 @@
 import { connect } from 'react-redux';
-import { doBalanceSubscribe, doNotify } from 'lbry-redux';
+import { doBalanceSubscribe, doBlackListedOutpointsSubscribe, doNotify } from 'lbry-redux';
 import {
   doAuthenticate,
   doFetchRewardedContent,
@@ -20,6 +20,7 @@ const select = state => ({
 const perform = dispatch => ({
   authenticate: (appVersion, os) => dispatch(doAuthenticate(appVersion, os)),
   balanceSubscribe: () => dispatch(doBalanceSubscribe()),
+  blacklistedOutpointsSubscribe: () => dispatch(doBlackListedOutpointsSubscribe()),
   deleteCompleteBlobs: () => dispatch(doDeleteCompleteBlobs()),
   fetchRewardedContent: () => dispatch(doFetchRewardedContent()),
   notify: data => dispatch(doNotify(data)),

app/src/page/splash/view.js

@@ -144,11 +144,13 @@ class SplashScreen extends React.PureComponent {
         const {
           authenticate,
           balanceSubscribe,
+          blacklistedOutpointsSubscribe,
           navigation,
           notify
         } = this.props;
 
         balanceSubscribe();
+        blacklistedOutpointsSubscribe();
         NativeModules.VersionInfo.getAppVersion().then(appVersion => {
           this.setState({ shouldAuthenticate: true });
           authenticate(appVersion, Platform.OS);

app/src/styles/filePage.js

@@ -165,6 +165,25 @@ const filePageStyle = StyleSheet.create({
     alignItems: 'center',
     flexDirection: 'row'
   },
+  dmcaContainer: {
+    flex: 1,
+    alignItems: 'flex-start',
+    justifyContent: 'center',
+    paddingLeft: 24,
+    paddingRight: 24
+  },
+  dmcaText: {
+    fontFamily: 'Metropolis-Regular',
+    fontSize: 18,
+    lineHeight: 24
+  },
+  dmcaLink: {
+    color: Colors.LbryGreen,
+    fontFamily: 'Metropolis-Regular',
+    fontSize: 18,
+    lineHeight: 24,
+    marginTop: 24
+  },
   infoText: {
     fontFamily: 'Metropolis-Regular',
     fontSize: 20,