import { Edit } from 'iconsax-react'
import type { ColumnType } from '@/components/types/TableTypes'
import type { Notification } from '../types/Types'
import { formatOptionalDate } from '@/helpers/func'
import Status from '@/components/Status'

const getChannelVariant = (channel: string): 'success' | 'error' | 'warning' | 'info' | 'pending' => {
    const variantMap: Record<string, 'success' | 'error' | 'warning' | 'info' | 'pending'> = {
        'sms': 'info',
        'push': 'warning',
        'in-app': 'success',
    }
    return variantMap[channel] || 'info'
}

const getChannelLabel = (channel: string): string => {
    const labels: Record<string, string> = {
        'sms': 'پیامک',
        'push': 'پوش',
        'in-app': 'درون برنامه',
    }
    return labels[channel] || channel
}

const getTitleLabel = (title: string): string => {
    const titleMap: Record<string, string> = {
        'order.created': 'سفارش ایجاد شد',
        'order.status.changed': 'تغییر وضعیت سفارش',
        'pager.created': 'پیجر ایجاد شد',
        'payment.success': 'پرداخت موفق',
        'review.created': 'نظر ایجاد شد',
    }
    return titleMap[title] || title
}

type Props = {
    onEdit: (notification: Notification) => void
}

export const getNotificationTableColumns = ({ onEdit }: Props): ColumnType<Notification>[] => {
    return [
        {
            key: 'title',
            title: 'عنوان',
            render: (item: Notification) => {
                return (
                    <div className="max-w-xs truncate" title={item.title}>
                        {item.title ? getTitleLabel(item.title) : '-'}
                    </div>
                )
            }
        },
        {
            key: 'channels',
            title: 'کانال‌های اعلان',
            render: (item: Notification) => {
                if (!item.channels || item.channels.length === 0) {
                    return <span className="text-gray-400">-</span>
                }
                return (
                    <div className="flex flex-wrap gap-2">
                        {item.channels.map((channel, index) => (
                            <Status
                                key={index}
                                variant={getChannelVariant(channel)}
                                label={getChannelLabel(channel)}
                            />
                        ))}
                    </div>
                )
            }
        },
        {
            key: 'createdAt',
            title: 'تاریخ ثبت',
            render: (item: Notification) => {
                return formatOptionalDate(item.createdAt, {
                    year: 'numeric',
                    month: '2-digit',
                    day: '2-digit',
                    hour: '2-digit',
                    minute: '2-digit',
                })
            }
        },
        {
            key: 'actions',
            title: '',
            render: (item: Notification) => {
                return (
                    <div className="flex gap-2 items-center">
                        <Edit
                            onClick={() => onEdit(item)}
                            size={20}
                            color="#8C90A3"
                            className="cursor-pointer"
                        />
                    </div>
                )
            }
        },
    ]
}
