dimitar/reactnative_mobilemk
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

backup

Browse Source
This commit is contained in:
dimitar 2025-02-04 18:27:17 +01:00
parent 0af7a5060e
commit 7f702c58aa
1 changed files with 82 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

90
app/(root)/(tabs)/index.tsx
View File

@ -1,57 +1,70 @@
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={'px-4'}> <View className={"flex flex-row items-center justify-between mt-5"}>
<View className={'flex flex-row items-center justify-between mt-5'}> <View className={"flex flex-row items-center"}>
<View className={'flex flex-row items-center'}> <Image
<Image source={{uri: user?.avatar}} className={'rounded-full size-12'}/> source={{ uri: user?.avatar }}
<View className={'flex flex-col items-start ml-4 justify-center'}> className={"rounded-full size-12"}
<Text className={'capitalize'}>good morning</Text> />
<Text className={'capitalize font-bold'}>{user?.name}</Text> <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>
</View> </View>
<Image source={icons.bell} className={'size-6'}/> <Image source={icons.bell} className={"size-6"} />
</View> </View>
<Search /> <Search />
<View className={'my-5'}> <View className={"my-5"}>
<View className={'flex flex-row items-center justify-between'}> <View className={"flex flex-row items-center justify-between"}>
<Text className={'capitalize font-bold text-base'}>featured</Text> <Text className={"capitalize font-bold text-base"}>
featured
</Text>
<TouchableOpacity> <TouchableOpacity>
<Text className={'capitalize text-base text-blue-500'}>see all</Text> <Text className={"capitalize text-base text-blue-500"}>
see all
</Text>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<FlatList data={[1,2,3]} <FlatList
renderItem={({item}) => ( data={[1, 2, 3]}
<FeaturedCard/> renderItem={({ item }) => <FeaturedCard />}
)}
keyExtractor={(item) => item.toString()} keyExtractor={(item) => item.toString()}
horizontal={true} horizontal={true}
bounces={false} bounces={false}
showsHorizontalScrollIndicator={false} showsHorizontalScrollIndicator={false}
contentContainerClassName={'flex gap-3 mt-5'} contentContainerClassName={"flex gap-3 mt-5"}
/> />
{/*<View className={'flex flex-row gap-5 mt-5'}>*/} {/*<View className={'flex flex-row gap-5 mt-5'}>*/}
{/* <FeaturedCard/>*/} {/* <FeaturedCard/>*/}
@ -59,19 +72,20 @@ export default function Index() {
{/*</View>*/} {/*</View>*/}
</View> </View>
<View className={'flex flex-row items-center justify-between'}> <View className={"flex flex-row items-center justify-between"}>
<Text className={'capitalize font-bold text-base'}>latest cars</Text> <Text className={"capitalize font-bold text-base"}>
latest cars
</Text>
<TouchableOpacity> <TouchableOpacity>
<Text className={'capitalize font-bold'}>see all</Text> <Text className={"capitalize font-bold"}>see all</Text>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<Filters /> <Filters />
<View className={'flex flex-row gap-5 mt-5'}> <View className={"flex flex-row gap-5 mt-5"}>
<Card/> <Card />
<Card/> <Card />
</View> </View>
</View> </View>
} }
/> />
</SafeAreaView> </SafeAreaView>