Merge pull request #4148 from lbryio/feat-trackReflectingFiles

track reflecting files after publish

package.json

@@ -131,7 +131,7 @@
     "imagesloaded": "^4.1.4",
     "json-loader": "^0.5.4",
     "lbry-format": "https://github.com/lbryio/lbry-format.git",
-    "lbry-redux": "lbryio/lbry-redux#1e27a854d012ef758c04b234fb80e74e264d5962",
+    "lbry-redux": "lbryio/lbry-redux#3be6fa52ac1cb6224cf9de45623183e62c2b24ab",
     "lbryinc": "lbryio/lbryinc#cc62a4eec10845cc0b31da7d0f27287cfa7c4866",
     "lint-staged": "^7.0.2",
     "localforage": "^1.7.1",

static/app-strings.json

@@ -1200,5 +1200,7 @@
   "this channel": "this channel",
   "Share this channel": "Share this channel",
   "File preview": "File preview",
-  "Go Home": "Go Home"
+  "Go Home": "Go Home",
+  "Uploading (%progress%%) ": "Uploading (%progress%%) ",
+  "Confirming": "Confirming"
 }

ui/component/claimPreview/index.js

@@ -11,6 +11,7 @@ import {
   selectBlockedChannels,
   selectChannelIsBlocked,
   doFileGet,
+  makeSelectReflectingClaimForUri,
 } from 'lbry-redux';
 import { selectBlackListedOutpoints, selectFilteredOutpoints } from 'lbryinc';
 import { selectShowMatureContent } from 'redux/selectors/settings';
