ecency/ecency-mobile
1
1
Fork 0
mirror of https://github.com/ecency/ecency-mobile.git synced 2025-01-02 19:06:39 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fixed comment issues

Browse Source
This commit is contained in:
Mustafa Buyukcelebi 2019-06-09 20:14:33 +03:00
parent 2204a9fde0
commit 326257bc40
8 changed files with 218 additions and 147 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

211
src/components/comment/view/commentView.js
View File

@ -1,5 +1,5 @@
import React, { PureComponent, Fragment } from 'react';
import { View, Text } from 'react-native';
import { View, Text, TouchableWithoutFeedback } from 'react-native';
import ActionSheet from 'react-native-actionsheet';
import { injectIntl } from 'react-intl';
@ -48,6 +48,7 @@ class CommentView extends PureComponent {
fetchPost,
handleDeleteComment,
handleOnEditPress,
handleOnLongPress,
handleOnReplyPress,
handleOnUserPress,
isLoggedIn,
@ -56,115 +57,121 @@ class CommentView extends PureComponent {
marginLeft,
voteCount,
intl,
author,
mainAuthor = { mainAuthor },
} = this.props;
const { isShowSubComments, isPressedShowButton } = this.state;
return (
<View>
<PostHeaderDescription
key={comment.permlink}
date={getTimeFromNow(comment.created)}
name={comment.author}
reputation={comment.author_reputation}
size={avatarSize || 24}
currentAccountUsername={currentAccountUsername}
isShowOwnerIndicator={mainAuthor === comment.author}
/>
<View style={[{ marginLeft: marginLeft || 29 }, styles.bodyWrapper]}>
<PostBody isComment handleOnUserPress={handleOnUserPress} body={comment.body} />
<View style={styles.footerWrapper}>
{isLoggedIn && (
<Fragment>
<Upvote isShowPayoutValue content={comment} />
<IconButton
size={18}
iconStyle={styles.leftIcon}
iconType="MaterialIcons"
name="people"
/>
<Text style={styles.voteCountText}>{voteCount}</Text>
<IconButton
size={18}
iconStyle={styles.leftIcon}
style={styles.leftButton}
name="reply"
onPress={() => handleOnReplyPress && handleOnReplyPress(comment)}
iconType="MaterialIcons"
/>
{currentAccountUsername === comment.author && (
<Fragment>
<IconButton
size={18}
iconStyle={styles.leftIcon}
style={styles.leftButton}
name="create"
onPress={() => handleOnEditPress && handleOnEditPress(comment)}
iconType="MaterialIcons"
/>
{!comment.children && !voteCount && (
<Fragment>
<IconButton
size={18}
iconStyle={styles.leftIcon}
style={styles.leftButton}
name="delete-forever"
onPress={() => this.ActionSheet.show()}
iconType="MaterialIcons"
/>
<ActionSheet
ref={o => (this.ActionSheet = o)}
options={[
intl.formatMessage({ id: 'alert.delete' }),
intl.formatMessage({ id: 'alert.cancel' }),
]}
title={intl.formatMessage({ id: 'alert.delete' })}
destructiveButtonIndex={0}
cancelButtonIndex={1}
onPress={index => {
index === 0 ? handleDeleteComment(comment.permlink) : null;
}}
/>
</Fragment>
)}
</Fragment>
)}
</Fragment>
)}
{isShowMoreButton && (
<View style={styles.rightButtonWrapper}>
<TextWithIcon
wrapperStyle={styles.rightButton}
iconName={isShowSubComments ? 'keyboard-arrow-up' : 'keyboard-arrow-down'}
textStyle={!isPressedShowButton && styles.moreText}
iconType="MaterialIcons"
isClickable
iconStyle={styles.iconStyle}
iconSize={16}
onPress={() => this._showSubCommentsToggle()}
text={!isPressedShowButton ? `${comment.children} more replies` : ''}
/>
</View>
<TouchableWithoutFeedback onLongPress={handleOnLongPress}>
<View>
<PostHeaderDescription
key={comment.permlink}
date={getTimeFromNow(comment.created)}
name={comment.author}
reputation={comment.author_reputation}
size={avatarSize || 24}
currentAccountUsername={currentAccountUsername}
isShowOwnerIndicator={mainAuthor === comment.author}
/>
<View style={[{ marginLeft: marginLeft || 29 }, styles.bodyWrapper]}>
<PostBody
isComment
handleOnUserPress={handleOnUserPress}
body={comment.body}
textSelectable={false}
/>
<View style={styles.footerWrapper}>
{isLoggedIn && (
<Fragment>
<Upvote isShowPayoutValue content={comment} />
<IconButton
size={18}
iconStyle={styles.leftIcon}
iconType="MaterialIcons"
name="people"
/>
<Text style={styles.voteCountText}>{voteCount}</Text>
<IconButton
size={18}
iconStyle={styles.leftIcon}
style={styles.leftButton}
name="reply"
onPress={() => handleOnReplyPress && handleOnReplyPress(comment)}
iconType="MaterialIcons"
/>
{currentAccountUsername === comment.author && (
<Fragment>
<IconButton
size={18}
iconStyle={styles.leftIcon}
style={styles.leftButton}
name="create"
onPress={() => handleOnEditPress && handleOnEditPress(comment)}
iconType="MaterialIcons"
/>
{!comment.children && !voteCount && (
<Fragment>
<IconButton
size={18}
iconStyle={styles.leftIcon}
style={styles.leftButton}
name="delete-forever"
onPress={() => this.ActionSheet.show()}
iconType="MaterialIcons"
/>
<ActionSheet
ref={o => (this.ActionSheet = o)}
options={[
intl.formatMessage({ id: 'alert.delete' }),
intl.formatMessage({ id: 'alert.cancel' }),
]}
title={intl.formatMessage({ id: 'alert.delete' })}
destructiveButtonIndex={0}
cancelButtonIndex={1}
onPress={index => {
index === 0 ? handleDeleteComment(comment.permlink) : null;
}}
/>
</Fragment>
)}
</Fragment>
)}
</Fragment>
)}
{isShowMoreButton && (
<View style={styles.rightButtonWrapper}>
<TextWithIcon
wrapperStyle={styles.rightButton}
iconName={isShowSubComments ? 'keyboard-arrow-up' : 'keyboard-arrow-down'}
textStyle={!isPressedShowButton && styles.moreText}
iconType="MaterialIcons"
isClickable
iconStyle={styles.iconStyle}
iconSize={16}
onPress={() => this._showSubCommentsToggle()}
text={!isPressedShowButton ? `${comment.children} more replies` : ''}
/>
</View>
)}
</View>
{isShowSubComments && commentNumber > 0 && (
<Comments
isShowComments={isShowComments}
commentNumber={commentNumber && commentNumber * 2}
marginLeft={20}
isShowSubComments={isShowSubComments}
avatarSize={avatarSize || 16}
author={comment.author}
permlink={comment.permlink}
commentCount={comment.children}
isShowMoreButton={false}
fetchPost={fetchPost}
mainAuthor={mainAuthor}
/>
)}
</View>
{isShowSubComments && commentNumber > 0 && (
<Comments
isShowComments={isShowComments}
commentNumber={commentNumber && commentNumber * 2}
marginLeft={20}
isShowSubComments={isShowSubComments}
avatarSize={avatarSize || 16}
author={comment.author}
permlink={comment.permlink}
commentCount={comment.children}
isShowMoreButton={false}
fetchPost={fetchPost}
mainAuthor={mainAuthor}
/>
)}
</View>
</View>
</TouchableWithoutFeedback>
);
}
}

32
src/components/comments/container/commentsContainer.js
View File

@ -1,18 +1,22 @@
import React, { Component } from 'react';
import { withNavigation } from 'react-navigation';
import { connect } from 'react-redux';
import { injectIntl } from 'react-intl';
import get from 'lodash/get';
import { getComments, deleteComment } from '../../../providers/steem/dsteem';
// Services and Actions
import { writeToClipboard } from '../../../utils/clipboard';
import { toastNotification } from '../../../redux/actions/uiAction';
// Middleware
// Constants
import { default as ROUTES } from '../../../constants/routeNames';
import ROUTES from '../../../constants/routeNames';
// Component
import { CommentsView } from '..';
import CommentsView from '../view/commentsView';
/*
* Props Name Description Value
@ -163,6 +167,27 @@ class CommentsContainer extends Component {
});
};
_handleCommentCopyAction = (index, selectedComment) => {
const { dispatch, intl } = this.props;
switch (index) {
case 0:
writeToClipboard(`https://steemit.com${get(selectedComment, 'url')}`).then(() => {
dispatch(
toastNotification(
intl.formatMessage({
id: 'alert.copied',
}),
),
);
});
break;
default:
break;
}
};
render() {
const { comments: _comments, selectedPermlink } = this.state;
const {
@ -196,6 +221,7 @@ class CommentsContainer extends Component {
isLoggedIn={isLoggedIn}
fetchPost={fetchPost}
handleDeleteComment={this._handleDeleteComment}
handleCommentCopyAction={this._handleCommentCopyAction}
{...this.props}
/>
);
@ -208,4 +234,4 @@ const mapStateToProps = state => ({
pinCode: state.account.pin,
});
export default withNavigation(connect(mapStateToProps)(CommentsContainer));
export default withNavigation(connect(mapStateToProps)(injectIntl(CommentsContainer)));

88
src/components/comments/view/commentsView.js
View File

@ -1,7 +1,11 @@
import React, { PureComponent } from 'react';
import React, { PureComponent, Fragment } from 'react';
import { FlatList } from 'react-native';
import ActionSheet from 'react-native-actionsheet';
import get from 'lodash/get';
import { injectIntl } from 'react-intl';
// Components
// eslint-disable-next-line import/no-cycle
import { Comment } from '../../comment';
// Styles
@ -15,7 +19,10 @@ class CommentsView extends PureComponent {
constructor(props) {
super(props);
this.state = {};
this.state = {
selectedComment: null,
};
this.commentMenu = React.createRef();
}
// Component Life Cycles
@ -24,6 +31,11 @@ class CommentsView extends PureComponent {
_keyExtractor = item => item.permlink;
_openCommentMenu = item => {
this.setState({ selectedComment: item });
this.commentMenu.current.show();
};
render() {
const {
mainAuthor,
@ -40,36 +52,56 @@ class CommentsView extends PureComponent {
isShowSubComments,
marginLeft,
handleDeleteComment,
handleCommentCopyAction,
intl,
} = this.props;
const { selectedComment } = this.state;
return (
<FlatList
data={comments}
keyExtractor={this._keyExtractor}
renderItem={({ item }) => (
<Comment
mainAuthor={mainAuthor}
avatarSize={avatarSize}
comment={item}
commentCount={commentCount || item.children}
commentNumber={commentNumber}
handleDeleteComment={handleDeleteComment}
currentAccountUsername={currentAccountUsername}
fetchPost={fetchPost}
handleOnEditPress={handleOnEditPress}
handleOnReplyPress={handleOnReplyPress}
handleOnUserPress={handleOnUserPress}
isLoggedIn={isLoggedIn}
isShowMoreButton={commentNumber === 1 && item.children > 0}
voteCount={item.net_votes}
isShowSubComments={isShowSubComments}
key={item.permlink}
marginLeft={marginLeft}
/>
)}
/>
<Fragment>
<FlatList
data={comments}
keyExtractor={this._keyExtractor}
renderItem={({ item }) => (
<Comment
mainAuthor={mainAuthor}
avatarSize={avatarSize}
comment={item}
commentCount={commentCount || item.children}
commentNumber={commentNumber}
handleDeleteComment={handleDeleteComment}
currentAccountUsername={currentAccountUsername}
fetchPost={fetchPost}
handleOnEditPress={handleOnEditPress}
handleOnReplyPress={handleOnReplyPress}
handleOnUserPress={handleOnUserPress}
isLoggedIn={isLoggedIn}
isShowMoreButton={commentNumber === 1 && item.children > 0}
voteCount={item.net_votes}
isShowSubComments={isShowSubComments}
key={item.permlink}
marginLeft={marginLeft}
handleOnLongPress={() => this._openCommentMenu(item)}
/>
)}
/>
<ActionSheet
ref={this.commentMenu}
options={[
intl.formatMessage({
id: 'post.copy_link',
}),
intl.formatMessage({
id: 'alert.cancel',
}),
]}
title={get(selectedComment, 'summary')}
cancelButtonIndex={1}
onPress={index => handleCommentCopyAction(index, selectedComment)}
/>
</Fragment>
);
}
}
export default CommentsView;
export default injectIntl(CommentsView);

4
src/components/postCard/view/postCardView.js
View File

@ -120,10 +120,10 @@ class PostCardView extends Component {
<Text style={styles.comment}>{content.vote_count}</Text>
</TouchableOpacity>
</View>
<TouchableOpacity style={styles.commentButton}>
<View style={styles.commentButton}>
<Icon style={[styles.commentIcon]} iconType="MaterialIcons" name="comment" />
<Text style={styles.comment}>{content.children}</Text>
</TouchableOpacity>
</View>
</View>
</View>
);

22
src/components/postElements/body/view/postBodyView.js
View File

@ -1,7 +1,5 @@
import React, { PureComponent, Fragment } from 'react';
import {
Dimensions, Linking, Alert, TouchableOpacity, Text,
} from 'react-native';
import { Dimensions, Linking, Alert, TouchableOpacity, Text } from 'react-native';
import { withNavigation } from 'react-navigation';
import { injectIntl } from 'react-intl';
import FastImage from 'react-native-fast-image';
@ -48,7 +46,7 @@ class PostBody extends PureComponent {
if (!url) return;
const { intl } = this.props;
Linking.canOpenURL(url).then((supported) => {
Linking.canOpenURL(url).then(supported => {
if (supported) {
Linking.openURL(url);
} else {
@ -148,7 +146,7 @@ class PostBody extends PureComponent {
};
render() {
const { body, isComment } = this.props;
const { body, isComment, textSelectable = true } = this.props;
const _initialDimensions = isComment
? { width: WIDTH - 50, height: 80 }
: { width: WIDTH, height: 216 };
@ -166,13 +164,21 @@ class PostBody extends PureComponent {
a: (htmlAttribs, children, convertedCSSStyles, passProps) => {
if (passProps.parentWrapper === 'Text') {
return (
<Text key={passProps.key} {...htmlAttribs} onPress={() => this._handleOnLinkPress(htmlAttribs['data-href'], htmlAttribs)}>
<Text
key={passProps.key}
{...htmlAttribs}
onPress={() => this._handleOnLinkPress(htmlAttribs['data-href'], htmlAttribs)}
>
{children}
</Text>
);
}
return (
<TouchableOpacity key={passProps.key} {...htmlAttribs} onPress={() => this._handleOnLinkPress(htmlAttribs['data-href'], htmlAttribs)}>
<TouchableOpacity
key={passProps.key}
{...htmlAttribs}
onPress={() => this._handleOnLinkPress(htmlAttribs['data-href'], htmlAttribs)}
>
{children}
</TouchableOpacity>
);
@ -185,7 +191,7 @@ class PostBody extends PureComponent {
html={body}
onLinkPress={(evt, href, hrefatr) => this._handleOnLinkPress(evt, href, hrefatr)}
containerStyle={isComment ? styles.commentContainer : styles.container}
textSelectable
textSelectable={textSelectable}
tagsStyles={isComment ? { img: { height: 120 } } : styles}
ignoredTags={['script']}
debug={false}

4
src/components/postView/view/postDisplayView.js
View File

@ -185,8 +185,8 @@ class PostDisplayView extends PureComponent {
<View style={styles.footer}>
<Tags tags={post.json_metadata && post.json_metadata.tags} />
<Text style={styles.footerText}>
Posted by <Text style={styles.footerName}>{author || post.author}</Text>
{' '}
Posted by
<Text style={styles.footerName}>{author || post.author}</Text>
{formatedTime}
</Text>
{/* {isPostEnd && this._getTabBar()} */}

3
src/config/locales/en-US.json
View File

@ -199,7 +199,8 @@
},
"post": {
"reblog_alert": "Are you sure you want to reblog?",
"removed_hint": "The post was removed by"
"removed_hint": "The post was removed by",
"copy_link": "Copy Link"
},
"drafts": {
"title": "Drafts",

1
src/screens/transfer/screen/transferScreen.js
View File

@ -1,4 +1,3 @@
/* eslint-disable no-restricted-globals */
import React, { Fragment, Component } from 'react';
import { Text, View, WebView, ScrollView, TouchableOpacity } from 'react-native';
import ActionSheet from 'react-native-actionsheet';