fix(chart): simplify node insertion using commands API

Use editor.commands.insertContent with JSON node definition instead of
direct transaction manipulation. This is more reliable for custom nodes.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

memento-note/components/rich-text-editor.tsx

@@ -297,37 +297,23 @@ export const RichTextEditor = forwardRef<RichTextEditorHandle, RichTextEditorPro
       try {
         console.log('[handleSelectChart] Inserting chart type:', chartContent.split('\n')[0])
 
-        const { from } = editor.state.selection
+        // Use TipTap's insertContent with proper JSON content
-        const { tr } = editor.state
+        // This is the most reliable way to insert custom nodes
-        const { schema } = editor.state
+        editor.commands.insertContent([
+          {
+            type: 'chartBlock',
+            attrs: {
+              code: chartContent,
+              language: 'chart'
+            }
+          },
+          {
+            type: 'paragraph',
+            content: []
+          }
+        ])
 
-        // Create the chartBlock node directly
+        console.log('[handleSelectChart] Chart inserted')
-        const chartNode = schema.nodes.chartBlock.create({
-          code: chartContent,
-          language: 'chart'
-        })
-
-        if (!chartNode) {
-          console.error('[handleSelectChart] Failed to create chartBlock node')
-          toast.error('Chart extension not available')
-          return
-        }
-
-        // Insert the chart node at current position
-        const transaction = tr.insert(from, chartNode)
-
-        // Get the position after the inserted chart
-        const insertPos = transaction.mapping.map(from)
-        const chartSize = chartNode.nodeSize
-
-        // Add a paragraph after for continued typing
-        const paragraph = schema.nodes.paragraph.create()
-        transaction.insert(insertPos + chartSize, paragraph)
-
-        editor.view.dispatch(transaction)
-        editor.chain().focus().run()
-
-        console.log('[handleSelectChart] Chart inserted successfully')
       } catch (error) {
         console.error('[handleSelectChart] Failed:', error)
         toast.error('Failed to insert chart: ' + (error as Error).message)