import { type FC } from 'react'
import Td from '../../../components/Td'
import { Calendar, MessageText } from 'iconsax-react'
import StatusWithText from '../../../components/StatusWithText'
import type { Notification } from '../types/Types'
import { AnnouncementType } from '../types/Types'

interface Props {
    notification: Notification
}

const AnnouncementTableRow: FC<Props> = ({ notification }) => {
    const getTypeLabel = (type: string) => {
        const typeMap: Record<string, string> = {
            [AnnouncementType.Announcement]: 'اطلاعیه عمومی',
            [AnnouncementType.Order]: 'سفارش',
            [AnnouncementType.Product]: 'محصول',
            [AnnouncementType.Shipment]: 'ارسال',
            [AnnouncementType.Fine]: 'جریمه',
            [AnnouncementType.Wallet]: 'کیف پول',
            [AnnouncementType.Ticket]: 'تیکت',
            [AnnouncementType.Chat]: 'چت',
            [AnnouncementType.Contract]: 'قرارداد'
        }
        return typeMap[type] || type
    }

    const getTypeVariant = (type: string) => {
        switch (type) {
            case AnnouncementType.Announcement: return 'warning'
            case AnnouncementType.Order: return 'success'
            case AnnouncementType.Product: return 'warning'
            case AnnouncementType.Shipment: return 'success'
            case AnnouncementType.Fine: return 'error'
            case AnnouncementType.Wallet: return 'success'
            case AnnouncementType.Ticket: return 'warning'
            case AnnouncementType.Chat: return 'warning'
            case AnnouncementType.Contract: return 'success'
            default: return 'warning'
        }
    }

    const truncateMessage = (message: string, maxLength: number = 100) => {
        if (message.length <= maxLength) return message
        return message.substring(0, maxLength) + '...'
    }

    const formatDate = (dateString: string) => {
        return new Date(dateString).toLocaleDateString('fa-IR', {
            year: 'numeric',
            month: 'long',
            day: 'numeric',
            hour: '2-digit',
            minute: '2-digit'
        })
    }

    return (
        <tr className='tr'>
            <Td text="">
                <div className="max-w-xs">
                    <div className="font-medium text-gray-900 truncate">
                        {notification.title}
                    </div>
                </div>
            </Td>
            <Td text="">
                <div className="max-w-sm">
                    <div className="flex items-start gap-2">
                        <MessageText size={16} color="#8C90A3" className="mt-0.5 flex-shrink-0" />
                        <span className="text-gray-600 text-sm leading-relaxed">
                            {truncateMessage(notification.message)}
                        </span>
                    </div>
                </div>
            </Td>
            <Td text="">
                <StatusWithText
                    variant={getTypeVariant(notification.type)}
                    text={getTypeLabel(notification.type)}
                />
            </Td>
            <Td text="">
                <div className="flex items-center gap-2">
                    <Calendar size={16} color="#8C90A3" />
                    <span className="text-gray-600 text-sm">
                        {formatDate(notification.createdAt)}
                    </span>
                </div>
            </Td>
            <Td text="">
                <StatusWithText
                    variant={notification.read ? 'success' : 'warning'}
                    text={notification.read ? 'خوانده شده' : 'خوانده نشده'}
                />
            </Td>
        </tr>
    )
}

export default AnnouncementTableRow
