From b60cd7615a624398c6b9d3d4e6c8a9dd45b7feac Mon Sep 17 00:00:00 2001 From: feruz Date: Wed, 22 Jan 2020 06:11:48 +0200 Subject: [PATCH] hide low rep comments, intl --- src/components/comment/view/commentView.js | 7 +- src/components/comments/view/commentsView.js | 2 +- .../postElements/body/view/commentBodyView.js | 47 ++++++++---- .../postElements/body/view/config.js | 3 +- .../postElements/body/view/postBodyStyles.js | 73 +++---------------- src/config/locales/en-US.json | 5 +- 6 files changed, 54 insertions(+), 83 deletions(-) diff --git a/src/components/comment/view/commentView.js b/src/components/comment/view/commentView.js index 663ee41d1..f8259bfbb 100644 --- a/src/components/comment/view/commentView.js +++ b/src/components/comment/view/commentView.js @@ -65,6 +65,7 @@ const CommentView = ({ _showSubCommentsToggle()} - text={!isPressedShowButton ? `${comment.children} more replies` : ''} + text={ + !isPressedShowButton + ? `${comment.children} ${intl.formatMessage({ id: 'comments.more_replies' })}` + : '' + } /> )} diff --git a/src/components/comments/view/commentsView.js b/src/components/comments/view/commentsView.js index 6bccf670f..baff65310 100644 --- a/src/components/comments/view/commentsView.js +++ b/src/components/comments/view/commentsView.js @@ -72,7 +72,7 @@ const CommentsView = ({ style={styles.moreRepliesButtonWrapper} textStyle={styles.moreRepliesText} onPress={() => _readMoreComments()} - text="Read more comments" + text={intl.formatMessage({ id: 'comments.read_more' })} /> ); } diff --git a/src/components/postElements/body/view/commentBodyView.js b/src/components/postElements/body/view/commentBodyView.js index 5eabba38a..130302d90 100644 --- a/src/components/postElements/body/view/commentBodyView.js +++ b/src/components/postElements/body/view/commentBodyView.js @@ -16,7 +16,10 @@ import { default as ROUTES } from '../../../../constants/routeNames'; import { CommentPlaceHolder } from '../../../basicUIElements'; import { customCommentScript } from './config'; +import { TextButton } from '../../..'; + // Styles +import styles from './postBodyStyles'; const WIDTH = Dimensions.get('window').width; @@ -27,11 +30,16 @@ const CommentBody = ({ handleOnPostPress, created, commentDepth, + reputation, }) => { const [isImageModalOpen, setIsImageModalOpen] = useState(false); const [postImages, setPostImages] = useState([]); + const [revealComment, setRevealComment] = useState(reputation > 0); const intl = useIntl(); + const _showLowComment = () => { + setRevealComment(true); + }; //new renderer functions const __handleOnLinkPress = event => { if ((!event && !get(event, 'nativeEvent.data'), false)) { @@ -347,21 +355,30 @@ const CommentBody = ({ }} /> - } - startInLoadingState={true} - onShouldStartLoadWithRequest={false} - scrollEnabled={false} - scalesPageToFit={false} - zoomable={false} - /> + {revealComment ? ( + } + startInLoadingState={true} + onShouldStartLoadWithRequest={false} + scrollEnabled={false} + scalesPageToFit={false} + zoomable={false} + /> + ) : ( + _showLowComment()} + text={intl.formatMessage({ id: 'comments.reveal_comment' })} + /> + )} ); }; diff --git a/src/components/postElements/body/view/config.js b/src/components/postElements/body/view/config.js index 1cf95fcc8..4c2940e94 100644 --- a/src/components/postElements/body/view/config.js +++ b/src/components/postElements/body/view/config.js @@ -137,6 +137,7 @@ for (var i = 0; i < images.length; i++) { } } document.addEventListener('touchstart', function(event) { + event.preventDefault(); var el = event.target; while (el.tagName !== 'A') { if (!el.parentNode) { @@ -228,7 +229,7 @@ document.addEventListener('touchstart', function(event) { return false; } } -}, { passive: false }); +}); true; `; diff --git a/src/components/postElements/body/view/postBodyStyles.js b/src/components/postElements/body/view/postBodyStyles.js index cc9827023..1673bc4f7 100644 --- a/src/components/postElements/body/view/postBodyStyles.js +++ b/src/components/postElements/body/view/postBodyStyles.js @@ -1,72 +1,17 @@ import EStyleSheet from 'react-native-extended-stylesheet'; export default EStyleSheet.create({ - text: { - fontSize: 16, - color: '$primaryBlack', - fontFamily: '$primaryFont', - }, - container: { - paddingHorizontal: 0, - marginTop: 10, - }, - a: { - color: '$primaryBlue', - fontFamily: '$primaryFont', - }, - h4: { - fontSize: 15, - marginHorizontal: 10, - marginVertical: 5, - }, - h1: { - fontSize: 30, - }, - h2: { - fontSize: 25, - }, - h3: { - fontSize: 20, - }, - commentContainer: { - paddingHorizontal: 0, - right: 30, - marginTop: 10, - }, - th: { - flex: 1, + revealButton: { + backgroundColor: '$iconColor', + height: 22, justifyContent: 'center', - fontWeight: 'bold', - color: '$primaryBlack', - fontSize: 14, - padding: 5, - }, - tr: { - backgroundColor: '$darkIconColor', - flexDirection: 'row', - }, - td: { - borderWidth: 0.5, - borderColor: '$tableBorderColor', - flex: 1, - padding: 10, - backgroundColor: '$tableTrColor', - }, - blockquote: { - borderLeftWidth: 5, - borderColor: '$darkIconColor', - paddingLeft: 5, - }, - code: { - backgroundColor: '$darkIconColor', - fontFamily: '$editorFont', - }, - center: { - textAlign: 'center', alignItems: 'center', - justifyContent: 'center', + borderRadius: 20, + minWidth: 40, + maxWidth: 170, }, - img: { - alignSelf: 'center', + revealText: { + color: '$white', + fontSize: 14, }, }); diff --git a/src/config/locales/en-US.json b/src/config/locales/en-US.json index 6e8b195c0..aef7ce8a4 100644 --- a/src/config/locales/en-US.json +++ b/src/config/locales/en-US.json @@ -464,6 +464,9 @@ } }, "comments": { - "title": "Comments" + "title": "Comments", + "reveal_comment": "Reveal comment", + "read_more": "Read more comments", + "more_replies": "more replies" } }