From ad1723cce982deef1fff9ef79581be3793a2348d Mon Sep 17 00:00:00 2001
From: alma <alma@governance-labs.org>
Date: Sat, 26 Apr 2025 13:28:53 +0200
Subject: [PATCH] courrier clean 2

---
 components/ComposeEmail.tsx | 49 ++++++++++++++++++++++++++++++++++---
 1 file changed, 46 insertions(+), 3 deletions(-)

diff --git a/components/ComposeEmail.tsx b/components/ComposeEmail.tsx
index f943060c..9da23628 100644
--- a/components/ComposeEmail.tsx
+++ b/components/ComposeEmail.tsx
@@ -229,7 +229,11 @@ export default function ComposeEmail({
       
       // For rich editor, combine user message with quoted content
       if (useRichEditor) {
-        const combinedContent = `${userMessage || ''}${quotedContent ? quotedContent : ''}`;
+        // Wrap the content with proper direction styles
+        const userContent = userMessage ? `<div class="force-ltr">${userMessage}</div>` : '';
+        const quotedWithStyles = quotedContent ? `<div class="force-ltr">${quotedContent}</div>` : '';
+        const combinedContent = `${userContent}${quotedWithStyles}`;
+        
         setComposeBody(combinedContent);
         
         // Wait for state update to complete
@@ -271,6 +275,34 @@ export default function ComposeEmail({
       {/* Compose Email Modal */}
       {showCompose && (
         <div className="fixed inset-0 bg-gray-600/30 backdrop-blur-sm z-50 flex items-center justify-center">
+          {/* Add global styles for email direction */}
+          <style dangerouslySetInnerHTML={{ __html: `
+            .force-ltr {
+              direction: ltr !important;
+              text-align: left !important;
+              unicode-bidi: isolate !important;
+              writing-mode: horizontal-tb !important;
+            }
+            .force-ltr * {
+              direction: ltr !important;
+              text-align: left !important;
+              unicode-bidi: isolate !important;
+            }
+            [dir="rtl"] .force-ltr,
+            [dir="rtl"] .force-ltr * {
+              direction: ltr !important;
+              text-align: left !important;
+            }
+            .email-content {
+              direction: ltr !important;
+              text-align: left !important;
+            }
+            .email-content * {
+              direction: ltr !important;
+              text-align: left !important;
+            }
+          `}} />
+          
           <div className="w-full max-w-2xl h-[80vh] bg-white rounded-xl shadow-xl flex flex-col mx-4">
             {/* Modal Header */}
             <div className="flex items-center justify-between px-6 py-3 border-b border-gray-200">
@@ -405,11 +437,17 @@ export default function ComposeEmail({
                           style={{ direction: 'ltr' }}
                         >
                           <div 
-                            className="p-3 opacity-90 text-sm email-content"
+                            className="p-3 opacity-90 text-sm email-content force-ltr"
                             contentEditable="true"
                             dangerouslySetInnerHTML={{ __html: quotedContent }}
                             onInput={(e) => {
                               const target = e.currentTarget;
+                              // Force LTR on any content added/edited using setAttribute
+                              target.querySelectorAll('*').forEach(el => {
+                                el.setAttribute('style', 'direction: ltr !important; text-align: left !important;');
+                                // Also add the class to ensure styles are applied
+                                el.classList.add('force-ltr');
+                              });
                               setQuotedContent(target.innerHTML);
                               // Update the combined content
                               if (contentEditableRef.current) {
@@ -417,7 +455,12 @@ export default function ComposeEmail({
                                 setComposeBody(combined);
                               }
                             }}
-                            style={{ direction: 'ltr', textAlign: 'left' }}
+                            style={{ 
+                              direction: 'ltr', 
+                              textAlign: 'left',
+                              unicodeBidi: 'isolate',
+                              writingMode: 'horizontal-tb'
+                            }}
                           />
                         </div>
                       )}