frostbyte-native/src/components/PostsContainer.tsx
2023-12-14 22:16:09 +01:00

66 lines
1.6 KiB
TypeScript

import React from "react";
import { View, Text } from "react-native";
import { getPost, getPosts, Post } from "../util/api";
import { PostView } from "./PostView";
import { style } from "../util/style";
import { SafeAreaView } from "react-native";
import { VirtualizedList } from "react-native";
type ItemData = {
id: string;
title: string;
};
type ItemProps = {
title: string;
};
const Item = ({title}: ItemProps): JSX.Element => (
<View style={style.postView}>
<Text style={style.postFont}>{title}</Text>
</View>
);
export function PostsContainer(): JSX.Element {
// const [posts, setPosts] = React.useState<Post[]>([]);
// React.useEffect(() => {
// refreshPosts();
// }, []);
const getItemCount = (_data: unknown): number => 50;
// function refreshPosts(): void {
// async function fetchPosts(): Promise<void> {
// const posts = await getPosts();
// setPosts(posts);
// }
// fetchPosts();
// }
// function getItemCount(): number {
// return posts.length;
// }
const getItem = (_data: unknown, index: number): ItemData => ({
id: Math.random().toString(12).substring(0),
title: `Item ${index + 1}`,
});
// const getItem = async (data: any, index: number): Promise<Post> => {
// const p = await getPost(index);
// return p;
// };
return (
<SafeAreaView style={style.postsContainer}>
<VirtualizedList
initialNumToRender={4}
renderItem={({ item }) => <Item title={item.title} />}
keyExtractor={(item: ItemData) => item.id}
getItemCount={getItemCount}
getItem={getItem}
/>
</SafeAreaView>
);
}