109 lines
2.5 KiB
TypeScript
109 lines
2.5 KiB
TypeScript
import React from 'react';
|
|
import { View, FlatList, StyleSheet, TouchableOpacity, Text } from 'react-native';
|
|
import { useNavigation } from '@react-navigation/native';
|
|
import { NativeStackNavigationProp } from '@react-navigation/native-stack';
|
|
import { useFiles } from '../hooks/useFiles';
|
|
import { FileCard } from '../components/FileCard';
|
|
import { FileItem } from '../types';
|
|
|
|
type RootStackParamList = {
|
|
Home: undefined;
|
|
Upload: undefined;
|
|
Scan: undefined;
|
|
Search: undefined;
|
|
};
|
|
|
|
type NavigationProp = NativeStackNavigationProp<RootStackParamList>;
|
|
|
|
export function HomeScreen() {
|
|
const navigation = useNavigation<NavigationProp>();
|
|
const { data, isLoading, error } = useFiles();
|
|
|
|
const renderItem = ({ item }: { item: FileItem }) => (
|
|
<FileCard
|
|
file={item}
|
|
onPress={(file) => console.log('File pressed:', file.id)}
|
|
/>
|
|
);
|
|
|
|
if (isLoading) {
|
|
return (
|
|
<View style={styles.center}>
|
|
<Text>Chargement...</Text>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
if (error) {
|
|
return (
|
|
<View style={styles.center}>
|
|
<Text>Erreur de chargement</Text>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<View style={styles.container}>
|
|
<FlatList
|
|
data={data?.data || []}
|
|
renderItem={renderItem}
|
|
keyExtractor={(item) => item.id}
|
|
contentContainerStyle={styles.list}
|
|
/>
|
|
|
|
<View style={styles.bottomNav}>
|
|
<TouchableOpacity
|
|
style={styles.navButton}
|
|
onPress={() => navigation.navigate('Upload')}
|
|
>
|
|
<Text style={styles.navText}>Upload</Text>
|
|
</TouchableOpacity>
|
|
|
|
<TouchableOpacity
|
|
style={styles.navButton}
|
|
onPress={() => navigation.navigate('Scan')}
|
|
>
|
|
<Text style={styles.navText}>Scan</Text>
|
|
</TouchableOpacity>
|
|
|
|
<TouchableOpacity
|
|
style={styles.navButton}
|
|
onPress={() => navigation.navigate('Search')}
|
|
>
|
|
<Text style={styles.navText}>Recherche</Text>
|
|
</TouchableOpacity>
|
|
</View>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
backgroundColor: '#f5f5f5',
|
|
},
|
|
center: {
|
|
flex: 1,
|
|
justifyContent: 'center',
|
|
alignItems: 'center',
|
|
},
|
|
list: {
|
|
padding: 16,
|
|
},
|
|
bottomNav: {
|
|
flexDirection: 'row',
|
|
justifyContent: 'space-around',
|
|
paddingVertical: 12,
|
|
backgroundColor: '#fff',
|
|
borderTopWidth: 1,
|
|
borderTopColor: '#e0e0e0',
|
|
},
|
|
navButton: {
|
|
padding: 8,
|
|
},
|
|
navText: {
|
|
fontSize: 16,
|
|
color: '#1976D2',
|
|
},
|
|
});
|