"use client";

import React, { useState } from "react";
import {
  useReactTable,
  getCoreRowModel,
  getExpandedRowModel,
  flexRender,
  ExpandedState,
} from "@tanstack/react-table";
import {
  Table,
  TableBody,
  TableCell,
  TableHead,
  TableHeader,
  TableRow,
} from "@/components/ui/table";
import { Button } from "@/components/ui/button";
import { swpDocumentColumns, type RevisionRow, type FileRow } from "./swp-table-columns";
import { fetchDocumentRevisions, fetchRevisionFiles, type SwpDocumentWithStats } from "../actions";
import { SwpRevisionListDialog } from "./swp-revision-list-dialog";

interface SwpTableProps {
  initialData: SwpDocumentWithStats[];
  total: number;
  page: number;
  pageSize: number;
  totalPages: number;
  onPageChange: (page: number) => void;
}

export function SwpTable({
  initialData,
  total,
  page,
  pageSize,
  totalPages,
  onPageChange,
}: SwpTableProps) {
  const [expanded, setExpanded] = useState<ExpandedState>({});
  const [revisionData, setRevisionData] = useState<Record<string, RevisionRow[]>>({});
  const [fileData, setFileData] = useState<Record<number, FileRow[]>>({});
  const [loadingRevisions, setLoadingRevisions] = useState<Set<string>>(new Set());
  const [loadingFiles, setLoadingFiles] = useState<Set<number>>(new Set());
  const [dialogOpen, setDialogOpen] = useState(false);
  const [selectedDocument, setSelectedDocument] = useState<SwpDocumentWithStats | null>(null);

  const table = useReactTable({
    data: initialData,
    columns: swpDocumentColumns,
    state: {
      expanded,
    },
    onExpandedChange: setExpanded,
    getCoreRowModel: getCoreRowModel(),
    getExpandedRowModel: getExpandedRowModel(),
    getRowCanExpand: () => true, // 모든 문서는 확장 가능
  });

  // 리비전 로드
  const loadRevisions = async (docNo: string) => {
    if (revisionData[docNo]) return; // 이미 로드됨
    
    setLoadingRevisions((prev) => {
      const newSet = new Set(prev);
      newSet.add(docNo);
      return newSet;
    });
    
    try {
      const revisions = await fetchDocumentRevisions(docNo);
      setRevisionData((prev) => ({ ...prev, [docNo]: revisions }));
    } catch (error) {
      console.error("리비전 로드 실패:", error);
    } finally {
      setLoadingRevisions((prev) => {
        const next = new Set(prev);
        next.delete(docNo);
        return next;
      });
    }
  };

  // 파일 로드
  const loadFiles = async (revisionId: number) => {
    if (fileData[revisionId]) return; // 이미 로드됨
    
    setLoadingFiles((prev) => {
      const newSet = new Set(prev);
      newSet.add(revisionId);
      return newSet;
    });
    
    try {
      const files = await fetchRevisionFiles(revisionId);
      setFileData((prev) => ({ ...prev, [revisionId]: files }));
    } catch (error) {
      console.error("파일 로드 실패:", error);
    } finally {
      setLoadingFiles((prev) => {
        const next = new Set(prev);
        next.delete(revisionId);
        return next;
      });
    }
  };

  // 문서 클릭 핸들러 - Dialog 열기
  const handleDocumentClick = async (document: SwpDocumentWithStats) => {
    setSelectedDocument(document);
    setDialogOpen(true);
    
    // 리비전 데이터 로드
    if (!revisionData[document.DOC_NO]) {
      await loadRevisions(document.DOC_NO);
    }
  };

  // 모든 리비전의 파일을 로드
  const loadAllFiles = async (docNo: string) => {
    const revisions = revisionData[docNo];
    if (!revisions) return;

    for (const revision of revisions) {
      if (!fileData[revision.id]) {
        await loadFiles(revision.id);
      }
    }
  };

  return (
    <div className="space-y-4">
      {/* 테이블 */}
      <div className="rounded-md border">
        <Table>
          <TableHeader>
            {table.getHeaderGroups().map((headerGroup) => (
              <TableRow key={headerGroup.id}>
                {headerGroup.headers.map((header) => (
                  <TableHead key={header.id}>
                    {header.isPlaceholder
                      ? null
                      : flexRender(
                          header.column.columnDef.header,
                          header.getContext()
                        )}
                  </TableHead>
                ))}
              </TableRow>
            ))}
          </TableHeader>
          <TableBody>
            {table.getRowModel().rows?.length ? (
              table.getRowModel().rows.map((row) => (
                <React.Fragment key={row.id}>
                  {/* 문서 행 */}
                  <TableRow
                    data-state={row.getIsSelected() && "selected"}
                    className="hover:bg-muted/50"
                  >
                    {row.getVisibleCells().map((cell) => (
                      <TableCell key={cell.id}>
                        {cell.column.id === "expander" ? (
                          <div
                            onClick={() => handleDocumentClick(row.original)}
                            className="cursor-pointer"
                          >
                            {flexRender(
                              cell.column.columnDef.cell,
                              cell.getContext()
                            )}
                          </div>
                        ) : (
                          flexRender(cell.column.columnDef.cell, cell.getContext())
                        )}
                      </TableCell>
                    ))}
                  </TableRow>
                </React.Fragment>
              ))
            ) : (
              <TableRow>
                <TableCell colSpan={swpDocumentColumns.length} className="h-24 text-center">
                  데이터 없음
                </TableCell>
              </TableRow>
            )}
          </TableBody>
        </Table>
      </div>

      {/* 페이지네이션 */}
      <div className="flex items-center justify-between">
        <div className="text-sm text-muted-foreground">
          총 {total}개 중 {(page - 1) * pageSize + 1}-
          {Math.min(page * pageSize, total)}개 표시
        </div>
        <div className="flex items-center space-x-2">
          <Button
            variant="outline"
            size="sm"
            onClick={() => onPageChange(page - 1)}
            disabled={page === 1}
          >
            이전
          </Button>
          <div className="text-sm">
            {page} / {totalPages}
          </div>
          <Button
            variant="outline"
            size="sm"
            onClick={() => onPageChange(page + 1)}
            disabled={page === totalPages}
          >
            다음
          </Button>
        </div>
      </div>

      {/* 문서 상세 Dialog */}
      <SwpRevisionListDialog
        open={dialogOpen}
        onOpenChange={setDialogOpen}
        document={selectedDocument}
        revisions={selectedDocument ? revisionData[selectedDocument.DOC_NO] || [] : []}
        fileData={fileData}
        loadingRevisions={selectedDocument ? loadingRevisions.has(selectedDocument.DOC_NO) : false}
        loadingFiles={loadingFiles}
        onLoadFiles={loadFiles}
        onLoadAllFiles={() => selectedDocument && loadAllFiles(selectedDocument.DOC_NO)}
      />
    </div>
  );
}