refactor document viewer UI buttons and props.

frontend/src/app/useWorkspaceSurface.tsx

@@ -118,7 +118,7 @@ export const useWorkspaceSurface = ({
           <DocumentViewerPanel
             variant="sidebar"
             sidebarMode={sidebarMode}
-            onCollapsePanel={onClose}
+            onClosePanel={onClose}
             onMaximizePanel={onOpenPreview}
             tagOptions={tagOptions}
             {...restDetailProps}

frontend/src/detail/PreviewZoomOverlay.tsx

@@ -312,14 +312,27 @@ const PreviewZoomOverlay: React.FC<PreviewZoomOverlayProps> = ({
           className="panel-header--dark"
           title={documentTitle}
           leading={
-            <button
+            <>
-              onClick={onClose}
+              <button
-              className="icon-button"
+                onClick={onClose}
-              aria-label="Close preview"
+                className="icon-button"
-              type="button"
+                aria-label="Close preview"
-            >
+                type="button"
-              <IconX />
+              >
-            </button>
+                <IconX />
+              </button>
+              {onMaximize && (
+                <button
+                  onClick={onMaximize}
+                  className="icon-button"
+                  aria-label="Open document info"
+                  title="Open document info"
+                  type="button"
+                >
+                  <FileInfoIcon />
+                </button>
+              )}
+            </>
           }
           actions={
             <>
@@ -335,17 +348,6 @@ const PreviewZoomOverlay: React.FC<PreviewZoomOverlayProps> = ({
                   <DownloadIcon />
                 </a>
               )}
-              {onMaximize && (
-                <button
-                  onClick={onMaximize}
-                  className="icon-button"
-                  aria-label="Open document info"
-                  title="Open document info"
-                  type="button"
-                >
-                  <FileInfoIcon />
-                </button>
-              )}
             </>
           }
         />

frontend/src/preview/DocumentViewerPanel.tsx

@@ -9,7 +9,6 @@ import {
   DownloadIcon,
   CloseIcon,
   IconZoomInArea,
-  IconX,
   WindowMaximizeIcon,
 } from '../ui/icons';
 import {
@@ -42,7 +41,6 @@ interface DocumentViewerPanelProps extends DocumentSummarySectionProps {
   onClosePanel?: () => void;
   resolveFolderPath?: (doc: Document | null) => Array<{ id?: string; name?: string }>;
   variant?: 'viewer' | 'sidebar';
-  onCollapsePanel?: () => void;
   onMaximizePanel?: (args: { documentIds: Array<string> }) => void;
   sidebarMode?: SidebarMode;
 }
@@ -76,17 +74,6 @@ export const createDocumentViewerHeaderActions = ({
           <DownloadIcon />
         </a>
       ) : null}
-      {canZoom && onZoom ? (
-        <button
-          type="button"
-          className="icon-button"
-          onClick={onZoom}
-          aria-label="Open zoom preview"
-          title="Open zoom preview"
-        >
-          <IconZoomInArea />
-        </button>
-      ) : null}
     </>
   );
 };
@@ -110,7 +97,6 @@ const DocumentViewerPanel: React.FC<DocumentViewerPanelProps> = ({
   onClosePanel,
   resolveFolderPath,
   variant = 'viewer',
-  onCollapsePanel,
   onMaximizePanel,
   sidebarMode = 'overlay',
 }) => {
@@ -330,20 +316,6 @@ const DocumentViewerPanel: React.FC<DocumentViewerPanelProps> = ({
     canZoom: Boolean(document),
   });
 
-  const collapseButton = isSidebarVariant && onCollapsePanel
-    ? (
-      <button
-        type="button"
-        className="icon-button"
-        onClick={() => onCollapsePanel?.()}
-        aria-label="Close detail panel"
-        title="Close detail panel"
-      >
-        <IconX />
-      </button>
-    )
-    : null;
-
   const maximizeButton = isSidebarVariant && onMaximizePanel
     ? (
       <button
@@ -365,7 +337,7 @@ const DocumentViewerPanel: React.FC<DocumentViewerPanelProps> = ({
     )
     : null;
 
-  const closeButton = !isSidebarVariant && onClosePanel
+  const closeButton = onClosePanel
     ? (
       <button
         type="button"
@@ -379,15 +351,24 @@ const DocumentViewerPanel: React.FC<DocumentViewerPanelProps> = ({
     )
     : null;
 
-  const headerLeadingButtons = isSidebarVariant
+  const previewZoomButton = (
-    ? [
+    <button
-      collapseButton ? <React.Fragment key="collapse-button">{collapseButton}</React.Fragment> : null,
+      type="button"
-      maximizeButton ? <React.Fragment key="maximize-button">{maximizeButton}</React.Fragment> : null,
+      className="icon-button"
-    ].filter(Boolean)
+      onClick={handleZoomOpen}
-    : [
+      aria-label="Open zoom preview"
-      sidebarToggle ? <React.Fragment key="sidebar-toggle">{sidebarToggle}</React.Fragment> : null,
+      title="Open zoom preview"
-      closeButton ? <React.Fragment key="close-button">{closeButton}</React.Fragment> : null,
+    >
-    ].filter(Boolean);
+      <IconZoomInArea />
+    </button>
+  );
+
+  const headerLeadingButtons = [
+    sidebarToggle ? <React.Fragment key="sidebar-toggle">{sidebarToggle}</React.Fragment> : null,
+    closeButton ? <React.Fragment key="close-button">{closeButton}</React.Fragment> : null,
+    maximizeButton ? <React.Fragment key="maximize-button">{maximizeButton}</React.Fragment> : null,
+    previewZoomButton ? <React.Fragment key="preview-zoom-button">{previewZoomButton}</React.Fragment> : null,
+  ].filter(Boolean);
   const headerLeadingContent = headerLeadingButtons.length ? headerLeadingButtons : null;
 
   const resizeHandle = isSidebarVariant ? (