re-enable lbry:// link styles in comments
will add support for odysee/lbry.tv once the style is finalized
This commit is contained in:
parent
480d8a8786
commit
b1bca7982a
4 changed files with 26 additions and 28 deletions
|
@ -1,15 +1,12 @@
|
|||
// @flow
|
||||
import * as React from 'react';
|
||||
import Button from 'component/button';
|
||||
import PreviewLink from 'component/previewLink';
|
||||
import UriIndicator from 'component/uriIndicator';
|
||||
|
||||
type Props = {
|
||||
uri: string,
|
||||
title: ?string,
|
||||
claim: StreamClaim,
|
||||
children: React.Node,
|
||||
className: ?string,
|
||||
autoEmbed: ?boolean,
|
||||
description: ?string,
|
||||
isResolvingUri: boolean,
|
||||
|
@ -24,7 +21,6 @@ class ClaimLink extends React.Component<Props> {
|
|||
static defaultProps = {
|
||||
href: null,
|
||||
link: false,
|
||||
title: null,
|
||||
thumbnail: null,
|
||||
autoEmbed: false,
|
||||
description: null,
|
||||
|
@ -63,7 +59,7 @@ class ClaimLink extends React.Component<Props> {
|
|||
};
|
||||
|
||||
render() {
|
||||
const { uri, claim, title, className, autoEmbed, children, isResolvingUri } = this.props;
|
||||
const { uri, claim, autoEmbed, children, isResolvingUri } = this.props;
|
||||
const isUnresolved = (!isResolvingUri && !claim) || !claim;
|
||||
const isBlacklisted = this.isClaimBlackListed();
|
||||
|
||||
|
@ -71,20 +67,15 @@ class ClaimLink extends React.Component<Props> {
|
|||
return <span>{children}</span>;
|
||||
}
|
||||
|
||||
const { name: claimName, value_type: valueType } = claim;
|
||||
const { value_type: valueType } = claim;
|
||||
const isChannel = valueType === 'channel';
|
||||
const showPreview = autoEmbed === true && !isUnresolved;
|
||||
|
||||
if(isChannel){
|
||||
return <UriIndicator uri={uri} link addTooltip />
|
||||
if (isChannel) {
|
||||
return <UriIndicator uri={uri} link addTooltip />;
|
||||
}
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
<Button label={children} title={title || claimName} button={'link'} navigate={uri} className={className} />
|
||||
{showPreview && <PreviewLink uri={uri} />}
|
||||
</React.Fragment>
|
||||
);
|
||||
return <React.Fragment>{showPreview && <PreviewLink uri={uri} />}</React.Fragment>;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -255,10 +255,10 @@ function Comment(props: Props) {
|
|||
<div className="comment__message">
|
||||
{editedMessage.length >= LENGTH_TO_COLLAPSE ? (
|
||||
<Expandable>
|
||||
<MarkdownPreview content={message} />
|
||||
<MarkdownPreview content={message} promptLinks />
|
||||
</Expandable>
|
||||
) : (
|
||||
<MarkdownPreview content={message} />
|
||||
<MarkdownPreview content={message} promptLinks />
|
||||
)}
|
||||
</div>
|
||||
|
||||
|
|
|
@ -29,20 +29,20 @@ class PreviewLink extends React.PureComponent<Props> {
|
|||
};
|
||||
|
||||
return (
|
||||
<span className={'preview-link'} role="button" onClick={this.handleClick}>
|
||||
<span className={'claim-preview'}>
|
||||
<span style={thumbnailStyle} className={'preview-link__thumbnail media__thumb'} />
|
||||
<span className={'claim-preview-metadata'}>
|
||||
<span className={'claim-preview-info'}>
|
||||
<span className={'claim-preview__title'}>
|
||||
<span className="preview-link" role="button" onClick={this.handleClick}>
|
||||
<span className="claim-preview">
|
||||
<span style={thumbnailStyle} className="preview-link__thumbnail media__thumb" />
|
||||
<span className="claim-preview-metadata">
|
||||
<span className="claim-preview-info">
|
||||
<span className="claim-preview__title">
|
||||
<TruncatedText text={title} lines={1} />
|
||||
</span>
|
||||
</span>
|
||||
<span className={'media__subtitle'}>
|
||||
<span className="media__subtitle">
|
||||
<UriIndicator uri={uri} link />
|
||||
</span>
|
||||
<span className={'claim-preview-properties'}>
|
||||
<span className={'preview-link__description media__subtitle'}>
|
||||
<span className="claim-preview-properties">
|
||||
<span className="preview-link__description media__subtitle">
|
||||
<TruncatedText lines={2} showTooltip={false}>
|
||||
<MarkdownPreview content={description} strip />
|
||||
</TruncatedText>
|
||||
|
|
|
@ -180,13 +180,14 @@
|
|||
|
||||
.preview-link {
|
||||
padding: 0;
|
||||
margin: 1rem 0;
|
||||
margin: var(--spacing-s) 0;
|
||||
padding-right: var(--spacing-s);
|
||||
background-color: var(--color-primary-alt);
|
||||
border-left: 0.5rem solid var(--color-primary);
|
||||
display: block;
|
||||
align-items: center;
|
||||
word-break: break-all;
|
||||
overflow: hidden;
|
||||
border-radius: var(--border-radius);
|
||||
|
||||
.claim-preview {
|
||||
border: 0;
|
||||
|
@ -198,8 +199,14 @@
|
|||
}
|
||||
}
|
||||
|
||||
.claim-preview-metadata {
|
||||
padding: var(--spacing-s) 0;
|
||||
}
|
||||
|
||||
.preview-link__thumbnail {
|
||||
width: 12rem;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
.preview-link__description {
|
||||
|
|
Loading…
Reference in a new issue