"use client";

import {
  ArrowDown,
  ArrowUp,
  ArrowUpDown,
  Ban,
  ChevronLeft,
  ChevronRight,
  KeyRound,
  MoreHorizontal,
  Pencil,
  Plus,
  Search,
  ShieldCheck,
  ShieldOff,
  Trash2,
  UserCheck,
} from "lucide-react";
import { createContext, use, useState } from "react";
import { toast } from "sonner";
import {
  columnFilteringFeature,
  createColumnHelper,
  createFilteredRowModel,
  createPaginatedRowModel,
  createSortedRowModel,
  globalFilteringFeature,
  rowPaginationFeature,
  rowSortingFeature,
  tableFeatures,
  useTable,
  type SortFn,
} from "@tanstack/react-table";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuLabel,
  DropdownMenuSeparator,
  DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
import { InputGroup, InputGroupAddon, InputGroupInput } from "@/components/ui/input-group";
import {
  Select,
  SelectContent,
  SelectItem,
  SelectTrigger,
  SelectValue,
} from "@/components/ui/select";
import {
  Table,
  TableBody,
  TableCell,
  TableHead,
  TableHeader,
  TableRow,
} from "@/components/ui/table";
import { tr } from "@/i18n/tr";
import { fail, type ActionResult } from "@/lib/action-result";
import { cn } from "@/lib/utils";
import { formatDate } from "@/shared/format";
import type { SystemRole } from "@/shared/schemas/common";
import type { UserCreate, UserUpdate } from "@/shared/schemas/user";
import { compareTr, includesTr } from "@/shared/search";
import {
  banUserAction,
  createUserAction,
  removeUserAction,
  setPasswordAction,
  setRoleAction,
  unbanUserAction,
  updateUserAction,
} from "../actions";
import { checkAdminAction, type AdminAction, type GuardViolation } from "../guards";
import type { AdminUser } from "../types";
import { BanUserDialog, DeleteUserDialog, SetPasswordDialog } from "./user-action-dialogs";
import { UserFormDialog } from "./user-form-dialog";

const t = tr.adminUsers;

// --- Tablo yapılandırması (modül seviyesinde sabit: v9 kararlı girdi ister) ---

const features = tableFeatures({
  rowSortingFeature,
  sortedRowModel: createSortedRowModel(),
  columnFilteringFeature,
  globalFilteringFeature,
  filteredRowModel: createFilteredRowModel(),
  rowPaginationFeature,
  paginatedRowModel: createPaginatedRowModel(),
});

const byTr: SortFn<typeof features, AdminUser> = (a, b, id) =>
  compareTr(String(a.getValue(id) ?? ""), String(b.getValue(id) ?? ""));

const helper = createColumnHelper<typeof features, AdminUser>();

/** Mobilde gizlenen sütunlar. */
const COLUMN_CLASS: Partial<Record<string, string>> = {
  username: "hidden sm:table-cell",
  email: "hidden lg:table-cell",
  createdAt: "hidden md:table-cell",
  actions: "w-12 text-right",
};

const PAGE_SIZES = [10, 20, 50] as const;

type DialogState =
  { kind: "create" } | { kind: "edit" | "password" | "ban" | "delete"; user: AdminUser } | null;

function SortableHeader({
  label,
  sorted,
  onToggle,
}: {
  label: string;
  sorted: false | "asc" | "desc";
  onToggle: ((event: unknown) => void) | undefined;
}) {
  const Icon = sorted === "asc" ? ArrowUp : sorted === "desc" ? ArrowDown : ArrowUpDown;
  return (
    <Button
      variant="ghost"
      size="sm"
      className="-ml-2.5"
      onClick={onToggle}
      aria-label={`${label} — sırala`}
    >
      {label}
      <Icon className={cn("size-3.5", !sorted && "opacity-40")} />
    </Button>
  );
}

type RowActionsApi = {
  currentUserId: string;
  guard: (action: AdminAction, target: AdminUser) => GuardViolation | null;
  guardMessage: (v: GuardViolation) => string;
  setDialog: (d: DialogState) => void;
  setRole: (user: AdminUser, role: SystemRole) => void;
  unbanUser: (user: AdminUser) => void;
};

/** Satır aksiyonları güncel durumu context'ten okur; sütunlar modül seviyesinde sabit kalır. */
const RowActionsContext = createContext<RowActionsApi | null>(null);

