First run changes (#103)

* streamlined first run
* download button tweaks
* fix downloads. file page tweaks.

src/component/AppNavigator.js

@@ -51,6 +51,7 @@ import {
   selectHashChanged,
   selectUser,
 } from 'lbryinc';
+import { doStartDownload, doUpdateDownload, doCompleteDownload } from 'redux/actions/file';
 import { makeSelectClientSetting, selectFullscreenMode } from 'redux/selectors/settings';
 import { decode as atob } from 'base-64';
 import { dispatchNavigateBack, dispatchNavigateToUri, transformUrl } from 'utils/helper';
@@ -311,6 +312,10 @@ class AppWithNavigationState extends React.Component {
     this.emailVerifyCheckInterval = setInterval(() => this.checkEmailVerification(), 5000);
     Linking.addEventListener('url', this._handleUrl);
 
+    DeviceEventEmitter.addListener('onDownloadStarted', this.handleDownloadStarted);
+    DeviceEventEmitter.addListener('onDownloadUpdated', this.handleDownloadUpdated);
+    DeviceEventEmitter.addListener('onDownloadCompleted', this.handleDownloadCompleted);
+
     // call /sync/get with interval
     this.syncGetInterval = setInterval(() => {
       this.setState({ syncHashChanged: false }); // reset local state
@@ -345,7 +350,29 @@ class AppWithNavigationState extends React.Component {
     );
   };
 
+  handleDownloadStarted = evt => {
+    const { dispatch } = this.props;
+    const { uri, outpoint, fileInfo } = evt;
+    dispatch(doStartDownload(uri, outpoint, fileInfo));
+  };
+
+  handleDownloadUpdated = evt => {
+    const { dispatch } = this.props;
+    const { uri, outpoint, fileInfo, progress } = evt;
+    dispatch(doUpdateDownload(uri, outpoint, fileInfo, progress));
+  };
+
+  handleDownloadCompleted = evt => {
+    const { dispatch } = this.props;
+    const { uri, outpoint, fileInfo } = evt;
+    dispatch(doCompleteDownload(uri, outpoint, fileInfo));
+  };
+
   componentWillUnmount() {
+    DeviceEventEmitter.removeListener('onDownloadStarted', this.handleDownloadStarted);
+    DeviceEventEmitter.removeListener('onDownloadUpdated', this.handleDownloadUpdated);
+    DeviceEventEmitter.removeListener('onDownloadCompleted', this.handleDownloadCompleted);
+
     AppState.removeEventListener('change', this._handleAppStateChange);
     BackHandler.removeEventListener('hardwareBackPress');
     Linking.removeEventListener('url', this._handleUrl);

src/component/fileDownloadButton/view.js

@@ -11,11 +11,6 @@ class FileDownloadButton extends React.PureComponent {
     }
   }
 
-  componentWillReceiveProps(nextProps) {
-    // this.checkAvailability(nextProps.uri);
-    // this.restartDownload(nextProps);
-  }
-
   restartDownload(props) {
     const { downloading, fileInfo, uri, restartDownload } = props;
 
@@ -45,6 +40,7 @@ class FileDownloadButton extends React.PureComponent {
       doPause,
       style,
       openFile,
+      onFileActionPress,
       onButtonLayout,
     } = this.props;
 
@@ -72,19 +68,7 @@ class FileDownloadButton extends React.PureComponent {
           text={isPlayable ? __('Play') : isViewable ? __('View') : __('Download')}
           onLayout={onButtonLayout}
           style={[style, fileDownloadButtonStyle.container]}
-          onPress={() => {
-            NativeModules.Firebase.track('purchase_uri', { uri: uri });
-            purchaseUri(uri, costInfo, !isPlayable);
-            if (NativeModules.UtilityModule) {
-              NativeModules.UtilityModule.checkDownloads();
-            }
-            if (isPlayable && onPlay) {
-              this.props.onPlay();
-            }
-            if (isViewable && onView) {
-              this.props.onView();
-            }
-          }}
+          onPress={onFileActionPress}
         />
       );
     } else if (fileInfo && fileInfo.download_path) {

src/component/fileListItem/view.js

@@ -158,7 +158,13 @@ class FileListItem extends React.PureComponent {
             </View>
           )}
           {fileInfo && fileInfo.completed && fileInfo.download_path && (
-            <Icon style={fileListStyle.downloadedIcon} solid color={Colors.NextLbryGreen} name={'folder'} size={16} />
+            <Icon
+              style={featuredResult ? fileListStyle.featuredDownloadedIcon : fileListStyle.downloadedIcon}
+              solid
+              color={Colors.NextLbryGreen}
+              name={'folder'}
+              size={16}
+            />
           )}
           <View style={fileListStyle.detailsContainer}>
             {featuredResult && (

src/component/relatedContent/view.js

@@ -8,18 +8,11 @@ import fileListStyle from 'styles/fileList';
 import relatedContentStyle from 'styles/relatedContent';
 
 export default class RelatedContent extends React.PureComponent {
-  state = {
-    urlsResolved: false,
-  };
-
-  componentDidUpdate(prevProps) {
+  componentDidMount() {
     const { resolveUris, recommendedContent } = this.props;
-
-    if (recommendedContent && recommendedContent.length > 0 && !this.state.urisResolved) {
-      this.setState({ urisResolved: true }, () => {
-        // batch resolve the uris
-        resolveUris(recommendedContent);
-      });
+    if (recommendedContent && recommendedContent.length > 0) {
+      // batch resolve the uris
+      resolveUris(recommendedContent);
     }
   }
 

src/i18n.js

@@ -52,8 +52,9 @@ function checkMessageAndSave(message, messagesFilePath) {
         ); */
       })
       .catch(err => {
-        if (err) {
-          throw err;
+        if (err && !isProduction) {
+          // only do this when not in production
+          console.error(err);
         }
       });
   }

src/index.js

@@ -57,7 +57,7 @@ window.__ = __;
 
 const globalExceptionHandler = (error, isFatal) => {
   if (error && NativeModules.Firebase) {
-    NativeModules.Firebase.logException(isFatal, error.message ? error.message : 'No message', JSON.stringify(error));
+    NativeModules.Firebase.logException(!!isFatal, error.message ? error.message : 'No message', JSON.stringify(error));
   }
 };
 setJSExceptionHandler(globalExceptionHandler, true);

src/page/file/index.js

@@ -8,6 +8,7 @@ import {
   doPurchaseUri,
   doDeletePurchasedUri,
   doResolveUri,
+  doResolveUris,
   doSearch,
   doSendTip,
   doToast,
@@ -28,6 +29,7 @@ import {
   selectPurchasedUris,
   selectFailedPurchaseUris,
   selectPurchaseUriErrorMessage,
+  selectResolvingUris,
   selectIsSearching,
 } from 'lbry-redux';
 import {
@@ -39,13 +41,7 @@ import {
   selectRewardContentClaimIds,
   selectBlackListedOutpoints,
 } from 'lbryinc';
-import {
-  doStartDownload,
-  doUpdateDownload,
-  doCompleteDownload,
-  doDeleteFile,
-  doStopDownloadingFile,
-} from 'redux/actions/file';
+import { doDeleteFile, doStopDownloadingFile } from 'redux/actions/file';
 import { doPushDrawerStack, doPopDrawerStack, doSetPlayerVisible } from 'redux/actions/drawer';
 import { doToggleFullscreenMode } from 'redux/actions/settings';
 import { selectDrawerStack } from 'redux/selectors/drawer';
@@ -77,6 +73,7 @@ const select = (state, props) => {
     thumbnail: makeSelectThumbnailForUri(contentUri)(state),
     title: makeSelectTitleForUri(contentUri)(state),
     recommendedContent: makeSelectRecommendedContentForUri(contentUri)(state),
+    resolvingUris: selectResolvingUris(state),
     isSearchingRecommendContent: selectIsSearching(state),
     viewCount: makeSelectViewCountForUri(contentUri)(state),
   };
@@ -100,14 +97,12 @@ const perform = dispatch => ({
   purchaseUri: (uri, costInfo, saveFile) => dispatch(doPurchaseUri(uri, costInfo, saveFile)),
   deletePurchasedUri: uri => dispatch(doDeletePurchasedUri(uri)),
   resolveUri: uri => dispatch(doResolveUri(uri)),
+  resolveUris: uris => dispatch(doResolveUris(uris)),
   searchRecommended: query => dispatch(doSearch(query, 20, undefined, true)),
   sendTip: (amount, claimId, isSupport, successCallback, errorCallback) =>
     dispatch(doSendTip(amount, claimId, isSupport, successCallback, errorCallback)),
   setPlayerVisible: () => dispatch(doSetPlayerVisible(true)),
   stopDownload: (uri, fileInfo) => dispatch(doStopDownloadingFile(uri, fileInfo)),
-  startDownload: (uri, outpoint, fileInfo) => dispatch(doStartDownload(uri, outpoint, fileInfo)),
-  updateDownload: (uri, outpoint, fileInfo, progress) => dispatch(doUpdateDownload(uri, outpoint, fileInfo, progress)),
-  completeDownload: (uri, outpoint, fileInfo) => dispatch(doCompleteDownload(uri, outpoint, fileInfo)),
   toggleFullscreenMode: mode => dispatch(doToggleFullscreenMode(mode)),
 });
 

src/page/firstRun/view.js

@@ -228,7 +228,13 @@ class FirstRunScreen extends React.PureComponent {
   handleContinuePressed = () => {
     const { notify, user, hasSyncedWallet } = this.props;
     const pageIndex = FirstRunScreen.pages.indexOf(this.state.currentPage);
-    if (Constants.FIRST_RUN_PAGE_WALLET === this.state.currentPage) {
+
+    if (Constants.FIRST_RUN_PAGE_WELCOME === this.state.currentPage) {
+      // only show the welcome screen on first run
+      this.closeFinalPage();
+    }
+
+    /* if (Constants.FIRST_RUN_PAGE_WALLET === this.state.currentPage) {
       // do apply sync to check if the password is valid
       if (hasSyncedWallet) {
         this.checkWalletPassword();
@@ -256,7 +262,7 @@ class FirstRunScreen extends React.PureComponent {
       } else {
         this.showNextPage();
       }
-    }
+    } */
   };
 
   handleEmailCollectPageContinue() {
@@ -500,7 +506,12 @@ class FirstRunScreen extends React.PureComponent {
                   {Constants.FIRST_RUN_PAGE_SKIP_ACCOUNT !== this.state.currentPage &&
                     Constants.FIRST_RUN_PAGE_EMAIL_VERIFY !== this.state.currentPage && (
                     <Text style={firstRunStyle.buttonText}>
-                      {Constants.FIRST_RUN_PAGE_WALLET === this.state.currentPage ? __('Use LBRY') : __('Continue')} »
+                      {[Constants.FIRST_RUN_PAGE_WALLET, Constants.FIRST_RUN_PAGE_WELCOME].includes(
+                        this.state.currentPage
+                      )
+                        ? __('Use LBRY')
+                        : __('Continue')}{' '}
+                        »
                     </Text>
                   )}
                 </TouchableOpacity>

src/styles/fileList.js

@@ -94,6 +94,11 @@ const fileListStyle = StyleSheet.create({
     top: 8,
     left: 8,
   },
+  featuredDownloadedIcon: {
+    position: 'absolute',
+    left: 16,
+    top: 16,
+  },
   fileItem: {
     marginLeft: 24,
     marginRight: 24,