better featured search result item handling (#37)

src/component/claimList/view.js

@@ -204,7 +204,12 @@ class ClaimList extends React.PureComponent {
 
     const options = this.buildClaimSearchOptions();
     const claimSearchKey = createNormalizedClaimSearchKey(options);
-    const uris = claimSearchByQuery[claimSearchKey];
+    let uris = claimSearchByQuery[claimSearchKey];
+
+    if (uris) {
+      // temporary workaround for missing short_urls
+      uris = uris.filter(uri => uri && uri.length > 0);
+    }
 
     if (Constants.ORIENTATION_VERTICAL === orientation) {
       return (

src/component/fileListItem/view.js

@@ -3,6 +3,7 @@ import { normalizeURI, parseURI } from 'lbry-redux';
 import { ActivityIndicator, Platform, Text, TouchableOpacity, View } from 'react-native';
 import { navigateToUri, formatBytes } from 'utils/helper';
 import Colors from 'styles/colors';
+import Constants from 'constants'; // eslint-disable-line node/no-deprecated-api
 import DateTime from 'component/dateTime';
 import FileItemMedia from 'component/fileItemMedia';
 import Icon from 'react-native-vector-icons/FontAwesome5';
@@ -42,8 +43,13 @@ class FileListItem extends React.PureComponent {
   }
 
   defaultOnPress = () => {
-    const { autoplay, navigation, uri, shortUrl } = this.props;
+    const { autoplay, claim, featuredResult, navigation, uri, shortUrl } = this.props;
-    navigateToUri(navigation, shortUrl || uri, { autoplay });
+
+    if (featuredResult && !claim) {
+      navigation.navigate({ routeName: Constants.DRAWER_ROUTE_PUBLISH, params: { vanityUrl: uri.trim() } });
+    } else {
+      navigateToUri(navigation, shortUrl || uri, { autoplay });
+    }
   };
 
   onPressHandler = () => {
@@ -111,7 +117,7 @@ class FileListItem extends React.PureComponent {
       // shouldHide = 'channel' === claim.value_type;
     }
 
-    if (shouldHide || (!isResolvingUri && !claim) || (featuredResult && !isResolvingUri && !claim && !title && !name)) {
+    if (shouldHide || (!isResolvingUri && !claim && !featuredResult)) {
       return null;
     }
 
@@ -130,7 +136,7 @@ class FileListItem extends React.PureComponent {
             style={fileListStyle.thumbnail}
             duration={duration}
             resizeMode="cover"
-            title={title || name}
+            title={title || name || normalizeURI(uri).substring(7)}
             thumbnail={thumbnail}
           />
           {selected && (
@@ -167,6 +173,13 @@ class FileListItem extends React.PureComponent {
                 {isRewardContent && <Icon style={fileListStyle.rewardIcon} name="award" size={12} />}
               </View>
             )}
+
+            {featuredResult && !isResolving && !claim && (
+              <View style={fileListStyle.titleContainer}>
+                <Text style={fileListStyle.featuredTitle}>Nothing here. Publish something!</Text>
+              </View>
+            )}
+
             {channel && !hideChannel && (
               <Link
                 style={fileListStyle.publisher}

src/page/publish/view.js

@@ -19,6 +19,7 @@ import {
   isNameValid,
   buildURI,
   normalizeURI,
+  parseURI,
   regexInvalidURI,
   CLAIM_VALUES,
   LICENSES,
@@ -27,7 +28,6 @@ import {
 } from 'lbry-redux';
 import { RNCamera } from 'react-native-camera';
 import { generateCombination } from 'gfycat-style-urls';
-import DocumentPicker from 'react-native-document-picker';
 import RNFS from 'react-native-fs';
 import Button from 'component/button';
 import ChannelSelector from 'component/channelSelector';
@@ -124,6 +124,7 @@ class PublishPage extends React.PureComponent {
     tags: [],
     selectedChannel: null,
     uploadedThumbnailUri: null,
+    vanityUrlSet: false,
 
     // other
     publishStarted: false,
@@ -180,9 +181,16 @@ class PublishPage extends React.PureComponent {
 
       // Check if this is an edit action
       if (navigation.state.params) {
-        const { editMode, claimToEdit } = navigation.state.params;
+        const { editMode, claimToEdit, vanityUrl } = navigation.state.params;
         if (editMode) {
           this.prepareEdit(claimToEdit);
+        } else if (vanityUrl) {
+          const { claimName } = parseURI(vanityUrl);
+          this.setState({
+            name: claimName,
+            hasEditedContentAddress: true,
+            vanityUrlSet: true,
+          });
         }
       }
     });
@@ -234,6 +242,7 @@ class PublishPage extends React.PureComponent {
         title,
         currentThumbnailUri: thumbnailUrl,
         uploadedThumbnailUri: thumbnailUrl,
+        vanityUrlSet: false,
       },
       () => {
         this.handleNameChange(name);
@@ -380,7 +389,7 @@ class PublishPage extends React.PureComponent {
       {
         currentMedia: media,
         title: null, // no title autogeneration (user will fill this in)
-        name: this.formatNameForTitle(name),
+        name: this.state.hasEditedContentAddress ? this.state.name : this.formatNameForTitle(name),
         currentPhase: Constants.PHASE_DETAILS,
       },
       () => this.handleNameChange(this.state.name)
@@ -426,6 +435,8 @@ class PublishPage extends React.PureComponent {
         tags: [],
         selectedChannel: null,
         uploadedThumbnailUri: null,
+
+        vanityUrlSet: false,
       },
       () => {
         // reset thumbnail
@@ -512,19 +523,6 @@ class PublishPage extends React.PureComponent {
     });
   };
 
-  handleUploadPressed = () => {
-    DocumentPicker.pick({ type: [DocumentPicker.types.allFiles] })
-      .then(file => {
-        // console.log(file);
-      })
-      .catch(error => {
-        if (!DocumentPicker.isCancel(error)) {
-          // notify the user
-          // console.log(error);
-        }
-      });
-  };
-
   getRandomFileId = () => {
     // generate a random id for a photo or recorded video between 1 and 20 (for creating thumbnails)
     const id = Math.floor(Math.random() * (20 - 2)) + 1;

src/page/search/view.js

@@ -101,13 +101,7 @@ class SearchPage extends React.PureComponent {
     const { currentUri } = this.state;
 
     return (
-      <FileListItem
+      <FileListItem uri={currentUri} featuredResult style={searchStyle.featuredResultItem} navigation={navigation} />
-        uri={currentUri}
-        featuredResult
-        style={searchStyle.featuredResultItem}
-        navigation={navigation}
-        onPress={() => navigateToUri(navigation, this.state.currentUri)}
-      />
     );
   };