// @flow import React from 'react'; import classnames from 'classnames'; import { NavLink, withRouter } from 'react-router-dom'; import FileThumbnail from 'component/fileThumbnail'; import UriIndicator from 'component/uriIndicator'; import TruncatedText from 'component/common/truncated-text'; import DateTime from 'component/dateTime'; import ChannelThumbnail from 'component/channelThumbnail'; import SubscribeButton from 'component/subscribeButton'; import useGetThumbnail from 'effects/use-get-thumbnail'; import { formatLbryUrlForWeb } from 'util/url'; import { parseURI } from 'lbry-redux'; import FileProperties from 'component/fileProperties'; import FileDownloadLink from 'component/fileDownloadLink'; import ClaimRepostAuthor from 'component/claimRepostAuthor'; import ClaimMenuList from 'component/claimMenuList'; // @if TARGET='app' import { openClaimPreviewMenu } from 'util/context-menu'; // @endif type Props = { uri: string, claim: ?Claim, resolveUri: (string) => void, isResolvingUri: boolean, history: { push: (string) => void }, thumbnail: string, title: string, placeholder: boolean, blackListedOutpoints: Array<{ txid: string, nout: number, }>, filteredOutpoints: Array<{ txid: string, nout: number, }>, blockedChannelUris: Array, getFile: (string) => void, placeholder: boolean, streamingUrl: string, isMature: boolean, showMature: boolean, showHiddenByUser?: boolean, }; function ClaimPreviewTile(props: Props) { const { history, uri, isResolvingUri, thumbnail, title, resolveUri, claim, placeholder, blackListedOutpoints, filteredOutpoints, getFile, streamingUrl, blockedChannelUris, isMature, showMature, showHiddenByUser, } = props; const isRepost = claim && claim.repost_channel_url; const shouldFetch = claim === undefined; const thumbnailUrl = useGetThumbnail(uri, claim, streamingUrl, getFile, placeholder) || thumbnail; const canonicalUrl = claim && claim.canonical_url; const navigateUrl = formatLbryUrlForWeb(canonicalUrl || uri || '/'); const navLinkProps = { to: navigateUrl, onClick: (e) => e.stopPropagation(), }; let isChannel; let isValid = false; if (uri) { try { ({ isChannel } = parseURI(uri)); isValid = true; } catch (e) { isValid = false; } } let channelUri; const signingChannel = claim && claim.signing_channel; if (signingChannel) { channelUri = signingChannel.permanent_url; } function handleClick(e) { if (navigateUrl) { history.push(navigateUrl); } } React.useEffect(() => { if (isValid && !isResolvingUri && shouldFetch && uri) { resolveUri(uri); } }, [isValid, isResolvingUri, uri, resolveUri, shouldFetch]); let shouldHide = false; if (isMature && !showMature) { // Unfortunately needed until this is resolved // https://github.com/lbryio/lbry-sdk/issues/2785 shouldHide = true; } // This will be replaced once blocking is done at the wallet server level if (claim && !shouldHide && blackListedOutpoints) { shouldHide = blackListedOutpoints.some( (outpoint) => (signingChannel && outpoint.txid === signingChannel.txid && outpoint.nout === signingChannel.nout) || (outpoint.txid === claim.txid && outpoint.nout === claim.nout) ); } // We're checking to see if the stream outpoint // or signing channel outpoint is in the filter list if (claim && !shouldHide && filteredOutpoints) { shouldHide = filteredOutpoints.some( (outpoint) => (signingChannel && outpoint.txid === signingChannel.txid && outpoint.nout === signingChannel.nout) || (outpoint.txid === claim.txid && outpoint.nout === claim.nout) ); } // block stream claims if (claim && !shouldHide && !showHiddenByUser && blockedChannelUris.length && signingChannel) { shouldHide = blockedChannelUris.some((blockedUri) => blockedUri === signingChannel.permanent_url); } // block channel claims if we can't control for them in claim search // e.g. fetchRecommendedSubscriptions if (claim && isChannel && !shouldHide && !showHiddenByUser && blockedChannelUris.length) { shouldHide = blockedChannelUris.some((blockedUri) => blockedUri === claim.permanent_url); } if (shouldHide) { return null; } if (placeholder || isResolvingUri) { return (
  • ); } function handleContextMenu(e) { // @if TARGET='app' e.preventDefault(); e.stopPropagation(); openClaimPreviewMenu(claim, e); // @endif } return (
  • {!isChannel && ( {/* @if TARGET='app' */}
    {/* @endif */}
    )}

    {isChannel && (
    )}

    {isChannel ? (
    ) : (
    )}
    {isRepost && (
    )}
  • ); } export default withRouter(ClaimPreviewTile);