import { Head, Link, router } from '@inertiajs/react'; import { ClipboardDocumentIcon, EyeIcon, FolderIcon, MagnifyingGlassIcon, PencilSquareIcon, PlusCircleIcon, TrashIcon, } from '@heroicons/react/24/outline'; import { FormEvent, useState } from 'react'; import { toast } from 'sonner'; import { Pagination } from '@/components/pagination'; import { Button } from '@/components/ui/button'; import { Input } from '@/components/ui/input'; import { create, destroy, edit, index, preview, show, } from '@/routes/documents'; import type { DocumentIframe, PaginatedData, } from '@/types'; type Props = { documentIframes: PaginatedData; filters: { search: string; }; }; export default function DocumentsIndex({ documentIframes, filters, }: Props) { const [search, setSearch] = useState(filters.search); const submitSearch = (event: FormEvent) => { event.preventDefault(); router.get( index().url, { search }, { preserveState: true, replace: true, }, ); }; const clearSearch = () => { setSearch(''); router.get( index().url, {}, { preserveState: true, replace: true, }, ); }; const copyEmbedUrl = async (url: string) => { try { await navigator.clipboard.writeText(url); toast.success('Link del iframe copiado.'); } catch { toast.error('No fue posible copiar el link.'); } }; const deleteDocumentIframe = ( documentIframe: DocumentIframe, ) => { const confirmed = window.confirm( `¿Seguro que deseas eliminar "${documentIframe.name}"?`, ); if (!confirmed) { return; } router.delete(destroy(documentIframe.public_id).url, { preserveScroll: true, }); }; return ( <>

Documentos

Administra los iframes de documentos que serán integrados en el sitio web.

Crear iframe de documentos

{documentIframes.data.map((documentIframe) => (

{documentIframe.name}

{documentIframe.view_label}

))}

{documentIframes.data.length === 0 && filters.search && (

No se encontraron iframes con la búsqueda "{filters.search}".

)}

); } DocumentsIndex.layout = { breadcrumbs: [ { title: 'Documentos', href: index(), }, ], };