function useRowActions() {
  const ctx = use(RowActionsContext);
  if (!ctx) throw new Error("RowActionsContext eksik");
  return ctx;
}

function NameCell({ user }: { user: AdminUser }) {
  const { currentUserId } = useRowActions();
  return (
    <div className="flex min-w-0 flex-col">
      <span className="truncate font-medium">
        {user.name}
        {user.id === currentUserId ? (
          <span className="ml-1.5 text-xs font-normal text-muted-foreground">({t.you})</span>
        ) : null}
      </span>
      <span className="truncate text-xs text-muted-foreground sm:hidden">@{user.username}</span>
    </div>
  );
}

function RowActions({ user }: { user: AdminUser }) {
  const { guard, guardMessage, setDialog, setRole, unbanUser } = useRowActions();
  const del = guard({ type: "delete" }, user);
  const ban = guard({ type: "ban" }, user);
  const toggleRole: SystemRole = user.role === "admin" ? "user" : "admin";
  const role = guard({ type: "setRole", role: toggleRole }, user);
  const blocked = del ?? role;
  return (
    // modal={false}: menüden açılan Dialog kapandıktan sonra sayfanın kilitli kalmasını önler.
    <DropdownMenu modal={false}>
      <DropdownMenuTrigger asChild>
        <Button variant="ghost" size="icon-sm" aria-label={`${user.name} — ${tr.common.actions}`}>
          <MoreHorizontal />
        </Button>
      </DropdownMenuTrigger>
      <DropdownMenuContent align="end" className="w-56">
        <DropdownMenuLabel className="truncate">{user.name}</DropdownMenuLabel>
        <DropdownMenuItem onSelect={() => setDialog({ kind: "edit", user })}>
          <Pencil />
          {t.actions.edit}
        </DropdownMenuItem>
        <DropdownMenuItem disabled={Boolean(role)} onSelect={() => setRole(user, toggleRole)}>
          {toggleRole === "admin" ? <ShieldCheck /> : <ShieldOff />}
          {toggleRole === "admin" ? t.actions.makeAdmin : t.actions.makeUser}
        </DropdownMenuItem>
        <DropdownMenuItem onSelect={() => setDialog({ kind: "password", user })}>
          <KeyRound />
          {t.actions.resetPassword}
        </DropdownMenuItem>
        {user.banned ? (
          <DropdownMenuItem onSelect={() => unbanUser(user)}>
            <UserCheck />
            {t.actions.unban}
          </DropdownMenuItem>
        ) : (
          <DropdownMenuItem
            disabled={Boolean(ban)}
            onSelect={() => setDialog({ kind: "ban", user })}
          >
            <Ban />
            {t.actions.ban}
          </DropdownMenuItem>
        )}
        <DropdownMenuSeparator />
        <DropdownMenuItem
          variant="destructive"
          disabled={Boolean(del)}
          onSelect={() => setDialog({ kind: "delete", user })}
        >
          <Trash2 />
          {t.actions.delete}
        </DropdownMenuItem>
        {blocked ? (
          <p className="px-2 py-1.5 text-xs text-muted-foreground">{guardMessage(blocked)}</p>
        ) : null}
      </DropdownMenuContent>
    </DropdownMenu>
  );
}

