import type { ColumnDef } from '@tanstack/react-table';
import { format } from 'date-fns';
import { Eye, Pencil, Trash2 } from 'lucide-react';
import { RowActions } from '@/components/row-actions';
import { Badge } from '@/components/ui/badge';
import type { Announcement } from '@/types/announcement';
import { AnnouncementTargetRoleLabels } from '@/types/announcement';

export type { Announcement } from '@/types/announcement';

type CreateColumnsParams = {
    handleView: (announcement: Announcement) => void;
    handleEdit: (announcement: Announcement) => void;
    handleDeleteClick: (announcement: Announcement) => void;
    canUpdate: boolean;
    canDelete: boolean;
    showTargetRoles: boolean;
};

export function createAnnouncementColumns(
    params: CreateColumnsParams,
): ColumnDef<Announcement>[] {
    const {
        handleView,
        handleEdit,
        handleDeleteClick,
        canUpdate,
        canDelete,
        showTargetRoles,
    } = params;

    const columns: ColumnDef<Announcement>[] = [
        {
            accessorKey: 'title',
            header: () => <span>Judul</span>,
            cell: ({ row }) => (
                <span className="font-medium">{row.original.title}</span>
            ),
        },
    ];

    if (showTargetRoles) {
        columns.push({
            accessorKey: 'target_roles',
            header: () => <span>Ditujukan Untuk</span>,
            cell: ({ row }) => (
                <div className="flex flex-wrap gap-1">
                    {row.original.target_roles.map((role) => (
                        <Badge key={role} variant="secondary">
                            {AnnouncementTargetRoleLabels[role]}
                        </Badge>
                    ))}
                </div>
            ),
        });
    }

    columns.push(
        {
            accessorKey: 'creator.profile.full_name',
            header: () => <span>Dibuat Oleh</span>,
            cell: ({ row }) => row.original.creator?.profile?.full_name ?? '-',
        },
        {
            accessorKey: 'created_at',
            header: () => <span>Tanggal</span>,
            cell: ({ row }) =>
                format(new Date(row.original.created_at), 'd MMM yyyy, HH:mm'),
        },
    );

    columns.push({
        id: 'actions',
        header: () => <span className="block text-center">Aksi</span>,
        meta: {
            className: 'w-[100px] text-center',
            headerClassName: 'w-[100px] text-center',
        },
        cell: ({ row }) => (
            <RowActions
                actions={[
                    {
                        label: 'Lihat Detail',
                        icon: <Eye className="h-4 w-4" />,
                        onClick: () => handleView(row.original),
                    },
                    {
                        label: 'Edit',
                        icon: <Pencil className="h-4 w-4" />,
                        show: canUpdate,
                        onClick: () => handleEdit(row.original),
                    },
                    {
                        label: 'Hapus',
                        icon: (
                            <Trash2 className="h-4 w-4 text-destructive" />
                        ),
                        show: canDelete,
                        onClick: () => handleDeleteClick(row.original),
                    },
                ]}
            />
        ),
    });

    return columns;
}