panel 2 courier api restore

This commit is contained in:
alma 2025-04-25 22:09:31 +02:00
parent e71289c911
commit 2cb180b7b0

View File

@ -169,38 +169,50 @@ export default function ComposeEmail({
subject: decoded.subject
});
let formattedContent = '';
// Create the email container with header information
let emailHeader = '';
if (type === 'forward') {
// EXACTLY MATCH THE FORMAT USED IN PANEL 3 (from ReplyContent in app/courrier/page.tsx)
formattedContent = `
<div class="forwarded-message">
emailHeader = `
<div style="border-top: 1px solid #e5e7eb; margin-top: 20px; padding-top: 20px; color: #6b7280; font-size: 14px;">
<p>---------- Forwarded message ---------</p>
<p>From: ${decoded.from || ''}</p>
<p>Date: ${formatDate(decoded.date ? new Date(decoded.date) : null)}</p>
<p>Subject: ${decoded.subject || ''}</p>
<p>To: ${decoded.to || ''}</p>
<br>
${decoded.html || `<pre>${decoded.text || ''}</pre>`}
</div>
`;
} else {
formattedContent = `
<div class="quoted-message">
emailHeader = `
<div style="border-top: 1px solid #e5e7eb; margin-top: 20px; padding-top: 20px; color: #6b7280; font-size: 14px;">
<p>On ${formatDate(decoded.date ? new Date(decoded.date) : null)}, ${decoded.from || ''} wrote:</p>
<blockquote>
${decoded.html || `<pre>${decoded.text || ''}</pre>`}
</blockquote>
</div>
`;
}
// Get the proper content with minimal sanitization to preserve structure
let emailContent = '';
if (decoded.html) {
// Preserve the HTML structure with minimal cleaning
emailContent = DOMPurify.sanitize(decoded.html, {
ADD_TAGS: ['style', 'meta'],
ADD_ATTR: ['class', 'id', 'style', 'align', 'border', 'cellpadding', 'cellspacing', 'width', 'height'],
KEEP_CONTENT: true,
WHOLE_DOCUMENT: false
});
} else if (decoded.text) {
emailContent = `<pre style="white-space: pre-wrap; font-family: inherit;">${decoded.text}</pre>`;
} else {
emailContent = '<div>No content available</div>';
}
// Set the content in the compose area with proper structure
const sanitizedContent = DOMPurify.sanitize(formattedContent);
const wrappedContent = `
<div class="compose-area" contenteditable="true" style="min-height: 100px; padding: 10px;">
<div class="cursor-position" style="min-height: 20px; cursor: text;"><br/></div>
${sanitizedContent}
${emailHeader}
<div class="email-content" style="margin-top: 10px; border: 1px solid #e5e7eb; padding: 15px; border-radius: 4px; max-height: 400px; overflow-y: auto;">
${emailContent}
</div>
</div>
`;
@ -220,14 +232,14 @@ export default function ComposeEmail({
}
// After setting the HTML content, add event listeners for scrolling
const messageContents = composeBodyRef.current.querySelectorAll('.message-content, .forwarded-message, .quoted-message');
const messageContents = composeBodyRef.current.querySelectorAll('.email-content');
messageContents.forEach(container => {
// Make sure the container is properly styled for scrolling
(container as HTMLElement).style.maxHeight = '300px';
(container as HTMLElement).style.maxHeight = '400px';
(container as HTMLElement).style.overflowY = 'auto';
(container as HTMLElement).style.border = '1px solid #e5e7eb';
(container as HTMLElement).style.borderRadius = '4px';
(container as HTMLElement).style.padding = '10px';
(container as HTMLElement).style.padding = '15px';
// Ensure wheel events are properly handled
if (!(container as HTMLElement).hasAttribute('data-scroll-handler-attached')) {