rename

frontend/src/preview/DocumentViewerPanel.jsx

@@ -14,7 +14,7 @@ const formatDateTime = (value) => {
   return Number.isNaN(date.getTime()) ? '—' : date.toLocaleString();
 };
 
-const PreviewWorkspace = ({
+const DocumentViewerPanel = ({
   document,
   documentId,
   previewEntry,
@@ -27,8 +27,6 @@ const PreviewWorkspace = ({
   onCorrespondentRemove,
   onUpdateTitle,
   onUpdateIssued,
-  resolveFolderPath,
-  onFolderNavigate,
 }) => {
   const sortedCorrespondents = useMemo(
     () => sortCorrespondents(document?.correspondents || []),
@@ -66,6 +64,34 @@ const PreviewWorkspace = ({
     ];
   }, [document]);
 
+  const contentType = (document?.content_type || '').toLowerCase();
+  const previewContent = useMemo(() => {
+    if (!previewEntry?.url) {
+      return null;
+    }
+
+    const title = document?.title || document?.original_name || 'Document';
+
+    if (contentType.startsWith('image/')) {
+      return (
+        <img
+          src={previewEntry.url}
+          alt={`Preview of ${title}`}
+          className="document-viewer__object document-viewer__object--image"
+          draggable={false}
+        />
+      );
+    }
+
+    return (
+      <iframe
+        src={previewEntry.url}
+        title={`Preview of ${title}`}
+        className="document-viewer__object"
+      />
+    );
+  }, [previewEntry?.url, contentType, document?.title, document?.original_name]);
+
   const metadataPayload = useMemo(() => {
     if (!document || !document.metadata || Object.keys(document.metadata).length === 0) {
       return null;
@@ -75,22 +101,22 @@ const PreviewWorkspace = ({
 
   if (!document) {
     return (
-      <section className="preview-workspace preview-workspace--loading">
-        <div className="preview-workspace__details">
-          <div className="preview-workspace__message">
+      <section className="document-viewer document-viewer--loading">
+        <div className="document-viewer__details">
+          <div className="document-viewer__message">
             Loading document{documentId ? ` ${documentId}` : ''}…
           </div>
         </div>
-        <div className="preview-workspace__viewer">
-          <div className="preview-workspace__message">Preparing preview…</div>
+        <div className="document-viewer__viewport">
+          <div className="document-viewer__message">Preparing preview…</div>
         </div>
       </section>
     );
   }
 
   return (
-    <section className="preview-workspace">
-      <div className="preview-workspace__details">
+    <section className="document-viewer">
+      <div className="document-viewer__details">
         <DocumentSummarySection
           document={document}
           tagLookupById={tagLookupById}
@@ -103,8 +129,6 @@ const PreviewWorkspace = ({
           onCorrespondentRemove={onCorrespondentRemove}
           onUpdateTitle={onUpdateTitle}
           onUpdateIssued={onUpdateIssued}
-          resolveFolderPath={resolveFolderPath}
-          onFolderNavigate={onFolderNavigate}
         />
         <section className="preview-section">
           <h3 className="preview-section__title">Metadata</h3>
@@ -124,24 +148,20 @@ const PreviewWorkspace = ({
           ) : null}
         </section>
       </div>
-      <div className="preview-workspace__viewer">
+      <div className="document-viewer__viewport">
         {!previewEntry?.url ? (
-          <div className="preview-workspace__message">Loading preview…</div>
+          <div className="document-viewer__message">Loading preview…</div>
         ) : (
-          <iframe
-            src={previewEntry.url}
-            title={`Preview of ${document.title}`}
-            className="preview-workspace__object"
-          />
+          previewContent
         )}
       </div>
     </section>
   );
 };
 
-export default PreviewWorkspace;
+export default DocumentViewerPanel;
 
-export const createPreviewWorkspaceHeaderActions = ({
+export const createDocumentViewerHeaderActions = ({
   document,
   ensureAssetUrl,
   ensurePreviewData,
@@ -204,7 +224,7 @@ export const createPreviewWorkspaceHeaderActions = ({
   );
 };
 
-export const createPreviewSurface = ({
+export const createDocumentViewerSurface = ({
   documentId,
   document,
   previewEntry,
@@ -226,7 +246,6 @@ export const createPreviewSurface = ({
   onUpdateTitle,
   onUpdateIssued,
   resolveFolderPath,
-  onFolderNavigate,
 }) => {
   if (!documentId && !document) {
     return null;
@@ -274,7 +293,7 @@ export const createPreviewSurface = ({
     title,
     subtitle: null,
     leading,
-    actions: createPreviewWorkspaceHeaderActions({
+    actions: createDocumentViewerHeaderActions({
       document,
       ensureAssetUrl,
       ensurePreviewData,
@@ -291,7 +310,7 @@ export const createPreviewSurface = ({
     variant: 'preview',
     header,
     content: (
-      <PreviewWorkspace
+      <DocumentViewerPanel
         document={document}
         documentId={documentId}
         previewEntry={previewEntry}
@@ -304,9 +323,6 @@ export const createPreviewSurface = ({
         onCorrespondentRemove={onCorrespondentRemove}
         onUpdateTitle={onUpdateTitle}
         onUpdateIssued={onUpdateIssued}
-        resolveFolderPath={resolveFolderPath}
-        onFolderNavigate={onFolderNavigate}
-        showFolderPath={false}
       />
     ),
     supportsDetail: false,