94 lines
3.2 KiB
TypeScript
94 lines
3.2 KiB
TypeScript
//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 Filters from "@/components/Filters";
|
|
|
|
export default function Index() {
|
|
// 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={
|
|
<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>
|
|
|
|
<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>
|
|
);
|
|
}
|