oh boy

package.json

@@ -124,14 +124,13 @@
     "jsmediatags": "^3.8.1",
     "json-loader": "^0.5.4",
     "lbry-format": "https://github.com/lbryio/lbry-format.git",
-    "lbry-redux": "lbryio/lbry-redux#469d3b70cbe39f28aafee4e072fdfc5bac604c4b",
+    "lbry-redux": "lbryio/lbry-redux#1b7bb1cc9f2cb6a8efcce1869031d4da8ddbf4ca",
     "lbryinc": "lbryio/lbryinc#a93596c51c8fb0a226cb84df04c26a6bb60a45fb",
     "lint-staged": "^7.0.2",
     "localforage": "^1.7.1",
     "lodash-es": "^4.17.14",
     "make-runnable": "^1.3.6",
     "mammoth": "^1.4.6",
-    "mime": "^2.3.1",
     "moment": "^2.22.0",
     "node-abi": "^2.5.1",
     "node-fetch": "^2.3.0",
@@ -168,7 +167,6 @@
     "remark-attr": "^0.8.3",
     "remark-emoji": "^2.0.1",
     "remark-react": "^4.0.3",
-    "render-media": "^3.1.0",
     "reselect": "^3.0.0",
     "sass-loader": "^7.1.0",
     "semver": "^5.3.0",

src/ui/component/claimPreview/index.js

@@ -10,14 +10,14 @@ import {
   makeSelectClaimIsNsfw,
 } from 'lbry-redux';
 import { selectBlackListedOutpoints, selectFilteredOutpoints } from 'lbryinc';
