update to work with new claimSearch api
This commit is contained in:
parent
22d860a885
commit
65716f46a9
2 changed files with 60 additions and 98 deletions
|
@ -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(
|
||||||
|
|
|
@ -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>
|
||||||
|
|
Loading…
Reference in a new issue