37 lines
No EOL
893 B
TypeScript
37 lines
No EOL
893 B
TypeScript
import React from "react";
|
|
import { View, Text } from "react-native";
|
|
import { getPosts, Post } from "../util/api";
|
|
import { PostView } from "./PostView";
|
|
import { StyleSheet } from "react-native";
|
|
|
|
export function PostsContainer(): JSX.Element {
|
|
const [posts, setPosts] = React.useState<Post[]>([]);
|
|
|
|
React.useEffect(() => {
|
|
async function fetchPosts(): Promise<void> {
|
|
const posts = await getPosts();
|
|
setPosts(posts);
|
|
}
|
|
fetchPosts();
|
|
}, []);
|
|
|
|
return (
|
|
<View style={style.container}>
|
|
<Text>Hello World!</Text>
|
|
{posts.map((post) => (
|
|
<PostView key={post.id} post={post} />
|
|
))}
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const style = StyleSheet.create({
|
|
container: {
|
|
height: '100%',
|
|
padding: 5,
|
|
flex: 1,
|
|
alignItems: 'center',
|
|
justifyContent: 'flex-start',
|
|
backgroundColor: '#fff', // For the container holding the posts
|
|
},
|
|
}); |