import { Link } from "expo-router";
import {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";

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'}>
          <View className={'px-5'}>
              <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>

                  <FeaturedCard/>
                  <Card/>
          </View>
          </View>
      </SafeAreaView>
  );
}