diff --git a/src/page/search/view.js b/src/page/search/view.js index d6580c0..9f191b4 100644 --- a/src/page/search/view.js +++ b/src/page/search/view.js @@ -1,6 +1,15 @@ import React from 'react'; import { Lbry, parseURI, normalizeURI, isURIValid } from 'lbry-redux'; -import { ActivityIndicator, Button, FlatList, NativeModules, Text, TextInput, View } from 'react-native'; +import { + ActivityIndicator, + Button, + FlatList, + NativeModules, + Text, + TextInput, + TouchableOpacity, + View, +} from 'react-native'; import { navigateToUri } from 'utils/helper'; import Colors from 'styles/colors'; import Constants from 'constants'; // eslint-disable-line node/no-deprecated-api @@ -99,12 +108,28 @@ class SearchPage extends React.PureComponent { listHeaderComponent = () => { const { navigation } = this.props; const { currentUri } = this.state; + const query = this.getSearchQuery(); + // TODO: Do a claim_search to see if the tag has any content + const showTagResult = query && query.trim().length > 0 && isURIValid(query); return ( - + + + {showTagResult && ( + this.handleTagResultPressed(query)}> + #{query} + Explore content for this tag + + )} + ); }; + handleTagResultPressed = tag => { + const { navigation } = this.props; + navigation.navigate({ routeName: Constants.DRAWER_ROUTE_TAG, key: `tagPage`, params: { tag } }); + }; + render() { const { isSearching, navigation, query, uris, urisByQuery } = this.props; diff --git a/src/styles/search.js b/src/styles/search.js index df62e8c..559d0a1 100644 --- a/src/styles/search.js +++ b/src/styles/search.js @@ -35,12 +35,24 @@ const searchStyle = StyleSheet.create({ flex: 1, flexDirection: 'row', justifyContent: 'space-between', - paddingTop: 8, - paddingBottom: 8, - paddingLeft: 8, - paddingRight: 8, + padding: 8, backgroundColor: Colors.Black, }, + tagResultItem: { + flex: 1, + padding: 16, + backgroundColor: Colors.DarkerGrey, + }, + tagResultTitle: { + fontFamily: 'Inter-UI-SemiBold', + fontSize: 24, + color: Colors.White, + }, + tagResultDescription: { + fontFamily: 'Inter-UI-Regular', + fontSize: 14, + color: Colors.VeryLightGrey, + }, searchInput: { width: '100%', height: '100%',