"use client"

import { useState } from "react"
import { AdjuntosManager, type Adjunto, type TipoAdjunto } from "@/components/adjuntos-manager"
import { AppLayout } from "@/components/app-layout"

export default function AdjuntosDemoPage() {
  const [adjuntos, setAdjuntos] = useState<Adjunto[]>([
    {
      id: "1",
      tipo: "modelo",
      titulo: "Modelo de Estatuto Social SA.pdf",
      tamanio: 245760,
      fecha: "2024-01-15T10:30:00Z",
      url: "#",
    },
    {
      id: "2",
      tipo: "normativa",
      titulo: "Ley General de Sociedades 19550.pdf",
      tamanio: 1048576,
      fecha: "2024-01-10T14:20:00Z",
      url: "#",
    },
    {
      id: "3",
      tipo: "bibliografia",
      titulo: "Guía práctica de trámites IGJ.docx",
      tamanio: 512000,
      fecha: "2024-01-08T09:15:00Z",
      url: "#",
    },
    {
      id: "4",
      tipo: "jurisprudencia",
      titulo: "Fallo CSJN - Sociedades Comerciales.pdf",
      tamanio: 327680,
      fecha: "2024-01-05T16:45:00Z",
      url: "#",
    },
    {
      id: "5",
      tipo: "interno",
      titulo: "Checklist interno de documentación.xlsx",
      tamanio: 81920,
      fecha: "2024-01-20T11:00:00Z",
      url: "#",
    },
  ])

  const handleUpload = (tipo: TipoAdjunto, titulo: string, archivo: File) => {
    const nuevoAdjunto: Adjunto = {
      id: Date.now().toString(),
      tipo,
      titulo,
      archivo,
      tamanio: archivo.size,
      fecha: new Date().toISOString(),
    }
    setAdjuntos([...adjuntos, nuevoAdjunto])
    console.log("[v0] Archivo subido:", { tipo, titulo, tamanio: archivo.size })
  }

  const handleDelete = (id: string) => {
    setAdjuntos(adjuntos.filter((a) => a.id !== id))
    console.log("[v0] Archivo eliminado:", id)
  }

  const handleRename = (id: string, nuevoTitulo: string) => {
    setAdjuntos(adjuntos.map((a) => (a.id === id ? { ...a, titulo: nuevoTitulo } : a)))
    console.log("[v0] Archivo renombrado:", { id, nuevoTitulo })
  }

  const handleFilterByTipo = (tipo: TipoAdjunto | "todos") => {
    console.log("[v0] Filtrar por tipo:", tipo)
  }

  return (
    <AppLayout userRole="edicion">
      <div className="p-6 lg:p-8">
        <div className="mx-auto max-w-6xl space-y-6">
          {/* Header */}
          <div>
            <h1 className="text-3xl font-semibold tracking-tight text-foreground">Gestión de Adjuntos</h1>
            <p className="text-sm text-muted-foreground mt-1">
              Componente completo para subir, organizar y gestionar archivos adjuntos
            </p>
          </div>

          {/* Componente de Adjuntos */}
          <AdjuntosManager
            adjuntos={adjuntos}
            onUpload={handleUpload}
            onDelete={handleDelete}
            onRename={handleRename}
            onFilterByTipo={handleFilterByTipo}
          />
        </div>
      </div>
    </AppLayout>
  )
}