import { useCallback, useEffect, useMemo, useRef, useState } from "react";
import { Search } from "lucide-react";
import {
  AdminPageLayout,
  adminErrorMessage,
  Button,
  DataGrid,
  Dialog,
  formatAdminDateTime as formatDateTime,
  mergeDeltaRows,
  TableActionGroup,
  useDeltaWatermarks,
  type ApiSettings,
  type AuthInfo,
  type DataGridColumn,
  type DataGridQueryState
} from "@govoplan/core-webui";
import { fetchAdminAudit, fetchAdminAuditDelta, type AuditAdminItem, type AuditSortBy } from "../../api/audit";

type Props = {
  settings: ApiSettings;
  auth: AuthInfo;
  systemMode?: boolean;
};

const DEFAULT_QUERY: DataGridQueryState = {
  sort: { columnId: "time", direction: "desc" },
  filters: {}
};

export default function AdminAuditPanel({ settings, auth, systemMode = false }: Props) {
  const [items, setItems] = useState<AuditAdminItem[]>([]);
  const itemsRef = useRef<AuditAdminItem[]>([]);
  const pageItemsRef = useRef<Record<string, AuditAdminItem[]>>({});
  const pageCursorsRef = useRef<Record<number, string | null>>({ 1: null });
  const { getDeltaWatermark, setDeltaWatermark, resetDeltaWatermark } = useDeltaWatermarks();
  const [total, setTotal] = useState(0);
  const [page, setPage] = useState(1);
  const [pageSize, setPageSize] = useState(10);
  const [query, setQuery] = useState<DataGridQueryState>(DEFAULT_QUERY);
  const [selected, setSelected] = useState<AuditAdminItem | null>(null);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState("");
  const [reloadToken, setReloadToken] = useState(0);
  const tenantId = (auth.active_tenant ?? auth.tenant).id;

  const load = useCallback(async () => {
    setLoading(true);
    setError("");
    try {
      const sortColumn = query.sort?.columnId;
      const sortBy = sortColumn && ["time", "actor", "action", "object", "tenant"].includes(sortColumn)
        ? sortColumn as AuditSortBy
        : "time";
      const sortDirection = query.sort?.direction ?? "desc";
      const filters = query.filters;
      const pageCursor = page === 1 ? null : pageCursorsRef.current[page];
      const deltaMode = page === 1 || pageCursor !== undefined;
      const requestOptions = {
        scope: systemMode ? "system" as const : "tenant" as const,
        page,
        pageSize,
        cursor: pageCursor,
        sortBy,
        sortDirection,
        filters
      };
      const deltaKey = `audit:${systemMode ? "system" : "tenant"}:${tenantId}:${pageSize}:${page}:${pageCursor ?? "root"}:${JSON.stringify({ sortBy, sortDirection, filters })}`;
      const response = deltaMode
        ? await fetchAdminAuditDelta(settings, { ...requestOptions, since: getDeltaWatermark(deltaKey) })
        : await fetchAdminAudit(settings, requestOptions);
      const baseItems = pageItemsRef.current[deltaKey] ?? [];
      const nextItems = "full" in response && !response.full
        ? mergeDeltaRows(baseItems, response.items, response.deleted, (item) => item.id, { sort: compareAuditEvents(sortBy, sortDirection) }).slice(0, pageSize)
        : response.items;
      pageItemsRef.current[deltaKey] = nextItems;
      itemsRef.current = nextItems;
      setItems(nextItems);
      setTotal(response.total);
      if (!deltaMode && response.page !== page) setPage(response.page);
      if (response.cursor !== undefined) pageCursorsRef.current[page] = response.cursor ?? null;
      if (response.next_cursor !== undefined) {
        if (response.next_cursor) pageCursorsRef.current[page + 1] = response.next_cursor;
        else delete pageCursorsRef.current[page + 1];
      }
      if ("full" in response && !response.full && page === 1 && (response.items.length > 0 || response.deleted.length > 0)) {
        pageCursorsRef.current = { 1: null };
      }
      if ("watermark" in response) setDeltaWatermark(deltaKey, response.watermark);
      if (!deltaMode) resetDeltaWatermark(deltaKey);
    } catch (err) {
      setError(adminErrorMessage(err));
    } finally {
      setLoading(false);
    }
  }, [settings.accessToken, settings.apiBaseUrl, settings.apiKey, systemMode, tenantId, page, pageSize, query, reloadToken, getDeltaWatermark, setDeltaWatermark, resetDeltaWatermark]);

  useEffect(() => {
    itemsRef.current = [];
    pageItemsRef.current = {};
    pageCursorsRef.current = { 1: null };
    resetDeltaWatermark();
  }, [settings.accessToken, settings.apiBaseUrl, settings.apiKey, systemMode, tenantId, pageSize, query, resetDeltaWatermark]);

  useEffect(() => { void load(); }, [load]);

  const handleQueryChange = useCallback((next: DataGridQueryState) => {
    setQuery((current) => {
      if (JSON.stringify(current) === JSON.stringify(next)) return current;
      setPage(1);
      return next;
    });
  }, []);

  const columns = useMemo<DataGridColumn<AuditAdminItem>[]>(() => [
    { id: "time", header: "Time", width: 190, minWidth: 150, maxWidth: 260, resizable: true, sticky: "start", sortable: true, filterable: true, filterType: "date", value: (row) => row.created_at, render: (row) => formatDateTime(row.created_at) },
    { id: "actor", header: "Actor", width: 220, minWidth: 170, maxWidth: 360, resizable: true, sortable: true, filterable: true, value: (row) => row.actor_email || "System" },
    { id: "action", header: "Action", width: 250, minWidth: 170, maxWidth: 420, resizable: true, sortable: true, filterable: true, value: (row) => row.action },
    { id: "object", header: "Object", width: 300, minWidth: 180, maxWidth: 640, resizable: true, fill: true, sortable: true, filterable: true, value: (row) => `${row.object_type || "-"} ${row.object_id || ""}`.trim() },
    ...(systemMode ? [{ id: "tenant", header: "Tenant context", width: 190, minWidth: 150, maxWidth: 300, resizable: true, sortable: true, filterable: true, value: (row: AuditAdminItem) => row.tenant_id || "-" }] : []),
    { id: "actions", header: "Actions", width: 70, sticky: "end", resizable: false, align: "right", render: (row) => <TableActionGroup actions={[{ id: "inspect", label: "Inspect audit event", icon: <Search />, onClick: () => setSelected(row) }]} /> }
  ], [systemMode]);

  const firstShown = total === 0 ? 0 : (page - 1) * pageSize + 1;
  const lastShown = Math.min(total, page * pageSize);
  const pageDescription = systemMode
    ? `System-level administrative history, showing ${firstShown}-${lastShown} of ${total}.`
    : `Tenant-level administrative history for the active tenant, showing ${firstShown}-${lastShown} of ${total}.`;

  return (
    <>
      <AdminPageLayout
        title={systemMode ? "System audit" : "Tenant audit"}
        description={pageDescription}
        loading={loading}
        error={error}
        actions={<Button onClick={() => setReloadToken((value) => value + 1)} disabled={loading}>Reload</Button>}>
        <div className="admin-table-surface">
          <DataGrid
            id={systemMode ? "admin-system-audit-v6" : "admin-tenant-audit-v6"}
            rows={items}
            columns={columns}
            initialFit="container"
            getRowKey={(row) => row.id}
            emptyText="No administrative audit records found."
            className="admin-audit-grid"
            initialSort={{ columnId: "time", direction: "desc" }}
            pagination={{
              mode: "server",
              page,
              pageSize,
              totalRows: total,
              pageSizeOptions: [10, 25, 50, 100, 250],
              disabled: loading,
              onPageChange: setPage,
              onPageSizeChange: (next) => { setPageSize(next); setPage(1); }
            }}
            onQueryChange={handleQueryChange}
          />
        </div>
      </AdminPageLayout>
      <Dialog open={Boolean(selected)} title="Audit event details" onClose={() => setSelected(null)} className="admin-dialog admin-dialog-wide" footer={<Button onClick={() => setSelected(null)}>Close</Button>}>
        {selected && (
          <>
            <dl className="admin-details-grid">
              <div><dt>Scope</dt><dd>{selected.scope}</dd></div>
              <div><dt>Action</dt><dd>{selected.action}</dd></div>
              <div><dt>Actor</dt><dd>{selected.actor_email || "System"}</dd></div>
              <div><dt>Object</dt><dd>{selected.object_type || "-"} {selected.object_id || ""}</dd></div>
              <div><dt>Tenant context</dt><dd>{selected.tenant_id || "-"}</dd></div>
              <div><dt>Time</dt><dd>{formatDateTime(selected.created_at)}</dd></div>
            </dl>
            <pre className="admin-json-preview">{JSON.stringify(selected.details, null, 2)}</pre>
          </>
        )}
      </Dialog>
    </>
  );
}

function compareAuditEvents(sortBy: AuditSortBy, sortDirection: "asc" | "desc"): (left: AuditAdminItem, right: AuditAdminItem) => number {
  return (left, right) => {
    const primary = compareAuditValues(auditSortValue(left, sortBy), auditSortValue(right, sortBy));
    const directed = sortDirection === "asc" ? primary : -primary;
    return directed || right.id.localeCompare(left.id);
  };
}

function auditSortValue(item: AuditAdminItem, sortBy: AuditSortBy): string | number {
  if (sortBy === "time") return new Date(item.created_at).getTime();
  if (sortBy === "actor") return item.actor_email || "System";
  if (sortBy === "action") return item.action;
  if (sortBy === "object") return `${item.object_type || ""} ${item.object_id || ""}`;
  return item.tenant_id || "";
}

function compareAuditValues(left: string | number, right: string | number): number {
  if (typeof left === "number" && typeof right === "number") return left - right;
  return String(left).localeCompare(String(right));
}
