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 {FlatList, Image, SafeAreaView, Text, TouchableOpacity, View} from "react-native";
//import { Link } from "expo-router";
import {
FlatList,
Image,
SafeAreaView,
Text,
TouchableOpacity,
View,
} from "react-native";
import images from "@/constants/images";
import icons from "@/constants/icons";
import Search from "@/components/Search";
import {useGlobalContext} from "@/lib/globalProvider";
import {Card, FeaturedCard} from "@/components/Cards";
import { useGlobalContext } from "@/lib/globalProvider";
import { Card, FeaturedCard } from "@/components/Cards";
import Filters from "@/components/Filters";
export default function Index() {
// create func that determines the time od day [morning, evening, night]
const {user, refetch} = useGlobalContext();
// create func that determines the time od day [morning, evening, night]
const { user, refetch } = useGlobalContext();
return (
<SafeAreaView className={'bg-white h-full'}>
<FlatList data={[5,6,7,8]}
renderItem={({item}) => (
<Card/>
)}
keyExtractor={(item) => item.toString()}
numColumns={2}
contentContainerClassName={'pb-32'}
columnWrapperClassName={'flex flex-row gap-5 px-5'}
showsVerticalScrollIndicator={false}
ListHeaderComponent={
<SafeAreaView className={"bg-white h-full"}>
<FlatList
data={[5, 6, 7, 8]}
renderItem={({ item }) => <Card />}
keyExtractor={(item) => item.toString()}
numColumns={2}
contentContainerClassName={"pb-32"}
columnWrapperClassName={"flex flex-row gap-5 px-5"}
showsVerticalScrollIndicator={false}
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'}>
<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>
<Search />
<View className={"my-5"}>
<View className={"flex flex-row items-center justify-between"}>
<Text className={"capitalize font-bold text-base"}>
featured
</Text>
<TouchableOpacity>
<Text className={"capitalize text-base text-blue-500"}>
see all
</Text>
</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={'my-5'}>
<View className={'flex flex-row items-center justify-between'}>
<Text className={'capitalize font-bold text-base'}>featured</Text>
<TouchableOpacity>
<Text className={'capitalize text-base text-blue-500'}>see all</Text>
</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>
<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>
<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>
);
}