35 lines
984 B
TypeScript
35 lines
984 B
TypeScript
import React, { useEffect, useState } from 'react';
|
|
import { View, Text, FlatList, StyleSheet } from 'react-native';
|
|
import { apiService } from '../services/api';
|
|
|
|
export default function PostsScreen({ filter }: { filter: string }) {
|
|
const [posts, setPosts] = useState([]);
|
|
|
|
useEffect(() => {
|
|
apiService.getPosts().then(setPosts);
|
|
}, []);
|
|
|
|
const filtered = posts.filter((p: any) => p.title.toLowerCase().includes(filter.toLowerCase()));
|
|
|
|
return (
|
|
<View style={styles.container}>
|
|
<FlatList
|
|
data={filtered}
|
|
keyExtractor={(item: any) => item.id.toString()}
|
|
renderItem={({ item }: any) => (
|
|
<View style={styles.item}>
|
|
<Text style={styles.title}>{item.title}</Text>
|
|
<Text>{item.body}</Text>
|
|
</View>
|
|
)}
|
|
/>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: { flex: 1, padding: 16 },
|
|
item: { padding: 16, borderBottomWidth: 1 },
|
|
title: { fontWeight: 'bold' },
|
|
});
|