adolforeyna/EMI-ExpoAPP
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refresh Look on posts

Browse Source
This commit is contained in:
Adolfo Reyna
2023-07-16 22:13:30 -04:00
parent ad39608e2a
commit 940bd14d6e
3 changed files with 305 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
components/Post.js
View File

@@ -11,6 +11,7 @@ import Moment from 'moment';
import { useSnapshot } from 'valtio';
import GlobalState from '../contexts/GlobalState.js';
import i18n from "../i18nMessages.js";
import ProfilePhotoCircle from './ProfilePhotoCircle.js';
let Post = (props) => {
@@ -21,7 +22,7 @@ let Post = (props) => {
let [likes, changeLikes] = useState(Object.keys(post.reactions).length);
let [bookmarked, changeBookmarked] = useState(post.bookmarks && post.bookmarks.includes(viewer._id));
let toProfileText = post.toProfile && post.toProfile !== post.profileid ?
<Text> {">"} <UserName profileid={post.toProfile} /></Text> : undefined;
<ProfilePhotoCircle profileid={post.toProfile} small={true} /> : undefined;
let cleanContent = post.content.replace(/@[A-z]+:.+\w/g, '');
//cleanContent = convertLinks(cleanContent);
const newComentAdded = (commentData) => {
@@ -60,18 +61,20 @@ let Post = (props) => {
return (
<Card style={styles.card}>
<Card.Content>
<Hyperlink linkDefault={ true } linkStyle={ { color: '#2980b9'} }>
<Hyperlink linkDefault={true} linkStyle={{ color: '#2980b9' }}>
{!post.nonOrganicType ?
<View>
<Text style={styles.userName}>
<UserName profileid={post.profileid}/>
<ProfilePhotoCircle profileid={post.profileid} />
<View style={{ flexDirection: 'row', alignItems: 'center', margin:0, marginLeft: 35, top: -5 }}>
{toProfileText}
<Text style={{ fontWeight: 'normal', fontSize: 12 }}>
{" " + Moment(post.createdAt).fromNow()}
</Text>
</Text>
<Text style={{ fontSize: 16, paddingBottom:5 }}>{cleanContent}</Text>
<Media content={post.content} postId={post._id} post={post} />
</View>
<Text style={{ fontSize: 15, padding: 0 }}>{cleanContent}</Text>
<View style={{paddingTop: 5}}>
<Media content={post.content} postId={post._id} post={post} />
</View>
</View> :
<View>
<Chip icon="new-releases" style={{ width: 100 }} >{i18n.t("message.news")}</Chip>
@@ -81,27 +84,36 @@ let Post = (props) => {
}
</Hyperlink>
</Card.Content>
<Card.Actions style={{ flexDirection: "row", flow: 4, justifyContent: 'space-evenly', fontSize: 18 }}>
<Card.Actions style={{ flexDirection: "row", flow: 4, fontSize: 16 }}>
<Button
icon={post.reactions[viewer._id] ? "favorite" : "favorite-border"}
labelStyle={{ fontSize: 18 }}
labelStyle={{ fontSize: 16 }}
style={{ flow: 1 }}
onPress={newPostReaction}
color="#555"
>
{likes}
</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 }} onPress={()=>{
Share.share({
//message: "https://social.emmint.com/post/" + props.post._id,
url: "https://social.emmint.com/feed/post/" + props.post._id
});
}}></Button>
<Button icon="forum" labelStyle={{ fontSize: 16 }} style={{ flow: 1 }}
onPress={() => { changeshowCommentsB(!showCommentsB) }}
color="#555"
>
{post.comments.length}
</Button>
<Button icon="ios-share" style={{ flow: 1 }} labelStyle={{ fontSize: 16 }}
color="#555"
onPress={() => {
Share.share({
//message: "https://social.emmint.com/post/" + props.post._id,
url: "https://social.emmint.com/feed/post/" + props.post._id
});
}}></Button>
<Button
icon={!bookmarked ? "bookmark-outline" : "bookmark"}
style={{ flow: 1 }}
labelStyle={{ fontSize: 18 }}
labelStyle={{ fontSize: 16 }}
onPress={newPostBookmark}
color="#555"
>
</Button>
</Card.Actions>
@@ -129,9 +141,10 @@ const styles = StyleSheet.create({
fontSize: 17,
},
card: {
margin: 8,
backgroundColor: "#FFFFFF",
borderRadius: 5,
margin: 0,
backgroundColor: "#FFFAFA",
borderRadius: 0,
marginBottom: 2
},
comment: {
margin: 8,

60
components/ProfilePhotoCircle.js Normal file
View File

@@ -0,0 +1,60 @@
import React, { useState, useEffect } from 'react';
import { Avatar } from 'react-native-paper';
import { View, StyleSheet, Text } from 'react-native';
import API from './../API.js';
const DefaultPhoto = "https://social.emmint.com/uploads/e6f9be6d665dc43417701bf16a90122c.png";
const ProfileHeader = ({ profileid, withName = false, small = false }) => {
let [profile, setProfile] = useState({});
useEffect(() => {
let subscribed = true;
let getData = async () => {
let p = await API.getUserProfile(profileid).catch(() => { return {} });
if (subscribed)
setProfile(p);
}
getData();
return () => {
subscribed = false;
};
}, [profileid]);
let photoUrl = profile.profile && profile.profile.photo ? 'https://social.emmint.com/' + profile.profile.photo : DefaultPhoto;
const fullName = " " + profile.profile?.firstName + " " + profile.profile?.lastName;
console.log(photoUrl);
return (
<View style={styles.container}>
<View style={styles.avatarContainer}>
<Avatar.Image size={small ? 20 : 30} source={{ uri: photoUrl }} />
</View>
<View style={styles.textContainer}>
<Text style={small ? styles.smallProfileName : styles.profileName}>{fullName}</Text>
</View>
</View>
);
}
const styles = StyleSheet.create({
container: {
flexDirection: 'row',
alignItems: 'center',
},
avatarContainer: {
marginRight: 5,
},
textContainer: {
alignItems: 'center',
},
profileName: {
fontSize: 16,
fontWeight: 'bold',
},
smallProfileName: {
fontSize: 14,
fontWeight: 'bold',
},
});
export default React.memo(ProfileHeader);