const columns = helper.columns([
  helper.accessor("name", {
    header: ({ column }) => (
      <SortableHeader
        label={t.columns.name}
        sorted={column.getIsSorted()}
        onToggle={column.getToggleSortingHandler()}
      />
    ),
    sortFn: byTr,
    cell: ({ row }) => <NameCell user={row.original} />,
  }),
  helper.accessor("username", {
    header: ({ column }) => (
      <SortableHeader
        label={t.columns.username}
        sorted={column.getIsSorted()}
        onToggle={column.getToggleSortingHandler()}
      />
    ),
    sortFn: byTr,
    cell: ({ getValue }) => <span className="text-muted-foreground">@{getValue()}</span>,
  }),
  helper.accessor((u) => u.email ?? "", {
    id: "email",
    header: ({ column }) => (
      <SortableHeader
        label={t.columns.email}
        sorted={column.getIsSorted()}
        onToggle={column.getToggleSortingHandler()}
      />
    ),
    sortFn: byTr,
    cell: ({ getValue }) =>
      getValue() || <span className="text-muted-foreground">{t.noEmail}</span>,
  }),
  helper.accessor("role", {
    header: ({ column }) => (
      <SortableHeader
        label={t.columns.role}
        sorted={column.getIsSorted()}
        onToggle={column.getToggleSortingHandler()}
      />
    ),
    cell: ({ getValue }) => (
      <Badge variant={getValue() === "admin" ? "default" : "secondary"}>
        {tr.roles[getValue()]}
      </Badge>
    ),
  }),
  helper.accessor("banned", {
    header: ({ column }) => (
      <SortableHeader
        label={t.columns.status}
        sorted={column.getIsSorted()}
        onToggle={column.getToggleSortingHandler()}
      />
    ),
    cell: ({ row }) =>
      row.original.banned ? (
        <Badge variant="destructive" title={row.original.banReason}>
          {t.status.banned}
        </Badge>
      ) : (
        <Badge variant="outline" className="border-income/30 text-income">
          {t.status.active}
        </Badge>
      ),
  }),
  helper.accessor("createdAt", {
    header: ({ column }) => (
      <SortableHeader
        label={t.columns.createdAt}
        sorted={column.getIsSorted()}
        onToggle={column.getToggleSortingHandler()}
      />
    ),
    cell: ({ getValue }) => <span className="tabular-nums">{formatDate(getValue())}</span>,
  }),
  helper.display({
    id: "actions",
    header: () => <span className="sr-only">{tr.common.actions}</span>,
    cell: ({ row }) => <RowActions user={row.original} />,
  }),
]);

