refactor: clean up markdown serialization, use @tiptap/markdown API

- Remove old addStorage.markdown.serialize (community tiptap-markdown)
- Keep only renderMarkdown (official @tiptap/markdown)
- Update TextView.tsx to use @tiptap/markdown with contentType

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Anton Tranelis 2026-01-14 17:29:22 +01:00
parent acda71ee7b
commit 90eb66bc80

View File

@ -1,8 +1,8 @@
import { Markdown } from '@tiptap/markdown'
import { EditorContent, useEditor } from '@tiptap/react' import { EditorContent, useEditor } from '@tiptap/react'
import { StarterKit } from '@tiptap/starter-kit' import { StarterKit } from '@tiptap/starter-kit'
import { useEffect, useRef } from 'react' import { useEffect, useRef } from 'react'
import { useNavigate } from 'react-router-dom' import { useNavigate } from 'react-router-dom'
import { Markdown } from 'tiptap-markdown'
import { useAddFilterTag } from '#components/Map/hooks/useFilter' import { useAddFilterTag } from '#components/Map/hooks/useFilter'
import { useGetItemColor } from '#components/Map/hooks/useItemColor' import { useGetItemColor } from '#components/Map/hooks/useItemColor'
@ -10,7 +10,6 @@ import { useItems } from '#components/Map/hooks/useItems'
import { useTags } from '#components/Map/hooks/useTags' import { useTags } from '#components/Map/hooks/useTags'
import { Hashtag, ItemMention, VideoEmbed } from '#components/TipTap/extensions' import { Hashtag, ItemMention, VideoEmbed } from '#components/TipTap/extensions'
import { import {
preprocessMarkdown,
removeMarkdownSyntax, removeMarkdownSyntax,
truncateMarkdown, truncateMarkdown,
} from '#components/TipTap/utils/preprocessMarkdown' } from '#components/TipTap/utils/preprocessMarkdown'
@ -63,18 +62,11 @@ export const TextView = ({
innerText = truncateMarkdown(removeMarkdownSyntax(innerText), 100) innerText = truncateMarkdown(removeMarkdownSyntax(innerText), 100)
} }
// Pre-process the markdown
const processedText = innerText ? preprocessMarkdown(innerText) : ''
const editor = useEditor( const editor = useEditor(
{ {
extensions: [ extensions: [
StarterKit, StarterKit,
Markdown.configure({ Markdown,
html: true, // Allow HTML in markdown (for our preprocessed tags)
transformPastedText: true,
linkify: true,
}),
Hashtag.configure({ Hashtag.configure({
tags, tags,
onTagClick: (tag) => { onTagClick: (tag) => {
@ -87,7 +79,8 @@ export const TextView = ({
}), }),
VideoEmbed, VideoEmbed,
], ],
content: processedText, content: innerText,
contentType: 'markdown',
editable: false, editable: false,
editorProps: { editorProps: {
attributes: { attributes: {
@ -95,13 +88,13 @@ export const TextView = ({
}, },
}, },
}, },
[processedText, tags], [innerText, tags],
) )
// Update content when text changes // Update content when text changes
useEffect(() => { useEffect(() => {
editor.commands.setContent(processedText) editor.commands.setContent(innerText, { contentType: 'markdown' })
}, [editor, processedText]) }, [editor, innerText])
// Handle link clicks for internal navigation // Handle link clicks for internal navigation
useEffect(() => { useEffect(() => {