import CaraouselHome from "@/components/home/carouselHome";
import ChartDokumenHome from "@/components/home/chartDokumenHome";
import ChartProgresHome from "@/components/home/chartProgresHome";
import DisccussionHome from "@/components/home/discussionHome";
import DivisionHome from "@/components/home/divisionHome";
import EventHome from "@/components/home/eventHome";
import FiturHome from "@/components/home/fiturHome";
import { HeaderRightHome } from "@/components/home/headerRightHome";
import ProjectHome from "@/components/home/projectHome";
import Text from "@/components/Text";
import Styles from "@/constants/Styles";
import { apiGetProfile } from "@/lib/api";
import { setEntities } from "@/lib/entitiesSlice";
import { useAuthSession } from "@/providers/AuthProvider";
import { Stack } from "expo-router";
import { useEffect } from "react";
import { Platform, SafeAreaView, ScrollView, View } from "react-native";
import { useSafeAreaInsets } from "react-native-safe-area-context";
import { useDispatch, useSelector } from "react-redux";


export default function Home() {
   const entities = useSelector((state: any) => state.entities)
   const dispatch = useDispatch()
   const { token, decryptToken, signOut } = useAuthSession()
   const insets = useSafeAreaInsets()

   useEffect(() => {
      handleUserLogin()
   }, [dispatch]);

   async function handleUserLogin() {
      const hasil = await decryptToken(String(token?.current))
      apiGetProfile({ id: hasil })
         .then((data) => dispatch(setEntities(data.data)))
         .catch((error) => {
            signOut()
         });
   }

   return (
      <SafeAreaView>
         <Stack.Screen
            options={{
               title: 'Home',
               headerTitle: entities.village,
               header: () => (
                  <View style={[Styles.rowItemsCenter, Styles.ph20, Platform.OS === 'ios' ? Styles.pb07 : Styles.pb13, { backgroundColor: '#19345E', paddingTop: Platform.OS === 'ios' ? insets.top : 10 }]}>
                     <Text style={Styles.textHeaderHome}>{entities.village}</Text>
                     <HeaderRightHome />
                  </View>
               ),
            }}
         />
         <ScrollView>
            <CaraouselHome />
            <View style={[Styles.ph15, Styles.mb100]}>
               <FiturHome />
               <ProjectHome />
               <DivisionHome />
               <ChartProgresHome />
               <ChartDokumenHome />
               <EventHome />
               <DisccussionHome />
            </View>
         </ScrollView>
      </SafeAreaView>
   )
}