From e71289c911069841115b8cc5a243f2ba1e4132ef Mon Sep 17 00:00:00 2001 From: alma Date: Fri, 25 Apr 2025 22:07:24 +0200 Subject: [PATCH] panel 2 courier api restore --- components/ComposeEmail.tsx | 118 +++++++++++++----------------------- 1 file changed, 43 insertions(+), 75 deletions(-) diff --git a/components/ComposeEmail.tsx b/components/ComposeEmail.tsx index ba31cca4..64586e5a 100644 --- a/components/ComposeEmail.tsx +++ b/components/ComposeEmail.tsx @@ -159,17 +159,9 @@ export default function ComposeEmail({ // Now proceed with the usual decoding const type = replyTo ? 'reply' : 'forward'; - // ========== MATCH PANEL 3 CONTENT HANDLING ========== + // DIRECTLY MATCH PANEL 3 IMPLEMENTATION try { - // Get the actual email content - similar to panel 3 - const formattedEmail = emailToProcess.content.trim(); - if (!formattedEmail) { - throw new Error("Email content is empty"); - } - - // Parse the email just like panel 3 - const decoded = await decodeEmail(formattedEmail); - + const decoded = await decodeEmail(emailToProcess.content); console.log('[DEBUG] Decoded email for compose:', { hasHtml: !!decoded.html, hasText: !!decoded.text, @@ -177,79 +169,43 @@ export default function ComposeEmail({ subject: decoded.subject }); - // Get clean content similar to Panel 3 - let cleanContent = ''; + let formattedContent = ''; - if (decoded.html) { - // Sanitize HTML exactly as in Panel 3 - cleanContent = DOMPurify.sanitize(decoded.html); - } else if (decoded.text) { - // Format text content with proper whitespace like Panel 3 - cleanContent = `
${decoded.text}
`; + if (type === 'forward') { + // EXACTLY MATCH THE FORMAT USED IN PANEL 3 (from ReplyContent in app/courrier/page.tsx) + formattedContent = ` +
+

---------- Forwarded message ---------

+

From: ${decoded.from || ''}

+

Date: ${formatDate(decoded.date ? new Date(decoded.date) : null)}

+

Subject: ${decoded.subject || ''}

+

To: ${decoded.to || ''}

+
+ ${decoded.html || `
${decoded.text || ''}
`} +
+ `; } else { - // Fallback to raw content if parsing failed - if (formattedEmail.startsWith('<') && formattedEmail.endsWith('>')) { - cleanContent = DOMPurify.sanitize(formattedEmail); - } else { - cleanContent = `
${formattedEmail}
`; - } + formattedContent = ` +
+

On ${formatDate(decoded.date ? new Date(decoded.date) : null)}, ${decoded.from || ''} wrote:

+
+ ${decoded.html || `
${decoded.text || ''}
`} +
+
+ `; } - - // Extract reliable metadata - const from = decoded.from || - (emailToProcess.fromName ? `${emailToProcess.fromName} <${emailToProcess.from}>` : emailToProcess.from) || - 'Unknown Sender'; - - const date = decoded.date ? - new Date(decoded.date).toLocaleString() : - (emailToProcess.date ? new Date(emailToProcess.date).toLocaleString() : new Date().toLocaleString()); - - const subject = decoded.subject || emailToProcess.subject || 'No Subject'; - - const to = decoded.to || - (emailToProcess.to && Array.isArray(emailToProcess.to) ? - emailToProcess.to.map((t: any) => t.address || t.name || '').filter(Boolean).join(', ') : - emailToProcess.to) || - ''; - - const cc = decoded.cc || - (emailToProcess.cc && Array.isArray(emailToProcess.cc) ? - emailToProcess.cc.map((c: any) => c.address || c.name || '').filter(Boolean).join(', ') : - emailToProcess.cc) || - ''; - - // Format the content based on reply type - const quotedContent = type === 'forward' ? ` -
- ---------- Forwarded message ---------
- From: ${from}
- Date: ${date}
- Subject: ${subject}
- To: ${to}
- ${cc ? `Cc: ${cc}
` : ''} -
-
- ${cleanContent || '
No content available
'} -
- ` : ` -
- On ${date}, ${from} wrote: -
-
- ${cleanContent || '
No content available
'} -
- `; // Set the content in the compose area with proper structure - const formattedContent = ` + const sanitizedContent = DOMPurify.sanitize(formattedContent); + const wrappedContent = `

- ${quotedContent} + ${sanitizedContent}
`; if (composeBodyRef.current) { - composeBodyRef.current.innerHTML = formattedContent; + composeBodyRef.current.innerHTML = wrappedContent; // Place cursor at the beginning before the quoted content const selection = window.getSelection(); @@ -264,7 +220,7 @@ export default function ComposeEmail({ } // After setting the HTML content, add event listeners for scrolling - const messageContents = composeBodyRef.current.querySelectorAll('.message-content'); + const messageContents = composeBodyRef.current.querySelectorAll('.message-content, .forwarded-message, .quoted-message'); messageContents.forEach(container => { // Make sure the container is properly styled for scrolling (container as HTMLElement).style.maxHeight = '300px'; @@ -296,8 +252,8 @@ export default function ComposeEmail({ }); // Update compose state - setComposeBody(formattedContent); - setLocalContent(formattedContent); + setComposeBody(wrappedContent); + setLocalContent(wrappedContent); console.log('[DEBUG] Successfully set compose content with scrollable message area'); } } catch (error) { @@ -485,6 +441,18 @@ export default function ComposeEmail({ } }; + // Add formatDate function to match Panel 3 exactly + function formatDate(date: Date | null): string { + if (!date) return ''; + return new Intl.DateTimeFormat('fr-FR', { + day: '2-digit', + month: '2-digit', + year: 'numeric', + hour: '2-digit', + minute: '2-digit' + }).format(date); + } + if (!showCompose) return null; return (