LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

Highlight comments made by content owner

Browse source
This commit is contained in:
saltrafael 2021-04-02 16:14:53 -03:00 committed by Sean Yesmunt
parent 3c3fc90b6a
commit 3e1f6cdf4d
3 changed files with 28 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
ui/component/comment/index.js
View file

@ -1,5 +1,5 @@
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { makeSelectStakedLevelForChannelUri, makeSelectThumbnailForUri, selectMyChannelClaims } from 'lbry-redux'; import { makeSelectStakedLevelForChannelUri, makeSelectClaimForUri, makeSelectThumbnailForUri, selectMyChannelClaims } from 'lbry-redux';
import { doCommentUpdate } from 'redux/actions/comments'; import { doCommentUpdate } from 'redux/actions/comments';
import { makeSelectChannelIsMuted } from 'redux/selectors/blocked'; import { makeSelectChannelIsMuted } from 'redux/selectors/blocked';
import { doToast } from 'redux/actions/notifications'; import { doToast } from 'redux/actions/notifications';
@ -11,6 +11,7 @@ import { selectPlayingUri } from 'redux/selectors/content';
import Comment from './view'; import Comment from './view';
const select = (state, props) => ({ const select = (state, props) => ({
claim: makeSelectClaimForUri(props.uri)(state),
thumbnail: props.authorUri && makeSelectThumbnailForUri(props.authorUri)(state), thumbnail: props.authorUri && makeSelectThumbnailForUri(props.authorUri)(state),
channelIsBlocked: props.authorUri && makeSelectChannelIsMuted(props.authorUri)(state), channelIsBlocked: props.authorUri && makeSelectChannelIsMuted(props.authorUri)(state),
commentingEnabled: IS_WEB ? Boolean(selectUserVerifiedEmail(state)) : true, commentingEnabled: IS_WEB ? Boolean(selectUserVerifiedEmail(state)) : true,

12
ui/component/comment/view.jsx
View file

@ -25,6 +25,7 @@ import UriIndicator from 'component/uriIndicator';
type Props = { type Props = {
clearPlayingUri: () => void, clearPlayingUri: () => void,
uri: string, uri: string,
claim: StreamClaim,
author: ?string, // LBRY Channel Name, e.g. @channel author: ?string, // LBRY Channel Name, e.g. @channel
authorUri: string, // full LBRY Channel URI: lbry://@channel#123... authorUri: string, // full LBRY Channel URI: lbry://@channel#123...
commentId: string, // sha256 digest identifying the comment commentId: string, // sha256 digest identifying the comment
@ -59,6 +60,7 @@ const ESCAPE_KEY = 27;
function Comment(props: Props) { function Comment(props: Props) {
const { const {
clearPlayingUri, clearPlayingUri,
claim,
uri, uri,
author, author,
authorUri, authorUri,
@ -98,6 +100,7 @@ function Comment(props: Props) {
const dislikesCount = (othersReacts && othersReacts.dislike) || 0; const dislikesCount = (othersReacts && othersReacts.dislike) || 0;
const totalLikesAndDislikes = likesCount + dislikesCount; const totalLikesAndDislikes = likesCount + dislikesCount;
const slimedToDeath = totalLikesAndDislikes >= 5 && dislikesCount / totalLikesAndDislikes > 0.8; const slimedToDeath = totalLikesAndDislikes >= 5 && dislikesCount / totalLikesAndDislikes > 0.8;
const commentByOwnerOfContent = claim && claim.signing_channel && claim.signing_channel.permanent_url === authorUri;
let channelOwnerOfContent; let channelOwnerOfContent;
try { try {
@ -197,7 +200,14 @@ function Comment(props: Props) {
{!author ? ( {!author ? (
<span className="comment__author">{__('Anonymous')}</span> <span className="comment__author">{__('Anonymous')}</span>
) : ( ) : (
<UriIndicator className="comment__author" link external={livestream} uri={authorUri} /> <UriIndicator
className={classnames('comment__author', {
'comment__author--creator': commentByOwnerOfContent,
})}
link
external={livestream}
uri={authorUri}
/>
)} )}
{!livestream && ( {!livestream && (
<Button <Button

15
ui/scss/component/_comments.scss
View file

@ -192,6 +192,13 @@ $thumbnailWidthSmall: 1rem;
} }
} }
.comment__creator {
.icon {
padding-top: 1px;
stroke: var(--color-primary);
}
}
.comment__message { .comment__message {
word-break: break-word; word-break: break-word;
max-width: 35rem; max-width: 35rem;
@ -215,6 +222,14 @@ $thumbnailWidthSmall: 1rem;
height: 100%; height: 100%;
} }
.comment__author--creator {
@extend .comment__meta-information;
padding-left: var(--spacing-xxs);
padding-right: var(--spacing-xxs);
background-color: var(--color-primary-alt);
border-radius: var(--border-radius);
}
.comment__time { .comment__time {
@extend .button--uri-indicator; @extend .button--uri-indicator;
opacity: 0.5; opacity: 0.5;