-import { selectShowNsfw } from 'redux/selectors/settings';
+import { selectShowMatureContent } from 'redux/selectors/settings';
 import { makeSelectHasVisitedUri } from 'redux/selectors/content';
 import ClaimPreview from './view';
 
 const select = (state, props) => ({
   pending: makeSelectClaimIsPending(props.uri)(state),
   claim: makeSelectClaimForUri(props.uri)(state),
-  obscureNsfw: !selectShowNsfw(state),
+  obscureNsfw: !selectShowMatureContent(state),
   claimIsMine: makeSelectClaimIsMine(props.uri)(state),
   isResolvingUri: makeSelectIsUriResolving(props.uri)(state),
   thumbnail: makeSelectThumbnailForUri(props.uri)(state),

src/ui/component/claimPreview/view.jsx

@@ -1,5 +1,5 @@
 // @flow
-import React, { Fragment, useEffect } from 'react';
+import React, { Fragment, useEffect, forwardRef } from 'react';
 import classnames from 'classnames';
 import { parseURI, convertToShareLink } from 'lbry-redux';
 import { withRouter } from 'react-router-dom';
@@ -41,7 +41,7 @@ type Props = {
   }>,
 };
 
-function ClaimPreview(props: Props) {
+const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
   const {
     obscureNsfw,
     claimIsMine,
@@ -132,6 +132,7 @@ function ClaimPreview(props: Props) {
 
   return (
     <li
+      ref={ref}
       role="link"
       onClick={pending || type === 'inline' ? undefined : onClick}
       onContextMenu={handleContextMenu}
@@ -188,6 +189,6 @@ function ClaimPreview(props: Props) {
       </div>
     </li>
   );
-}
+});
 
 export default withRouter(ClaimPreview);

src/ui/component/common/loading-screen.jsx

@@ -3,7 +3,7 @@ import React from 'react';
 import Spinner from 'component/spinner';
 
 type Props = {
-  status: string,
+  status?: string,
   spinner: boolean,
 };
 

src/ui/component/fileDetails/view.jsx

@@ -30,10 +30,11 @@ class FileDetails extends PureComponent<Props> {
       : fileInfo && fileInfo.download_path && formatBytes(fileInfo.written_bytes);
     let downloadPath = fileInfo && fileInfo.download_path ? path.normalize(fileInfo.download_path) : null;
     let downloadNote;
-    // If the path is blank, file is not avialable. Create path from name so the folder opens on click.
-    if (fileInfo && fileInfo.download_path === null) {
+    // If the path is blank, file is not avialable. Streamed files won't have any blobs saved
+    // Create path from name so the folder opens on click.
+    if (fileInfo && fileInfo.blobs_completed >= 1 && fileInfo.download_path === null) {
       downloadPath = `${fileInfo.download_directory}/${fileInfo.file_name}`;
-      downloadNote = 'This file may have been moved or deleted';
+      downloadNote = 'This file may have been streamed, moved or deleted';
     }
 
     return (

src/ui/component/fileDownloadLink/index.js

@@ -3,28 +3,23 @@ import {
   makeSelectFileInfoForUri,
   makeSelectDownloadingForUri,
   makeSelectLoadingForUri,
-  makeSelectClaimForUri,
   makeSelectClaimIsMine,
+  makeSelectUriIsStreamable,
 } from 'lbry-redux';
-import { makeSelectCostInfoForUri } from 'lbryinc';
 import { doOpenModal } from 'redux/actions/app';
-import { doPurchaseUri, doStartDownload, doSetPlayingUri } from 'redux/actions/content';
+import { doSetPlayingUri } from 'redux/actions/content';
 import FileDownloadLink from './view';
 
 const select = (state, props) => ({
   fileInfo: makeSelectFileInfoForUri(props.uri)(state),
-  /* availability check is disabled due to poor performance, TBD if it dies forever or requires daemon fix */
   downloading: makeSelectDownloadingForUri(props.uri)(state),
-  costInfo: makeSelectCostInfoForUri(props.uri)(state),
   loading: makeSelectLoadingForUri(props.uri)(state),
-  claim: makeSelectClaimForUri(props.uri)(state),
   claimIsMine: makeSelectClaimIsMine(props.uri)(state),
+  isStreamable: makeSelectUriIsStreamable(props.uri)(state),
 });
 
 const perform = dispatch => ({
   openModal: (modal, props) => dispatch(doOpenModal(modal, props)),
-  purchaseUri: uri => dispatch(doPurchaseUri(uri)),
-  restartDownload: (uri, outpoint) => dispatch(doStartDownload(uri, outpoint)),
   pause: () => dispatch(doSetPlayingUri(null)),
 });
 

src/ui/component/fileDownloadLink/view.jsx

@@ -4,104 +4,46 @@ import * as MODALS from 'constants/modal_types';
 import React from 'react';
 import Button from 'component/button';
 import ToolTip from 'component/common/tooltip';
-import analytics from 'analytics';
 
 type Props = {
-  claim: StreamClaim,
   claimIsMine: boolean,
-  uri: string,
   downloading: boolean,
-  fileInfo: ?{
-    written_bytes: number,
-    total_bytes: number,
-    outpoint: number,
-    download_path: string,
-    completed: boolean,
-    status: string,
-  },
   loading: boolean,
-  costInfo: ?{},
-  restartDownload: (string, number) => void,
+  isStreamable: boolean,
+  fileInfo: ?FileInfo,
   openModal: (id: string, { path: string }) => void,
-  purchaseUri: string => void,
   pause: () => void,
 };
 
-class FileDownloadLink extends React.PureComponent<Props> {
-  componentDidMount() {
-    const { fileInfo, uri, restartDownload } = this.props;
-    if (
-      fileInfo &&
-      !fileInfo.completed &&
-      fileInfo.status === 'running' &&
-      fileInfo.written_bytes !== false &&
-      fileInfo.written_bytes < fileInfo.total_bytes
-    ) {
-      // This calls file list to show the percentage
-      restartDownload(uri, fileInfo.outpoint);
-    }
-  }
-
-  uri: ?string;
-
-  render() {
-    const {
-      fileInfo,
-      downloading,
-      uri,
-      openModal,
-      purchaseUri,
-      costInfo,
-      loading,
-      pause,
-      claim,
-      claimIsMine,
-    } = this.props;
-
-    if (loading || downloading) {
-      const progress = fileInfo && fileInfo.written_bytes ? (fileInfo.written_bytes / fileInfo.total_bytes) * 100 : 0;
-      const label = fileInfo ? __('Downloading: ') + progress.toFixed(0) + __('% complete') : __('Connecting...');
+function FileDownloadLink(props: Props) {
+  const { fileInfo, downloading, loading, openModal, pause, claimIsMine, isStreamable } = props;
 
-      return <span>{label}</span>;
-    } else if ((fileInfo === null && !downloading) || (fileInfo && !fileInfo.download_path)) {
-      if (!costInfo) {
-        return null;
-      }
+  if (!isStreamable && (loading || downloading)) {
+    const progress = fileInfo && fileInfo.written_bytes > 0 ? (fileInfo.written_bytes / fileInfo.total_bytes) * 100 : 0;
+    const label =
+      fileInfo && fileInfo.written_bytes > 0
+        ? __('Downloading: ') + progress.toFixed(0) + __('% complete')
+        : __('Connecting...');
 
-      return (
-        <ToolTip label={__('Add to your library')}>
-          <Button
-            button="link"
-            icon={ICONS.DOWNLOAD}
-            onClick={() => {
-              purchaseUri(uri);
-
-              const { name, claim_id: claimId, nout, txid } = claim;
-              // // ideally outpoint would exist inside of claim information
-              // // we can use it after https://github.com/lbryio/lbry/issues/1306 is addressed
-              const outpoint = `${txid}:${nout}`;
-              analytics.apiLogView(`${name}#${claimId}`, outpoint, claimId);
-            }}
-          />
-        </ToolTip>
-      );
-    } else if (fileInfo && fileInfo.download_path) {
-      return (
-        <ToolTip label={__('Open file')}>
-          <Button
-            button="link"
-            icon={ICONS.EXTERNAL}
-            onClick={() => {
-              pause();
-              openModal(MODALS.CONFIRM_EXTERNAL_RESOURCE, { path: fileInfo.download_path, isMine: claimIsMine });
-            }}
-          />
-        </ToolTip>
-      );
-    }
+    return <span>{label}</span>;
+  }
 
-    return null;
+  if (fileInfo && fileInfo.download_path && fileInfo.completed) {
+    return (
+      <ToolTip label={__('Open file')}>
+        <Button
+          button="link"
+          icon={ICONS.EXTERNAL}
+          onClick={() => {
+            pause();
+            openModal(MODALS.CONFIRM_EXTERNAL_RESOURCE, { path: fileInfo.download_path, isMine: claimIsMine });
+          }}
+        />
+      </ToolTip>
+    );
   }
+
+  return null;
 }
 
 export default FileDownloadLink;

src/ui/component/fileRender/index.js

@@ -1,11 +1,26 @@
 import { connect } from 'react-redux';
+import {
+  makeSelectClaimForUri,
+  makeSelectThumbnailForUri,
+  makeSelectContentTypeForUri,
+  makeSelectStreamingUrlForUri,
+  makeSelectMediaTypeForUri,
+  makeSelectDownloadPathForUri,
+  makeSelectFileNameForUri,
+} from 'lbry-redux';
 import { THEME } from 'constants/settings';
 import { makeSelectClientSetting } from 'redux/selectors/settings';
-
 import FileRender from './view';
 
-const select = state => ({
+const select = (state, props) => ({
   currentTheme: makeSelectClientSetting(THEME)(state),
+  claim: makeSelectClaimForUri(props.uri)(state),
+  mediaType: makeSelectMediaTypeForUri(props.uri)(state),
+  thumbnail: makeSelectThumbnailForUri(props.uri)(state),
+  contentType: makeSelectContentTypeForUri(props.uri)(state),
+  downloadPath: makeSelectDownloadPathForUri(props.uri)(state),
+  fileName: makeSelectFileNameForUri(props.uri)(state),
+  streamingUrl: makeSelectStreamingUrlForUri(props.uri)(state),
 });
 
 export default connect(select)(FileRender);