Files
EMI-ExpoAPP/Views/Notifications.js
T
2022-03-12 21:39:57 -08:00

62 lines
1.8 KiB
JavaScript

import { StatusBar } from 'expo-status-bar';
import React, { useState, useEffect } from 'react';
import { View, Text, StyleSheet, SafeAreaView, FlatList } from 'react-native';
import { Card } from 'react-native-paper';
import API from './../API.js';
import Post from './../components/Post.js';
let LoadPost = ({ postid, viewer }) => {
let [post, setPost] = useState({});
useEffect(async () => {
setPost(await API.getPost(postid));
}, [postid]);
return (post._id ? <Post post={post} viewer={viewer} /> : null);
};
let Notifications = ({ navigation, route }) => {
let [Me, setMeProfile] = useState({});
let [notifications, setNotifications] = useState([]);
useEffect(async () => {
let r = await API.getMe();
setMeProfile(r);
setNotifications(r.notifications)
}, [route.params]);
const renderNotification = (({ item }) => {
//return (<LoadPost postid={item.postid} viewer={Me} />);
const gotToPost = ()=>{
navigation.navigate('SinglePost', {postid: item.postid, viewer: Me});
};
return (
<Card style={{margin: 3}} onPress={gotToPost}>
<Card.Content>
<Text>{item.body}</Text>
</Card.Content>
</Card>
)
});
return (
<SafeAreaView style={styles.container}>
<View>
<FlatList
data={notifications.reverse().slice(0, 10)}
renderItem={renderNotification}
keyExtractor={item => item.ts}
/>
</View>
<StatusBar style="auto" />
</SafeAreaView>
);
}
export default Notifications;
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#edf2f7",
},
});