fix: prevent curly quotes from mcp config

This commit is contained in:
Faisal Amir 2025-04-21 09:43:42 +07:00 committed by Louis
parent 9c1f0f8a33
commit 1a3cc64a7e
No known key found for this signature in database
GPG Key ID: 44FA9F4D33C37DE2

View File

@ -1,4 +1,4 @@
import React, { useState, useEffect, useCallback } from 'react'
import React, { useState, useEffect, useCallback, useRef } from 'react'
import { Button, TextArea } from '@janhq/joi'
import { useAtomValue } from 'jotai'
@ -12,6 +12,8 @@ const MCPConfiguration = () => {
const [error, setError] = useState('')
const [success, setSuccess] = useState('')
const textAreaRef = useRef<HTMLTextAreaElement>(null)
const readConfigFile = useCallback(async () => {
try {
// Read the file
@ -76,14 +78,37 @@ const MCPConfiguration = () => {
Configuration File (JSON)
</label>
<TextArea
// className="h-80 w-full rounded border border-gray-800 p-2 font-mono text-sm"
ref={textAreaRef}
className="font-mono text-xs"
value={configContent}
rows={20}
onChange={(e) => {
setConfigContent(e.target.value)
const input = e.target
const start = input.selectionStart
const end = input.selectionEnd
// Sanitize quotes
const originalValue = input.value
const sanitizedValue = originalValue
.replace(/[“”]/g, '"')
.replace(/[]/g, "'")
// Update content
setConfigContent(sanitizedValue)
setSuccess('')
// Restore cursor after DOM updates
requestAnimationFrame(() => {
if (textAreaRef.current) {
const offset = sanitizedValue.length - originalValue.length
textAreaRef.current.selectionStart = start + offset
textAreaRef.current.selectionEnd = end + offset
}
})
}}
autoComplete="off"
autoCorrect="off"
spellCheck={false}
/>
</div>