diff --git a/src/components/comment/view/commentStyles.js b/src/components/comment/view/commentStyles.js index 69eb8c28e..b40bc21b5 100644 --- a/src/components/comment/view/commentStyles.js +++ b/src/components/comment/view/commentStyles.js @@ -19,6 +19,11 @@ export default EStyleSheet.create({ borderRadius: 20, minWidth: 40, }, + moreButton: { + backgroundColor: '$iconColor', + height: 18, + borderRadius: 20, + }, moreText: { color: '$white', fontSize: 10, diff --git a/src/components/comment/view/commentView.js b/src/components/comment/view/commentView.tsx similarity index 76% rename from src/components/comment/view/commentView.js rename to src/components/comment/view/commentView.tsx index a716f8dab..e2fc652b5 100644 --- a/src/components/comment/view/commentView.js +++ b/src/components/comment/view/commentView.tsx @@ -36,12 +36,12 @@ const CommentView = ({ isLoggedIn, isShowComments, isShowMoreButton, - marginLeft, mainAuthor = { mainAuthor }, isHideImage, showAllComments, isShowSubComments, hideManyCommentsButton, + openReplyThread, }) => { const [_isShowSubComments, setIsShowSubComments] = useState(isShowSubComments || false); const [isPressedShowButton, setIsPressedShowButton] = useState(false); @@ -61,6 +61,46 @@ const CommentView = ({ setIsPressedShowButton(true); }; + + const _renderReadMoreButton = () => ( + openReplyThread && openReplyThread()} + text={ + !isPressedShowButton + ? intl.formatMessage({ id: 'comments.read_more' }) + : '' + } + /> + + ) + + const _renderReplies = () => { + return ( + 0} + fetchPost={fetchPost} + hideManyCommentsButton={hideManyCommentsButton} + mainAuthor={mainAuthor} + /> + ) + } + return ( @@ -159,7 +199,8 @@ const CommentView = ({ )} )} - {!showAllComments && isShowMoreButton && ( + + {isShowMoreButton && ( )} + + {/* { comment.children > 0 && !comment.replies?.length && ( + + openReplyThread && openReplyThread()} + text={ + !isPressedShowButton + ? intl.formatMessage({ id: 'post.open_thread' }) + : '' + } + /> + + ) + } */} - {_isShowSubComments && commentNumber > 0 && ( - 0} - fetchPost={fetchPost} - hideManyCommentsButton={hideManyCommentsButton} - mainAuthor={mainAuthor} - /> - )} + { comment.children > 0 && !comment.replies?.length && _renderReadMoreButton() } + + {_isShowSubComments && commentNumber > 0 && _renderReplies()} diff --git a/src/components/comments/container/commentsContainer.js b/src/components/comments/container/commentsContainer.js index 9b85e3f32..b79d8de53 100644 --- a/src/components/comments/container/commentsContainer.js +++ b/src/components/comments/container/commentsContainer.js @@ -139,7 +139,7 @@ const CommentsContainer = ({ const _getComments = async () => { if (isOwnProfile) { fetchPost(); - } else if (author && permlink) { + } else if (author && permlink && !comments) { await getComments(author, permlink, name) .then((__comments) => { if (selectedFilter) { @@ -200,6 +200,17 @@ const CommentsContainer = ({ }); }; + const _openReplyThread = (comment) => { + navigation.navigate({ + routeName: ROUTES.SCREENS.POST, + key: comment.permlink, + params: { + author: comment.author, + permlink: comment.permlink, + }, + }); + }; + const _handleOnPressCommentMenu = (index, selectedComment) => { if (index === 0) { writeToClipboard(`https://ecency.com${get(selectedComment, 'url')}`).then(() => { @@ -212,14 +223,7 @@ const CommentsContainer = ({ ); }); } else if (index === 1) { - navigation.navigate({ - routeName: ROUTES.SCREENS.POST, - key: get(selectedComment, 'permlink'), - params: { - author: get(selectedComment, 'author'), - permlink: get(selectedComment, 'permlink'), - }, - }); + _openReplyThread(selectedComment); } }; @@ -249,6 +253,7 @@ const CommentsContainer = ({ isShowSubComments={isShowSubComments} showAllComments={showAllComments} flatListProps={flatListProps} + openReplyThread={_openReplyThread} /> ); }; diff --git a/src/components/comments/view/commentsView.tsx b/src/components/comments/view/commentsView.tsx index 16e35efa1..f4b045075 100644 --- a/src/components/comments/view/commentsView.tsx +++ b/src/components/comments/view/commentsView.tsx @@ -41,6 +41,7 @@ const CommentsView = ({ onScroll, onEndReached, flatListProps, + openReplyThread, }) => { const [selectedComment, setSelectedComment] = useState(null); const intl = useIntl(); @@ -56,15 +57,17 @@ const CommentsView = ({ setSelectedComment(item); }; + const _openReplyThread = (item) => { + if(item && openReplyThread){ + openReplyThread(item) + } + + } + const _readMoreComments = () => { - navigate({ - routeName: ROUTES.SCREENS.POST, - key: comments[0].permlink, - params: { - author: comments[0].author, - permlink: comments[0].permlink, - }, - }); + if(comments[0] && openReplyThread){ + openReplyThread(comments[0]) + } }; const _onMenuItemPress = (index) => { @@ -78,6 +81,7 @@ const CommentsView = ({ intl.formatMessage({ id: 'alert.cancel' }), ]; + if (!hideManyCommentsButton && hasManyComments) { return ( ( - 0} - showAllComments={showAllComments} - isShowSubComments={isShowSubComments} - key={get(item, 'permlink')} - marginLeft={marginLeft} - handleOnLongPress={() => _openCommentMenu(item)} - /> - ); + const _renderItem = ({ item }) => { + return ( + 0)} + showAllComments={showAllComments} + isShowSubComments={isShowSubComments} + key={get(item, 'permlink')} + marginLeft={marginLeft} + handleOnLongPress={() => _openCommentMenu(item)} + openReplyThread={()=> _openReplyThread(item)} + /> + ) + }; diff --git a/src/components/postElements/body/view/postBodyView.js b/src/components/postElements/body/view/postBodyView.js index c6d0fd37b..4603a6e4c 100644 --- a/src/components/postElements/body/view/postBodyView.js +++ b/src/components/postElements/body/view/postBodyView.js @@ -506,7 +506,10 @@ const PostBody = ({ { } }; -export const getComments = async (author, permlink, currentUserName = null) => { +export const getComments = async (author, permlink) => { try { const commentsMap = await client.call('bridge', 'get_discussion', { author, permlink });