diff --git a/.env.defaults b/.env.defaults index 0c56b8598..4896e87d9 100644 --- a/.env.defaults +++ b/.env.defaults @@ -30,6 +30,7 @@ YRBL_SAD_IMG_URL=https://cdn.lbryplayer.xyz/api/v3/streams/free/yrbl-sad/c2d9649 ENABLE_COMMENT_REACTIONS=true ENABLE_FILE_REACTIONS=false ENABLE_CREATOR_REACTIONS=false +CHANNEL_STAKED_LEVEL_VIDEO_COMMENTS=4 # OG OG_TITLE_SUFFIX=| lbry.tv diff --git a/config.js b/config.js index ab36896fa..77041bdc8 100644 --- a/config.js +++ b/config.js @@ -35,6 +35,7 @@ const config = { ENABLE_COMMENT_REACTIONS: process.env.ENABLE_COMMENT_REACTIONS === 'true', ENABLE_FILE_REACTIONS: process.env.ENABLE_FILE_REACTIONS === 'true', ENABLE_CREATOR_REACTIONS: process.env.ENABLE_CREATOR_REACTIONS === 'true', + CHANNEL_STAKED_LEVEL_VIDEO_COMMENTS: process.env.CHANNEL_STAKED_LEVEL_VIDEO_COMMENTS, SIMPLE_SITE: process.env.SIMPLE_SITE === 'true', SHOW_ADS: process.env.SHOW_ADS === 'true', PINNED_URI_1: process.env.PINNED_URI_1, diff --git a/ui/component/comment/index.js b/ui/component/comment/index.js index 40766512e..315d5188f 100644 --- a/ui/component/comment/index.js +++ b/ui/component/comment/index.js @@ -1,5 +1,5 @@ import { connect } from 'react-redux'; -import { makeSelectThumbnailForUri, selectMyChannelClaims } from 'lbry-redux'; +import { makeSelectStakedLevelForChannelUri, makeSelectThumbnailForUri, selectMyChannelClaims } from 'lbry-redux'; import { doCommentUpdate } from 'redux/actions/comments'; import { makeSelectChannelIsMuted } from 'redux/selectors/blocked'; import { doToast } from 'redux/actions/notifications'; @@ -18,6 +18,7 @@ const select = (state, props) => ({ activeChannelClaim: selectActiveChannelClaim(state), myChannels: selectMyChannelClaims(state), playingUri: selectPlayingUri(state), + stakedLevel: makeSelectStakedLevelForChannelUri(props.authorUri)(state), }); const perform = (dispatch) => ({ diff --git a/ui/component/comment/view.jsx b/ui/component/comment/view.jsx index a01f44890..814016b58 100644 --- a/ui/component/comment/view.jsx +++ b/ui/component/comment/view.jsx @@ -49,6 +49,7 @@ type Props = { commentIdentityChannel: any, activeChannelClaim: ?ChannelClaim, playingUri: ?PlayingUri, + stakedLevel: number, }; const LENGTH_TO_COLLAPSE = 300; @@ -75,6 +76,7 @@ function Comment(props: Props) { isPinned, othersReacts, playingUri, + stakedLevel, } = props; const { push, @@ -254,10 +256,20 @@ function Comment(props: Props) { ) : editedMessage.length >= LENGTH_TO_COLLAPSE ? ( - + ) : ( - + )} diff --git a/ui/component/common/markdown-preview.jsx b/ui/component/common/markdown-preview.jsx index 1242624d5..192b5ec3a 100644 --- a/ui/component/common/markdown-preview.jsx +++ b/ui/component/common/markdown-preview.jsx @@ -13,6 +13,7 @@ import defaultSchema from 'hast-util-sanitize/lib/github.json'; import { formatedLinks, inlineLinks } from 'util/remark-lbry'; import { formattedTimestamp, inlineTimestamp } from 'util/remark-timestamp'; import ZoomableImage from 'component/zoomableImage'; +import { CHANNEL_STAKED_LEVEL_VIDEO_COMMENTS } from 'config'; type SimpleTextProps = { children?: React.Node, @@ -32,6 +33,7 @@ type MarkdownProps = { className?: string, parentCommentId?: string, isMarkdownPost?: boolean, + stakedLevel?: number, }; // **************************************************************************** @@ -93,7 +95,7 @@ const REPLACE_REGEX = /(<\/iframe>)/g; // **************************************************************************** const MarkdownPreview = (props: MarkdownProps) => { - const { content, strip, simpleLinks, noDataStore, className, parentCommentId, isMarkdownPost } = props; + const { content, strip, simpleLinks, noDataStore, className, parentCommentId, isMarkdownPost, stakedLevel } = props; const strippedContent = content ? content.replace(REPLACE_REGEX, (iframeHtml, y, iframeSrc) => { // Let the browser try to create an iframe to see if the markup is valid @@ -119,12 +121,13 @@ const MarkdownPreview = (props: MarkdownProps) => { remarkReactComponents: { a: noDataStore ? SimpleLink - : linkProps => ( + : (linkProps) => ( = CHANNEL_STAKED_LEVEL_VIDEO_COMMENTS} /> ), // Workaraund of remarkOptions.Fragment diff --git a/ui/component/fileRender/index.js b/ui/component/fileRender/index.js index b09fd76d7..9e2af8b43 100644 --- a/ui/component/fileRender/index.js +++ b/ui/component/fileRender/index.js @@ -6,6 +6,8 @@ import { makeSelectDownloadPathForUri, makeSelectStreamingUrlForUri, SETTINGS, + makeSelectStakedLevelForChannelUri, + makeSelectChannelForClaimUri, } from 'lbry-redux'; import { makeSelectClientSetting } from 'redux/selectors/settings'; import { makeSelectFileRenderModeForUri, makeSelectFileExtensionForUri } from 'redux/selectors/content'; @@ -13,9 +15,11 @@ import FileRender from './view'; const select = (state, props) => { const autoplay = props.embedded ? false : makeSelectClientSetting(SETTINGS.AUTOPLAY)(state); + const channelUri = makeSelectChannelForClaimUri(props.uri)(state); return { currentTheme: makeSelectClientSetting(SETTINGS.THEME)(state), claim: makeSelectClaimForUri(props.uri)(state), + stakedLevel: makeSelectStakedLevelForChannelUri(channelUri)(state), thumbnail: makeSelectThumbnailForUri(props.uri)(state), contentType: makeSelectContentTypeForUri(props.uri)(state), downloadPath: makeSelectDownloadPathForUri(props.uri)(state), diff --git a/ui/component/fileRender/view.jsx b/ui/component/fileRender/view.jsx index e3b666d31..f155eb9a7 100644 --- a/ui/component/fileRender/view.jsx +++ b/ui/component/fileRender/view.jsx @@ -35,6 +35,7 @@ type Props = { thumbnail: string, desktopPlayStartTime?: number, className?: string, + stakedLevel?: number, }; class FileRender extends React.PureComponent { @@ -78,6 +79,7 @@ class FileRender extends React.PureComponent { uri, renderMode, desktopPlayStartTime, + stakedLevel, } = this.props; const source = streamingUrl; @@ -110,6 +112,7 @@ class FileRender extends React.PureComponent { }} renderMode={renderMode} theme={currentTheme} + stakedLevel={stakedLevel} /> ); case RENDER_MODES.DOCX: diff --git a/ui/component/markdownLink/view.jsx b/ui/component/markdownLink/view.jsx index 2f0ab6986..83e730171 100644 --- a/ui/component/markdownLink/view.jsx +++ b/ui/component/markdownLink/view.jsx @@ -1,5 +1,5 @@ // @flow -import { KNOWN_APP_DOMAINS } from 'config'; +import { KNOWN_APP_DOMAINS, SIMPLE_SITE } from 'config'; import * as ICONS from 'constants/icons'; import * as React from 'react'; import { isURIValid } from 'lbry-redux'; @@ -10,6 +10,7 @@ type Props = { href: string, title?: string, embed?: boolean, + allowPreview?: boolean, children: React.Node, parentCommentId?: string, isMarkdownPost?: boolean, @@ -17,7 +18,16 @@ type Props = { }; function MarkdownLink(props: Props) { - const { children, href, title, embed = false, parentCommentId, isMarkdownPost, simpleLinks = false } = props; + const { + children, + href, + title, + embed = false, + allowPreview = false, + parentCommentId, + isMarkdownPost, + simpleLinks = false, + } = props; let decodedUri; try { @@ -33,6 +43,7 @@ function MarkdownLink(props: Props) { // Regex for url protocol const protocolRegex = new RegExp('^(https?|lbry|mailto)+:', 'i'); const protocol = href ? protocolRegex.exec(href) : null; + const isLbryLink = href.startsWith('lbry://'); let linkUrlObject; try { @@ -62,6 +73,10 @@ function MarkdownLink(props: Props) { } } + // Return timestamp link if it starts with '?t=' (only possible from remark-timestamp). + // Return plain text if no valid url. + // Return external link if protocol is http or https. + // Return local link if protocol is lbry uri. if (href.startsWith('?t=')) { // Video timestamp markers element = ( @@ -80,10 +95,7 @@ function MarkdownLink(props: Props) { /> ); } else if (!simpleLinks && ((protocol && protocol[0] === 'lbry:' && isURIValid(decodedUri)) || lbryUrlFromLink)) { - // Return plain text if no valid url - // Return external link if protocol is http or https - // Return local link if protocol is lbry uri - element = ( + element = allowPreview ? ( {children} + ) : ( +