courrier clean 2$

README.md

@@ -68,6 +68,7 @@ All email formatting is now handled by a centralized formatter in `lib/utils/ema
 - Text direction (RTL/LTR)
 - HTML sanitization
 - Content formatting for forwards and replies
+- MIME encoding and decoding for email composition
 
 ### Key Functions
 
@@ -75,5 +76,7 @@ All email formatting is now handled by a centralized formatter in `lib/utils/ema
 - `formatReplyEmail`: Format emails for replying
 - `sanitizeHtml`: Sanitize HTML while preserving direction attributes
 - `formatEmailForReplyOrForward`: Compatibility function for both
+- `decodeComposeContent`: Parse MIME content for email composition
+- `encodeComposeContent`: Create MIME-formatted content for sending emails
 
 This centralized approach prevents formatting inconsistencies and direction problems when dealing with emails in different languages. 

components/email/ComposeEmail.tsx

@@ -187,6 +187,12 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {
         // Focus editor after initializing
         setTimeout(() => {
           if (editorRef.current) {
+            // First set the direction correctly on the editor
+            editorRef.current.dir = isRTL ? 'rtl' : 'ltr';
+            editorRef.current.style.textAlign = isRTL ? 'right' : 'left';
+            editorRef.current.style.direction = isRTL ? 'rtl' : 'ltr';
+            
+            // Then focus and position cursor
             editorRef.current.focus();
             
             try {
@@ -196,6 +202,8 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {
                 const range = document.createRange();
                 
                 if (editorRef.current.firstChild) {
+                  // For RTL, place cursor at the right side (beginning for RTL)
+                  // For LTR, place cursor at the left side (beginning for LTR)
                   range.setStart(editorRef.current.firstChild, 0);
                   range.collapse(true);
                   
@@ -212,7 +220,7 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {
         console.error('Error formatting email:', error);
       }
     }
-  }, [initialEmail, type]);
+  }, [initialEmail, type, isRTL]);
 
   // Handle attachment selection
   const handleAttachmentClick = () => {
@@ -255,10 +263,15 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {
     setAttachments(current => current.filter((_, i) => i !== index));
   };
 
-  // Handle editor input without re-sanitizing content
+  // Handle editor input with improved support for direction
   const handleEditorInput = () => {
     if (editorRef.current) {
-      // Capture innerHTML directly without reapplying sanitization
+      // Ensure text direction attributes are maintained
+      editorRef.current.dir = isRTL ? 'rtl' : 'ltr';
+      editorRef.current.style.textAlign = isRTL ? 'right' : 'left';
+      editorRef.current.style.direction = isRTL ? 'rtl' : 'ltr';
+      
+      // Capture innerHTML
       setEmailContent(editorRef.current.innerHTML);
     }
   };
@@ -271,12 +284,11 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {
     
     // Apply the direction to the editor content immediately
     if (editorRef.current) {
-      // Preserve the content but update the direction attributes
+      // Update the direction attributes correctly - this ensures proper text behavior
       editorRef.current.dir = newRTL ? 'rtl' : 'ltr';
       editorRef.current.style.textAlign = newRTL ? 'right' : 'left';
       editorRef.current.style.direction = newRTL ? 'rtl' : 'ltr';
-      
-      // No need to modify the content, just let the user edit with proper directionality
+      // Don't set unicodeBidi here which can cause text reversal problems
     }
   };
 
@@ -420,7 +432,7 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {
             </Button>
           </div>
           
-          {/* Email editor with a single editable area */}
+          {/* Email editor with correct text direction settings */}
           <div className="border rounded-md overflow-hidden">
             <div
               ref={editorRef}
@@ -433,7 +445,7 @@ export default function ComposeEmail(props: ComposeEmailAllProps) {
               style={{ 
                 textAlign: isRTL ? 'right' : 'left',
                 direction: isRTL ? 'rtl' : 'ltr',
-                unicodeBidi: 'isolate'
+                // Remove unicodeBidi which can cause text reversal issues
               }}
             />
           </div>
@@ -532,19 +544,30 @@ function LegacyAdapter({
   // Check if the user has RTL preference
   const [preferRTL, setPreferRTL] = useState<boolean>(false);
   
-  // Detect RTL content in body on initialization
+  // Detect RTL content in body on initialization - improve detection logic
   useEffect(() => {
     if (!composeBody) return;
     
+    // Only detect RTL if we're creating a new message, not for replies/forwards
+    if (originalEmail) return;
+    
     // Better RTL detection based on common RTL languages (Arabic, Hebrew, Persian, Urdu, etc.)
+    // Look for substantial presence of RTL characters, not just any single RTL character
     const rtlRegex = /[\u0591-\u07FF\uFB1D-\uFDFD\uFE70-\uFEFC]/;
     
-    // If there are RTL characters, set preferRTL to true
-    if (rtlRegex.test(composeBody)) {
+    // Count RTL characters
+    const rtlCount = (composeBody.match(rtlRegex) || []).length;
+    
+    // Only set RTL mode if there's a significant number of RTL characters
+    // This prevents accidentally enabling RTL mode for text that just has a few RTL characters
+    if (rtlCount > 5) {
+      console.log('Significant RTL text detected - setting editor to RTL mode');
       setPreferRTL(true);
-      console.log('RTL text detected - setting editor to RTL mode');
+    } else {
+      // Keep the default LTR mode for Latin/English text
+      setPreferRTL(false);
     }
-  }, [composeBody]);
+  }, [composeBody, originalEmail]);
   
   // Determine the type from the original email or subject
   const determineType = (): 'new' | 'reply' | 'reply-all' | 'forward' => {