diff --git a/ui/component/claimListDiscover/view.jsx b/ui/component/claimListDiscover/view.jsx index c77e26281..c25c53452 100644 --- a/ui/component/claimListDiscover/view.jsx +++ b/ui/component/claimListDiscover/view.jsx @@ -136,7 +136,7 @@ function ClaimListDiscover(props: Props) { claim_type?: Array, name?: string, duration?: string, - reposted_claim_id: string, + reposted_claim_id?: string, stream_types?: any, } = { page_size: pageSize || CS.PAGE_SIZE, @@ -598,9 +598,13 @@ function ClaimListDiscover(props: Props) { hideBlock={hideBlock} /> -
- {loading && new Array(CS.PAGE_SIZE).fill(1).map((x, i) => )} -
+ {loading && ( +
+ {new Array(CS.PAGE_SIZE).fill(1).map((x, i) => ( + + ))} +
+ )} ); } diff --git a/ui/page/discover/index.js b/ui/page/discover/index.js index aaf9a8a44..32d75ca53 100644 --- a/ui/page/discover/index.js +++ b/ui/page/discover/index.js @@ -1,5 +1,5 @@ import { connect } from 'react-redux'; -import { makeSelectClaimForUri, selectFollowedTags } from 'lbry-redux'; +import { makeSelectClaimForUri, selectFollowedTags, doResolveUri } from 'lbry-redux'; import { doToggleTagFollowDesktop } from 'redux/actions/tags'; import * as CS from 'constants/claim_search'; import Tags from './view'; @@ -17,4 +17,5 @@ const select = (state, props) => { export default connect(select, { doToggleTagFollowDesktop, + doResolveUri, })(Tags); diff --git a/ui/page/discover/view.jsx b/ui/page/discover/view.jsx index 31f63057d..b4889da28 100644 --- a/ui/page/discover/view.jsx +++ b/ui/page/discover/view.jsx @@ -16,15 +16,17 @@ type Props = { repostedUri: string, repostedClaim: ?GenericClaim, doToggleTagFollowDesktop: string => void, + doResolveUri: string => void, }; -function TagsPage(props: Props) { +function DiscoverPage(props: Props) { const { location: { search }, followedTags, repostedClaim, repostedUri, doToggleTagFollowDesktop, + doResolveUri, } = props; const buttonRef = useRef(); const isHovering = useHover(buttonRef); @@ -33,6 +35,7 @@ function TagsPage(props: Props) { const claimType = urlParams.get('claim_type'); const tagsQuery = urlParams.get('t') || null; const tags = tagsQuery ? tagsQuery.split(',') : null; + const repostedClaimIsResolved = repostedUri && repostedClaim; // Eventually allow more than one tag on this page // Restricting to one to make follow/unfollow simpler @@ -44,6 +47,12 @@ function TagsPage(props: Props) { label = __('Unfollow'); } + React.useEffect(() => { + if (repostedUri && !repostedClaimIsResolved) { + doResolveUri(repostedUri); + } + }, [repostedUri, repostedClaimIsResolved, doResolveUri]); + function handleFollowClick() { if (tag) { doToggleTagFollowDesktop(tag); @@ -98,4 +107,4 @@ function TagsPage(props: Props) { ); } -export default TagsPage; +export default DiscoverPage;