diff --git a/src/modules/rendicontazione/components/FilePreviewDialog.js b/src/modules/rendicontazione/components/FilePreviewDialog.js new file mode 100644 index 0000000..6502e36 --- /dev/null +++ b/src/modules/rendicontazione/components/FilePreviewDialog.js @@ -0,0 +1,114 @@ +import React, { useEffect, useState, useRef } from 'react'; +import { __ } from '@wordpress/i18n'; +import { Dialog } from 'primereact/dialog'; +import { Button } from 'primereact/button'; +import { ProgressSpinner } from 'primereact/progressspinner'; + +import RendicontazioneService from '../service/rendicontazioneService'; + +/** + * Dialog full-height per preview inline PDF/immagini. + * Fetcha il blob dal microservizio (Authorization header), crea object URL, + * lo monta in iframe. Revoca l'URL alla chiusura. + * + * Props: + * visible boolean + * onHide () => void + * entityType 'invoice' | 'ula' | 'document' + * entityId UUID + * title stringa titolo dialog + * filename nome file da mostrare e usare per download + */ +const FilePreviewDialog = ({ visible, onHide, entityType, entityId, title, filename }) => { + const [loading, setLoading] = useState(false); + const [error, setError] = useState(null); + const [objectUrl, setObjectUrl] = useState(null); + const currentUrlRef = useRef(null); + + useEffect(() => { + // cleanup url precedente + if (currentUrlRef.current) { + URL.revokeObjectURL(currentUrlRef.current); + currentUrlRef.current = null; + } + + if (!visible || !entityType || !entityId) { + setObjectUrl(null); + setError(null); + return; + } + + setLoading(true); + setError(null); + RendicontazioneService.fetchEntityFileBlob(entityType, entityId, true, + ({ objectUrl }) => { + currentUrlRef.current = objectUrl; + setObjectUrl(objectUrl); + setLoading(false); + }, + (err) => { + setError(err.detail || __('Errore caricamento file', 'gepafin')); + setLoading(false); + } + ); + + return () => { + if (currentUrlRef.current) { + URL.revokeObjectURL(currentUrlRef.current); + currentUrlRef.current = null; + } + }; + }, [visible, entityType, entityId]); + + const onDownload = () => { + RendicontazioneService.downloadEntityFile(entityType, entityId, + (err) => setError(err.detail || __('Errore download', 'gepafin')) + ); + }; + + const footer = ( +
+ {filename} +
+
+
+ ); + + return ( + + {loading && ( +
+ +
+ )} + {error && !loading && ( +
+
{error}
+
+ )} + {!loading && !error && objectUrl && ( +