// @flow import * as ICONS from 'constants/icons'; import React from 'react'; import Comment from 'component/comment'; import Button from 'component/button'; type Props = { comments: Array, uri: string, claimIsMine: boolean, myChannels: ?Array, linkedComment?: Comment, commentingEnabled: boolean, threadDepth: number, }; function CommentsReplies(props: Props) { const { uri, comments, claimIsMine, myChannels, linkedComment, commentingEnabled, threadDepth } = props; const [isExpanded, setExpanded] = React.useState(true); const [start, setStart] = React.useState(0); const [end, setEnd] = React.useState(9); const sortedComments = comments ? [...comments].reverse() : []; const numberOfComments = comments ? comments.length : 0; const linkedCommentId = linkedComment ? linkedComment.comment_id : ''; const commentsIndexOfLInked = comments && sortedComments.findIndex((e) => e.comment_id === linkedCommentId); function showMore() { if (start > 0) { setStart(0); } else { setEnd(numberOfComments); } } // todo: implement comment_list --mine in SDK so redux can grab with selectCommentIsMine function isMyComment(channelId: string) { if (myChannels != null && channelId != null) { for (let i = 0; i < myChannels.length; i++) { if (myChannels[i].claim_id === channelId) { return true; } } } return false; } function handleCommentDone() { if (!isExpanded) { setExpanded(true); setStart(numberOfComments || 0); } setEnd(numberOfComments + 1); } React.useEffect(() => { if ( setStart && setEnd && setExpanded && linkedCommentId && Number.isInteger(commentsIndexOfLInked) && commentsIndexOfLInked > -1 ) { setStart(commentsIndexOfLInked); setEnd(commentsIndexOfLInked + 1); setExpanded(true); } }, [setStart, setEnd, setExpanded, linkedCommentId, commentsIndexOfLInked]); const displayedComments = sortedComments.slice(start, end); return ( Boolean(numberOfComments) && (
{Boolean(numberOfComments) && !isExpanded && (
)} {comments && displayedComments && isExpanded && (
)} {isExpanded && comments && (end < numberOfComments || start > 0) && (
)}
) ); } export default CommentsReplies;