Merge pull request #156 from lbryio/search-result-urls

Add URI to search result items. Update omnibar URI suggestions display.

app/src/component/searchResultItem/view.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import { normalizeURI, parseURI } from 'lbry-redux';
-import { Text, TouchableOpacity, View } from 'react-native';
+import { ActivityIndicator, Text, TouchableOpacity, View } from 'react-native';
+import Colors from '../../styles/colors';
 import FileItemMedia from '../fileItemMedia';
 import NsfwOverlay from '../../component/nsfwOverlay';
 import searchStyle from '../../styles/search';
@@ -39,7 +40,13 @@ class SearchResultItem extends React.PureComponent {
                            thumbnail={metadata ? metadata.thumbnail : null} />
           </View>
           <View style={searchStyle.detailsContainer}>
-            {isResolvingUri && <Text style={searchStyle.loading}>Loading...</Text>} 
+            {isResolvingUri && (
+            <View>
+              <Text style={searchStyle.uri}>{uri}</Text>
+              <View style={searchStyle.row}>
+                <ActivityIndicator size={"small"} color={Colors.LbryGreen} />
+              </View>
+            </View>)} 
             {!isResolvingUri && <Text style={searchStyle.title}>{title || name}</Text>}
             {!isResolvingUri && channel && <Text style={searchStyle.publisher}>{channel}</Text>}
           </View>

app/src/component/uriBar/internal/uri-bar-item.js

@@ -8,7 +8,7 @@ import uriBarStyle from '../../../styles/uriBar';
 class UriBarItem extends React.PureComponent {
   render() {
     const { item, onPress } = this.props;
-    const { type, value } = item;
+    const { shorthand, type, value } = item;
     
     let icon;
     switch (type) {
@@ -29,7 +29,7 @@ class UriBarItem extends React.PureComponent {
     return (
       <TouchableOpacity style={uriBarStyle.item} onPress={onPress}>
         {icon}
-        <Text style={uriBarStyle.itemText} numberOfLines={1}>{value}</Text>
+        <Text style={uriBarStyle.itemText} numberOfLines={1}>{shorthand || value} - {type === 'search' ? 'Search' : value}</Text>
       </TouchableOpacity>
     )
   }                                                      

app/src/styles/search.js

@@ -42,6 +42,11 @@ const searchStyle = StyleSheet.create({
     fontFamily: 'Metropolis-SemiBold',
     fontSize: 16
   },
+  uri: {
+    fontFamily: 'Metropolis-SemiBold',
+    fontSize: 14,
+    marginBottom: 8
+  },
   publisher: {
     fontFamily: 'Metropolis-SemiBold',
     fontSize: 12,