diff --git a/components/ComposeEmail.tsx b/components/ComposeEmail.tsx index fba828e2..d739d031 100644 --- a/components/ComposeEmail.tsx +++ b/components/ComposeEmail.tsx @@ -62,27 +62,19 @@ export default function ComposeEmail({ useEffect(() => { if (composeBodyRef.current) { const decodedContent = decodeComposeContent(composeBody); - composeBodyRef.current.innerHTML = decodedContent; + composeBodyRef.current.innerHTML = `

${decodedContent}`; + const range = document.createRange(); + const sel = window.getSelection(); + range.setStart(composeBodyRef.current, 0); + range.collapse(true); + sel?.removeAllRanges(); + sel?.addRange(range); } }, [composeBody]); const handleInput = (e: React.FormEvent) => { if (composeBodyRef.current) { - // Get the current content - const content = composeBodyRef.current.innerHTML; - - // Create a temporary div to parse the content - const tempDiv = document.createElement('div'); - tempDiv.innerHTML = content; - - // Check if the content contains RTL text - const hasRTL = /[\u0591-\u07FF\u200F\u202B\u202E\uFB1D-\uFDFD\uFE70-\uFEFC]/.test(content); - - // Set the appropriate direction - composeBodyRef.current.dir = hasRTL ? 'rtl' : 'ltr'; - - // Encode the content - const encodedContent = encodeComposeContent(content); + const encodedContent = encodeComposeContent(composeBodyRef.current.innerHTML); setComposeBody(encodedContent); } }; @@ -267,8 +259,8 @@ export default function ComposeEmail({ className="w-full h-full mt-1 bg-white border border-gray-300 rounded-md p-2 text-gray-900 overflow-y-auto" style={{ minHeight: '200px', - textAlign: 'left', - unicodeBidi: 'bidi-override' + textAlign: 'start', + unicodeBidi: 'plaintext' }} dir="auto" />