feat(editor): page templates - live whole-page embed (MVP)

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>
This commit is contained in:
claude code agent 227
2026-06-20 10:05:00 +03:00
parent c8af637654
commit 39ae89264d
41 changed files with 1587 additions and 6 deletions

View File

@@ -22,6 +22,7 @@ export * from "./lib/search-and-replace";
export * from "./lib/embed-provider";
export * from "./lib/subpages";
export * from "./lib/transclusion";
export * from "./lib/page-embed";
export * from "./lib/highlight";
export * from "./lib/indent";
export * from "./lib/heading/heading";

View File

@@ -0,0 +1 @@
export * from "./page-embed";

View File

@@ -0,0 +1,88 @@
import { mergeAttributes, Node } from "@tiptap/core";
import { ReactNodeViewRenderer } from "@tiptap/react";
export interface PageEmbedOptions {
HTMLAttributes: Record<string, any>;
view: any;
}
export interface PageEmbedAttributes {
sourcePageId?: string | null;
}
declare module "@tiptap/core" {
interface Commands<ReturnType> {
pageEmbed: {
insertPageEmbed: (attributes: PageEmbedAttributes) => ReturnType;
};
}
}
/**
* Whole-page live embed. Holds only a `sourcePageId` reference; the node view
* fetches the source page's current content at render time, so the embed stays
* live (no snapshot is stored in the host document). Separate from
* `transclusionReference` (which addresses a single block by `transclusionId`).
*/
export const PageEmbed = Node.create<PageEmbedOptions>({
name: "pageEmbed",
addOptions() {
return {
HTMLAttributes: {},
view: null,
};
},
group: "block",
atom: true,
isolating: true,
selectable: true,
draggable: true,
addAttributes() {
return {
sourcePageId: {
default: null,
parseHTML: (el) => el.getAttribute("data-source-page-id"),
renderHTML: (attrs) =>
attrs.sourcePageId
? { "data-source-page-id": attrs.sourcePageId }
: {},
},
};
},
parseHTML() {
return [{ tag: `div[data-type="${this.name}"]` }];
},
renderHTML({ HTMLAttributes }) {
return [
"div",
mergeAttributes(
{ "data-type": this.name },
this.options.HTMLAttributes,
HTMLAttributes,
),
];
},
addCommands() {
return {
insertPageEmbed:
(attributes) =>
({ commands }) =>
commands.insertContent({
type: this.name,
attrs: attributes,
}),
};
},
addNodeView() {
if (!this.options.view) return null;
this.editor.isInitialized = true;
return ReactNodeViewRenderer(this.options.view);
},
});