This commit is contained in:
dimitar 2025-02-04 18:27:17 +01:00
parent 0af7a5060e
commit 7f702c58aa

View File

@ -1,79 +1,93 @@
import { Link } from "expo-router"; //import { Link } from "expo-router";
import {FlatList, Image, SafeAreaView, Text, TouchableOpacity, View} from "react-native"; import {
FlatList,
Image,
SafeAreaView,
Text,
TouchableOpacity,
View,
} from "react-native";
import images from "@/constants/images"; import images from "@/constants/images";
import icons from "@/constants/icons"; import icons from "@/constants/icons";
import Search from "@/components/Search"; import Search from "@/components/Search";
import {useGlobalContext} from "@/lib/globalProvider"; import { useGlobalContext } from "@/lib/globalProvider";
import {Card, FeaturedCard} from "@/components/Cards"; import { Card, FeaturedCard } from "@/components/Cards";
import Filters from "@/components/Filters"; import Filters from "@/components/Filters";
export default function Index() { export default function Index() {
// create func that determines the time od day [morning, evening, night] // create func that determines the time od day [morning, evening, night]
const {user, refetch} = useGlobalContext(); const { user, refetch } = useGlobalContext();
return ( return (
<SafeAreaView className={'bg-white h-full'}> <SafeAreaView className={"bg-white h-full"}>
<FlatList data={[5,6,7,8]} <FlatList
renderItem={({item}) => ( data={[5, 6, 7, 8]}
<Card/> renderItem={({ item }) => <Card />}
)} keyExtractor={(item) => item.toString()}
keyExtractor={(item) => item.toString()} numColumns={2}
numColumns={2} contentContainerClassName={"pb-32"}
contentContainerClassName={'pb-32'} columnWrapperClassName={"flex flex-row gap-5 px-5"}
columnWrapperClassName={'flex flex-row gap-5 px-5'} showsVerticalScrollIndicator={false}
showsVerticalScrollIndicator={false} ListHeaderComponent={
ListHeaderComponent={ <View className={"px-4"}>
<View className={"flex flex-row items-center justify-between mt-5"}>
<View className={"flex flex-row items-center"}>
<Image
source={{ uri: user?.avatar }}
className={"rounded-full size-12"}
/>
<View
className={"flex flex-col items-start ml-4 justify-center"}
>
<Text className={"capitalize"}>good morning</Text>
<Text className={"capitalize font-bold"}>{user?.name}</Text>
</View>
</View>
<Image source={icons.bell} className={"size-6"} />
</View>
<View className={'px-4'}> <Search />
<View className={'flex flex-row items-center justify-between mt-5'}> <View className={"my-5"}>
<View className={'flex flex-row items-center'}> <View className={"flex flex-row items-center justify-between"}>
<Image source={{uri: user?.avatar}} className={'rounded-full size-12'}/> <Text className={"capitalize font-bold text-base"}>
<View className={'flex flex-col items-start ml-4 justify-center'}> featured
<Text className={'capitalize'}>good morning</Text> </Text>
<Text className={'capitalize font-bold'}>{user?.name}</Text> <TouchableOpacity>
</View> <Text className={"capitalize text-base text-blue-500"}>
</View> see all
<Image source={icons.bell} className={'size-6'}/> </Text>
</View> </TouchableOpacity>
</View>
<FlatList
data={[1, 2, 3]}
renderItem={({ item }) => <FeaturedCard />}
keyExtractor={(item) => item.toString()}
horizontal={true}
bounces={false}
showsHorizontalScrollIndicator={false}
contentContainerClassName={"flex gap-3 mt-5"}
/>
{/*<View className={'flex flex-row gap-5 mt-5'}>*/}
{/* <FeaturedCard/>*/}
{/* <FeaturedCard/>*/}
{/*</View>*/}
</View>
<Search /> <View className={"flex flex-row items-center justify-between"}>
<View className={'my-5'}> <Text className={"capitalize font-bold text-base"}>
<View className={'flex flex-row items-center justify-between'}> latest cars
<Text className={'capitalize font-bold text-base'}>featured</Text> </Text>
<TouchableOpacity> <TouchableOpacity>
<Text className={'capitalize text-base text-blue-500'}>see all</Text> <Text className={"capitalize font-bold"}>see all</Text>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<FlatList data={[1,2,3]} <Filters />
renderItem={({item}) => ( <View className={"flex flex-row gap-5 mt-5"}>
<FeaturedCard/> <Card />
)} <Card />
keyExtractor={(item) => item.toString()} </View>
horizontal={true} </View>
bounces={false} }
showsHorizontalScrollIndicator={false} />
contentContainerClassName={'flex gap-3 mt-5'} </SafeAreaView>
/>
{/*<View className={'flex flex-row gap-5 mt-5'}>*/}
{/* <FeaturedCard/>*/}
{/* <FeaturedCard/>*/}
{/*</View>*/}
</View>
<View className={'flex flex-row items-center justify-between'}>
<Text className={'capitalize font-bold text-base'}>latest cars</Text>
<TouchableOpacity>
<Text className={'capitalize font-bold'}>see all</Text>
</TouchableOpacity>
</View>
<Filters />
<View className={'flex flex-row gap-5 mt-5'}>
<Card/>
<Card/>
</View>
</View>
}
/>
</SafeAreaView>
); );
} }