fix(editor): guard unresolved page mentions and bare anchor links

A page mention without a slug rendered as a link ending in -null; it now
renders as plain text. A link whose href is a bare #fragment scrolls to
the target on the current page instead of opening about:blank.
This commit is contained in:
Philipinho
2026-09-07 05:03:28 +01:00
parent caf049a181
commit 84aea058f3
2 changed files with 29 additions and 3 deletions
@@ -224,6 +224,16 @@ export default function LinkView(props: MarkViewProps) {
const handleNavigate = useCallback(() => { const handleNavigate = useCallback(() => {
if (!href) return; if (!href) return;
if (href.startsWith("#")) {
const anchor = href.slice(1);
const element =
document.querySelector(`[id="${anchor}"]`) ||
document.querySelector(`[data-id="${anchor}"]`);
element?.scrollIntoView({ behavior: "smooth", block: "start" });
navigate(`${location.pathname}#${anchor}`, { replace: true });
return;
}
if (isInternal) { if (isInternal) {
let targetPath = href; let targetPath = href;
let anchor = ""; let anchor = "";
@@ -15,6 +15,7 @@ export default function MentionView(props: NodeViewProps) {
const { node } = props; const { node } = props;
const { label, entityType, entityId, slugId, anchorId } = node.attrs; const { label, entityType, entityId, slugId, anchorId } = node.attrs;
const isPageMention = entityType === "page"; const isPageMention = entityType === "page";
const hasTarget = isPageMention && !!slugId;
const { spaceSlug, pageSlug } = useParams(); const { spaceSlug, pageSlug } = useParams();
const { shareId } = useParams(); const { shareId } = useParams();
const navigate = useNavigate(); const navigate = useNavigate();
@@ -63,7 +64,22 @@ export default function MentionView(props: NodeViewProps) {
</Text> </Text>
)} )}
{isPageMention && isShareRoute && ( {isPageMention && !hasTarget && (
<Text component="span" fw={500} className={classes.pageMentionLink}>
<ActionIcon
variant="transparent"
color="gray"
component="span"
size={18}
style={{ verticalAlign: "text-bottom" }}
>
<IconFileDescription size={18} />
</ActionIcon>
<span className={classes.pageMentionText}>{label}</span>
</Text>
)}
{hasTarget && isShareRoute && (
<Anchor <Anchor
component={Link} component={Link}
fw={500} fw={500}
@@ -87,7 +103,7 @@ export default function MentionView(props: NodeViewProps) {
</Anchor> </Anchor>
)} )}
{isPageMention && !isShareRoute && isError && ( {hasTarget && !isShareRoute && isError && (
<Anchor <Anchor
component={Link} component={Link}
fw={500} fw={500}
@@ -111,7 +127,7 @@ export default function MentionView(props: NodeViewProps) {
</Anchor> </Anchor>
)} )}
{isPageMention && !isShareRoute && !isError && ( {hasTarget && !isShareRoute && !isError && (
<Anchor <Anchor
component={Link} component={Link}
fw={500} fw={500}