import { DrawerItem } from "@react-navigation/drawer";
import { Drawer } from "expo-router/drawer";
import { useAuthStore } from "@/store/authStore";

import {
  DrawerContentScrollView,
  DrawerItemList,
} from "@react-navigation/drawer";

export default function AccountDrawerLayout() {
  const signOut = useAuthStore((state) => state.signOut);

  return (
    <Drawer
      screenOptions={{
        drawerActiveTintColor: "#1c1c1e",
        drawerInactiveTintColor: "#8e8e8f",
        drawerActiveBackgroundColor: "#f0f0f0",
        drawerItemStyle: {
          borderRadius: 8,
        },
        headerTintColor: "#1c1c1e",
      }}
      drawerContent={(props) => (
        <DrawerContentScrollView {...props}>
          <DrawerItemList {...props} />
          <DrawerItem
            label="Wyloguj"
            onPress={signOut}
            labelStyle={{ color: "red" }}
          />
        </DrawerContentScrollView>
      )}
    >
      <Drawer.Screen name="account" options={{ title: "Konto" }} />
      <Drawer.Screen
        name="userNotices"
        options={{ title: "Moje ogłoszenia" }}
      />
      <Drawer.Screen name="userOrders" options={{ title: "Moje zamówienia" }} />
    </Drawer>
  );
}