update to work with new claimSearch api

This commit is contained in:
Sean Yesmunt 2019-07-31 15:46:54 -04:00
parent 22d860a885
commit 65716f46a9
2 changed files with 60 additions and 98 deletions

View file

@ -2,44 +2,25 @@ import { connect } from 'react-redux';
import { import {
MATURE_TAGS, MATURE_TAGS,
doClaimSearch, doClaimSearch,
doClaimSearchByTags, selectClaimSearchByQuery,
makeSelectClaimSearchUrisForTags, selectFetchingClaimSearchByQuery,
makeSelectFetchingClaimSearchForTags,
selectFetchingClaimSearch, selectFetchingClaimSearch,
selectLastClaimSearchUris,
} from 'lbry-redux'; } from 'lbry-redux';
import Constants from 'constants'; // eslint-disable-line node/no-deprecated-api import Constants from 'constants'; // eslint-disable-line node/no-deprecated-api
import ClaimList from './view'; import ClaimList from './view';
const select = (state, props) => { const select = (state, props) => {
return { return {
loading: makeSelectFetchingClaimSearchForTags(props.tags)(state), // loadingByQuery: selectFetchingClaimSearchByQuery(state),
uris: makeSelectClaimSearchUrisForTags(props.tags)(state), claimSearchByQuery: selectClaimSearchByQuery(state),
// for subscriptions // for subscriptions
claimSearchLoading: selectFetchingClaimSearch(state), loading: selectFetchingClaimSearch(state),
claimSearchUris: selectLastClaimSearchUris(state), // claimSearchUris: selectLastClaimSearchUris(state),
}; };
}; };
const perform = dispatch => ({ const perform = dispatch => ({
claimSearch: options => dispatch(doClaimSearch(Constants.DEFAULT_PAGE_SIZE, options)), claimSearch: options => dispatch(doClaimSearch(options)),
searchByTags: (tags, orderBy = Constants.DEFAULT_ORDER_BY, page = 1, additionalOptions = {}) =>
dispatch(
doClaimSearchByTags(
tags,
Constants.DEFAULT_PAGE_SIZE,
Object.assign(
{},
{
no_totals: true,
order_by: orderBy,
page,
not_tags: MATURE_TAGS,
},
additionalOptions
)
)
),
}); });
export default connect( export default connect(

View file

@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import NavigationActions from 'react-navigation'; import NavigationActions from 'react-navigation';
import { ActivityIndicator, FlatList, Text, TouchableOpacity, View } from 'react-native'; import { ActivityIndicator, FlatList, Text, TouchableOpacity, View } from 'react-native';
import { MATURE_TAGS, normalizeURI } from 'lbry-redux'; import { MATURE_TAGS, normalizeURI, createNormalizedClaimSearchKey } from 'lbry-redux';
import _ from 'lodash'; import _ from 'lodash';
import FileItem from 'component/fileItem'; import FileItem from 'component/fileItem';
import FileListItem from 'component/fileListItem'; import FileListItem from 'component/fileListItem';
@ -25,40 +25,18 @@ class ClaimList extends React.PureComponent {
}; };
componentDidMount() { componentDidMount() {
const { const { channelIds, trendingForAll } = this.props;
channelIds,
trendingForAll,
claimSearch,
orderBy = Constants.DEFAULT_ORDER_BY,
searchByTags,
tags,
time,
} = this.props;
if (channelIds || trendingForAll) {
const options = {
order_by: orderBy,
no_totals: true,
not_tags: MATURE_TAGS,
page: this.state.currentPage,
};
if (channelIds) {
this.setState({ subscriptionsView: true });
options.channel_ids = channelIds;
} else if (trendingForAll) {
this.setState({ trendingForAllView: true });
}
claimSearch(options); if (channelIds) {
} else if (tags && tags.length > 0) { this.setState({ subscriptionsView: true });
const additionalOptions = {}; } else if (trendingForAll) {
if (orderBy && orderBy[0] === Constants.ORDER_BY_EFFECTIVE_AMOUNT && Constants.TIME_ALL !== time) { this.setState({ trendingForAllView: true });
additionalOptions.release_time = this.getReleaseTimeOption(time);
}
searchByTags(tags, orderBy, this.state.currentPage, additionalOptions);
} }
this.doClaimSearch();
} }
componentWillReceiveProps(nextProps) { componentDidUpdate(prevProps) {
const { const {
claimSearch, claimSearch,
orderBy: prevOrderBy, orderBy: prevOrderBy,
@ -67,8 +45,9 @@ class ClaimList extends React.PureComponent {
channelIds: prevChannelIds, channelIds: prevChannelIds,
trendingForAll: prevTrendingForAll, trendingForAll: prevTrendingForAll,
time: prevTime, time: prevTime,
} = this.props; } = prevProps;
const { orderBy, tags, channelIds, trendingForAll, time } = nextProps; const { orderBy, tags, channelIds, trendingForAll, time } = this.props;
if ( if (
!_.isEqual(orderBy, prevOrderBy) || !_.isEqual(orderBy, prevOrderBy) ||
!_.isEqual(tags, prevTags) || !_.isEqual(tags, prevTags) ||
@ -81,34 +60,47 @@ class ClaimList extends React.PureComponent {
if (this.scrollView) { if (this.scrollView) {
this.scrollView.scrollToOffset({ animated: true, offset: 0 }); this.scrollView.scrollToOffset({ animated: true, offset: 0 });
} }
if (trendingForAll || (prevChannelIds && channelIds)) { if (trendingForAll || (prevChannelIds && channelIds)) {
const options = {
order_by: orderBy,
no_totals: true,
not_tags: MATURE_TAGS,
page: this.state.currentPage,
};
if (channelIds) { if (channelIds) {
this.setState({ subscriptionsView: true }); this.setState({ subscriptionsView: true });
options.channel_ids = channelIds;
} }
if (trendingForAll) { if (trendingForAll) {
this.setState({ trendingForAllView: true }); this.setState({ trendingForAllView: true });
} }
claimSearch(options);
} else if (tags && tags.length > 0) { } else if (tags && tags.length > 0) {
this.setState({ subscriptionsView: false, trendingForAllView: false }); this.setState({ subscriptionsView: false, trendingForAllView: false });
const additionalOptions = {};
if (orderBy && orderBy[0] === Constants.ORDER_BY_EFFECTIVE_AMOUNT && Constants.TIME_ALL !== time) {
additionalOptions.release_time = this.getReleaseTimeOption(time);
}
searchByTags(tags, orderBy, this.state.currentPage, additionalOptions);
} }
this.doClaimSearch();
}); });
} }
} }
buildClaimSearchOptions() {
const { orderBy = Constants.DEFAULT_ORDER_BY, channelIds, time } = this.props;
const { currentPage, subscriptionsView } = this.state;
const options = {
order_by: orderBy,
no_totals: true,
not_tags: MATURE_TAGS,
page: currentPage,
};
if (subscriptionsView && channelIds) {
options.channel_ids = channelIds;
} else if (tags && tags.length > 0) {
options.any_tags = tags;
}
if (orderBy && orderBy[0] === Constants.ORDER_BY_EFFECTIVE_AMOUNT && Constants.TIME_ALL !== time) {
options.release_time = this.getReleaseTimeOption(time);
}
return options;
}
getReleaseTimeOption = time => { getReleaseTimeOption = time => {
return `>${Math.floor( return `>${Math.floor(
moment() moment()
@ -117,6 +109,12 @@ class ClaimList extends React.PureComponent {
)}`; )}`;
}; };
doClaimSearch() {
const { claimSearch } = this.props;
const options = this.buildClaimSearchOptions();
claimSearch(options);
}
handleVerticalEndReached = () => { handleVerticalEndReached = () => {
// fetch more content // fetch more content
const { channelIds, claimSearch, claimSearchUris, orderBy, searchByTags, tags, time, uris } = this.props; const { channelIds, claimSearch, claimSearchUris, orderBy, searchByTags, tags, time, uris } = this.props;
@ -127,25 +125,7 @@ class ClaimList extends React.PureComponent {
} }
this.setState({ currentPage: this.state.currentPage + 1 }, () => { this.setState({ currentPage: this.state.currentPage + 1 }, () => {
if (subscriptionsView || trendingForAllView) { this.doClaimSearch();
const options = {
order_by: orderBy,
no_totals: true,
not_tags: MATURE_TAGS,
page: this.state.currentPage,
};
if (subscriptionsView) {
options.channel_ids = channelIds;
}
claimSearch(options);
} else {
const additionalOptions = {};
if (orderBy && orderBy[0] === Constants.ORDER_BY_EFFECTIVE_AMOUNT && Constants.TIME_ALL !== time) {
additionalOptions.release_time = this.getReleaseTimeOption(time);
}
searchByTags(tags, orderBy, this.state.currentPage, additionalOptions);
}
}); });
}; };
@ -178,18 +158,19 @@ class ClaimList extends React.PureComponent {
const { const {
ListHeaderComponent, ListHeaderComponent,
loading, loading,
claimSearchLoading,
claimSearchUris,
morePlaceholder, morePlaceholder,
navigation, navigation,
orientation = Constants.ORIENTATION_VERTICAL, orientation = Constants.ORIENTATION_VERTICAL,
style, style,
uris, claimSearchByQuery,
} = this.props; } = this.props;
const { subscriptionsView, trendingForAllView } = this.state; const { subscriptionsView, trendingForAllView } = this.state;
const options = this.buildClaimSearchOptions();
const claimSearchKey = createNormalizedClaimSearchKey(options);
const uris = claimSearchByQuery[claimSearchKey];
if (Constants.ORIENTATION_VERTICAL === orientation) { if (Constants.ORIENTATION_VERTICAL === orientation) {
const data = subscriptionsView || trendingForAllView ? claimSearchUris : uris;
return ( return (
<View style={style}> <View style={style}>
<FlatList <FlatList
@ -205,12 +186,12 @@ class ClaimList extends React.PureComponent {
renderItem={({ item }) => ( renderItem={({ item }) => (
<FileListItem key={item} uri={item} style={claimListStyle.verticalListItem} navigation={navigation} /> <FileListItem key={item} uri={item} style={claimListStyle.verticalListItem} navigation={navigation} />
)} )}
data={data} data={uris}
keyExtractor={(item, index) => item} keyExtractor={(item, index) => item}
onEndReached={this.handleVerticalEndReached} onEndReached={this.handleVerticalEndReached}
onEndReachedThreshold={0.9} onEndReachedThreshold={0.9}
/> />
{(((subscriptionsView || trendingForAllView) && claimSearchLoading) || loading) && ( {loading && (
<View style={claimListStyle.verticalLoading}> <View style={claimListStyle.verticalLoading}>
<ActivityIndicator size={'small'} color={Colors.LbryGreen} /> <ActivityIndicator size={'small'} color={Colors.LbryGreen} />
</View> </View>