From 76ff56a716aec88c137f47abd2c45458b941a07b Mon Sep 17 00:00:00 2001
From: pengx17 <pengxiao@outlook.com>
Date: Wed, 25 Sep 2024 09:11:24 +0000
Subject: [PATCH] feat: add open info button to doc center peek (#8388)

fix AF-1229

![image](https://github.com/user-attachments/assets/3e7b43ad-43c6-4dfb-b737-5dffb1396b6b)
---
 .../peek-view/view/peek-view-controls.tsx     | 22 ++++++++++++++++++-
 packages/frontend/i18n/src/resources/en.json  |  1 +
 2 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/packages/frontend/core/src/modules/peek-view/view/peek-view-controls.tsx b/packages/frontend/core/src/modules/peek-view/view/peek-view-controls.tsx
index 306586d10..20849c9fc 100644
--- a/packages/frontend/core/src/modules/peek-view/view/peek-view-controls.tsx
+++ b/packages/frontend/core/src/modules/peek-view/view/peek-view-controls.tsx
@@ -4,6 +4,7 @@ import type { DocMode } from '@blocksuite/affine/blocks';
 import {
   CloseIcon,
   ExpandFullIcon,
+  InformationIcon,
   OpenInNewIcon,
   SplitViewIcon,
 } from '@blocksuite/icons/rc';
@@ -17,6 +18,7 @@ import {
   useMemo,
 } from 'react';
 
+import { DocInfoService } from '../../doc-info';
 import { WorkbenchService } from '../../workbench';
 import { PeekViewService } from '../services/peek-view';
 import * as styles from './peek-view-controls.css';
@@ -100,6 +102,7 @@ export const DocPeekViewControls = ({
   const peekView = useService(PeekViewService).peekView;
   const workbench = useService(WorkbenchService).workbench;
   const t = useI18n();
+  const docInfoService = useService(DocInfoService);
   const controls = useMemo(() => {
     return [
       {
@@ -138,8 +141,25 @@ export const DocPeekViewControls = ({
           peekView.close('none');
         },
       },
+      {
+        icon: <InformationIcon />,
+        nameKey: 'info',
+        name: t['com.affine.peek-view-controls.open-info'](),
+        onClick: () => {
+          docInfoService.modal.open(docId);
+        },
+      },
     ].filter((opt): opt is ControlButtonProps => Boolean(opt));
-  }, [docId, mode, blockIds, elementIds, peekView, t, workbench]);
+  }, [
+    t,
+    peekView,
+    workbench,
+    docId,
+    mode,
+    blockIds,
+    elementIds,
+    docInfoService.modal,
+  ]);
   return (
     <div {...rest} className={clsx(styles.root, className)}>
       {controls.map(option => (
diff --git a/packages/frontend/i18n/src/resources/en.json b/packages/frontend/i18n/src/resources/en.json
index 055ce3468..fa3c24942 100644
--- a/packages/frontend/i18n/src/resources/en.json
+++ b/packages/frontend/i18n/src/resources/en.json
@@ -882,6 +882,7 @@
   "com.affine.peek-view-controls.open-doc": "Open this doc",
   "com.affine.peek-view-controls.open-doc-in-new-tab": "Open in new tab",
   "com.affine.peek-view-controls.open-doc-in-split-view": "Open in split view",
+  "com.affine.peek-view-controls.open-info": "Open doc info",
   "com.affine.quicksearch.group.creation": "New",
   "com.affine.quicksearch.group.searchfor": "Search for \"{{query}}\"",
   "com.affine.resetSyncStatus.button": "Reset sync",