diff --git a/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/widgets/edgeless-note-header.css.ts b/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/widgets/edgeless-note-header.css.ts index c245fef011..56148f15ac 100644 --- a/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/widgets/edgeless-note-header.css.ts +++ b/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/widgets/edgeless-note-header.css.ts @@ -13,6 +13,9 @@ export const header = style({ }); export const title = style({ + display: 'flex', + alignItems: 'center', + gap: 4, flex: 1, color: cssVarV2('text/primary'), fontFamily: 'Inter', diff --git a/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/widgets/edgeless-note-header.tsx b/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/widgets/edgeless-note-header.tsx index 18a6efda1f..2168439c88 100644 --- a/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/widgets/edgeless-note-header.tsx +++ b/packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/widgets/edgeless-note-header.tsx @@ -1,6 +1,7 @@ import { IconButton } from '@affine/component'; import { useSharingUrl } from '@affine/core/components/hooks/affine/use-share-url'; import { WorkspaceDialogService } from '@affine/core/modules/dialogs'; +import { DocDisplayMetaService } from '@affine/core/modules/doc-display-meta'; import { EditorService } from '@affine/core/modules/editor'; import { FeatureFlagService } from '@affine/core/modules/feature-flag'; import { useInsidePeekView } from '@affine/core/modules/peek-view/view/modal-container'; @@ -32,6 +33,10 @@ const EdgelessNoteToggleButton = ({ note }: { note: NoteBlockModel }) => { const editor = useService(EditorService).editor; const editorContainer = useLiveData(editor.editorContainer$); const gfx = editorContainer?.std.get(GfxControllerIdentifier); + const docDisplayMetaService = useService(DocDisplayMetaService); + + const Icon = useLiveData(docDisplayMetaService.icon$(note.doc.id)); + const title = useLiveData(docDisplayMetaService.title$(note.doc.id)); useEffect(() => { setCollapsed(note.edgeless.collapse); @@ -80,7 +85,11 @@ const EdgelessNoteToggleButton = ({ note }: { note: NoteBlockModel }) => { {collapsed ? : }
- {collapsed && (note.doc.meta?.title ?? 'Untitled')} + {collapsed && ( + <> + {title} + + )}
);