import { Report, User } from "@repo/db";
import { ColumnDef } from "@tanstack/react-table";
import { Check, Eye, Plane, ShieldQuestion, Workflow, X } from "lucide-react";
import Link from "next/link";

export const reportColumns: ColumnDef<Report & { Sender?: User; Reported: User }>[] = [
	{
		accessorKey: "reviewed",
		header: "Erledigt",

		cell: ({ row }) => {
			return (
				<div className="text-center">
					{row.getValue("reviewed") ? (
						<Check className="h-5 w-5 text-green-500" />
					) : (
						<X className="h-5 w-5 text-red-500" />
					)}
				</div>
			);
		},
	},
	{
		accessorKey: "Sender",
		header: "Sender",
		cell: ({ row }) => {
			const user = row.original.Sender;
			if (!user) return "Unbekannt";
			return `${user.firstname} ${user.lastname} (${user.publicId})`;
		},
	},
	{
		accessorKey: "reportedUserRole",
		header: "Rolle",
		cell: ({ row }) => {
			const role = row.getValue("reportedUserRole") as string | undefined;
			const Icon = role ? (role.startsWith("LST") ? Workflow : Plane) : ShieldQuestion;
			return (
				<span className="flex items-center gap-2">
					<Icon className="h-4 w-4" />
					{role || "Unbekannt"}
				</span>
			);
		},
	},
	{
		accessorKey: "Reported",
		header: "Reported",
		cell: ({ row }) => {
			const user = row.original.Reported;
			return `${user.firstname} ${user.lastname} (${user.publicId})`;
		},
	},
	{
		accessorKey: "timestamp",
		header: "Time",
		cell: ({ row }) => new Date(row.getValue("timestamp")).toLocaleString(),
	},
	{
		accessorKey: "actions",
		header: "Actions",
		cell: ({ row }) => (
			<Link href={`/admin/report/${row.original.id}`}>
				<button className="btn btn-sm btn-outline btn-info flex items-center gap-2">
					<Eye className="h-4 w-4" /> Anzeigen
				</button>
			</Link>
		),
	},
];