use Card component

lbrytv/webpack.config.js

@@ -22,6 +22,7 @@ const webConfig = {
   },
   devServer: {
     port: WEBPACK_WEB_PORT,
+    contentBase: path.join(__dirname, 'dist'),
   },
   module: {
     rules: [

static/app-strings.json

@@ -925,7 +925,6 @@
   "Available": "Available",
   "Unable to load your saved preferences.": "Unable to load your saved preferences.",
   "Add/Delete": "Add/Delete",
-  "PDF opened externally. %click_here% to open it again.": "PDF opened externally. %click_here% to open it again.",
   "%numberOfMonthsSincePublish% years ago": "%numberOfMonthsSincePublish% years ago",
   "%numberOfYearsSincePublish% years ago": "%numberOfYearsSincePublish% years ago",
   "%numberOfYearsSincePublish% year ago": "%numberOfYearsSincePublish% year ago",
@@ -939,5 +938,6 @@
   "Provide a description and link to your license": "Provide a description and link to your license",
   "Walletserver preference": "Walletserver preference",
   "Wallet servers": "Wallet servers",
-  "lbry.tv": "lbry.tv"
+  "lbry.tv": "lbry.tv",
+  "In response to a complaint we received under the US Digital Millennium Copyright Act, we have blocked access to this content from our applications.": "In response to a complaint we received under the US Digital Millennium Copyright Act, we have blocked access to this content from our applications."
 }

ui/page/show/index.js

@@ -8,7 +8,6 @@ import {
   makeSelectTitleForUri,
   normalizeURI,
   makeSelectClaimIsMine,
-  makeSelectFileInfoForUri,
 } from 'lbry-redux';
 import { selectBlackListedOutpoints } from 'lbryinc';
 import ShowPage from './view';
@@ -41,7 +40,6 @@ const select = (state, props) => {
     uri,
     title: makeSelectTitleForUri(uri)(state),
     claimIsMine: makeSelectClaimIsMine(uri)(state),
-    fileInfo: makeSelectFileInfoForUri(uri)(state),
   };
 };
 

ui/page/show/view.jsx

@@ -7,6 +7,7 @@ import FilePage from 'page/file';
 import Page from 'component/page';
 import Button from 'component/button';
 import { SITE_TITLE } from 'config';
+import Card from 'component/common/card';
 
 type Props = {
   isResolvingUri: boolean,
@@ -20,21 +21,10 @@ type Props = {
   }>,
   title: string,
   claimIsMine: Boolean,
-  fileInfo: FileListItem,
 };
 
 function ShowPage(props: Props) {
-  const {
+  const { isResolvingUri, resolveUri, uri, claim, blackListedOutpoints, location, title, claimIsMine } = props;
-    isResolvingUri,
-    resolveUri,
-    uri,
-    claim,
-    blackListedOutpoints,
-    location,
-    title,
-    claimIsMine,
-    fileInfo,
-  } = props;
   const { channelName, streamName } = parseURI(uri);
   const signingChannel = claim && claim.signing_channel;
   const canonicalUrl = claim && claim.canonical_url;
@@ -98,31 +88,24 @@ function ShowPage(props: Props) {
         (outpoint.txid === claim.txid && outpoint.nout === claim.nout)
     );
 
-    let blockedMessage = (
-      <section className="card card--section">
-        <div className="card__title card__title--deprecated">{uri}</div>
-        <p>
-          {__(
-            'In response to a complaint we received under the US Digital Millennium Copyright Act, we have blocked access to this content from our applications.'
-          )}
-        </p>
-        <div className="card__actions">
-          <Button button="link" href="https://lbry.com/faq/dmca" label={__('Read More')} />
-        </div>
-      </section>
-    );
-
     if (isClaimBlackListed && !claimIsMine) {
-      innerContent = <Page>{blockedMessage}</Page>;
+      innerContent = (
+        <Page>
+          <Card
+            title={uri}
+            subtitle={__(
+              'In response to a complaint we received under the US Digital Millennium Copyright Act, we have blocked access to this content from our applications.'
+            )}
+            actions={
+              <div className="card__actions">
+                <Button button="link" href="https://lbry.com/faq/dmca" label={__('Read More')} />
+              </div>
+            }
+          />
+        </Page>
+      );
     } else {
-      innerContent =
+      innerContent = <FilePage uri={uri} location={location} />;
-        isClaimBlackListed || fileInfo ? (
-          <div>
-            {blockedMessage} <FilePage uri={uri} location={location} />
-          </div>
-        ) : (
-          <FilePage uri={uri} location={location} />
-        );
     }
   }