export function UsersTable({
  users,
  currentUserId,
}: {
  users: AdminUser[];
  currentUserId: string;
}) {
  const [dialog, setDialog] = useState<DialogState>(null);
  // Arayüzdeki kural kontrolü yalnızca erken geri bildirim içindir; asıl kontrol sunucuda.
  const adminCount = users.filter((u) => u.role === "admin").length;

  const guard = (action: AdminAction, target: AdminUser): GuardViolation | null =>
    checkAdminAction(action, { actorId: currentUserId, target, adminCount });

  const guardMessage = (v: GuardViolation) => (v === "self" ? t.guards.self : t.guards.lastAdmin);

  /** Server Action'ı çağırır; başarıda bildirim gösterir. Sayfa revalidatePath ile tazelenir. */
  async function run(promise: Promise<ActionResult>, success: string): Promise<ActionResult> {
    try {
      const result = await promise;
      if (result.ok) toast.success(success);
      return result;
    } catch {
      return fail(tr.common.genericError);
    }
  }

  const createUser = (values: UserCreate) =>
    run(createUserAction(values), t.toast.created(values.name));

  const updateUser = (id: string, values: UserUpdate) =>
    run(updateUserAction(id, values), t.toast.updated(values.name));

  async function setRole(user: AdminUser, role: SystemRole) {
    const result = await run(setRoleAction(user.id, role), t.toast.roleChanged(user.name));
    if (!result.ok) toast.error(result.error);
  }

  const setPassword = (user: AdminUser, values: { password: string }) =>
    run(setPasswordAction(user.id, values), t.toast.passwordSet(user.name));

  const banUser = (user: AdminUser, values: { reason?: string }) =>
    run(banUserAction(user.id, values), t.toast.banned(user.name));

  async function unbanUser(user: AdminUser) {
    const result = await run(unbanUserAction(user.id), t.toast.unbanned(user.name));
    if (!result.ok) toast.error(result.error);
  }

  const removeUser = (user: AdminUser) =>
    run(removeUserAction(user.id), t.toast.removed(user.name));

  const table = useTable({
    features,
    columns,
    data: users,
    // Türkçe, büyük/küçük harf ve aksan duyarsız arama (ad, kullanıcı adı, e-posta).
    globalFilterFn: (row, _columnId, filterValue) => {
      const q = String(filterValue ?? "");
      const u = row.original;
      return includesTr(u.name, q) || includesTr(u.username, q) || includesTr(u.email, q);
    },
    getColumnCanGlobalFilter: (column) => column.id !== "actions",
    initialState: {
      sorting: [{ id: "createdAt", desc: true }],
      pagination: { pageIndex: 0, pageSize: 10 },
    },
  });

  const globalFilter = String(table.state.globalFilter ?? "");
  const pageCount = Math.max(table.getPageCount(), 1);
  const filteredCount = table.getFilteredRowModel().rows.length;
  const selected = dialog && dialog.kind !== "create" ? dialog.user : undefined;
  const close = (open: boolean) => !open && setDialog(null);

  const rowActions: RowActionsApi = {
    currentUserId,
    guard,
    guardMessage,
    setDialog,
    setRole,
    unbanUser,
  };

  return (
    <RowActionsContext value={rowActions}>
      <div className="flex flex-col gap-3">
        <div className="flex flex-wrap items-center gap-2">
          <InputGroup className="max-w-sm flex-1">
            <InputGroupAddon>
              <Search />
            </InputGroupAddon>
            <InputGroupInput
              type="search"
              value={globalFilter}
              onChange={(e) => table.setGlobalFilter(e.target.value)}
              placeholder={t.searchPlaceholder}
              aria-label={tr.common.search}
            />
          </InputGroup>
          <Button className="ml-auto" onClick={() => setDialog({ kind: "create" })}>
            <Plus />
            {t.newUser}
          </Button>
        </div>

        <div className="overflow-hidden rounded-xl border bg-card">
          <Table>
            <TableHeader>
              {table.getHeaderGroups().map((group) => (
                <TableRow key={group.id}>
                  {group.headers.map((header) => (
                    <TableHead key={header.id} className={COLUMN_CLASS[header.column.id]}>
                      {header.isPlaceholder ? null : <table.FlexRender header={header} />}
                    </TableHead>
                  ))}
                </TableRow>
              ))}
            </TableHeader>
            <TableBody>
              {table.getRowModel().rows.length ? (
                table.getRowModel().rows.map((row) => (
                  <TableRow key={row.id} className={cn(row.original.banned && "opacity-70")}>
                    {row.getAllCells().map((cell) => (
                      <TableCell key={cell.id} className={COLUMN_CLASS[cell.column.id]}>
                        <table.FlexRender cell={cell} />
                      </TableCell>
                    ))}
                  </TableRow>
                ))
              ) : (
                <TableRow>
                  <TableCell
                    colSpan={columns.length}
                    className="h-24 text-center text-muted-foreground"
                  >
                    {tr.common.noResults}
                  </TableCell>
                </TableRow>
              )}
            </TableBody>
          </Table>
        </div>

        <div className="flex flex-wrap items-center justify-between gap-3 text-sm text-muted-foreground">
          <span>{tr.common.totalRows(filteredCount)}</span>
          <div className="flex items-center gap-2">
            <span className="hidden sm:inline">{tr.common.rowsPerPage}</span>
            <Select
              value={String(table.state.pagination.pageSize)}
              onValueChange={(v) => table.setPageSize(Number(v))}
            >
              <SelectTrigger size="sm" aria-label={tr.common.rowsPerPage} className="w-18">
                <SelectValue>{table.state.pagination.pageSize}</SelectValue>
              </SelectTrigger>
              <SelectContent>
                {PAGE_SIZES.map((n) => (
                  <SelectItem key={n} value={String(n)}>
                    {n}
                  </SelectItem>
                ))}
              </SelectContent>
            </Select>
            <span className="tabular-nums">
              {tr.common.page(table.state.pagination.pageIndex + 1, pageCount)}
            </span>
            <Button
              variant="outline"
              size="icon-sm"
              onClick={() => table.previousPage()}
              disabled={!table.getCanPreviousPage()}
              aria-label={tr.common.previous}
            >
              <ChevronLeft />
            </Button>
            <Button
              variant="outline"
              size="icon-sm"
              onClick={() => table.nextPage()}
              disabled={!table.getCanNextPage()}
              aria-label={tr.common.next}
            >
              <ChevronRight />
            </Button>
          </div>
        </div>

        <UserFormDialog
          open={dialog?.kind === "create" || dialog?.kind === "edit"}
          onOpenChange={close}
          user={dialog?.kind === "edit" ? dialog.user : undefined}
          onCreate={createUser}
          onUpdate={updateUser}
        />
        <SetPasswordDialog
          user={selected}
          open={dialog?.kind === "password"}
          onOpenChange={close}
          onConfirm={setPassword}
        />
        <BanUserDialog
          user={selected}
          open={dialog?.kind === "ban"}
          onOpenChange={close}
          onConfirm={banUser}
        />
        <DeleteUserDialog
          user={selected}
          open={dialog?.kind === "delete"}
          onOpenChange={close}
          onConfirm={removeUser}
        />
      </div>
    </RowActionsContext>
  );
}