repost ui #5293

Merged
jessopb merged 2 commits from repostedPreview into master 2021-01-13 16:44:44 +01:00
3 changed files with 45 additions and 25 deletions

View file

@ -131,9 +131,10 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
isValid = false;
}
}
const isRepost = claim && claim.repost_url;
const contentUri = hideRepostLabel && claim && claim.repost_url ? claim.canonical_url || claim.permanent_url : uri;
const isChannel = isValid ? parseURI(contentUri).isChannel : false;
const contentUri = claim && isRepost ? claim.canonical_url || claim.permanent_url : uri;
const isChannelUri = isValid ? parseURI(contentUri).isChannel : false;
const signingChannel = claim && claim.signing_channel;
const navigateUrl = formatLbryUrlForWeb((claim && claim.canonical_url) || uri || '/');
const navLinkProps = {
@ -170,7 +171,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
}
// block channel claims if we can't control for them in claim search
// e.g. fetchRecommendedSubscriptions
if (claim && isChannel && !shouldHide && !showUserBlocked && blockedChannelUris.length) {
if (claim && isChannelUri && !shouldHide && !showUserBlocked && blockedChannelUris.length) {
shouldHide = blockedChannelUris.some(blockedUri => blockedUri === claim.permanent_url);
}
@ -216,21 +217,25 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
}
if (placeholder === 'loading' || (uri && !claim && isResolvingUri)) {
return <ClaimPreviewLoading isChannel={isChannel} type={type} />;
return <ClaimPreviewLoading isChannel={isChannelUri} type={type} />;
}
if (claim && showNullPlaceholder && shouldHide && nsfw) {
return (
<ClaimPreviewHidden message={__('Mature content hidden by your preferences')} isChannel={isChannel} type={type} />
<ClaimPreviewHidden
message={__('Mature content hidden by your preferences')}
isChannel={isChannelUri}
type={type}
/>
);
}
if (claim && showNullPlaceholder && shouldHide) {
return <ClaimPreviewHidden message={__('This content is hidden')} isChannel={isChannel} type={type} />;
return <ClaimPreviewHidden message={__('This content is hidden')} isChannel={isChannelUri} type={type} />;
}
if (!claim && (showNullPlaceholder || empty)) {
return empty || <ClaimPreviewNoContent isChannel={isChannel} type={type} />;
return empty || <ClaimPreviewNoContent isChannel={isChannelUri} type={type} />;
}
if (!shouldFetch && showUnresolvedClaim && !isResolvingUri && claim === null) {
@ -247,7 +252,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
onClick={pending || type === 'inline' ? undefined : handleOnClick}
onContextMenu={handleContextMenu}
className={classnames('claim-preview__wrapper', {
'claim-preview__wrapper--channel': isChannel && type !== 'inline',
'claim-preview__wrapper--channel': isChannelUri && type !== 'inline',
'claim-preview__wrapper--inline': type === 'inline',
'claim-preview__wrapper--small': type === 'small',
})}
@ -260,12 +265,12 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
'claim-preview--large': type === 'large',
'claim-preview--inline': type === 'inline',
'claim-preview--tooltip': type === 'tooltip',
'claim-preview--channel': isChannel,
'claim-preview--visited': !isChannel && !claimIsMine && hasVisitedUri,
'claim-preview--channel': isChannelUri,
'claim-preview--visited': !isChannelUri && !claimIsMine && hasVisitedUri,
'claim-preview--pending': pending,
})}
>
{isChannel && claim ? (
{isChannelUri && claim ? (
<UriIndicator uri={contentUri} link>
<ChannelThumbnail uri={contentUri} obscure={channelIsBlocked} />
</UriIndicator>
@ -281,9 +286,11 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
</div>
)}
{/* @endif */}
{!isRepost && !isChannelUri && (
<div className="claim-preview__file-property-overlay">
<FileProperties uri={contentUri} small />
</div>
)}
</FileThumbnail>
</NavLink>
) : (
@ -299,11 +306,11 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
<ClaimPreviewTitle uri={contentUri} />
) : (
<NavLink {...navLinkProps}>
<ClaimPreviewTitle uri={contentUri} />
<ClaimPreviewTitle uri={uri} />
</NavLink>
)}
</div>
<ClaimPreviewSubtitle uri={contentUri} type={type} />
<ClaimPreviewSubtitle uri={uri} type={type} />
{(pending || !!reflectingProgress) && <PublishPending uri={uri} />}
</div>
{type !== 'small' && (
@ -315,10 +322,10 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
actions
) : (
<div className="claim-preview__primary-actions">
{isChannel && !channelIsBlocked && !claimIsMine && (
{isChannelUri && !channelIsBlocked && !claimIsMine && (
<SubscribeButton uri={contentUri.startsWith('lbry://') ? contentUri : `lbry://${contentUri}`} />
)}
{!hideBlock && isChannel && !isSubscribed && (!claimIsMine || channelIsBlocked) && (
{!hideBlock && isChannelUri && !isSubscribed && (!claimIsMine || channelIsBlocked) && (
<BlockButton uri={contentUri.startsWith('lbry://') ? contentUri : `lbry://${contentUri}`} />
)}
{includeSupportAction && <ClaimSupportButton uri={contentUri} />}

View file

@ -16,18 +16,29 @@ function ClaimRepostAuthor(props: Props) {
const repostChannelUrl = claim && claim.repost_channel_url;
const repostUrl = claim && claim.repost_url;
if (!repostChannelUrl) {
return null;
}
if (short) {
if (short && repostUrl) {
return (
<span className="claim-preview__repost-author">
<Icon icon={ICONS.REPOST} size={14} />
<Icon icon={ICONS.REPOST} size={12} />
<span>{repostUrl}</span>
</span>
);
}
if (repostUrl && !repostChannelUrl) {
return (
<div className="claim-preview__repost-author">
<Icon icon={ICONS.REPOST} size={10} />
<span>
<strong>Anonymous</strong> {__('Reposted')}
</span>
</div>
);
}
if (!repostUrl) {
return null;
}
return (
<div className="claim-preview__repost-author">
<Icon icon={ICONS.REPOST} size={10} />

View file

@ -140,7 +140,9 @@ export const makeSelectWinningUriForQuery = (query: string) => {
}
const returnBeforePending =
Number(effectiveAmount1) > Number(effectiveAmount2) ? claim1.canonical_url : claim2.canonical_url;
Number(effectiveAmount1) > Number(effectiveAmount2)
? claim1.repost_url || claim1.canonical_url
: claim2.canonical_url;
if (pendingAmount && pendingAmount > effectiveAmount1 && pendingAmount > effectiveAmount2) {
return pendingAmount.permanent_url;
} else {