"use client"

import Link from "next/link"
import type { ColumnDef } from "@tanstack/react-table"

import { Badge } from "@/components/ui/badge"
import { DataTableColumnHeader } from "@/components/ui/data-table"
import type { Translate } from "@/lib/i18n"
import type { PersonRow } from "@/lib/services/people"

/**
 * Built from the reader's language rather than declared once, like the task
 * columns and for the same reason: a column definition holds render functions
 * and a Server Component cannot hand one to a client component.
 */
export function peopleColumns(t: Translate): ColumnDef<PersonRow>[] {
  return [
    {
      accessorKey: "employeeCode",
      meta: { label: t("people.code") },
      header: ({ column }) => (
        <DataTableColumnHeader column={column} title={t("people.code")} />
      ),
      cell: ({ row }) => (
        <span className="tabular-nums">{row.original.employeeCode}</span>
      ),
    },
    {
      accessorKey: "name",
      meta: { label: t("people.name") },
      header: ({ column }) => (
        <DataTableColumnHeader column={column} title={t("people.name")} />
      ),
      cell: ({ row }) => (
        <Link
          href={`/admin/people/${row.original.id}`}
          className="font-medium hover:underline"
        >
          {row.original.name}
        </Link>
      ),
    },
    {
      accessorKey: "position",
      meta: { label: t("people.position") },
      header: ({ column }) => (
        <DataTableColumnHeader column={column} title={t("people.position")} />
      ),
      cell: ({ row }) => row.original.position ?? "—",
    },
    {
      accessorKey: "username",
      meta: { label: t("people.username") },
      header: ({ column }) => (
        <DataTableColumnHeader column={column} title={t("people.username")} />
      ),
      cell: ({ row }) => row.original.username ?? "—",
    },
    {
      id: "login",
      meta: { label: t("people.login") },
      enableSorting: false,
      header: ({ column }) => (
        <DataTableColumnHeader column={column} title={t("people.login")} />
      ),
      /**
       * Left first, because it outranks the other fact: somebody who has left
       * cannot sign in whatever their account says, and showing "can sign in"
       * beside their name would be showing something that is not true.
       */
      cell: ({ row }) =>
        row.original.archived ? (
          <Badge variant="outline">{t("people.archived")}</Badge>
        ) : row.original.hasLogin ? (
          <Badge variant="secondary">{t("people.hasLogin")}</Badge>
        ) : (
          <Badge variant="outline">{t("people.noLogin")}</Badge>
        ),
    },
  ]
}