fix(core): bidi links rendering issue (#5707)

This commit is contained in:
Peng Xiao
2024-01-26 06:07:04 +00:00
parent fd9a7f6aad
commit e8a6b6ad5e

View File

@@ -15,6 +15,7 @@ import React, {
useEffect, useEffect,
useMemo, useMemo,
useRef, useRef,
useState,
} from 'react'; } from 'react';
import { BlocksuiteEditorJournalDocTitle } from './journal-doc-title'; import { BlocksuiteEditorJournalDocTitle } from './journal-doc-title';
@@ -61,6 +62,8 @@ export const BlocksuiteDocEditor = forwardRef<
>(function BlocksuiteDocEditor({ page, customRenderers }, ref) { >(function BlocksuiteDocEditor({ page, customRenderers }, ref) {
const titleRef = useRef<DocTitle>(null); const titleRef = useRef<DocTitle>(null);
const docRef = useRef<DocEditor | null>(null); const docRef = useRef<DocEditor | null>(null);
const [docPage, setDocPage] =
useState<HTMLElementTagNameMap['affine-doc-page']>();
const { isJournal } = useJournalInfoHelper(page.workspace, page.id); const { isJournal } = useJournalInfoHelper(page.workspace, page.id);
const onDocRef = useCallback( const onDocRef = useCallback(
@@ -84,11 +87,15 @@ export const BlocksuiteDocEditor = forwardRef<
useEffect(() => { useEffect(() => {
// auto focus the title // auto focus the title
setTimeout(() => { setTimeout(() => {
const docPage = docRef.current?.querySelector('affine-doc-page');
if (docPage) {
setDocPage(docPage);
}
if (titleRef.current) { if (titleRef.current) {
const richText = titleRef.current.querySelector('rich-text'); const richText = titleRef.current.querySelector('rich-text');
richText?.inlineEditor?.focusEnd(); richText?.inlineEditor?.focusEnd();
} else { } else {
docRef.current?.querySelector('affine-doc-page')?.focusFirstParagraph(); docPage?.focusFirstParagraph();
} }
}); });
}, []); }, []);
@@ -110,7 +117,9 @@ export const BlocksuiteDocEditor = forwardRef<
specs={specs} specs={specs}
hasViewport={false} hasViewport={false}
/> />
<adapted.BiDirectionalLinkPanel page={page} /> {docPage ? (
<adapted.BiDirectionalLinkPanel page={page} docPageBlock={docPage} />
) : null}
</div> </div>
</div> </div>
); );