diff --git a/ui/component/claimList/view.jsx b/ui/component/claimList/view.jsx index 50ed87f1f..6afdd6576 100644 --- a/ui/component/claimList/view.jsx +++ b/ui/component/claimList/view.jsx @@ -208,17 +208,23 @@ export default function ClaimList(props: Props) { ); React.useEffect(() => { + refreshBuffer(); + }, [tileUris, injectedItem, lastVisibleIndex, pageSize]); + + function refreshBuffer() { tileUris.forEach((uri, index) => { if (uri) { const inj = getInjectedItem(index); if (inj) { if (uriBuffer.indexOf(index) === -1) { - setUriBuffer([index]); + let newUriBUffer = uriBuffer; + newUriBUffer.push(index); + setUriBuffer(newUriBUffer); } } } }); - }, [tileUris, injectedItem, lastVisibleIndex, pageSize]); + } const getInjectedItem = (index) => { if (injectedItem && injectedItem.node) { @@ -243,6 +249,7 @@ export default function ClaimList(props: Props) { tileUris.map((uri, index) => { if (uri) { const inj = getInjectedItem(index); + if (inj) refreshBuffer(); return ( {inj && inj} diff --git a/ui/component/claimTilesDiscover/view.jsx b/ui/component/claimTilesDiscover/view.jsx index 2c4a6fdb7..f45df61ee 100644 --- a/ui/component/claimTilesDiscover/view.jsx +++ b/ui/component/claimTilesDiscover/view.jsx @@ -176,17 +176,23 @@ function ClaimTilesDiscover(props: Props) { }, [doClaimSearch, shouldPerformSearch, optionsStringified]); React.useEffect(() => { + refreshBuffer(); + }, [finalUris, injectedItem, lastVisibleIndex, pageSize]); + + function refreshBuffer() { finalUris.forEach((uri, index) => { if (uri) { const inj = getInjectedItem(index); if (inj) { if (uriBuffer.indexOf(index) === -1) { - setUriBuffer([index]); + let newUriBUffer = uriBuffer; + newUriBUffer.push(index); + setUriBuffer(newUriBUffer); } } } }); - }, [finalUris, injectedItem, lastVisibleIndex, pageSize]); + } // -------------------------------------------------------------------------- // -------------------------------------------------------------------------- @@ -220,6 +226,7 @@ function ClaimTilesDiscover(props: Props) { ? finalUris.map((uri, i) => { if (uri) { const inj = getInjectedItem(i); + if (inj) refreshBuffer(); return ( {inj && inj}