From 3aa2f2013df7e2e27eb60afd2816db9ac1f9a2ca Mon Sep 17 00:00:00 2001 From: fantasticit Date: Sat, 18 Jun 2022 14:03:38 +0800 Subject: [PATCH] tiptap: update the way to set default title --- .../components/wiki/setting/import/editor.tsx | 11 +++++++--- .../components/wiki/setting/import/index.tsx | 1 + .../html-to-prosemirror/index.ts | 22 +++++++++++++------ .../markdown-to-prosemirror/index.tsx | 4 ++-- pnpm-lock.yaml | 18 ++++++++++++++- 5 files changed, 43 insertions(+), 13 deletions(-) diff --git a/packages/client/src/components/wiki/setting/import/editor.tsx b/packages/client/src/components/wiki/setting/import/editor.tsx index bc7cdcba..d23aff6c 100644 --- a/packages/client/src/components/wiki/setting/import/editor.tsx +++ b/packages/client/src/components/wiki/setting/import/editor.tsx @@ -8,7 +8,7 @@ import { prosemirrorJSONToYDoc } from 'tiptap/core/thritypart/y-prosemirror/y-pr import { markdownToProsemirror } from 'tiptap/markdown/markdown-to-prosemirror'; import * as Y from 'yjs'; -export const ImportEditor = ({ content, onChange, onError }) => { +export const ImportEditor = ({ filename, content, onChange, onError }) => { const parsed = useRef(false); const ydoc = useMemo(() => new Y.Doc(), []); const editor = useEditor( @@ -24,7 +24,12 @@ export const ImportEditor = ({ content, onChange, onError }) => { if (!content || !editor || !ydoc || parsed.current) return; try { - const prosemirrorNode = markdownToProsemirror({ schema: editor.schema, content, needTitle: true }); + const prosemirrorNode = markdownToProsemirror({ + schema: editor.schema, + content, + needTitle: true, + defaultTitle: filename.replace(/\.md$/gi, ''), + }); const title = prosemirrorNode.content[0].content[0].text; editor.commands.setContent(prosemirrorNode); @@ -48,7 +53,7 @@ export const ImportEditor = ({ content, onChange, onError }) => { ydoc.destroy(); editor.destroy(); }; - }, [editor, ydoc, content, onChange, onError]); + }, [editor, ydoc, filename, content, onChange, onError]); return null; }; diff --git a/packages/client/src/components/wiki/setting/import/index.tsx b/packages/client/src/components/wiki/setting/import/index.tsx index 45252c04..ce2fc3c4 100644 --- a/packages/client/src/components/wiki/setting/import/index.tsx +++ b/packages/client/src/components/wiki/setting/import/index.tsx @@ -127,6 +127,7 @@ export const Import: React.FC = ({ wikiId }) => { return ( { +export const htmlToPromsemirror = (body, forceATitle = false, defaultTitle = '') => { const json = renderer.render(body); // 设置标题 if (forceATitle) { - const firstNode = json.content[0]; - if (firstNode && firstNode.type !== 'title') { - if (firstNode.type === 'heading' || firstNode.type === 'paragraph') { - firstNode.type = 'title'; - } - } + const forceTitleNode = json.content.find((node) => { + return node.type === 'heading' || node.type === 'paragraph'; + }); + + json.content.unshift({ + type: 'title', + content: [ + { + type: 'text', + text: defaultTitle || forceTitleNode?.content[0]?.text.slice(0, 50), + }, + ], + }); } const nodes = json.content; diff --git a/packages/client/src/tiptap/markdown/markdown-to-prosemirror/index.tsx b/packages/client/src/tiptap/markdown/markdown-to-prosemirror/index.tsx index 68991ef1..728ccbee 100644 --- a/packages/client/src/tiptap/markdown/markdown-to-prosemirror/index.tsx +++ b/packages/client/src/tiptap/markdown/markdown-to-prosemirror/index.tsx @@ -25,7 +25,7 @@ const extractImage = (html) => { }; // 将 markdown 字符串转换为 ProseMirror JSONDocument -export const markdownToProsemirror = ({ schema, content, needTitle }) => { +export const markdownToProsemirror = ({ schema, content, needTitle, defaultTitle = '' }) => { const html = markdownToHTML(content); if (!html) return null; @@ -34,7 +34,7 @@ export const markdownToProsemirror = ({ schema, content, needTitle }) => { const { body } = parser.parseFromString(extractImage(html), 'text/html'); body.append(document.createComment(content)); - const node = htmlToPromsemirror(body, needTitle); + const node = htmlToPromsemirror(body, needTitle, defaultTitle); return node; }; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 5ee6947e..2ce0d89b 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -248,7 +248,7 @@ importers: eslint: 8.14.0 eslint-config-prettier: 8.5.0_eslint@8.14.0 eslint-plugin-import: 2.26.0_eslint@8.14.0 - eslint-plugin-prettier: 4.0.0_740be41c8168d0cc214a306089357ad0 + eslint-plugin-prettier: 4.0.0_74ebb802163a9b4fa8f89d76ed02f62a eslint-plugin-react: 7.29.4_eslint@8.14.0 eslint-plugin-react-hooks: 4.5.0_eslint@8.14.0 eslint-plugin-simple-import-sort: 7.0.0_eslint@8.14.0 @@ -5605,6 +5605,22 @@ packages: prettier-linter-helpers: 1.0.0 dev: true + /eslint-plugin-prettier/4.0.0_74ebb802163a9b4fa8f89d76ed02f62a: + resolution: {integrity: sha512-98MqmCJ7vJodoQK359bqQWaxOE0CS8paAz/GgjaZLyex4TTk3g9HugoO89EqWCrFiOqn9EVvcoo7gZzONCWVwQ==} + engines: {node: '>=6.0.0'} + peerDependencies: + eslint: '>=7.28.0' + eslint-config-prettier: '*' + prettier: '>=2.0.0' + peerDependenciesMeta: + eslint-config-prettier: + optional: true + dependencies: + eslint: 8.14.0 + eslint-config-prettier: 8.5.0_eslint@8.14.0 + prettier-linter-helpers: 1.0.0 + dev: true + /eslint-plugin-react-hooks/4.5.0_eslint@8.14.0: resolution: {integrity: sha512-8k1gRt7D7h03kd+SAAlzXkQwWK22BnK6GKZG+FJA6BAGy22CFvl8kCIXKpVux0cCxMWDQUPqSok0LKaZ0aOcCw==} engines: {node: '>=10'}