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"
/>