diff --git a/ui/component/commentCreate/index.js b/ui/component/commentCreate/index.js index 66bb84f01..2f6d25b47 100644 --- a/ui/component/commentCreate/index.js +++ b/ui/component/commentCreate/index.js @@ -7,7 +7,7 @@ import { doSendTip, } from 'lbry-redux'; import { doOpenModal, doSetActiveChannel } from 'redux/actions/app'; -import { doCommentCreate, doFetchCreatorSettings } from 'redux/actions/comments'; +import { doCommentCreate, doFetchCreatorSettings, doCommentById } from 'redux/actions/comments'; import { selectUserVerifiedEmail } from 'redux/selectors/user'; import { selectActiveChannelClaim } from 'redux/selectors/app'; import { selectSettingsByChannelId } from 'redux/selectors/comments'; @@ -43,6 +43,7 @@ const perform = (dispatch, ownProps) => ({ sendTip: (params, callback, errorCallback) => dispatch(doSendTip(params, false, callback, errorCallback, false)), doToast: (options) => dispatch(doToast(options)), doFetchCreatorSettings: (channelClaimId) => dispatch(doFetchCreatorSettings(channelClaimId)), + fetchComment: (commentId) => dispatch(doCommentById(commentId, false)), }); export default connect(select, perform)(CommentCreate); diff --git a/ui/component/commentCreate/view.jsx b/ui/component/commentCreate/view.jsx index ec203e22c..33360f3d0 100644 --- a/ui/component/commentCreate/view.jsx +++ b/ui/component/commentCreate/view.jsx @@ -51,6 +51,8 @@ type Props = { doFetchCreatorSettings: (channelId: string) => Promise, settingsByChannelId: { [channelId: string]: PerChannelSettings }, setQuickReply: (any) => void, + fetchComment: (commentId: string) => Promise, + shouldFetchComment: boolean, }; export function CommentCreate(props: Props) { @@ -75,6 +77,8 @@ export function CommentCreate(props: Props) { settingsByChannelId, supportDisabled, setQuickReply, + fetchComment, + shouldFetchComment, } = props; const buttonRef: ElementRef = React.useRef(); const { @@ -94,7 +98,8 @@ export function CommentCreate(props: Props) { const charCount = commentValue.length; const [activeTab, setActiveTab] = React.useState(''); const [tipError, setTipError] = React.useState(); - const disabled = isSubmitting || isFetchingChannels || !commentValue.length; + const [deletedComment, setDeletedComment] = React.useState(false); + const disabled = deletedComment || isSubmitting || isFetchingChannels || !commentValue.length; const [shouldDisableReviewButton, setShouldDisableReviewButton] = React.useState(); const channelId = getChannelIdFromClaim(claim); const channelSettings = channelId ? settingsByChannelId[channelId] : undefined; @@ -103,6 +108,15 @@ export function CommentCreate(props: Props) { const minAmount = minTip || minSuper || 0; const minAmountMet = minAmount === 0 || tipAmount >= minAmount; + // Fetch top-level comments to identify if it has been deleted and can reply to it + React.useEffect(() => { + if (shouldFetchComment && fetchComment) { + fetchComment(parentId).then((result) => { + setDeletedComment(String(result).includes('Error')); + }); + } + }, [fetchComment, shouldFetchComment, parentId]); + const minAmountRef = React.useRef(minAmount); minAmountRef.current = minAmount; @@ -568,6 +582,7 @@ export function CommentCreate(props: Props) { )} )} + {deletedComment &&
{__('This comment has been deleted.')}
} {MinAmountNotice} diff --git a/ui/component/notification/view.jsx b/ui/component/notification/view.jsx index e81fdd0ee..2d5746a2d 100644 --- a/ui/component/notification/view.jsx +++ b/ui/component/notification/view.jsx @@ -283,6 +283,7 @@ export default function Notification(props: Props) { onCancelReplying={() => setReplying(false)} setQuickReply={setQuickReply} supportDisabled + shouldFetchComment /> )} diff --git a/ui/redux/actions/comments.js b/ui/redux/actions/comments.js index 78f1397bc..894e751c9 100644 --- a/ui/redux/actions/comments.js +++ b/ui/redux/actions/comments.js @@ -170,6 +170,8 @@ export function doCommentById(commentId: string, toastIfNotFound: boolean = true } else { devToast(dispatch, error.message); } + + return error; }); }; }