diff --git a/components/email/ComposeEmail.tsx b/components/email/ComposeEmail.tsx
index 5eb9a5cb..da2919f7 100644
--- a/components/email/ComposeEmail.tsx
+++ b/components/email/ComposeEmail.tsx
@@ -220,6 +220,20 @@ function isLegacyProps(props: ComposeEmailAllProps): props is LegacyComposeEmail
return 'showCompose' in props && 'setShowCompose' in props;
}
+// Create a utility function to preprocess email content
+function preprocessEmailContent(content: string): string {
+ if (!content) return '';
+
+ // Sanitize HTML content
+ const sanitized = DOMPurify.sanitize(content);
+
+ // Fix common RTL/LTR issues by ensuring consistent direction
+ // Wrap content in a div with explicit direction if needed
+ const processed = sanitized.replace(/
-
+
-
---------- Forwarded message ---------
-
From: ${fromString}
-
Date: ${dateString}
-
Subject: ${initialEmail.subject || ''}
-
To: ${toString}
+
---------- Forwarded message ---------
+
From: ${fromString}
+
Date: ${dateString}
+
Subject: ${initialEmail.subject || ''}
+
To: ${toString}
-
${originalContent}
+
${originalContent}
`;
@@ -312,11 +329,12 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {
setSubject(formattedEmail.subject);
- // Set the reply content with proper formatting
- formattedContent = formattedEmail.body;
+ // Process content to fix direction issues
+ formattedContent = preprocessEmailContent(formattedEmail.body);
}
// Set the entire content as one editable area
+ // Force LTR direction for quoted content
setBody(formattedContent);
setUserMessage(formattedContent);
@@ -324,20 +342,27 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {
setTimeout(() => {
if (editorRef.current) {
editorRef.current.focus();
+ editorRef.current.dir = isRTL ? 'rtl' : 'ltr';
// Place cursor at the beginning of the content
const selection = window.getSelection();
- const range = document.createRange();
-
- range.setStart(editorRef.current, 0);
- range.collapse(true);
-
- selection?.removeAllRanges();
- selection?.addRange(range);
+ if (selection) {
+ const range = document.createRange();
+
+ // Find the first text node or element node
+ let firstNode = editorRef.current.firstChild;
+ if (firstNode) {
+ range.setStart(firstNode, 0);
+ range.collapse(true);
+
+ selection.removeAllRanges();
+ selection.addRange(range);
+ }
+ }
}
}, 100);
}
- }, [initialEmail, type]);
+ }, [initialEmail, type, isRTL]);
// Format date for the forwarded message header
const formatDate = (date: Date | null): string => {
@@ -649,13 +674,15 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {