Fix channel links being filtered by Staked Level

## Issue
Channel links were showing the "This channel isn't staking enough LBRY Credits for link previews." -- channel links shouldn't be showing previews in the first place.

## Change
Moved the logic into `ClaimLink`, which is the better place to put it anyway. I think I was trying to not touch as many components as possible (i.e. not passing `allowPreview` down too many layers) in the initial implementation. This caused the `isChannel` consideration to be missed.
This commit is contained in:
infinite-persistence 2021-04-25 11:27:59 +08:00 committed by Sean Yesmunt
parent 1e2919531b
commit e2db26c595
2 changed files with 29 additions and 17 deletions

View file

@ -5,6 +5,7 @@ import EmbedPlayButton from 'component/embedPlayButton';
import Button from 'component/button'; import Button from 'component/button';
import UriIndicator from 'component/uriIndicator'; import UriIndicator from 'component/uriIndicator';
import { INLINE_PLAYER_WRAPPER_CLASS } from 'component/fileRenderFloating/view'; import { INLINE_PLAYER_WRAPPER_CLASS } from 'component/fileRenderFloating/view';
import { SIMPLE_SITE } from 'config';
type Props = { type Props = {
uri: string, uri: string,
@ -12,7 +13,7 @@ type Props = {
children: React.Node, children: React.Node,
description: ?string, description: ?string,
isResolvingUri: boolean, isResolvingUri: boolean,
doResolveUri: string => void, doResolveUri: (string) => void,
blackListedOutpoints: Array<{ blackListedOutpoints: Array<{
txid: string, txid: string,
nout: number, nout: number,
@ -20,6 +21,7 @@ type Props = {
playingUri: ?PlayingUri, playingUri: ?PlayingUri,
parentCommentId?: string, parentCommentId?: string,
isMarkdownPost?: boolean, isMarkdownPost?: boolean,
allowPreview: boolean,
}; };
class ClaimLink extends React.Component<Props> { class ClaimLink extends React.Component<Props> {
@ -29,6 +31,7 @@ class ClaimLink extends React.Component<Props> {
thumbnail: null, thumbnail: null,
description: null, description: null,
isResolvingUri: false, isResolvingUri: false,
allowPreview: false,
}; };
componentDidMount() { componentDidMount() {
@ -46,7 +49,7 @@ class ClaimLink extends React.Component<Props> {
let blackListed = false; let blackListed = false;
blackListed = blackListedOutpoints.some( blackListed = blackListedOutpoints.some(
outpoint => (outpoint) =>
(signingChannel && outpoint.txid === signingChannel.txid && outpoint.nout === signingChannel.nout) || (signingChannel && outpoint.txid === signingChannel.txid && outpoint.nout === signingChannel.nout) ||
(outpoint.txid === claim.txid && outpoint.nout === claim.nout) (outpoint.txid === claim.txid && outpoint.nout === claim.nout)
); );
@ -63,7 +66,16 @@ class ClaimLink extends React.Component<Props> {
}; };
render() { render() {
const { uri, claim, children, isResolvingUri, playingUri, parentCommentId, isMarkdownPost } = this.props; const {
uri,
claim,
children,
isResolvingUri,
playingUri,
parentCommentId,
isMarkdownPost,
allowPreview,
} = this.props;
const isUnresolved = (!isResolvingUri && !claim) || !claim; const isUnresolved = (!isResolvingUri && !claim) || !claim;
const isBlacklisted = this.isClaimBlackListed(); const isBlacklisted = this.isClaimBlackListed();
const isPlayingInline = const isPlayingInline =
@ -81,7 +93,7 @@ class ClaimLink extends React.Component<Props> {
return isChannel ? ( return isChannel ? (
<UriIndicator uri={uri} link /> <UriIndicator uri={uri} link />
) : ( ) : allowPreview ? (
<div className={classnames('claim-link')}> <div className={classnames('claim-link')}>
<div <div
className={classnames({ className={classnames({
@ -92,6 +104,14 @@ class ClaimLink extends React.Component<Props> {
</div> </div>
<Button button="link" className="preview-link__url" label={uri} navigate={uri} /> <Button button="link" className="preview-link__url" label={uri} navigate={uri} />
</div> </div>
) : (
<Button
button="link"
title={SIMPLE_SITE ? __("This channel isn't staking enough LBRY Credits for link previews.") : children}
label={children}
className="button--external-link"
navigate={uri}
/>
); );
} }
} }

View file

@ -1,5 +1,5 @@
// @flow // @flow
import { KNOWN_APP_DOMAINS, SIMPLE_SITE } from 'config'; import { KNOWN_APP_DOMAINS } from 'config';
import * as ICONS from 'constants/icons'; import * as ICONS from 'constants/icons';
import * as React from 'react'; import * as React from 'react';
import { isURIValid } from 'lbry-redux'; import { isURIValid } from 'lbry-redux';
@ -43,7 +43,6 @@ function MarkdownLink(props: Props) {
// Regex for url protocol // Regex for url protocol
const protocolRegex = new RegExp('^(https?|lbry|mailto)+:', 'i'); const protocolRegex = new RegExp('^(https?|lbry|mailto)+:', 'i');
const protocol = href ? protocolRegex.exec(href) : null; const protocol = href ? protocolRegex.exec(href) : null;
const isLbryLink = href.startsWith('lbry://');
let linkUrlObject; let linkUrlObject;
try { try {
@ -98,30 +97,23 @@ function MarkdownLink(props: Props) {
/> />
); );
} else if (!simpleLinks && ((protocol && protocol[0] === 'lbry:' && isURIValid(decodedUri)) || lbryUrlFromLink)) { } else if (!simpleLinks && ((protocol && protocol[0] === 'lbry:' && isURIValid(decodedUri)) || lbryUrlFromLink)) {
element = allowPreview ? ( element = (
<ClaimLink <ClaimLink
uri={lbryUrlFromLink || decodedUri} uri={lbryUrlFromLink || decodedUri}
autoEmbed={embed} autoEmbed={embed}
parentCommentId={parentCommentId} parentCommentId={parentCommentId}
isMarkdownPost={isMarkdownPost} isMarkdownPost={isMarkdownPost}
allowPreview={allowPreview}
> >
{children} {children}
</ClaimLink> </ClaimLink>
) : (
<Button
button="link"
iconRight={isLbryLink ? undefined : ICONS.EXTERNAL}
title={SIMPLE_SITE ? __("This channel isn't staking enough LBRY Credits for link previews.") : children}
label={children}
className="button--external-link"
navigate={isLbryLink ? href : undefined}
href={isLbryLink ? undefined : href}
/>
); );
} else if ( } else if (
simpleLinks || simpleLinks ||
(protocol && (protocol[0] === 'http:' || protocol[0] === 'https:' || protocol[0] === 'mailto:')) (protocol && (protocol[0] === 'http:' || protocol[0] === 'https:' || protocol[0] === 'mailto:'))
) { ) {
const isLbryLink = href.startsWith('lbry://');
element = ( element = (
<Button <Button
button="link" button="link"