Refresh Look on posts

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

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,

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);

View File

@@ -3,6 +3,8 @@ import { I18n } from 'i18n-js';
import moment from 'moment'
import 'moment/min/locales'
I18n.enableFallback = true;
const messages = {
en: {
message: {
@@ -78,75 +80,219 @@ const messages = {
},
es: {
message: {
feed: 'Mural',
events: "Eventos",
livestream: "En Vivo",
search: 'Busqueda',
invite: "Invitaciones",
feed: 'Inicio',
events: 'Eventos',
livestream: 'Transmisión en vivo',
search: 'Buscar',
invite: 'Invitar',
groups: 'Grupos',
courses: 'Cursos',
giving: "Ofrendas",
profile: "Perfil",
settings: 'Configuraciones',
logout: "Cerrar Sesión",
about: 'Acerca',
statusUpdate: "Publicación Nueva",
newsPost: "Noticias?",
post: "Publica",
add: 'Añade',
whatIsNew: "Que hay de nuevo?",
saySomethingTo: "Publica algo para ",
follow: "Seguir",
unfollow: "Dejar",
subscribe: "Subscribirse",
unsubscribe: 'Abandonar',
pending: "Pendiente",
subscribers: "Subscriptores",
loading: "Cargando",
login: 'Inicia Sesión',
email: "Correo Electronico",
cancel: "Cancelar",
password: "Contraseña",
rpassword: "Confirma tu Contraseña",
resetPassword: "Recuperar Contraseña",
register: "Registrate",
giving: 'Donaciones',
profile: 'Perfil',
settings: 'Configuración',
logout: 'Cerrar sesión',
about: 'Acerca de',
statusUpdate: 'Nueva publicación',
newsPost: 'Publicación de noticias',
post: 'Publicar',
add: 'Agregar',
whatIsNew: '¿Qué hay de nuevo?',
saySomethingTo: 'Di algo a ',
follow: 'Seguir',
unfollow: 'Dejar de seguir',
subscribe: 'Suscribirse',
unsubscribe: 'Cancelar suscripción',
pending: 'Pendiente',
subscribers: 'Suscriptores',
loading: 'Cargando',
login: 'Iniciar sesión',
email: 'Correo electrónico',
cancel: 'Cancelar',
password: 'Contraseña',
rpassword: 'Repetir contraseña',
resetPassword: 'Restablecer contraseña',
register: 'Registrarse',
name: 'Nombre',
lastName: "Apeido",
describeYourself: 'Describete en unas cuantas palabras',
continueWatching: "Continua viendo",
createCourse: "Crea tu propio curso!",
createGroup: "Crea un grupo nuevo!",
title: "Titulo",
subtitle: "Subtitulo",
recentlyAdded: "Recientemente añadido",
popularCourses: "Cursos populares",
privateGroup: "Grupo privado",
tithesAndOfferings: "Diezmos y Ofrendas",
type: "Tipo",
description: "Descripción",
amount: "Cantidad",
tithes: "Diezmos",
offerings: "Ofrendas",
event: "Evento",
proceedToPayment: "Continuar con el pago",
minimumAmount: "La cantidad mínima es de ",
notifications: "Notificaciones",
searchUsers: "Busca Usuarios",
searchCourses: "Busca Cursos",
news: "Noticias",
wrongInformation: "Por favor revisa la información introducida.",
submit: "Ingresar",
IKnowThisPerson: "Conozco a esta persona",
update: "Actualizar",
invalidEmail: "El correo electronico es invalido!",
reviewPassword: "Revisa la constraseña introducida.",
updatePhoto: "Nueva foto",
optional: "Opcional",
birthday: "Cumpleaños",
localMinistry: "Ministerio Local",
ocupation: "Ocupación",
country: 'Pais',
},
lastName: 'Apellido',
describeYourself: 'Describirse',
continueWatching: 'Continuar viendo',
createCourse: Crea tu propio curso nuevo!',
createGroup: Crea tu propio grupo nuevo!',
title: 'Título',
subtitle: 'Subtítulo',
recentlyAdded: 'Agregado recientemente',
popularCourses: 'Cursos populares',
privateGroup: 'Grupo privado',
tithesAndOfferings: 'Diezmos y Ofrendas',
type: 'Tipo',
description: 'Descripción',
amount: 'Monto',
tithes: 'Diezmos',
offerings: 'Ofrendas',
event: 'Evento',
proceedToPayment: 'Continuar al pago',
minimumAmount: 'El monto mínimo es ',
notifications: 'Notificaciones',
searchUsers: 'Buscar usuarios',
searchCourses: 'Buscar cursos',
news: 'Noticias',
wrongInformation: 'Por favor, revisa la información.',
submit: 'Enviar',
IKnowThisPerson: 'Conozco a esta persona',
update: 'Actualizar',
invalidEmail: '¡La dirección de correo electrónico no es válida!',
reviewPassword: 'Por favor, revisa tu contraseña.',
updatePhoto: 'Actualizar foto',
optional: 'Opcional',
birthday: 'Cumpleaños',
localMinistry: 'Ministerio local',
ocupation: 'Ocupación',
country: 'País',
}
},
fr: {
message: {
feed: 'Fil d\'actualité',
events: 'Événements',
livestream: 'Diffusion en direct',
search: 'Rechercher',
invite: 'Inviter',
groups: 'Groupes',
courses: 'Cours',
giving: 'Don',
profile: 'Profil',
settings: 'Paramètres',
logout: 'Se déconnecter',
about: 'À propos',
statusUpdate: 'Nouvelle publication',
newsPost: 'Publication de nouvelles',
post: 'Publier',
add: 'Ajouter',
whatIsNew: 'Quoi de neuf ?',
saySomethingTo: 'Dire quelque chose à ',
follow: 'Suivre',
unfollow: 'Ne plus suivre',
subscribe: 'S\'abonner',
unsubscribe: 'Se désabonner',
pending: 'En attente',
subscribers: 'Abonnés',
loading: 'Chargement',
login: 'Connexion',
email: 'Email',
cancel: 'Annuler',
password: 'Mot de passe',
rpassword: 'Répéter le mot de passe',
resetPassword: 'Réinitialiser le mot de passe',
register: 'S\'inscrire',
name: 'Nom',
lastName: 'Nom de famille',
describeYourself: 'Décrivez-vous',
continueWatching: 'Continuer à regarder',
createCourse: 'Créer votre propre nouveau cours !',
createGroup: 'Créer votre propre nouveau groupe !',
title: 'Titre',
subtitle: 'Sous-titre',
recentlyAdded: 'Récemment ajouté',
popularCourses: 'Cours populaires',
privateGroup: 'Groupe privé',
tithesAndOfferings: 'Dîmes et offrandes',
type: 'Type',
description: 'Description',
amount: 'Montant',
tithes: 'Dîmes',
offerings: 'Offrandes',
event: 'Événement',
proceedToPayment: 'Procéder au paiement',
minimumAmount: 'Le montant minimum est de ',
notifications: 'Notifications',
searchUsers: 'Rechercher des utilisateurs',
searchCourses: 'Rechercher des cours',
news: 'Actualités',
wrongInformation: 'Veuillez vérifier les informations.',
submit: 'Soumettre',
IKnowThisPerson: 'Je connais cette personne',
update: 'Mettre à jour',
invalidEmail: 'L\'adresse email est invalide !',
reviewPassword: 'Veuillez vérifier votre mot de passe.',
updatePhoto: 'Mettre à jour la photo',
optional: 'Facultatif',
birthday: 'Date de naissance',
localMinistry: 'Ministère local',
ocupation: 'Occupation',
country: 'Pays',
}
},
da: {
message: {
feed: 'Feed',
events: "Begivenheder",
livestream: "Live stream",
search: 'Søg',
invite: 'Inviter',
groups: 'Grupper',
courses: "Kurser",
giving: "Donation",
profile: "Profil",
settings: 'Indstillinger',
logout: "Log ud",
about: 'Om',
statusUpdate: "Ny opdatering",
newsPost: "Nyhedsopslag",
post: "Indlæg",
add: 'Tilføj',
whatIsNew: "Hvad er nyt?",
saySomethingTo: "Sig noget til ",
follow: "Følg",
unfollow: "Følg ikke",
subscribe: "Abonnér",
unsubscribe: 'Afmeld',
pending: "Afventer",
subscribers: "Abonnenter",
loading: "Indlæser",
login: 'Log ind',
email: "E-mail",
cancel: "Annuller",
password: "Adgangskode",
rpassword: "Gentag adgangskode",
resetPassword: "Nulstil adgangskode",
register: "Registrer",
name: "Navn",
lastName: "Efternavn",
describeYourself: 'Beskriv dig selv',
continueWatching: "Fortsæt med at se",
createCourse: "Opret din egen nye kursus!",
createGroup: "Opret din egen nye gruppe!",
title: "Titel",
subtitle: "Undertitel",
recentlyAdded: "Nyligt tilføjet",
popularCourses: "Populære kurser",
privateGroup: "Privat gruppe",
tithesAndOfferings: "Tiende og offer",
type: "Type",
description: "Beskrivelse",
amount: "Beløb",
tithes: "Tiende",
offerings: "Offergaver",
event: "Begivenhed",
proceedToPayment: "Fortsæt til betaling",
minimumAmount: "Det mindste beløb er ",
notifications: "Notifikationer",
searchUsers: "Søg efter brugere",
searchCourses: "Søg efter kurser",
news: "Nyheder",
wrongInformation: "Gennemse venligst oplysningerne.",
submit: "Indsend",
IKnowThisPerson: "Jeg kender denne person",
update: "Opdater",
invalidEmail: "E-mailadressen er ugyldig!",
reviewPassword: "Gennemse venligst din adgangskode.",
updatePhoto: "Opdater foto",
optional: "Valgfrit",
birthday: "Fødselsdag",
localMinistry: "Lokalt ministerium",
ocupation: "Beskæftigelse",
country: 'Land',
}
}
}