cleanup

frontend/src/preview/DocumentViewerLayout.tsx

@@ -48,6 +48,37 @@ interface DocumentViewerLayoutProps {
   layoutMode?: LayoutMode;
 }
 
+const AUDIO_EXTENSIONS = new Set([
+  'aac',
+  'aiff',
+  'flac',
+  'm4a',
+  'mp3',
+  'ogg',
+  'oga',
+  'opus',
+  'wav',
+  'weba',
+]);
+
+const VIDEO_EXTENSIONS = new Set([
+  'avi',
+  'mkv',
+  'mov',
+  'mp4',
+  'm4v',
+  'webm',
+  'wmv',
+]);
+
+const getFileExtension = (filename?: string | null) => {
+  if (!filename) {
+    return '';
+  }
+  const match = filename.toLowerCase().match(/\.([a-z0-9]+)$/);
+  return match ? match[1] : '';
+};
+
 const DocumentViewerLayout = ({
   document,
   previewEntry,
@@ -73,9 +104,21 @@ const DocumentViewerLayout = ({
       || document.content_type
       || '')
       .toLowerCase();
+    const normalizedFilename = previewEntry.filename
+      || document.filename
+      || document.original_name
+      || '';
+    const fileExtension = getFileExtension(normalizedFilename);
     const isImage = normalizedContentType.startsWith('image/');
     const isPdf = normalizedContentType === 'application/pdf'
       || normalizedContentType === 'application/x-pdf';
+    const isAudio = normalizedContentType.startsWith('audio/')
+      || AUDIO_EXTENSIONS.has(fileExtension);
+    const isVideo = normalizedContentType.startsWith('video/')
+      || VIDEO_EXTENSIONS.has(fileExtension);
+    const mediaLabel = document.title
+      || normalizedFilename
+      || 'Document preview';
 
     if (isImage) {
       return (
@@ -101,6 +144,32 @@ const DocumentViewerLayout = ({
       );
     }
 
+    if (isAudio) {
+      return (
+        <audio
+          className="document-viewer__object document-viewer__object--audio"
+          controls
+          preload="metadata"
+          src={previewEntry.url}
+          aria-label={`Audio preview of ${mediaLabel}`}
+        >
+        </audio>
+      );
+    }
+
+    if (isVideo) {
+      return (
+        <video
+          className="document-viewer__object document-viewer__object--video"
+          controls
+          preload="metadata"
+          src={previewEntry.url}
+          aria-label={`Video preview of ${mediaLabel}`}
+        >
+        </video>
+      );
+    }
+
     const displayContentType = document.content_type || previewEntry.contentType || 'this file type';
     const displayFilename = previewEntry.filename
       || document.filename