diff --git a/CHANGELOG.md b/CHANGELOG.md index e944242cc..05d470fd4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -23,6 +23,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/). - Fix floating player stopping on markdown or image files ([#7073](https://github.com/lbryio/lbry-desktop/pull/7073)) - Fix list thumbnail upload ([#7074](https://github.com/lbryio/lbry-desktop/pull/7074)) - Stream Key is now hidden _community pr!_ ([#7127](https://github.com/lbryio/lbry-desktop/pull/7127)) +- Fix playlist preview thumbnail ([#7178](https://github.com/lbryio/lbry-desktop/pull/7178) - Fixed “Your Account” popup on mobile ([#7172](https://github.com/lbryio/lbry-desktop/pull/7172)) ## [0.51.2] - [2021-08-20] diff --git a/ui/component/collectionPreviewOverlay/index.js b/ui/component/collectionPreviewOverlay/index.js index 7e7968976..bf88345d3 100644 --- a/ui/component/collectionPreviewOverlay/index.js +++ b/ui/component/collectionPreviewOverlay/index.js @@ -7,6 +7,7 @@ import { makeSelectNameForCollectionId, makeSelectPendingCollectionForId, makeSelectCountForCollectionId, + doFetchItemsInCollection, } from 'lbry-redux'; import CollectionPreviewOverlay from './view'; @@ -27,4 +28,8 @@ const select = (state, props) => { }; }; -export default connect(select)(CollectionPreviewOverlay); +const perform = (dispatch) => ({ + fetchCollectionItems: (claimId) => dispatch(doFetchItemsInCollection({ collectionId: claimId })), // if collection not resolved, resolve it +}); + +export default connect(select, perform)(CollectionPreviewOverlay); diff --git a/ui/component/collectionPreviewOverlay/view.jsx b/ui/component/collectionPreviewOverlay/view.jsx index 01dd5ab8a..18dfcc106 100644 --- a/ui/component/collectionPreviewOverlay/view.jsx +++ b/ui/component/collectionPreviewOverlay/view.jsx @@ -12,10 +12,17 @@ type Props = { pendingCollection?: Collection, claim: ?Claim, collectionItemUrls: Array, + fetchCollectionItems: (string) => void, }; function CollectionPreviewOverlay(props: Props) { - const { collectionItemUrls } = props; + const { collectionId, collectionItemUrls, fetchCollectionItems } = props; + + React.useEffect(() => { + if (!collectionItemUrls) { + fetchCollectionItems(collectionId); + } + }, [collectionId, collectionItemUrls, fetchCollectionItems]); if (collectionItemUrls && collectionItemUrls.length > 0) { return (