redirect to channel creation page when reacting to comment with no channel
This commit is contained in:
parent
dd582f4009
commit
71b948f2fc
2 changed files with 33 additions and 5 deletions
|
@ -1,6 +1,7 @@
|
|||
import { connect } from 'react-redux';
|
||||
import Comment from './view';
|
||||
import { makeSelectClaimIsMine, makeSelectClaimForUri } from 'lbry-redux';
|
||||
import { doToast } from 'redux/actions/notifications';
|
||||
import {
|
||||
makeSelectMyReactionsForComment,
|
||||
makeSelectOthersReactionsForComment,
|
||||
|
@ -18,6 +19,7 @@ const select = (state, props) => ({
|
|||
|
||||
const perform = dispatch => ({
|
||||
react: (commentId, type) => dispatch(doCommentReact(commentId, type)),
|
||||
doToast: params => dispatch(doToast(params)),
|
||||
});
|
||||
|
||||
export default connect(select, perform)(Comment);
|
||||
|
|
|
@ -1,11 +1,13 @@
|
|||
// @flow
|
||||
import { ENABLE_CREATOR_REACTIONS } from 'config';
|
||||
import * as ICONS from 'constants/icons';
|
||||
import * as PAGES from 'constants/pages';
|
||||
import * as REACTION_TYPES from 'constants/reactions';
|
||||
import React from 'react';
|
||||
import classnames from 'classnames';
|
||||
import Button from 'component/button';
|
||||
import ChannelThumbnail from 'component/channelThumbnail';
|
||||
import { useHistory } from 'react-router';
|
||||
|
||||
type Props = {
|
||||
myReacts: Array<string>,
|
||||
|
@ -16,10 +18,15 @@ type Props = {
|
|||
claimIsMine: boolean,
|
||||
activeChannel: string,
|
||||
claim: ?ChannelClaim,
|
||||
doToast: ({ message: string }) => void,
|
||||
};
|
||||
|
||||
export default function CommentReactions(props: Props) {
|
||||
const { myReacts, othersReacts, commentId, react, claimIsMine, claim, activeChannel } = props;
|
||||
const { myReacts, othersReacts, commentId, react, claimIsMine, claim, activeChannel, doToast } = props;
|
||||
const {
|
||||
push,
|
||||
location: { pathname },
|
||||
} = useHistory();
|
||||
const canCreatorReact =
|
||||
claim &&
|
||||
claimIsMine &&
|
||||
|
@ -44,6 +51,27 @@ export default function CommentReactions(props: Props) {
|
|||
|
||||
const creatorLiked = getCountForReact(REACTION_TYPES.CREATOR_LIKE) > 0;
|
||||
|
||||
function handleCommentLike() {
|
||||
if (activeChannel) {
|
||||
react(commentId, REACTION_TYPES.LIKE);
|
||||
} else {
|
||||
promptForChannel();
|
||||
}
|
||||
}
|
||||
|
||||
function handleCommentDislike() {
|
||||
if (activeChannel) {
|
||||
react(commentId, REACTION_TYPES.DISLIKE);
|
||||
} else {
|
||||
promptForChannel();
|
||||
}
|
||||
}
|
||||
|
||||
function promptForChannel() {
|
||||
push(`/$/${PAGES.CHANNEL_NEW}?redirect=${pathname}&lc=${commentId}`);
|
||||
doToast({ message: __('A channel is required to throw fire and slime') });
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<Button
|
||||
|
@ -53,8 +81,7 @@ export default function CommentReactions(props: Props) {
|
|||
className={classnames('comment__action', {
|
||||
'comment__action--active': myReacts && myReacts.includes(REACTION_TYPES.LIKE),
|
||||
})}
|
||||
disabled={!activeChannel}
|
||||
onClick={() => react(commentId, REACTION_TYPES.LIKE)}
|
||||
onClick={handleCommentLike}
|
||||
label={<span className="comment__reaction-count">{getCountForReact(REACTION_TYPES.LIKE)}</span>}
|
||||
/>
|
||||
<Button
|
||||
|
@ -64,8 +91,7 @@ export default function CommentReactions(props: Props) {
|
|||
className={classnames('comment__action', {
|
||||
'comment__action--active': myReacts && myReacts.includes(REACTION_TYPES.DISLIKE),
|
||||
})}
|
||||
disabled={!activeChannel}
|
||||
onClick={() => react(commentId, REACTION_TYPES.DISLIKE)}
|
||||
onClick={handleCommentDislike}
|
||||
label={<span className="comment__reaction-count">{getCountForReact(REACTION_TYPES.DISLIKE)}</span>}
|
||||
/>
|
||||
|
||||
|
|
Loading…
Add table
Reference in a new issue