import React from 'react';
import {createDrawerNavigator} from '@react-navigation/drawer';
import Setting from '../screens/Setting';
import UserInformation from '../screens/UserInformation';
import CustomDrawer from '../component/CustomDrawer';
import MembershipWithdrawal from '../screens/MembershipWithdrawal';
import Main from '../screens/Main';
import {BLACK, PRIMARY, WHITE} from '../color';

const Drawer = createDrawerNavigator();

export default function DrawerNavigate() {
  return (
    <Drawer.Navigator
      initialRouteName="Main screen"
      drawerContent={props => <CustomDrawer {...props} />}
      screenOptions={{
        drawerStyle: {
          width: 220,
        },
        drawerActiveBackgroundColor: PRIMARY.LIGHT,
      }}>
      <Drawer.Screen
        name="Main screen"
        component={Main}
        options={{
          headerShown: false,
          drawerLabel: '홈',
          drawerLabelStyle: {
            color: BLACK, // 검정색으로 변경
          },
        }}
      />
      <Drawer.Screen
        name="Setting screen"
        component={Setting}
        options={{
          drawerLabel: '설정',
          drawerLabelStyle: {
            color: BLACK, // 검정색으로 변경
          },
        }}
      />
      <Drawer.Screen
        name="UserInformation screen"
        component={UserInformation}
        options={{
          drawerLabel: '회원 정보 수정',
          drawerLabelStyle: {
            color: BLACK, // 검정색으로 변경
          },
        }}
      />
      <Drawer.Screen
        name="MembershipWithdrawal screen"
        component={MembershipWithdrawal}
        options={{
          drawerLabel: '회원탈퇴',
          drawerLabelStyle: {
            color: BLACK, // 검정색으로 변경
          },
        }}
      />
    </Drawer.Navigator>
  );
}