import ButtonBackHeader from "@/components/buttonBackHeader";
import HeaderMemberList from "@/components/member/headerMemberList";
import { Headers } from "@/constants/Headers";
import { router, Stack } from "expo-router";
import { StatusBar } from 'expo-status-bar';

export default function RootLayout() {
   return (
      <>
         <Stack screenOptions={Headers.shadow}>
            <Stack.Screen name="home" options={{ title: 'Home' }} />
            <Stack.Screen name="feature" options={{ title: 'Fitur' }} />
            <Stack.Screen name="search" options={{ title: 'Pencarian' }} />
            <Stack.Screen name="notification" options={{ title: 'Notifikasi' }} />
            <Stack.Screen name="profile" options={{ title: 'Profile' }} />
            <Stack.Screen name="group" options={{ title: 'Lembaga Desa', headerShown: false }} />
            <Stack.Screen name="position" options={{ title: 'Jabatan', headerShown: false }} />
            <Stack.Screen name="member/index" options={{
               headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
               title: 'Anggota',
               headerTitleAlign: 'center',
               headerRight: () => <HeaderMemberList />
            }} />
            <Stack.Screen name="member/create" options={{ title: 'Tambah Anggota' }} />
         </Stack>
         <StatusBar style="light" />
      </>
   )
}