New Comment

This commit is contained in:
Adolfo Reyna
2022-03-07 18:15:40 -08:00
parent 98201c8948
commit 983ac258b3
4 changed files with 98 additions and 22 deletions

View File

@@ -5,13 +5,22 @@ import API from './../API.js';
import UserName from './UserName.js';
import Media from './Media.js';
import Comment from "./Comment";
import NewComment from './NewComment.js';
let Post = ({ post, viewer }) => {
let Post = (props) => {
const viewer = props.viewer;
let [showCommentsB, changeshowCommentsB] = useState(false);
let [post, changePost] = useState(props.post);
let toProfileText = post.toProfile && post.toProfile !== post.profileid ?
<Text> {">"} <UserName profileid={post.toProfile} /></Text> : undefined;
let cleanContent = post.content.replace(/@[A-z]+:.+\w/g, '');
const newComentAdded = (commentData) => {
//add to comments
props.post.comments.push(commentData);
changePost(props.post);
console.log(commentData);
};
return (
<Card style={styles.card}>
<Card.Content>
@@ -19,21 +28,24 @@ let Post = ({ post, viewer }) => {
<UserName profileid={post.profileid} />
{toProfileText}
</Text>
<Text>{cleanContent}</Text>
<Text style={{fontSize: 18}}>{cleanContent}</Text>
<Media content={post.content} />
</Card.Content>
<Card.Actions style={{ flexDirection: "row", flow: 4, justifyContent: 'space-evenly' }}>
<Button icon={post.reactions[viewer._id] ? "favorite" : "favorite-border"} style={{ flow: 1 }} >{Object.keys(post.reactions).length}</Button>
<Button icon="forum" style={{ flow: 1 }} onPress={()=>{changeshowCommentsB(!showCommentsB)}} >{post.comments.length}</Button>
<Button icon="ios-share" style={{ flow: 1 }} ></Button>
<Button icon={!post.bookmarks || !post.bookmarks.includes(viewer._id) ? "bookmark-outline" : "bookmark"} style={{ flow: 1 }} ></Button>
<Card.Actions style={{ flexDirection: "row", flow: 4, justifyContent: 'space-evenly', fontSize: 18}}>
<Button icon={post.reactions[viewer._id] ? "favorite" : "favorite-border"} labelStyle={{fontSize: 18}} style={{ flow: 1 }} >{Object.keys(post.reactions).length}</Button>
<Button icon="forum" labelStyle={{fontSize: 18}} style={{ flow: 1 }} onPress={()=>{changeshowCommentsB(!showCommentsB)}} >{post.comments.length}</Button>
<Button icon="ios-share" style={{ flow: 1 }} labelStyle={{fontSize: 18}}></Button>
<Button icon={!post.bookmarks || !post.bookmarks.includes(viewer._id) ? "bookmark-outline" : "bookmark"} style={{ flow: 1 }} labelStyle={{fontSize: 18}}></Button>
</Card.Actions>
{showCommentsB && <NewComment postid={post._id} newComentAdded={newComentAdded} />}
{
showCommentsB &&
post.comments.map((comment, i) => {
return <Comment key={i} comment={comment} />
})
(
post.comments.map((comment, i) => {
return <Comment key={i} comment={comment} />
})
)
}
</Card>
);
@@ -46,6 +58,7 @@ const styles = StyleSheet.create({
fontSize: 14,
fontWeight: 'bold',
marginBottom: 5,
fontSize: 18,
},
card: {
margin: 8,