75 lines
2.3 KiB
JavaScript
75 lines
2.3 KiB
JavaScript
import { StatusBar } from 'expo-status-bar';
|
|
import React, { useState, useEffect } from 'react';
|
|
import { View, ActivityIndicator, StyleSheet, SafeAreaView, FlatList } from 'react-native';
|
|
import API from './../API.js';
|
|
import Post from './../components/Post.js';
|
|
import { Provider as PaperProvider, DefaultTheme, } from 'react-native-paper';
|
|
import MaterialIcons from 'react-native-vector-icons/MaterialIcons';
|
|
import NewPost from "./../components/NewPost.js";
|
|
|
|
const theme = {
|
|
...DefaultTheme,
|
|
roundness: 2,
|
|
colors: {
|
|
...DefaultTheme.colors,
|
|
primary: '#000000',
|
|
accent: '#0d6efd',
|
|
background: "#edf2f7",
|
|
},
|
|
};
|
|
|
|
|
|
let Feed = ({ navigation, route }) => {
|
|
let [Me, setMeProfile] = useState({});
|
|
let [Posts, setPosts] = useState([]);
|
|
useEffect(async () => {
|
|
setPosts([]);
|
|
let r = await API.getMe();
|
|
setMeProfile(r);
|
|
if (route.params && route.params.profileid) {
|
|
navigation.navigate('Profile', {profileid: route.params.profileid})
|
|
} else {
|
|
let posts = await API.getPosts();
|
|
setPosts(posts);
|
|
navigation.setOptions({ title: "Feed" });
|
|
}
|
|
//console.log(posts)
|
|
}, [route.params]);
|
|
const renderPost = (({ item }) => {
|
|
return (<Post post={item} viewer={Me} />);
|
|
});
|
|
|
|
|
|
return (
|
|
<PaperProvider settings={{
|
|
icon: props => <MaterialIcons {...props} />,
|
|
}} theme={theme}>
|
|
<SafeAreaView style={styles.container}>
|
|
<View>
|
|
<FlatList
|
|
data={Posts}
|
|
renderItem={renderPost}
|
|
keyExtractor={item => item._id || item.createdAt}
|
|
ListHeaderComponent={<NewPost newPostCB={(newPost) => setPosts([newPost, ...Posts])} />}
|
|
refreshing={Posts.length === 0}
|
|
onRefresh={()=>{
|
|
API.getPosts().then(setPosts);
|
|
}}
|
|
/>
|
|
</View>
|
|
<StatusBar style="auto" />
|
|
</SafeAreaView>
|
|
</PaperProvider>
|
|
);
|
|
}
|
|
|
|
export default Feed;
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
alignItems: 'center',
|
|
backgroundColor: "#edf2f7",
|
|
},
|
|
});
|