From 4ecdfb125868177fa215ec820c4c4e60e345c2ec Mon Sep 17 00:00:00 2001
From: fundon <fundon@pindash.io>
Date: Sun, 18 May 2025 05:47:52 +0000
Subject: [PATCH] fix(core): should use AttachmentViewerView in split view and
 standalone page (#12323)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Closes: [AF-2564](https://linear.app/affine-design/issue/AF-2564/pdf-split-view-多了-header)

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **Refactor**
  - Improved code clarity and maintainability with clearer comments and streamlined property usage.
  - Updated the workspace attachment page to use a more context-appropriate attachment viewer component.
- **Style**
  - Minor formatting improvements for better code readability.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 .../frontend/core/src/blocksuite/attachment-viewer/index.tsx | 4 ++--
 .../core/src/blocksuite/attachment-viewer/pdf/pdf-viewer.tsx | 1 +
 .../core/src/desktop/pages/workspace/attachment/index.tsx    | 4 ++--
 .../frontend/core/src/modules/pdf/views/page-renderer.tsx    | 5 +++--
 4 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/packages/frontend/core/src/blocksuite/attachment-viewer/index.tsx b/packages/frontend/core/src/blocksuite/attachment-viewer/index.tsx
index 43d383862d..341876e594 100644
--- a/packages/frontend/core/src/blocksuite/attachment-viewer/index.tsx
+++ b/packages/frontend/core/src/blocksuite/attachment-viewer/index.tsx
@@ -7,7 +7,7 @@ import { buildAttachmentProps } from './utils';
 import { Titlebar } from './viewer';
 import * as styles from './viewer.css';
 
-// In Peek view
+// Peek view
 export const AttachmentViewer = ({ model }: AttachmentViewerProps) => {
   const props = buildAttachmentProps(model);
 
@@ -19,7 +19,7 @@ export const AttachmentViewer = ({ model }: AttachmentViewerProps) => {
   );
 };
 
-// In View container
+// Split view or standalone page
 export const AttachmentViewerView = ({ model }: AttachmentViewerProps) => {
   const props = buildAttachmentProps(model);
 
diff --git a/packages/frontend/core/src/blocksuite/attachment-viewer/pdf/pdf-viewer.tsx b/packages/frontend/core/src/blocksuite/attachment-viewer/pdf/pdf-viewer.tsx
index c56ad3ed5a..1836a76077 100644
--- a/packages/frontend/core/src/blocksuite/attachment-viewer/pdf/pdf-viewer.tsx
+++ b/packages/frontend/core/src/blocksuite/attachment-viewer/pdf/pdf-viewer.tsx
@@ -39,6 +39,7 @@ function calculatePageNum(el: HTMLElement, pageCount: number) {
   const cursor = Math.min(index, pageCount - 1);
   return cursor;
 }
+
 export interface PDFViewerInnerProps {
   pdf: PDF;
   state: Extract<PDFRendererState, { status: PDFStatus.Opened }>;
diff --git a/packages/frontend/core/src/desktop/pages/workspace/attachment/index.tsx b/packages/frontend/core/src/desktop/pages/workspace/attachment/index.tsx
index 382c989d9d..843cff6e92 100644
--- a/packages/frontend/core/src/desktop/pages/workspace/attachment/index.tsx
+++ b/packages/frontend/core/src/desktop/pages/workspace/attachment/index.tsx
@@ -1,5 +1,5 @@
 import { Skeleton } from '@affine/component';
-import { AttachmentViewer } from '@affine/core/blocksuite/attachment-viewer';
+import { AttachmentViewerView } from '@affine/core/blocksuite/attachment-viewer';
 import { type Doc, DocsService } from '@affine/core/modules/doc';
 import { type AttachmentBlockModel } from '@blocksuite/affine/model';
 import { FrameworkScope, useLiveData, useService } from '@toeverything/infra';
@@ -71,7 +71,7 @@ export const AttachmentPage = ({
         <ViewIcon
           icon={model.props.type.endsWith('pdf') ? 'pdf' : 'attachment'}
         />
-        <AttachmentViewer model={model} />
+        <AttachmentViewerView model={model} />
       </FrameworkScope>
     );
   }
diff --git a/packages/frontend/core/src/modules/pdf/views/page-renderer.tsx b/packages/frontend/core/src/modules/pdf/views/page-renderer.tsx
index 8ff27de510..86b100850a 100644
--- a/packages/frontend/core/src/modules/pdf/views/page-renderer.tsx
+++ b/packages/frontend/core/src/modules/pdf/views/page-renderer.tsx
@@ -142,12 +142,13 @@ interface PageRendererInnerProps {
 const PageRendererInner = forwardRef<HTMLCanvasElement, PageRendererInnerProps>(
   ({ img, err }, ref) => {
     if (img) {
+      const { width, height } = img;
       return (
         <PDFPageCanvas
           ref={ref}
           style={{
-            height: img.height / 2,
-            aspectRatio: `${img.width} / ${img.height}`,
+            height: height / 2,
+            aspectRatio: `${width} / ${height}`,
           }}
         />
       );