import type { ColumnDef } from '@tanstack/react-table';
import { format } from 'date-fns';
import { Eye } from 'lucide-react';
import { RowActions } from '@/components/row-actions';
import { Badge } from '@/components/ui/badge';
import type { LogEntry, LogLevel } from '@/types/log-entry';

function levelVariant(
    level: LogLevel,
): 'default' | 'secondary' | 'destructive' | 'outline' {
    if (['EMERGENCY', 'ALERT', 'CRITICAL', 'ERROR'].includes(level)) {
        return 'destructive';
    }

    if (['WARNING', 'NOTICE'].includes(level)) {
        return 'secondary';
    }

    if (level === 'INFO') {
        return 'default';
    }

    return 'outline';
}

function firstLine(message: string): string {
    return message.split('\n')[0];
}

type CreateColumnsParams = {
    handleViewDetail: (entry: LogEntry) => void;
};

export function createLogColumns(
    params: CreateColumnsParams,
): ColumnDef<LogEntry>[] {
    const { handleViewDetail } = params;

    return [
        {
            accessorKey: 'timestamp',
            header: () => <span>Waktu</span>,
            meta: {
                className: 'w-[180px]',
                headerClassName: 'w-[180px]',
            },
            cell: ({ row }) => {
                const timestamp = row.getValue('timestamp') as string;
                const date = new Date(timestamp.replace(' ', 'T'));

                return (
                    <span className="whitespace-nowrap">
                        {Number.isNaN(date.getTime())
                            ? timestamp
                            : format(date, 'd MMM yyyy, HH:mm:ss')}
                    </span>
                );
            },
        },
        {
            accessorKey: 'level',
            header: () => <span className="block text-center">Level</span>,
            meta: {
                className: 'w-[110px] text-center',
                headerClassName: 'w-[110px] text-center',
            },
            cell: ({ row }) => {
                const level = row.getValue('level') as LogLevel;

                return (
                    <div className="flex justify-center">
                        <Badge variant={levelVariant(level)}>{level}</Badge>
                    </div>
                );
            },
        },
        {
            accessorKey: 'message',
            header: () => <span>Pesan</span>,
            cell: ({ row }) => (
                <p className="line-clamp-2 max-w-2xl font-mono text-xs break-all">
                    {firstLine(row.original.message)}
                </p>
            ),
        },
        {
            id: 'actions',
            header: () => <span className="block text-center">Aksi</span>,
            meta: {
                className: 'w-[80px] text-center',
                headerClassName: 'w-[80px] text-center',
            },
            cell: ({ row }) => (
                <RowActions
                    actions={[
                        {
                            label: 'Lihat Detail',
                            icon: <Eye className="h-4 w-4" />,
                            onClick: () => handleViewDetail(row.original),
                        },
                    ]}
                />
            ),
        },
    ];
}