diff --git a/shared/editor/nodes/Heading.ts b/shared/editor/nodes/Heading.ts index a966915722..1a610e4c9c 100644 --- a/shared/editor/nodes/Heading.ts +++ b/shared/editor/nodes/Heading.ts @@ -16,7 +16,7 @@ import splitHeading from "../commands/splitHeading"; import toggleBlockType from "../commands/toggleBlockType"; import headingToSlug, { headingToPersistenceKey } from "../lib/headingToSlug"; import { MarkdownSerializerState } from "../lib/markdown/serializer"; -import { FoldingHeadersPlugin } from "../plugins/FoldingHeaders"; +import { findCollapsedNodes } from "../queries/findCollapsedNodes"; import Node from "./Node"; export default class Heading extends Node { @@ -274,7 +274,23 @@ export default class Heading extends Node { }, }); - return [new FoldingHeadersPlugin(this.editor.props.id), plugin]; + const foldPlugin: Plugin = new Plugin({ + props: { + decorations: (state) => { + const { doc } = state; + const decorations: Decoration[] = findCollapsedNodes(doc).map( + (block) => + Decoration.node(block.pos, block.pos + block.node.nodeSize, { + class: "folded-content", + }) + ); + + return DecorationSet.create(doc, decorations); + }, + }, + }); + + return [foldPlugin, plugin]; } inputRules({ type }: { type: NodeType }) { diff --git a/shared/editor/plugins/FoldingHeaders.ts b/shared/editor/plugins/FoldingHeaders.ts deleted file mode 100644 index 4c43316722..0000000000 --- a/shared/editor/plugins/FoldingHeaders.ts +++ /dev/null @@ -1,67 +0,0 @@ -import { Plugin, PluginKey } from "prosemirror-state"; -import { Decoration, DecorationSet } from "prosemirror-view"; -import Storage from "../../utils/Storage"; -import { headingToPersistenceKey } from "../lib/headingToSlug"; -import { findBlockNodes } from "../queries/findChildren"; -import { findCollapsedNodes } from "../queries/findCollapsedNodes"; - -export class FoldingHeadersPlugin extends Plugin { - constructor(documentId: string | undefined) { - const plugin = new PluginKey("folding"); - let loaded = false; - - super({ - key: plugin, - view: (view) => { - loaded = false; - view.dispatch(view.state.tr.setMeta("folding", { loaded: true })); - return {}; - }, - appendTransaction: (transactions, oldState, newState) => { - if (loaded) { - return; - } - if ( - !transactions.some((transaction) => transaction.getMeta("folding")) - ) { - return; - } - - let modified = false; - const tr = newState.tr; - const blocks = findBlockNodes(newState.doc); - - for (const block of blocks) { - if (block.node.type.name === "heading") { - const persistKey = headingToPersistenceKey(block.node, documentId); - const persistedState = Storage.get(persistKey); - - if (persistedState === "collapsed") { - tr.setNodeMarkup(block.pos, undefined, { - ...block.node.attrs, - collapsed: true, - }); - modified = true; - } - } - } - - loaded = true; - return modified ? tr : null; - }, - props: { - decorations: (state) => { - const { doc } = state; - const decorations: Decoration[] = findCollapsedNodes(doc).map( - (block) => - Decoration.node(block.pos, block.pos + block.node.nodeSize, { - class: "folded-content", - }) - ); - - return DecorationSet.create(doc, decorations); - }, - }, - }); - } -}