7bb5df97fd
show visible card and add remove card button show your transactions even if you dont have a card fix presentational issues show your transactions even if you dont have a card fix presentational issues add link to channel section update yarn show donation location add remove card modal still needs completion and also changed how stripe is used on settings stripe card page add confirm remove card modal to router move bank account stuff to settings page move account functionality to settings page continuing to move account transactions to settings list transactions for creator updating copy touchup tip error do a better job autofocusing bugfix show an error on the card page if api returns 500 building out frontend for comment tip display dollar sign if its a fiat tip more frontend work more frontend work more frontend bug fixes working with hardcoded payment intent id working but with one bug bugfixed add toast if payment fails add add card button cant get claim id but otherwise done more frontend work call is working show fiat for livestream comments add is fiat on comments round and show values properly dont allow review if tiperror copy displaying properly disable buttons conditionally properly remove card button working remove card working with a workaround by refreshing page bugfix send toast when tip on comment jeremy frontend changes only show cart on lbc
89 lines
2.9 KiB
JavaScript
89 lines
2.9 KiB
JavaScript
// @flow
|
|
import * as ICONS from 'constants/icons';
|
|
import React from 'react';
|
|
import { parseURI } from 'lbry-redux';
|
|
import MarkdownPreview from 'component/common/markdown-preview';
|
|
import ChannelThumbnail from 'component/channelThumbnail';
|
|
import { Menu, MenuButton } from '@reach/menu-button';
|
|
import Icon from 'component/common/icon';
|
|
import classnames from 'classnames';
|
|
import CommentMenuList from 'component/commentMenuList';
|
|
import Button from 'component/button';
|
|
import CreditAmount from 'component/common/credit-amount';
|
|
|
|
type Props = {
|
|
uri: string,
|
|
claim: StreamClaim,
|
|
authorUri: string,
|
|
commentId: string,
|
|
message: string,
|
|
commentIsMine: boolean,
|
|
stakedLevel: number,
|
|
supportAmount: number,
|
|
isFiat: boolean,
|
|
};
|
|
|
|
function LivestreamComment(props: Props) {
|
|
const { claim, uri, authorUri, message, commentIsMine, commentId, stakedLevel, supportAmount, isFiat } = props;
|
|
const [mouseIsHovering, setMouseHover] = React.useState(false);
|
|
const commentByOwnerOfContent = claim && claim.signing_channel && claim.signing_channel.permanent_url === authorUri;
|
|
const { claimName } = parseURI(authorUri);
|
|
|
|
return (
|
|
<li
|
|
className={classnames('livestream-comment', {
|
|
'livestream-comment--superchat': supportAmount > 0,
|
|
})}
|
|
onMouseOver={() => setMouseHover(true)}
|
|
onMouseOut={() => setMouseHover(false)}
|
|
>
|
|
{supportAmount > 0 && (
|
|
<div className="super-chat livestream-superchat__banner">
|
|
<div className="livestream-superchat__banner-corner" />
|
|
<CreditAmount isFiat={isFiat} amount={supportAmount} superChat className="livestream-superchat__amount" />
|
|
</div>
|
|
)}
|
|
|
|
<div className="livestream-comment__body">
|
|
{supportAmount > 0 && <ChannelThumbnail uri={authorUri} xsmall />}
|
|
<div className="livestream-comment__info">
|
|
<Button
|
|
className={classnames('button--uri-indicator comment__author', {
|
|
'comment__author--creator': commentByOwnerOfContent,
|
|
})}
|
|
target="_blank"
|
|
navigate={authorUri}
|
|
>
|
|
{claimName}
|
|
</Button>
|
|
|
|
<div className="livestream-comment__text">
|
|
<MarkdownPreview content={message} promptLinks stakedLevel={stakedLevel} />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="livestream-comment__menu">
|
|
<Menu>
|
|
<MenuButton className="menu__button">
|
|
<Icon
|
|
size={18}
|
|
className={mouseIsHovering ? 'comment__menu-icon--hovering' : 'comment__menu-icon'}
|
|
icon={ICONS.MORE_VERTICAL}
|
|
/>
|
|
</MenuButton>
|
|
<CommentMenuList
|
|
uri={uri}
|
|
commentId={commentId}
|
|
authorUri={authorUri}
|
|
commentIsMine={commentIsMine}
|
|
disableEdit
|
|
disableRemove={supportAmount > 0}
|
|
/>
|
|
</Menu>
|
|
</div>
|
|
</li>
|
|
);
|
|
}
|
|
|
|
export default LivestreamComment;
|