import { View, Text } from '@tarojs/components'
import Taro from '@tarojs/taro'

interface EntryItem {
  icon: string
  label: string
  url?: string
  onClick?: () => void
  badge?: string
}

interface EntryGridProps {
  items: EntryItem[]
  columns?: number
}

export default function EntryGrid({ items, columns = 3 }: EntryGridProps) {
  return (
    <View className='bg-white rounded-xl p-2'>
      <View className='flex flex-wrap'>
        {items.map((it, i) => (
          <View
            key={i}
            className='flex flex-col items-center justify-center py-3 relative'
            style={{ width: `${100 / columns}%` }}
            onClick={() => {
              if (it.onClick) it.onClick()
              else if (it.url) Taro.navigateTo({ url: it.url })
            }}
          >
            <Text className='text-2xl mb-1'>{it.icon}</Text>
            <Text className='text-xs text-gray-600'>{it.label}</Text>
            {it.badge && (
              <View className='absolute top-1 right-6 px-1 rounded-full' style={{ background: '#ef4444' }}>
                <Text className='text-white text-xs'>{it.badge}</Text>
              </View>
            )}
          </View>
        ))}
      </View>
    </View>
  )
}
