import { Tabs } from 'expo-router'
import { Feather } from '@expo/vector-icons'
import { useTheme } from '../../constants/ThemeContext'

/*
 * ITMS 하단 탭 — 홈 · 요청 · 인시던트 · 공지 · 내정보.
 */
export default function TabsLayout() {
  const { t } = useTheme()
  return (
    <Tabs
      screenOptions={{
        headerShown: false,
        tabBarActiveTintColor: t.tabActive,
        tabBarInactiveTintColor: t.tabIdle,
        tabBarStyle: { backgroundColor: t.card, borderTopColor: t.border, height: 60, paddingBottom: 8, paddingTop: 6 },
        tabBarLabelStyle: { fontSize: 11, fontWeight: '700' },
      }}
    >
      <Tabs.Screen name="home" options={{ title: '홈', tabBarIcon: ({ color, size }: { color: string; size: number }) => <Feather name="home" size={size} color={color} /> }} />
      <Tabs.Screen name="requests" options={{ title: '요청', tabBarIcon: ({ color, size }: { color: string; size: number }) => <Feather name="file-text" size={size} color={color} /> }} />
      <Tabs.Screen name="incidents" options={{ title: '인시던트', tabBarIcon: ({ color, size }: { color: string; size: number }) => <Feather name="alert-circle" size={size} color={color} /> }} />
      <Tabs.Screen name="notices" options={{ title: '공지', tabBarIcon: ({ color, size }: { color: string; size: number }) => <Feather name="bell" size={size} color={color} /> }} />
      <Tabs.Screen name="me" options={{ title: '내정보', tabBarIcon: ({ color, size }: { color: string; size: number }) => <Feather name="user" size={size} color={color} /> }} />
    </Tabs>
  )
}