@@ -21,6 +22,7 @@ import ClaimPreview from './view';
 const select = (state, props) => ({
   pending: props.uri && makeSelectClaimIsPending(props.uri)(state),
   claim: props.uri && makeSelectClaimForUri(props.uri)(state),
+  reflectingInfo: props.uri && makeSelectReflectingClaimForUri(props.uri)(state),
   obscureNsfw: !selectShowMatureContent(state),
   claimIsMine: props.uri && makeSelectClaimIsMine(props.uri)(state),
   isResolvingUri: props.uri && makeSelectIsUriResolving(props.uri)(state),

ui/component/claimPreview/view.jsx

@@ -21,6 +21,7 @@ import ClaimPreviewSubtitle from 'component/claimPreviewSubtitle';
 import ClaimRepostAuthor from 'component/claimRepostAuthor';
 import FileDownloadLink from 'component/fileDownloadLink';
 import AbandonedChannelPreview from 'component/abandonedChannelPreview';
+import PublishPending from 'component/publishPending';
 
 type Props = {
   uri: string,
@@ -29,6 +30,7 @@ type Props = {
   showUserBlocked: boolean,
   claimIsMine: boolean,
   pending?: boolean,
+  reflectingInfo?: any, // fxme
   resolveUri: string => void,
   isResolvingUri: boolean,
   history: { push: string => void },
@@ -65,6 +67,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
     obscureNsfw,
     claimIsMine,
     pending,
+    reflectingInfo,
     history,
     uri,
     isResolvingUri,
@@ -97,7 +100,6 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
   const showPublishLink = abandoned && !showUnresolvedClaim && placeholder === 'publish';
   const hideActions = type === 'small' || type === 'tooltip';
   const canonicalUrl = claim && claim.canonical_url;
-
   let isValid = false;
   if (uri) {
     try {
@@ -245,28 +247,40 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
             <ChannelThumbnail uri={uri} obscure={channelIsBlocked} />
           </UriIndicator>
         ) : (
-          <NavLink {...navLinkProps}>
-            <FileThumbnail thumbnail={thumbnailUrl}>
-              {/* @if TARGET='app' */}
-              {claim && (
-                <div className="claim-preview__hover-actions">
-                  <FileDownloadLink uri={canonicalUrl} hideOpenButton hideDownloadStatus />
-                </div>
-              )}
-              {/* @endif */}
-            </FileThumbnail>
-          </NavLink>
+          <>
+            {!pending ? (
+              <NavLink {...navLinkProps}>
+                <FileThumbnail thumbnail={thumbnailUrl}>
+                  {/* @if TARGET='app' */}
+                  {claim && (
+                    <div className="claim-preview__hover-actions">
+                      <FileDownloadLink uri={canonicalUrl} hideOpenButton hideDownloadStatus />
+                    </div>
+                  )}
+                  {/* @endif */}
+                </FileThumbnail>
+              </NavLink>
+            ) : (
+              <FileThumbnail thumbnail={thumbnailUrl} />
+            )}
+          </>
         )}
 
         <div className="claim-preview__text">
           <div className="claim-preview-metadata">
             <div className="claim-preview-info">
-              <NavLink {...navLinkProps}>
+              {pending ? (
                 <ClaimPreviewTitle uri={uri} />
-              </NavLink>
+              ) : (
+                <NavLink {...navLinkProps}>
+                  <ClaimPreviewTitle uri={uri} />
+                </NavLink>
+              )}
+
               {!isChannel && <FileProperties uri={uri} />}
             </div>
             <ClaimPreviewSubtitle uri={uri} type={type} />
+            {(pending || !!reflectingInfo) && <PublishPending uri={uri} />}
           </div>
           {type !== 'small' && (
             <div className="claim-preview__actions">

ui/component/claimPreviewSubtitle/view.jsx

@@ -28,14 +28,9 @@ function ClaimPreviewSubtitle(props: Props) {
       {claim ? (
         <React.Fragment>
           <UriIndicator uri={uri} link />{' '}
-          {pending
-            ? __('Pending...')
-            : claim &&
-              (isChannel ? (
-                type !== 'inline' && `${claimsInChannel} ${__('publishes')}`
-              ) : (
-                <DateTime timeAgo uri={uri} />
-              ))}
+          {!pending &&
+            claim &&
+            (isChannel ? type !== 'inline' && `${claimsInChannel} ${__('publishes')}` : <DateTime timeAgo uri={uri} />)}
         </React.Fragment>
       ) : (
         <React.Fragment>

ui/component/publishPending/index.js

@@ -0,0 +1,13 @@
+import { connect } from 'react-redux';
+import { makeSelectReflectingClaimForUri, doCheckReflectingFiles } from 'lbry-redux';
+import PublishPending from './view';
+
+const select = (state, props) => ({
+  reflectingInfo: props.uri && makeSelectReflectingClaimForUri(props.uri)(state),
+});
+
+const perform = dispatch => ({
+  checkReflecting: () => dispatch(doCheckReflectingFiles()),
+});
+
+export default connect(select, perform)(PublishPending);

ui/component/publishPending/view.jsx

@@ -0,0 +1,32 @@
+// @flow
+
+import React from 'react';
+import Lbry from 'lbry-redux';
+import Button from 'component/button';
+
+type Props = {
+  reflectingInfo?: ReflectingUpdate,
+  checkReflecting: () => void,
+};
+
+const PublishPending = (props: Props) => {
+  const { reflectingInfo = {}, checkReflecting } = props;
+  const { fileListItem, progress, stalled } = reflectingInfo;
+  const sdHash = fileListItem && fileListItem.sd_hash;
+  const reflecting = Object.keys(reflectingInfo).length;
+  if (stalled) {
+    return (
+      <Button
+        button="link"
+        label={__('Upload stalled. Retry?')}
+        onClick={() => Lbry.file_reflect({ sd_hash: sdHash }).then(() => checkReflecting())}
+      />
+    );
+  } else if (reflecting) {
+    return <span>{__('Uploading (%progress%%) ', { progress: progress })}</span>;
+  } else {
+    return <span>{__('Confirming')}</span>;
+  }
+};
+
+export default PublishPending;

ui/reducers.js

@@ -24,7 +24,6 @@ import {
   lbrytvReducer,
 } from 'lbryinc';
 import appReducer from 'redux/reducers/app';
-import availabilityReducer from 'redux/reducers/availability';
 import contentReducer from 'redux/reducers/content';
 import settingsReducer from 'redux/reducers/settings';
 import subscriptionsReducer from 'redux/reducers/subscriptions';
@@ -33,7 +32,6 @@ export default history =>
   combineReducers({
     router: connectRouter(history),
     app: appReducer,
-    availability: availabilityReducer,
     blacklist: blacklistReducer,
     filtered: filteredReducer,
     claims: claimsReducer,

ui/redux/actions/publish.js

@@ -8,6 +8,7 @@ import {
   selectMyClaims,
   doPublish,
   doCheckPendingPublishes,
+  doCheckReflectingFiles,
   ACTIONS as LBRY_REDUX_ACTIONS,
 } from 'lbry-redux';
 import { selectosNotificationsEnabled } from 'redux/selectors/settings';
@@ -44,6 +45,12 @@ export const doPublishDesktop = (filePath: string) => (dispatch: Dispatch, getSt
         claims: [pendingClaim],
       },
     });
+    // @if TARGET='app'
+    actions.push({
+      type: LBRY_REDUX_ACTIONS.ADD_FILES_REFLECTING,
+      data: pendingClaim,
+    });
+    // @endif
 
     dispatch(batchActions(...actions));
     dispatch(
@@ -53,6 +60,10 @@ export const doPublishDesktop = (filePath: string) => (dispatch: Dispatch, getSt
         filePath,
       })
     );
+    dispatch(doCheckPendingPublishesApp());
+    // @if TARGET='app'
+    dispatch(doCheckReflectingFiles());
+    // @endif
   };
 
   const publishFail = error => {

yarn.lock

@@ -6178,9 +6178,9 @@ lazy-val@^1.0.4:
     yargs "^13.2.2"
     zstd-codec "^0.1.1"
 
-lbry-redux@lbryio/lbry-redux#1e27a854d012ef758c04b234fb80e74e264d5962:
+lbry-redux@lbryio/lbry-redux#3be6fa52ac1cb6224cf9de45623183e62c2b24ab:
   version "0.0.1"
-  resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/1e27a854d012ef758c04b234fb80e74e264d5962"
+  resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/3be6fa52ac1cb6224cf9de45623183e62c2b24ab"
   dependencies:
     proxy-polyfill "0.1.6"
     reselect "^3.0.0"