61 lines
1.9 KiB
JavaScript
61 lines
1.9 KiB
JavaScript
import {
|
|
View,
|
|
StyleSheet,
|
|
FlatList,
|
|
} from "react-native";
|
|
import {useTheme, Card, Text, Button, ActivityIndicator} from "react-native-paper";
|
|
import {Link} from "expo-router";
|
|
import useLocationStore from "@/locationStore";
|
|
|
|
export default function Index() {
|
|
const theme = useTheme();
|
|
const {locations, loading} = useLocationStore();
|
|
|
|
if (loading) {
|
|
return (
|
|
<View style={[styles.container, {backgroundColor: theme.colors.background}]}>
|
|
<ActivityIndicator size="large" color={theme.colors.primary}/>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<View
|
|
style={[styles.container, {backgroundColor: theme.colors.background}]}
|
|
>
|
|
<FlatList
|
|
data={locations}
|
|
keyExtractor={(item) => item.id.toString()}
|
|
renderItem={({item}) => (
|
|
<Card style={{margin: 10}}>
|
|
<Card.Cover
|
|
style={{marginBottom: 10}}
|
|
source={item.imageSource}
|
|
/>
|
|
<Card.Content style={{marginBottom: 10}}>
|
|
<Text variant="titleLarge">{item.name}</Text>
|
|
<Text variant="bodyMedium">
|
|
{item.description && item.description.split(".")[0]}...
|
|
</Text>
|
|
</Card.Content>
|
|
<Card.Actions>
|
|
<Link href={`/location/${item.id}`} asChild>
|
|
<Button>Zobacz więcej</Button>
|
|
</Link>
|
|
</Card.Actions>
|
|
</Card>
|
|
)}
|
|
/>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
backgroundColor: "#25292e",
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
},
|
|
});
|