Embed another page's LIVE content into a host page (it updates when the source
changes, not a static copy). A page can be flagged a template for discovery in
the picker; any accessible page can be embedded.
Server:
- migrations: pages.is_template (+ partial index) and page_template_references
(whole-page back-refs); db.d.ts/entity types hand-merged (db.d.ts is curated).
- POST /pages/toggle-template (CASL Edit) flips is_template; is_template is
returned by findById + the sidebar tree select so the tree menu label
reflects state. Search suggestions gain an onlyTemplates filter for the picker.
- POST /pages/template/lookup ({sourcePageIds[]}, <=50): returns each accessible
source's {title, icon, slugId, content, sourceUpdatedAt} with comment marks
stripped (same access path as transclusion: filterViewerAccessiblePageIds;
inaccessible -> no_access, missing -> not_found; error path -> not_found, never
raw content).
- reference sync (collectPageEmbedsFromPmJson + syncPageTemplateReferences) on
the Yjs save hook; duplicatePage remaps pageEmbed.sourcePageId + inserts refs.
Known MVP gap: REST content updates don't resync refs (lookup uses in-doc ids).
Client:
- pageEmbed node (editor-ext, registered in BOTH client + server schemas);
read-only NodeView with a batching lookup; '/Embed page' slash + template
picker (self-embed prevented); 'Make/Unset template' in the tree node menu.
- Cycle guard: an ancestry-chain context + depth cap (5) render a 'circular
embed' placeholder instead of recursing.
- Public shares show a placeholder (no public lookup in MVP).
MVP excludes (follow-ups): public-share lookup, unsync->static copy, server-side
expansion for export/RAG, MCP schema mirror, point-in-time snapshots.
Implements docs/page-templates-plan.md (MVP, variant A).
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
50 lines
1.4 KiB
TypeScript
50 lines
1.4 KiB
TypeScript
import { EditorProvider } from "@tiptap/react";
|
|
import { useMemo } from "react";
|
|
import { mainExtensions } from "@/features/editor/extensions/extensions";
|
|
import { UniqueID } from "@docmost/editor-ext";
|
|
|
|
type Props = {
|
|
content: unknown;
|
|
};
|
|
|
|
/**
|
|
* Read-only nested renderer for embedded whole-page content. Same pattern as
|
|
* the transclusion read-only renderer: drop uniqueID/globalDragHandle, never
|
|
* write back, and isolate pointer/drag events from the host editor. Nested
|
|
* `pageEmbed`/`transclusionReference` nodes inside the content render with
|
|
* their own views (the cycle/depth guard lives in the node view itself).
|
|
*/
|
|
export default function PageEmbedContent({ content }: Props) {
|
|
const extensions = useMemo(() => {
|
|
const filtered = mainExtensions.filter(
|
|
(e: any) => e.name !== "uniqueID" && e.name !== "globalDragHandle",
|
|
);
|
|
return [
|
|
...filtered,
|
|
UniqueID.configure({
|
|
types: ["heading", "paragraph", "transclusionSource"],
|
|
updateDocument: false,
|
|
}),
|
|
];
|
|
}, []);
|
|
|
|
const stop = (e: React.SyntheticEvent) => e.stopPropagation();
|
|
|
|
return (
|
|
<div
|
|
onMouseDown={stop}
|
|
onClick={stop}
|
|
onDragStart={stop}
|
|
onDragOver={stop}
|
|
onDrop={stop}
|
|
>
|
|
<EditorProvider
|
|
editable={false}
|
|
immediatelyRender={true}
|
|
extensions={extensions}
|
|
content={content as any}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|