Merge pull request #11 from lbryio/more-fixes

display remaining discover tags and fix publish cancel bug

src/page/discover/view.js

@@ -30,6 +30,7 @@ import _ from 'lodash';
 class DiscoverPage extends React.PureComponent {
   state = {
     tagCollection: [],
+    remainingTags: [],
     showModalTagSelector: false,
     showSortPicker: false,
     orderBy: Constants.DEFAULT_ORDER_BY,
@@ -207,10 +208,14 @@ class DiscoverPage extends React.PureComponent {
     const tagCollection = _.shuffle(tags)
       .slice(0, 5)
       .map(tag => [tag]);
+
+    const usedTags = tagCollection.map(tagList => tagList[0]);
+    const remainingTags = tags.filter(tag => !usedTags.includes(tag));
+
     // everything
     tagCollection.unshift(tags);
 
-    this.setState({ tagCollection });
+    this.setState({ remainingTags, tagCollection });
   };
 
   handleTagPress = name => {
@@ -246,6 +251,23 @@ class DiscoverPage extends React.PureComponent {
     </View>
   );
 
+  sectionListFooter = () => (
+    <View style={discoverStyle.footer}>
+      <Text style={discoverStyle.footerTitle}>More tags you follow</Text>
+      <View style={discoverStyle.footerTags}>
+        {this.state.remainingTags.map(tag => (
+          <Text
+            key={tag}
+            style={[discoverStyle.categoryName, discoverStyle.footerTag]}
+            onPress={() => this.handleTagPress(tag)}
+          >
+            {formatTagTitle(tag)}
+          </Text>
+        ))}
+      </View>
+    </View>
+  );
+
   renderSectionListItem = ({ item, index, section }) => (
     <ClaimList
       key={item.sort().join(',')}
@@ -278,6 +300,7 @@ class DiscoverPage extends React.PureComponent {
         <UriBar navigation={navigation} belowOverlay={showModalTagSelector} />
         <SectionList
           ListHeaderComponent={this.sectionListHeader}
+          ListFooterComponent={this.sectionListFooter}
           style={discoverStyle.scrollContainer}
           contentContainerStyle={discoverStyle.scrollPadding}
           initialNumToRender={4}

src/page/publish/index.js

@@ -3,12 +3,13 @@ import {
   doPublish,
   doResolveUri,
   doToast,
+  doUpdatePublishForm,
   doUploadThumbnail,
   selectBalance,
   selectPublishFormValues,
 } from 'lbry-redux';
 import { doPushDrawerStack, doSetPlayerVisible } from 'redux/actions/drawer';
-import Constants from 'constants';
+import Constants from 'constants'; // eslint-disable-line node/no-deprecated-api
 import PublishPage from './view';
 
 const select = state => ({
@@ -18,6 +19,7 @@ const select = state => ({
 
 const perform = dispatch => ({
   notify: data => dispatch(doToast(data)),
+  updatePublishForm: value => dispatch(doUpdatePublishForm(value)),
   uploadThumbnail: (filePath, fsAdapter) => dispatch(doUploadThumbnail(filePath, null, fsAdapter)),
   publish: params => dispatch(doPublish(params)),
   resolveUri: uri => dispatch(doResolveUri(uri)),

src/page/publish/view.js

@@ -283,31 +283,41 @@ class PublishPage extends React.PureComponent {
   };
 
   showSelector() {
-    this.setState({
-      publishStarted: false,
+    const { updatePublishForm } = this.props;
 
-      currentMedia: null,
-      currentThumbnailUri: null,
-      currentPhase: Constants.PHASE_SELECTOR,
+    this.setState(
+      {
+        publishStarted: false,
 
-      // publish
-      advancedMode: false,
-      anonymous: true,
-      channelName: CLAIM_VALUES.CHANNEL_ANONYMOUS,
-      priceSet: false,
+        currentMedia: null,
+        currentThumbnailUri: null,
+        currentPhase: Constants.PHASE_SELECTOR,
+        updatingThumbnailUri: false,
+        uploadThumbnailStarted: false,
 
-      // input data
-      bid: 0.1,
-      description: null,
-      title: null,
-      language: 'en',
-      license: LICENSES.NONE,
-      name: null,
-      price: 0,
-      uri: null,
-      tags: [],
-      uploadedThumbnailUri: null,
-    });
+        // publish
+        advancedMode: false,
+        anonymous: true,
+        channelName: CLAIM_VALUES.CHANNEL_ANONYMOUS,
+        priceSet: false,
+
+        // input data
+        bid: 0.1,
+        description: null,
+        title: null,
+        language: 'en',
+        license: LICENSES.NONE,
+        name: null,
+        price: 0,
+        uri: null,
+        tags: [],
+        uploadedThumbnailUri: null,
+      },
+      () => {
+        // reset thumbnail
+        updatePublishForm({ thumbnail: null });
+      }
+    );
   }
 
   handleRecordVideoPressed = () => {
@@ -523,6 +533,10 @@ class PublishPage extends React.PureComponent {
     );
   };
 
+  handleDescriptionChange = description => {
+    this.setState({ description });
+  };
+
   render() {
     const { balance, navigation, notify, publishFormValues } = this.props;
     const { canUseCamera, currentPhase, galleryThumbnailsChecked, thumbnailPath, videos } = this.state;
@@ -605,7 +619,7 @@ class PublishPage extends React.PureComponent {
 
           {this.state.uploadThumbnailStarted && !this.state.uploadedThumbnailUri && (
             <View style={publishStyle.thumbnailUploadContainer}>
-              <ActivityIndicator size={'small'} color={Colors.LbryGreen} />
+              <ActivityIndicator size={'small'} color={Colors.NextLbryGreen} />
               <Text style={publishStyle.thumbnailUploadText}>Uploading thumbnail...</Text>
             </View>
           )}
@@ -781,11 +795,7 @@ class PublishPage extends React.PureComponent {
             )}
 
             {!publishFormValues.publishing && !this.state.publishStarted && (
-              <Link
-                style={publishStyle.cancelLink}
-                text="Cancel"
-                onPress={() => this.setState({ currentPhase: Constants.PHASE_SELECTOR })}
-              />
+              <Link style={publishStyle.cancelLink} text="Cancel" onPress={() => this.showSelector()} />
             )}
 
             {!publishFormValues.publishing && !this.state.publishStarted && (

src/styles/discover.js

@@ -76,6 +76,25 @@ const discoverStyle = StyleSheet.create({
     marginTop: 6,
     marginBottom: 6,
   },
+  footer: {
+    marginTop: 12,
+    marginLeft: 16,
+    marginRight: 16,
+    marginBottom: 64,
+  },
+  footerTitle: {
+    fontFamily: 'Inter-UI-Regular',
+    fontSize: 20,
+    marginBottom: 10,
+  },
+  footerTags: {
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+  },
+  footerTag: {
+    marginRight: 24,
+    marginBottom: 12,
+  },
   categoryName: {
     fontFamily: 'Inter-UI-SemiBold',
     fontSize: 18,