diff --git a/packages/frontend/core/src/components/affine/page-properties/info-modal/info-modal.tsx b/packages/frontend/core/src/components/affine/page-properties/info-modal/info-modal.tsx index 93e167408a8d..9e4ea911c41b 100644 --- a/packages/frontend/core/src/components/affine/page-properties/info-modal/info-modal.tsx +++ b/packages/frontend/core/src/components/affine/page-properties/info-modal/info-modal.tsx @@ -5,6 +5,7 @@ import { Scrollable, } from '@affine/component'; import { DocsSearchService } from '@affine/core/modules/docs-search'; +import { useI18n } from '@affine/i18n'; import { LiveData, useLiveData, useServices } from '@toeverything/infra'; import { Suspense, useCallback, useContext, useMemo, useRef } from 'react'; @@ -16,8 +17,8 @@ import { SortableProperties, usePagePropertiesManager, } from '../table'; -import { BackLinksRow } from './back-links-row'; import * as styles from './info-modal.css'; +import { LinksRow } from './links-row'; import { TagsRow } from './tags-row'; import { TimeRow } from './time-row'; @@ -30,22 +31,12 @@ export const InfoModal = ({ onOpenChange: (open: boolean) => void; docId: string; }) => { - const { docsSearchService } = useServices({ - DocsSearchService, - }); const titleInputHandleRef = useRef(null); const manager = usePagePropertiesManager(docId); const handleClose = useCallback(() => { onOpenChange(false); }, [onOpenChange]); - const references = useLiveData( - useMemo( - () => LiveData.from(docsSearchService.watchRefsFrom(docId), null), - [docId, docsSearchService] - ) - ); - if (!manager.page || manager.readonly) { return null; } @@ -76,7 +67,6 @@ export const InfoModal = ({ @@ -90,29 +80,52 @@ export const InfoModal = ({ const InfoTable = ({ onClose, - references, docId, readonly, }: { docId: string; onClose: () => void; readonly: boolean; - references: - | { - docId: string; - title: string; - }[] - | null; }) => { + const t = useI18n(); const manager = useContext(managerContext); + const { docsSearchService } = useServices({ + DocsSearchService, + }); + const links = useLiveData( + useMemo( + () => LiveData.from(docsSearchService.watchRefsFrom(docId), null), + [docId, docsSearchService] + ) + ); + const backlinks = useLiveData( + useMemo( + () => LiveData.from(docsSearchService.watchRefsTo(docId), null), + [docId, docsSearchService] + ) + ); return (
- {references && references.length > 0 ? ( + {backlinks && backlinks.length > 0 ? ( + <> + + + + ) : null} + {links && links.length > 0 ? ( <> - + ) : null} diff --git a/packages/frontend/core/src/components/affine/page-properties/info-modal/back-links-row.css.ts b/packages/frontend/core/src/components/affine/page-properties/info-modal/links-row.css.ts similarity index 100% rename from packages/frontend/core/src/components/affine/page-properties/info-modal/back-links-row.css.ts rename to packages/frontend/core/src/components/affine/page-properties/info-modal/links-row.css.ts diff --git a/packages/frontend/core/src/components/affine/page-properties/info-modal/back-links-row.tsx b/packages/frontend/core/src/components/affine/page-properties/info-modal/links-row.tsx similarity index 70% rename from packages/frontend/core/src/components/affine/page-properties/info-modal/back-links-row.tsx rename to packages/frontend/core/src/components/affine/page-properties/info-modal/links-row.tsx index e32cdadac560..1d389112122b 100644 --- a/packages/frontend/core/src/components/affine/page-properties/info-modal/back-links-row.tsx +++ b/packages/frontend/core/src/components/affine/page-properties/info-modal/links-row.tsx @@ -1,22 +1,24 @@ -import { useI18n } from '@affine/i18n'; +import type { Backlink, Link } from '@affine/core/modules/doc-link'; import { useContext } from 'react'; import { AffinePageReference } from '../../reference-link'; import { managerContext } from '../common'; -import * as styles from './back-links-row.css'; -export const BackLinksRow = ({ +import * as styles from './links-row.css'; + +export const LinksRow = ({ references, + label, onClick, }: { - references: { docId: string; title: string }[]; + references: Backlink[] | Link[]; + label: string; onClick?: () => void; }) => { const manager = useContext(managerContext); - const t = useI18n(); return (
- {t['com.affine.page-properties.backlinks']()} · {references.length} + {label} · {references.length}
{references.map(link => ( { DocLinksService, WorkspaceService, }); + const t = useI18n(); const links = useLiveData(docLinksService.links.links$); const backlinks = useLiveData(docLinksService.backlinks.backlinks$); @@ -44,7 +46,7 @@ export const BiDirectionalLinkPanel = () => {
- Backlinks · {backlinks.length} + {t['com.affine.page-properties.backlinks']()} · {backlinks.length}
{backlinks.map(link => (
@@ -58,7 +60,8 @@ export const BiDirectionalLinkPanel = () => {
- Outgoing links · {links.length} + {t['com.affine.page-properties.outgoing-links']()} ·{' '} + {links.length}
{links.map(link => (
diff --git a/packages/frontend/core/src/modules/doc-link/entities/doc-backlinks.ts b/packages/frontend/core/src/modules/doc-link/entities/doc-backlinks.ts index e0a64d57944e..8ca7c6d985d1 100644 --- a/packages/frontend/core/src/modules/doc-link/entities/doc-backlinks.ts +++ b/packages/frontend/core/src/modules/doc-link/entities/doc-backlinks.ts @@ -3,7 +3,7 @@ import { Entity, LiveData } from '@toeverything/infra'; import type { DocsSearchService } from '../../docs-search'; -interface Backlink { +export interface Backlink { docId: string; blockId: string; title: string; diff --git a/packages/frontend/core/src/modules/doc-link/entities/doc-links.ts b/packages/frontend/core/src/modules/doc-link/entities/doc-links.ts index 52665aefd626..3f3033a4c252 100644 --- a/packages/frontend/core/src/modules/doc-link/entities/doc-links.ts +++ b/packages/frontend/core/src/modules/doc-link/entities/doc-links.ts @@ -3,7 +3,7 @@ import { Entity, LiveData } from '@toeverything/infra'; import type { DocsSearchService } from '../../docs-search'; -interface Link { +export interface Link { docId: string; title: string; } diff --git a/packages/frontend/core/src/modules/doc-link/index.ts b/packages/frontend/core/src/modules/doc-link/index.ts index c9b923bc6563..6db0af6d1417 100644 --- a/packages/frontend/core/src/modules/doc-link/index.ts +++ b/packages/frontend/core/src/modules/doc-link/index.ts @@ -10,6 +10,8 @@ import { DocBacklinks } from './entities/doc-backlinks'; import { DocLinks } from './entities/doc-links'; import { DocLinksService } from './services/doc-links'; +export type { Backlink } from './entities/doc-backlinks'; +export type { Link } from './entities/doc-links'; export { DocLinksService } from './services/doc-links'; export function configureDocLinksModule(framework: Framework) { diff --git a/packages/frontend/i18n/src/resources/en.json b/packages/frontend/i18n/src/resources/en.json index 387167801b62..95816d7692e7 100644 --- a/packages/frontend/i18n/src/resources/en.json +++ b/packages/frontend/i18n/src/resources/en.json @@ -851,6 +851,7 @@ "com.affine.page-properties.add-property.menu.create": "Create property", "com.affine.page-properties.add-property.menu.header": "Properties", "com.affine.page-properties.backlinks": "Backlinks", + "com.affine.page-properties.outgoing-links": "Outgoing links", "com.affine.page-properties.create-property.menu.header": "Type", "com.affine.page-properties.icons": "Icons", "com.affine.page-properties.page-info": "Info",