prevent multiple claim_search's happening on the homepage
This commit is contained in:
parent
707abdd280
commit
dd5636c2b3
3 changed files with 9 additions and 7 deletions
|
@ -1,5 +1,5 @@
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import { doClaimSearch, selectClaimSearchByQuery, selectFetchingClaimSearch, SETTINGS } from 'lbry-redux';
|
import { doClaimSearch, selectClaimSearchByQuery, selectFetchingClaimSearchByQuery, SETTINGS } from 'lbry-redux';
|
||||||
import { selectBlockedChannels } from 'redux/selectors/blocked';
|
import { selectBlockedChannels } from 'redux/selectors/blocked';
|
||||||
import { doToggleTagFollowDesktop } from 'redux/actions/tags';
|
import { doToggleTagFollowDesktop } from 'redux/actions/tags';
|
||||||
import { makeSelectClientSetting } from 'redux/selectors/settings';
|
import { makeSelectClientSetting } from 'redux/selectors/settings';
|
||||||
|
@ -7,7 +7,7 @@ import ClaimListDiscover from './view';
|
||||||
|
|
||||||
const select = state => ({
|
const select = state => ({
|
||||||
claimSearchByQuery: selectClaimSearchByQuery(state),
|
claimSearchByQuery: selectClaimSearchByQuery(state),
|
||||||
loading: selectFetchingClaimSearch(state),
|
fetchingClaimSearchByQuery: selectFetchingClaimSearchByQuery(state),
|
||||||
showNsfw: makeSelectClientSetting(SETTINGS.SHOW_MATURE)(state),
|
showNsfw: makeSelectClientSetting(SETTINGS.SHOW_MATURE)(state),
|
||||||
hideReposts: makeSelectClientSetting(SETTINGS.HIDE_REPOSTS)(state),
|
hideReposts: makeSelectClientSetting(SETTINGS.HIDE_REPOSTS)(state),
|
||||||
hiddenUris: selectBlockedChannels(state),
|
hiddenUris: selectBlockedChannels(state),
|
||||||
|
|
|
@ -14,6 +14,9 @@ type Props = {
|
||||||
claimSearchByQuery: {
|
claimSearchByQuery: {
|
||||||
[string]: Array<string>,
|
[string]: Array<string>,
|
||||||
},
|
},
|
||||||
|
fetchingClaimSearchByQuery: {
|
||||||
|
[string]: boolean,
|
||||||
|
},
|
||||||
// claim search options are below
|
// claim search options are below
|
||||||
tags: Array<string>,
|
tags: Array<string>,
|
||||||
hiddenUris: Array<string>,
|
hiddenUris: Array<string>,
|
||||||
|
@ -49,12 +52,12 @@ function ClaimTilesDiscover(props: Props) {
|
||||||
timestamp,
|
timestamp,
|
||||||
feeAmount,
|
feeAmount,
|
||||||
limitClaimsPerChannel,
|
limitClaimsPerChannel,
|
||||||
|
fetchingClaimSearchByQuery,
|
||||||
} = props;
|
} = props;
|
||||||
const { location } = useHistory();
|
const { location } = useHistory();
|
||||||
const urlParams = new URLSearchParams(location.search);
|
const urlParams = new URLSearchParams(location.search);
|
||||||
const feeAmountInUrl = urlParams.get('fee_amount');
|
const feeAmountInUrl = urlParams.get('fee_amount');
|
||||||
const feeAmountParam = feeAmountInUrl || feeAmount;
|
const feeAmountParam = feeAmountInUrl || feeAmount;
|
||||||
const [hasSearched, setHasSearched] = React.useState(false);
|
|
||||||
const options: {
|
const options: {
|
||||||
page_size: number,
|
page_size: number,
|
||||||
no_totals: boolean,
|
no_totals: boolean,
|
||||||
|
@ -118,17 +121,17 @@ function ClaimTilesDiscover(props: Props) {
|
||||||
|
|
||||||
const claimSearchCacheQuery = createNormalizedClaimSearchKey(options);
|
const claimSearchCacheQuery = createNormalizedClaimSearchKey(options);
|
||||||
const uris = (prefixUris || []).concat(claimSearchByQuery[claimSearchCacheQuery] || []);
|
const uris = (prefixUris || []).concat(claimSearchByQuery[claimSearchCacheQuery] || []);
|
||||||
const shouldPerformSearch = !hasSearched || uris.length === 0;
|
|
||||||
// Don't use the query from createNormalizedClaimSearchKey for the effect since that doesn't include page & release_time
|
// Don't use the query from createNormalizedClaimSearchKey for the effect since that doesn't include page & release_time
|
||||||
const optionsStringForEffect = JSON.stringify(options);
|
const optionsStringForEffect = JSON.stringify(options);
|
||||||
|
const isLoading = fetchingClaimSearchByQuery[claimSearchCacheQuery];
|
||||||
|
const shouldPerformSearch = !isLoading && uris.length === 0;
|
||||||
|
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
if (shouldPerformSearch) {
|
if (shouldPerformSearch) {
|
||||||
const searchOptions = JSON.parse(optionsStringForEffect);
|
const searchOptions = JSON.parse(optionsStringForEffect);
|
||||||
doClaimSearch(searchOptions);
|
doClaimSearch(searchOptions);
|
||||||
setHasSearched(true);
|
|
||||||
}
|
}
|
||||||
}, [doClaimSearch, shouldPerformSearch, optionsStringForEffect, hasSearched]);
|
}, [doClaimSearch, shouldPerformSearch, optionsStringForEffect]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ul className="claim-grid">
|
<ul className="claim-grid">
|
||||||
|
|
|
@ -34,7 +34,6 @@ export default handleActions(
|
||||||
const commentsByUri = Object.assign({}, state.commentsByUri);
|
const commentsByUri = Object.assign({}, state.commentsByUri);
|
||||||
const comments = byId[claimId] || [];
|
const comments = byId[claimId] || [];
|
||||||
const newCommentIds = comments.slice();
|
const newCommentIds = comments.slice();
|
||||||
const commentsByUri = Object.assign({}, state.commentsByUri);
|
|
||||||
|
|
||||||
// add the comment by its ID
|
// add the comment by its ID
|
||||||
commentById[comment.comment_id] = comment;
|
commentById[comment.comment_id] = comment;
|
||||||
|
|
Loading…
Reference in a new issue