Skip to content

Commit

Permalink
fix: markdown inline inputbox
Browse files Browse the repository at this point in the history
  • Loading branch information
urmauur committed Dec 12, 2024
1 parent 09bfc05 commit 94ec927
Showing 1 changed file with 1 addition and 90 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@
import { useCallback, useEffect, useMemo, useRef, ClipboardEvent } from 'react'

import { MessageStatus } from '@janhq/core'
import hljs from 'highlight.js'
import { useAtom, useAtomValue } from 'jotai'

import { BaseEditor, createEditor, Editor, Transforms } from 'slate'
Expand Down Expand Up @@ -134,97 +133,9 @@ const RichTextEditor = ({
})
}

if (Editor.isBlock(editor, node) && node.type === 'paragraph') {
node.children.forEach((child: { text: any }, childIndex: number) => {
const text = child.text

const codeBlockStartRegex = /```(\w*)/g
const matches = [...currentPrompt.matchAll(codeBlockStartRegex)]

if (matches.length % 2 !== 0) {
hasEndBackticks.current = false
}

// Match code block start and end
const lang = text.match(/^```(\w*)$/)
const endMatch = text.match(/^```$/)

if (lang) {
// If it's the start of a code block, store the language
currentLanguage.current = lang[1] || 'plaintext'
} else if (endMatch) {
// Reset language when code block ends
currentLanguage.current = 'plaintext'
} else if (
hasStartBackticks.current &&
hasEndBackticks.current &&
currentLanguage.current !== 'plaintext'
) {
// Highlight entire code line if in a code block

const codeContent = text.trim() // Remove leading spaces for highlighting

let highlighted = ''
highlighted = hljs.highlightAuto(codeContent).value
try {
highlighted = hljs.highlight(codeContent, {
language:
currentLanguage.current.length > 1
? currentLanguage.current
: 'plaintext',
}).value
} catch (err) {
highlighted = hljs.highlight(codeContent, {
language: 'javascript',
}).value
}

const parser = new DOMParser()
const doc = parser.parseFromString(highlighted, 'text/html')

let slateTextIndex = 0

doc.body.childNodes.forEach((childNode) => {
const childText = childNode.textContent || ''

const length = childText.length
const className =
childNode.nodeType === Node.ELEMENT_NODE
? (childNode as HTMLElement).className
: ''

ranges.push({
anchor: {
path: [...path, childIndex],
offset: slateTextIndex,
},
focus: {
path: [...path, childIndex],
offset: slateTextIndex + length,
},
type: 'code',
code: true,
language: currentLanguage.current,
className,
})

slateTextIndex += length
})
} else {
currentLanguage.current = 'plaintext'
ranges.push({
anchor: { path: [...path, childIndex], offset: 0 },
focus: { path: [...path, childIndex], offset: text.length },
type: 'paragraph', // Treat as a paragraph
code: false,
})
}
})
}

return ranges

Check warning on line 136 in web/screens/Thread/ThreadCenterPanel/ChatInput/RichTextEditor.tsx

View workflow job for this annotation

GitHub Actions / coverage-check

136 line is not covered with tests
},
[currentPrompt, editor]
[editor]
)

// RenderLeaf applies the decoration styles
Expand Down

0 comments on commit 94ec927

Please sign in to comment.