710 lines
24 KiB
TypeScript
710 lines
24 KiB
TypeScript
import { useEffect, useState } from "react";
|
|
import { useFileStore } from "@/stores/fileStore";
|
|
import { api } from "@/services/api";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Input } from "@/components/ui/input";
|
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
|
|
import {
|
|
Table,
|
|
TableBody,
|
|
TableCell,
|
|
TableHead,
|
|
TableHeader,
|
|
TableRow,
|
|
} from "@/components/ui/table";
|
|
import { Checkbox } from "@/components/ui/checkbox";
|
|
import { FileUpload } from "./FileUpload";
|
|
import { DeleteConfirmDialog } from "./DeleteConfirmDialog";
|
|
import { PDFPreviewModal } from "./PDFPreviewModal";
|
|
import { ChunkViewerModal } from "./ChunkViewerModal";
|
|
import {
|
|
ChunkingConfigModalLandingAI,
|
|
type LandingAIConfig,
|
|
} from "./ChunkingConfigModalLandingAI";
|
|
import {
|
|
Upload,
|
|
Download,
|
|
Trash2,
|
|
Search,
|
|
FileText,
|
|
Eye,
|
|
MessageSquare,
|
|
Scissors,
|
|
Loader2,
|
|
CheckCircle2,
|
|
AlertCircle,
|
|
} from "lucide-react";
|
|
|
|
interface DashboardProps {
|
|
onProcessingChange?: (isProcessing: boolean) => void;
|
|
}
|
|
|
|
export function Dashboard({ onProcessingChange }: DashboardProps = {}) {
|
|
const {
|
|
selectedTema,
|
|
files,
|
|
setFiles,
|
|
loading,
|
|
setLoading,
|
|
selectedFiles,
|
|
toggleFileSelection,
|
|
selectAllFiles,
|
|
clearSelection,
|
|
} = useFileStore();
|
|
|
|
const [searchTerm, setSearchTerm] = useState("");
|
|
const [uploadDialogOpen, setUploadDialogOpen] = useState(false);
|
|
const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
|
|
const [fileToDelete, setFileToDelete] = useState<string | null>(null);
|
|
const [deleting, setDeleting] = useState(false);
|
|
const [downloading, setDownloading] = useState(false);
|
|
|
|
// Estados para el modal de preview de PDF
|
|
const [previewModalOpen, setPreviewModalOpen] = useState(false);
|
|
const [previewFileUrl, setPreviewFileUrl] = useState<string | null>(null);
|
|
const [previewFileName, setPreviewFileName] = useState("");
|
|
const [previewFileTema, setPreviewFileTema] = useState<string | undefined>(
|
|
undefined,
|
|
);
|
|
const [loadingPreview, setLoadingPreview] = useState(false);
|
|
|
|
// Estados para el modal de chunks
|
|
const [chunkViewerOpen, setChunkViewerOpen] = useState(false);
|
|
const [chunkFileName, setChunkFileName] = useState("");
|
|
const [chunkFileTema, setChunkFileTema] = useState("");
|
|
|
|
// Estados para chunking
|
|
const [chunkingConfigOpen, setChunkingConfigOpen] = useState(false);
|
|
const [chunkingFileName, setChunkingFileName] = useState("");
|
|
const [chunkingFileTema, setChunkingFileTema] = useState("");
|
|
const [chunkingCollectionName, setChunkingCollectionName] = useState("");
|
|
const [processing, setProcessing] = useState(false);
|
|
|
|
// Collection status states
|
|
const [isCheckingCollection, setIsCheckingCollection] = useState(false);
|
|
const [collectionExists, setCollectionExists] = useState<boolean | null>(
|
|
null,
|
|
);
|
|
const [collectionError, setCollectionError] = useState<string | null>(null);
|
|
|
|
useEffect(() => {
|
|
loadFiles();
|
|
}, [selectedTema]);
|
|
|
|
// Check collection status when tema changes
|
|
useEffect(() => {
|
|
checkCollectionStatus();
|
|
}, [selectedTema]);
|
|
|
|
const checkCollectionStatus = async () => {
|
|
if (!selectedTema) {
|
|
setCollectionExists(null);
|
|
return;
|
|
}
|
|
|
|
setIsCheckingCollection(true);
|
|
setCollectionError(null);
|
|
|
|
try {
|
|
const result = await api.checkCollectionExists(selectedTema);
|
|
setCollectionExists(result.exists);
|
|
} catch (err) {
|
|
console.error("Error checking collection:", err);
|
|
setCollectionError(
|
|
err instanceof Error ? err.message : "Error al verificar colección",
|
|
);
|
|
setCollectionExists(null);
|
|
} finally {
|
|
setIsCheckingCollection(false);
|
|
}
|
|
};
|
|
|
|
const handleCreateCollection = async () => {
|
|
if (!selectedTema) return;
|
|
|
|
setIsCheckingCollection(true);
|
|
setCollectionError(null);
|
|
|
|
try {
|
|
const result = await api.createCollection(selectedTema);
|
|
if (result.success) {
|
|
setCollectionExists(true);
|
|
console.log(`Collection "${selectedTema}" created successfully`);
|
|
}
|
|
} catch (err) {
|
|
console.error("Error creating collection:", err);
|
|
setCollectionError(
|
|
err instanceof Error ? err.message : "Error al crear colección",
|
|
);
|
|
} finally {
|
|
setIsCheckingCollection(false);
|
|
}
|
|
};
|
|
|
|
const loadFiles = async () => {
|
|
// Don't load files if no dataroom is selected
|
|
if (!selectedTema) {
|
|
setFiles([]);
|
|
return;
|
|
}
|
|
|
|
try {
|
|
setLoading(true);
|
|
const response = await api.getFiles(selectedTema);
|
|
setFiles(response.files);
|
|
} catch (error) {
|
|
console.error("Error loading files:", error);
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
};
|
|
|
|
const handleUploadSuccess = () => {
|
|
loadFiles();
|
|
};
|
|
|
|
// Eliminar archivo individual
|
|
const handleDeleteSingle = async (filename: string) => {
|
|
setFileToDelete(filename);
|
|
setDeleteDialogOpen(true);
|
|
};
|
|
|
|
// Eliminar archivos seleccionados
|
|
const handleDeleteMultiple = () => {
|
|
if (selectedFiles.size === 0) return;
|
|
setFileToDelete(null);
|
|
setDeleteDialogOpen(true);
|
|
};
|
|
|
|
// Confirmar eliminación
|
|
const confirmDelete = async () => {
|
|
if (!fileToDelete && selectedFiles.size === 0) return;
|
|
|
|
setDeleting(true);
|
|
try {
|
|
if (fileToDelete) {
|
|
// Eliminar archivo individual
|
|
await api.deleteFile(fileToDelete, selectedTema || undefined);
|
|
} else {
|
|
// Eliminar archivos seleccionados
|
|
const filesToDelete = Array.from(selectedFiles);
|
|
await api.deleteFiles(filesToDelete, selectedTema || undefined);
|
|
clearSelection();
|
|
}
|
|
|
|
// Recargar archivos
|
|
await loadFiles();
|
|
setDeleteDialogOpen(false);
|
|
setFileToDelete(null);
|
|
} catch (error) {
|
|
console.error("Error deleting files:", error);
|
|
} finally {
|
|
setDeleting(false);
|
|
}
|
|
};
|
|
|
|
// Descargar archivo individual
|
|
const handleDownloadSingle = async (filename: string) => {
|
|
try {
|
|
setDownloading(true);
|
|
await api.downloadFile(filename, selectedTema || undefined);
|
|
} catch (error) {
|
|
console.error("Error downloading file:", error);
|
|
} finally {
|
|
setDownloading(false);
|
|
}
|
|
};
|
|
|
|
// Descargar archivos seleccionados
|
|
const handleDownloadMultiple = async () => {
|
|
if (selectedFiles.size === 0) return;
|
|
|
|
try {
|
|
setDownloading(true);
|
|
const filesToDownload = Array.from(selectedFiles);
|
|
const zipName = selectedTema
|
|
? `${selectedTema}_archivos`
|
|
: "archivos_seleccionados";
|
|
await api.downloadMultipleFiles(
|
|
filesToDownload,
|
|
selectedTema || undefined,
|
|
zipName,
|
|
);
|
|
} catch (error) {
|
|
console.error("Error downloading files:", error);
|
|
} finally {
|
|
setDownloading(false);
|
|
}
|
|
};
|
|
|
|
// Abrir preview de PDF
|
|
const handlePreviewFile = async (filename: string, tema?: string) => {
|
|
// Solo permitir preview de archivos PDF
|
|
if (!filename.toLowerCase().endsWith(".pdf")) {
|
|
console.log("Solo se pueden previsualizar archivos PDF");
|
|
return;
|
|
}
|
|
|
|
try {
|
|
setLoadingPreview(true);
|
|
setPreviewFileName(filename);
|
|
setPreviewFileTema(tema);
|
|
|
|
// Obtener la URL temporal (SAS) para el archivo
|
|
const url = await api.getPreviewUrl(filename, tema);
|
|
|
|
setPreviewFileUrl(url);
|
|
setPreviewModalOpen(true);
|
|
} catch (error) {
|
|
console.error("Error obteniendo URL de preview:", error);
|
|
alert("Error al cargar la vista previa del archivo");
|
|
} finally {
|
|
setLoadingPreview(false);
|
|
}
|
|
};
|
|
|
|
// Manejar descarga desde el modal de preview
|
|
const handleDownloadFromPreview = async () => {
|
|
if (previewFileName) {
|
|
await handleDownloadSingle(previewFileName);
|
|
}
|
|
};
|
|
|
|
// Abrir modal de chunks
|
|
const handleViewChunks = (filename: string, tema: string) => {
|
|
if (!tema) {
|
|
alert("No hay tema seleccionado. Por favor selecciona un tema primero.");
|
|
return;
|
|
}
|
|
setChunkFileName(filename);
|
|
setChunkFileTema(tema);
|
|
setChunkViewerOpen(true);
|
|
};
|
|
|
|
// Handlers para chunking
|
|
const handleStartChunking = (filename: string, tema: string) => {
|
|
if (!tema) {
|
|
alert("No hay tema seleccionado. Por favor selecciona un tema primero.");
|
|
return;
|
|
}
|
|
setChunkingFileName(filename);
|
|
setChunkingFileTema(tema);
|
|
setChunkingCollectionName(tema); // Usar el tema como nombre de colección
|
|
setChunkingConfigOpen(true);
|
|
};
|
|
|
|
const handleProcessWithLandingAI = async (config: LandingAIConfig) => {
|
|
setProcessing(true);
|
|
onProcessingChange?.(true);
|
|
setChunkingConfigOpen(false);
|
|
|
|
try {
|
|
const result = await api.processWithLandingAI(config);
|
|
|
|
// Mensaje detallado
|
|
let message = `Completado\n\n`;
|
|
message += `• Modo: ${result.mode === "quick" ? "Rápido" : "Con Extracción"}\n`;
|
|
message += `• Chunks procesados: ${result.total_chunks}\n`;
|
|
message += `• Chunks agregados: ${result.chunks_added}\n`;
|
|
message += `• Colección: ${result.collection_name}\n`;
|
|
message += `• Tiempo: ${result.processing_time_seconds}s\n`;
|
|
|
|
if (result.schema_used) {
|
|
message += `• Schema usado: ${result.schema_used}\n`;
|
|
}
|
|
|
|
if (result.extracted_data) {
|
|
message += `\nDatos extraídos disponibles en metadata`;
|
|
}
|
|
|
|
alert(message);
|
|
|
|
// Recargar archivos
|
|
loadFiles();
|
|
} catch (error: any) {
|
|
console.error("Error processing with LandingAI:", error);
|
|
alert(`❌ Error: ${error.message}`);
|
|
} finally {
|
|
setProcessing(false);
|
|
onProcessingChange?.(false);
|
|
}
|
|
};
|
|
|
|
const filteredFiles = files.filter((file) =>
|
|
file.name.toLowerCase().includes(searchTerm.toLowerCase()),
|
|
);
|
|
const totalFiles = files.length;
|
|
|
|
const formatFileSize = (bytes: number) => {
|
|
if (bytes === 0) return "0 Bytes";
|
|
const k = 1024;
|
|
const sizes = ["Bytes", "KB", "MB", "GB"];
|
|
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
|
return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + " " + sizes[i];
|
|
};
|
|
|
|
const formatDate = (dateString: string) => {
|
|
return new Date(dateString).toLocaleDateString("es-ES", {
|
|
year: "numeric",
|
|
month: "short",
|
|
day: "numeric",
|
|
hour: "2-digit",
|
|
minute: "2-digit",
|
|
});
|
|
};
|
|
|
|
// Preparar datos para el modal de confirmación
|
|
const getDeleteDialogProps = () => {
|
|
if (fileToDelete) {
|
|
return {
|
|
title: "Eliminar archivo",
|
|
description: `¿Estás seguro de que quieres eliminar "${fileToDelete}"? Esta acción no se puede deshacer.`,
|
|
fileList: [fileToDelete],
|
|
};
|
|
} else {
|
|
const filesToDelete = Array.from(selectedFiles);
|
|
return {
|
|
title: `Eliminar ${filesToDelete.length} archivos`,
|
|
description: `¿Estás seguro de que quieres eliminar ${filesToDelete.length} archivo${filesToDelete.length !== 1 ? "s" : ""}? Esta acción no se puede deshacer.`,
|
|
fileList: filesToDelete,
|
|
};
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div className="flex flex-col h-full bg-white">
|
|
<div className="border-b border-gray-200 px-6 py-4">
|
|
<div className="flex flex-wrap items-center justify-between gap-4">
|
|
<div>
|
|
<div className="flex items-center gap-3 mb-2">
|
|
<h2 className="text-2xl font-semibold text-gray-900">
|
|
{selectedTema
|
|
? `Dataroom: ${selectedTema}`
|
|
: "Selecciona un dataroom"}
|
|
</h2>
|
|
{/* Collection Status Indicator */}
|
|
{selectedTema && (
|
|
<div className="flex items-center gap-2">
|
|
{isCheckingCollection ? (
|
|
<>
|
|
<Loader2 className="w-4 h-4 animate-spin text-gray-500" />
|
|
<span className="text-xs text-gray-500">
|
|
Verificando...
|
|
</span>
|
|
</>
|
|
) : collectionExists === true ? (
|
|
<>
|
|
<CheckCircle2 className="w-4 h-4 text-green-600" />
|
|
<span className="text-xs text-green-600">
|
|
Colección disponible
|
|
</span>
|
|
</>
|
|
) : collectionExists === false ? (
|
|
<>
|
|
<AlertCircle className="w-4 h-4 text-yellow-600" />
|
|
<button
|
|
onClick={handleCreateCollection}
|
|
className="text-xs text-yellow-600 hover:text-yellow-700 underline"
|
|
>
|
|
Crear colección
|
|
</button>
|
|
</>
|
|
) : collectionError ? (
|
|
<>
|
|
<AlertCircle className="w-4 h-4 text-red-600" />
|
|
<span className="text-xs text-red-600">
|
|
Error de conexión
|
|
</span>
|
|
</>
|
|
) : null}
|
|
</div>
|
|
)}
|
|
</div>
|
|
<p className="text-sm text-gray-600">
|
|
{selectedTema
|
|
? `${totalFiles} archivo${totalFiles !== 1 ? "s" : ""}`
|
|
: "Selecciona un dataroom de la barra lateral para ver sus archivos"}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<Tabs defaultValue="files" className="flex flex-col flex-1">
|
|
<div className="border-b border-gray-200 px-6 py-2">
|
|
<TabsList className="flex h-10 w-full items-center gap-2 bg-transparent p-0 justify-start">
|
|
<TabsTrigger
|
|
value="dashboard"
|
|
className="rounded-md px-4 py-2 text-sm font-medium text-gray-600 transition data-[state=active]:bg-gray-900 data-[state=active]:text-white data-[state=active]:shadow"
|
|
>
|
|
Dashboard
|
|
</TabsTrigger>
|
|
<TabsTrigger
|
|
value="files"
|
|
className="rounded-md px-4 py-2 text-sm font-medium text-gray-600 transition data-[state=active]:bg-gray-900 data-[state=active]:text-white data-[state=active]:shadow"
|
|
>
|
|
Files
|
|
</TabsTrigger>
|
|
<TabsTrigger
|
|
value="chat"
|
|
className="rounded-md px-4 py-2 text-sm font-medium text-gray-600 transition data-[state=active]:bg-gray-900 data-[state=active]:text-white data-[state=active]:shadow"
|
|
>
|
|
Chat
|
|
</TabsTrigger>
|
|
</TabsList>
|
|
</div>
|
|
<TabsContent value="dashboard" className="mt-0 flex-1">
|
|
<div className="p-6 text-sm text-gray-500">
|
|
Este panel se llenará con métricas generales próximamente.
|
|
</div>
|
|
</TabsContent>
|
|
<TabsContent value="files" className="mt-0 flex flex-1 flex-col">
|
|
{processing && (
|
|
<div className="bg-blue-50 border-b border-blue-200 px-6 py-3">
|
|
<div className="flex items-center justify-center gap-3">
|
|
<div className="animate-spin rounded-full h-4 w-4 border-b-2 border-blue-600"></div>
|
|
<p className="text-sm font-medium text-blue-900">
|
|
Procesando archivo con LandingAI... Por favor no navegues ni
|
|
realices otras acciones.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
)}
|
|
|
|
<div className="border-b border-gray-200 px-6 py-4">
|
|
<div className="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
|
|
<div className="relative w-full md:max-w-sm">
|
|
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400 w-4 h-4" />
|
|
<Input
|
|
placeholder="Buscar archivos..."
|
|
value={searchTerm}
|
|
onChange={(e) => setSearchTerm(e.target.value)}
|
|
className="pl-10"
|
|
disabled={processing}
|
|
/>
|
|
</div>
|
|
|
|
<div className="flex w-full items-center justify-between gap-2 md:w-auto md:justify-end">
|
|
{selectedFiles.size > 0 && (
|
|
<>
|
|
<Button
|
|
variant="outline"
|
|
size="sm"
|
|
onClick={handleDownloadMultiple}
|
|
disabled={downloading || processing}
|
|
>
|
|
<Download className="w-4 h-4 mr-2" />
|
|
{downloading
|
|
? "Descargando..."
|
|
: `Descargar (${selectedFiles.size})`}
|
|
</Button>
|
|
<Button
|
|
variant="outline"
|
|
size="sm"
|
|
onClick={handleDeleteMultiple}
|
|
disabled={processing}
|
|
>
|
|
<Trash2 className="w-4 h-4 mr-2" />
|
|
Eliminar ({selectedFiles.size})
|
|
</Button>
|
|
</>
|
|
)}
|
|
|
|
<Button
|
|
onClick={() => setUploadDialogOpen(true)}
|
|
disabled={processing}
|
|
>
|
|
<Upload className="w-4 h-4 mr-2" />
|
|
Subir archivo
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="flex-1 overflow-auto">
|
|
{loading ? (
|
|
<div className="flex items-center justify-center h-64">
|
|
<p className="text-gray-500">Cargando archivos...</p>
|
|
</div>
|
|
) : filteredFiles.length === 0 ? (
|
|
<div className="flex flex-col items-center justify-center h-64">
|
|
<FileText className="w-12 h-12 text-gray-400 mb-4" />
|
|
<p className="text-gray-500">
|
|
{!selectedTema
|
|
? "Selecciona un dataroom para ver sus archivos"
|
|
: searchTerm
|
|
? "No se encontraron archivos"
|
|
: "No hay archivos en este dataroom"}
|
|
</p>
|
|
</div>
|
|
) : (
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead className="w-12">
|
|
<Checkbox
|
|
checked={
|
|
selectedFiles.size === filteredFiles.length &&
|
|
filteredFiles.length > 0
|
|
}
|
|
onCheckedChange={(checked: boolean) => {
|
|
if (checked) {
|
|
selectAllFiles();
|
|
} else {
|
|
clearSelection();
|
|
}
|
|
}}
|
|
/>
|
|
</TableHead>
|
|
<TableHead>Nombre</TableHead>
|
|
<TableHead>Tamaño</TableHead>
|
|
<TableHead>Fecha</TableHead>
|
|
<TableHead>Tema</TableHead>
|
|
<TableHead className="w-32">Acciones</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
{filteredFiles.map((file) => {
|
|
const isPDF = file.name.toLowerCase().endsWith(".pdf");
|
|
|
|
return (
|
|
<TableRow key={file.full_path}>
|
|
<TableCell>
|
|
<Checkbox
|
|
checked={selectedFiles.has(file.name)}
|
|
onCheckedChange={() =>
|
|
toggleFileSelection(file.name)
|
|
}
|
|
/>
|
|
</TableCell>
|
|
<TableCell className="font-medium">
|
|
{isPDF ? (
|
|
<button
|
|
onClick={() =>
|
|
handlePreviewFile(
|
|
file.name,
|
|
file.tema || undefined,
|
|
)
|
|
}
|
|
className="text-blue-600 hover:text-blue-800 hover:underline text-left transition-colors"
|
|
disabled={loadingPreview}
|
|
>
|
|
{file.name}
|
|
</button>
|
|
) : (
|
|
<span>{file.name}</span>
|
|
)}
|
|
</TableCell>
|
|
<TableCell>{formatFileSize(file.size)}</TableCell>
|
|
<TableCell>{formatDate(file.last_modified)}</TableCell>
|
|
<TableCell>
|
|
<span className="px-2 py-1 bg-gray-100 rounded-md text-sm">
|
|
{file.tema || "General"}
|
|
</span>
|
|
</TableCell>
|
|
<TableCell>
|
|
<div className="flex gap-1">
|
|
<Button
|
|
variant="ghost"
|
|
size="sm"
|
|
onClick={() => handleDownloadSingle(file.name)}
|
|
disabled={downloading}
|
|
title="Descargar archivo"
|
|
>
|
|
<Download className="w-4 h-4" />
|
|
</Button>
|
|
<Button
|
|
variant="ghost"
|
|
size="sm"
|
|
title="Procesar con chunking"
|
|
onClick={() =>
|
|
handleStartChunking(file.name, file.tema)
|
|
}
|
|
>
|
|
<Scissors className="w-4 h-4" />
|
|
</Button>
|
|
<Button
|
|
variant="ghost"
|
|
size="sm"
|
|
title="Ver chunks"
|
|
onClick={() =>
|
|
handleViewChunks(file.name, file.tema)
|
|
}
|
|
>
|
|
<Eye className="w-4 h-4" />
|
|
</Button>
|
|
<Button
|
|
variant="ghost"
|
|
size="sm"
|
|
title="Generar preguntas"
|
|
>
|
|
<MessageSquare className="w-4 h-4" />
|
|
</Button>
|
|
<Button
|
|
variant="ghost"
|
|
size="sm"
|
|
onClick={() => handleDeleteSingle(file.name)}
|
|
title="Eliminar archivo"
|
|
>
|
|
<Trash2 className="w-4 h-4" />
|
|
</Button>
|
|
</div>
|
|
</TableCell>
|
|
</TableRow>
|
|
);
|
|
})}
|
|
</TableBody>
|
|
</Table>
|
|
)}
|
|
</div>
|
|
</TabsContent>
|
|
<TabsContent value="chat" className="mt-0 flex-1">
|
|
<div className="p-6 text-sm text-gray-500">
|
|
El chat estará disponible próximamente.
|
|
</div>
|
|
</TabsContent>
|
|
</Tabs>
|
|
{/* Upload Dialog */}
|
|
<FileUpload
|
|
open={uploadDialogOpen}
|
|
onOpenChange={setUploadDialogOpen}
|
|
onSuccess={handleUploadSuccess}
|
|
/>
|
|
|
|
{/* Delete Confirmation Dialog */}
|
|
<DeleteConfirmDialog
|
|
open={deleteDialogOpen}
|
|
onOpenChange={setDeleteDialogOpen}
|
|
onConfirm={confirmDelete}
|
|
loading={deleting}
|
|
{...getDeleteDialogProps()}
|
|
/>
|
|
|
|
{/* PDF Preview Modal */}
|
|
<PDFPreviewModal
|
|
open={previewModalOpen}
|
|
onOpenChange={setPreviewModalOpen}
|
|
fileUrl={previewFileUrl}
|
|
fileName={previewFileName}
|
|
onDownload={handleDownloadFromPreview}
|
|
/>
|
|
|
|
{/* Chunk Viewer Modal */}
|
|
<ChunkViewerModal
|
|
isOpen={chunkViewerOpen}
|
|
onClose={() => setChunkViewerOpen(false)}
|
|
fileName={chunkFileName}
|
|
tema={chunkFileTema}
|
|
/>
|
|
|
|
{/* Modal de configuración de chunking con LandingAI */}
|
|
<ChunkingConfigModalLandingAI
|
|
isOpen={chunkingConfigOpen}
|
|
onClose={() => setChunkingConfigOpen(false)}
|
|
fileName={chunkingFileName}
|
|
tema={chunkingFileTema}
|
|
collectionName={chunkingCollectionName}
|
|
onProcess={handleProcessWithLandingAI}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|