diff --git a/blocksuite/affine/blocks/block-embed/src/embed-linked-doc-block/configs/toolbar.ts b/blocksuite/affine/blocks/block-embed/src/embed-linked-doc-block/configs/toolbar.ts
index 6b113112e1..e87b820fa6 100644
--- a/blocksuite/affine/blocks/block-embed/src/embed-linked-doc-block/configs/toolbar.ts
+++ b/blocksuite/affine/blocks/block-embed/src/embed-linked-doc-block/configs/toolbar.ts
@@ -11,6 +11,7 @@ import {
} from '@blocksuite/affine-shared/consts';
import {
ActionPlacement,
+ DocDisplayMetaProvider,
type LinkEventType,
type OpenDocMode,
type ToolbarAction,
@@ -76,11 +77,13 @@ const docTitleAction = {
if (!model.props.title) return null;
const originalTitle =
- ctx.workspace.getDoc(model.props.pageId)?.meta?.title || 'Untitled';
+ ctx.std.get(DocDisplayMetaProvider).title(model.props.pageId).value ||
+ 'Untitled';
+ const open = (event: MouseEvent) => block.open({ event });
return html` block.open({ event })}
+ .open=${open}
>`;
},
} as const satisfies ToolbarAction;
diff --git a/blocksuite/affine/inlines/reference/src/reference-node/configs/toolbar.ts b/blocksuite/affine/inlines/reference/src/reference-node/configs/toolbar.ts
index 5d968f0ebf..2689ebbf77 100644
--- a/blocksuite/affine/inlines/reference/src/reference-node/configs/toolbar.ts
+++ b/blocksuite/affine/inlines/reference/src/reference-node/configs/toolbar.ts
@@ -1,6 +1,7 @@
import { notifyLinkedDocSwitchedToEmbed } from '@blocksuite/affine-components/notification';
import {
ActionPlacement,
+ DocDisplayMetaProvider,
type ToolbarAction,
type ToolbarActionGroup,
type ToolbarModuleConfig,
@@ -34,9 +35,14 @@ export const builtinInlineReferenceToolbarConfig = {
if (!(target instanceof AffineReference)) return null;
if (!target.referenceInfo.title) return null;
+ const originalTitle =
+ ctx.std.get(DocDisplayMetaProvider).title(target.referenceInfo.pageId)
+ .value || 'Untitled';
+ const open = (event: MouseEvent) => target.open({ event });
+
return html` target.open({ event })}
+ .title=${originalTitle}
+ .open=${open}
>`;
},
},
diff --git a/blocksuite/affine/shared/src/services/doc-display-meta-service.ts b/blocksuite/affine/shared/src/services/doc-display-meta-service.ts
index 415b31f224..e578629778 100644
--- a/blocksuite/affine/shared/src/services/doc-display-meta-service.ts
+++ b/blocksuite/affine/shared/src/services/doc-display-meta-service.ts
@@ -15,7 +15,12 @@ import {
} from '@blocksuite/icons/lit';
import { LifeCycleWatcher, StdIdentifier } from '@blocksuite/std';
import type { Store } from '@blocksuite/store';
-import { computed, type Signal, signal } from '@preact/signals-core';
+import {
+ computed,
+ type ReadonlySignal,
+ type Signal,
+ signal,
+} from '@preact/signals-core';
import type { TemplateResult } from 'lit';
import { referenceToNode } from '../utils/reference.js';
@@ -44,11 +49,11 @@ export interface DocDisplayMetaExtension {
icon: (
docId: string,
referenceInfo?: DocDisplayMetaParams
- ) => Signal;
+ ) => ReadonlySignal;
title: (
docId: string,
referenceInfo?: DocDisplayMetaParams
- ) => Signal;
+ ) => ReadonlySignal;
}
export const DocDisplayMetaProvider = createIdentifier(
@@ -93,11 +98,11 @@ export class DocDisplayMetaService
icon(
pageId: string,
{ params, title, referenced }: DocDisplayMetaParams = {}
- ): Signal {
+ ): ReadonlySignal {
const doc = this.std.workspace.getDoc(pageId);
if (!doc) {
- return signal(DocDisplayMetaService.icons.deleted);
+ return computed(() => DocDisplayMetaService.icons.deleted);
}
const store = doc.getStore();
@@ -160,11 +165,14 @@ export class DocDisplayMetaService
});
}
- title(pageId: string, { title }: DocDisplayMetaParams = {}): Signal {
+ title(
+ pageId: string,
+ { title }: DocDisplayMetaParams = {}
+ ): ReadonlySignal {
const doc = this.std.workspace.getDoc(pageId);
if (!doc) {
- return signal(title || 'Deleted doc');
+ return computed(() => title || 'Deleted doc');
}
const store = doc.getStore();
diff --git a/packages/frontend/core/src/blocksuite/extensions/display-meta.ts b/packages/frontend/core/src/blocksuite/extensions/display-meta.ts
index da0c5a42f1..3705ecd6ba 100644
--- a/packages/frontend/core/src/blocksuite/extensions/display-meta.ts
+++ b/packages/frontend/core/src/blocksuite/extensions/display-meta.ts
@@ -8,10 +8,10 @@ import { DocDisplayMetaProvider } from '@blocksuite/affine/shared/services';
import {
createSignalFromObservable,
referenceToNode,
- type Signal,
} from '@blocksuite/affine/shared/utils';
import { LifeCycleWatcher, StdIdentifier } from '@blocksuite/affine/std';
import { LinkedPageIcon, PageIcon } from '@blocksuite/icons/lit';
+import { computed, type ReadonlySignal } from '@preact/signals-core';
import { type FrameworkProvider } from '@toeverything/infra';
import type { TemplateResult } from 'lit';
@@ -52,7 +52,7 @@ export function buildDocDisplayMetaExtension(framework: FrameworkProvider) {
icon(
docId: string,
{ params, title, referenced }: DocDisplayMetaParams = {}
- ): Signal {
+ ): ReadonlySignal {
const icon$ = docDisplayMetaService
.icon$(docId, {
type: 'lit',
@@ -69,13 +69,13 @@ export function buildDocDisplayMetaExtension(framework: FrameworkProvider) {
this.disposables.push(cleanup);
- return iconSignal;
+ return computed(() => iconSignal.value);
}
title(
docId: string,
{ title, referenced }: DocDisplayMetaParams = {}
- ): Signal {
+ ): ReadonlySignal {
const title$ = docDisplayMetaService.title$(docId, {
title,
reference: referenced,
@@ -86,7 +86,7 @@ export function buildDocDisplayMetaExtension(framework: FrameworkProvider) {
this.disposables.push(cleanup);
- return titleSignal;
+ return computed(() => titleSignal.value);
}
override unmounted() {
diff --git a/tests/affine-local/e2e/links.spec.ts b/tests/affine-local/e2e/links.spec.ts
index 0eeb58fc63..94403020f8 100644
--- a/tests/affine-local/e2e/links.spec.ts
+++ b/tests/affine-local/e2e/links.spec.ts
@@ -12,7 +12,6 @@ import {
createLinkedPage,
createTodayPage,
getBlockSuiteEditorTitle,
- waitForEditorLoad,
waitForEmptyEditor,
} from '@affine-test/kit/utils/page-logic';
import {
@@ -980,7 +979,6 @@ test.describe('Customize linked doc title and description', () => {
});
test('should show emoji doc icon in normal document', async ({ page }) => {
- await waitForEditorLoad(page);
await enableEmojiDocIcon(page);
await clickNewPageButton(page);
@@ -1010,7 +1008,6 @@ test.describe('Customize linked doc title and description', () => {
});
test('should show emoji doc icon in journal document', async ({ page }) => {
- await waitForEditorLoad(page);
await enableEmojiDocIcon(page);
await clickNewPageButton(page);
@@ -1042,7 +1039,6 @@ test.describe('Customize linked doc title and description', () => {
});
test('should save open doc mode of internal links', async ({ page }) => {
- await waitForEditorLoad(page);
await enableEmojiDocIcon(page);
await clickNewPageButton(page);
@@ -1223,3 +1219,67 @@ test('should reach target block when clicking affine-link multiple times', async
expect(refreshKey0).not.toEqual(refreshKey1);
});
+
+test('should display date as the original title of journal', async ({
+ page,
+}) => {
+ await page.keyboard.press('Enter');
+ await createTodayPage(page);
+
+ const { toolbar, switchViewBtn, cardViewBtn } = toolbarButtons(page);
+
+ const linkedDocTitle = toolbar.locator('affine-linked-doc-title .label');
+
+ const inlineLink = page.locator('affine-reference');
+ await inlineLink.hover();
+
+ await expect(toolbar).toBeVisible();
+ await expect(linkedDocTitle).toBeHidden();
+
+ // Edits title & description
+ await toolbar.getByRole('button', { name: 'Edit' }).click();
+
+ await expect(toolbar).toBeHidden();
+
+ const popover = page.locator('reference-popup');
+
+ // Title alias
+ await page.keyboard.type('Test Page Alias Again');
+ await page.keyboard.press('Tab');
+ // Description alias
+ await page.keyboard.type('This is a new description');
+
+ await popover.getByLabel('Save').click();
+
+ await inlineLink.hover();
+ await expect(toolbar).toBeVisible();
+ await expect(linkedDocTitle).toBeVisible();
+ const inlineTitleText = (await linkedDocTitle.textContent())?.trim() ?? '';
+
+ const year = String(new Date().getFullYear());
+ expect(inlineTitleText).toContain(year);
+
+ await switchViewBtn.click();
+ await cardViewBtn.click();
+
+ const cardLink = page.locator('affine-embed-linked-doc-block');
+ await expect(cardLink).toBeVisible();
+
+ await expect(toolbar).toBeVisible();
+ await expect(linkedDocTitle).toBeVisible();
+ const cardViewTitleText = (await linkedDocTitle.textContent())?.trim() ?? '';
+
+ expect(cardViewTitleText).toBe(inlineTitleText);
+
+ // Edits title & description
+ await toolbar.getByRole('button', { name: 'Edit' }).click();
+
+ await expect(toolbar).toBeHidden();
+
+ const cardEditPopup = page.locator('embed-card-edit-modal');
+ // Resets
+ await cardEditPopup.getByRole('button', { name: 'Reset' }).click();
+
+ await expect(toolbar).toBeVisible();
+ await expect(linkedDocTitle).toBeHidden();
+});