courrier clean 2$

This commit is contained in:
alma 2025-04-26 20:09:09 +02:00
parent aeaa086b40
commit d7bbb68b5e

View File

@ -55,6 +55,15 @@ import { decodeEmail, cleanHtml } from '@/lib/mail-parser-wrapper';
import { Attachment as MailParserAttachment } from 'mailparser';
import { LoadingFix } from './loading-fix';
// Import centralized email formatters
import {
formatForwardedEmail,
formatReplyEmail,
formatEmailForReplyOrForward,
EmailMessage as FormatterEmailMessage,
cleanHtmlContent
} from '@/lib/utils/email-formatter';
export interface Account {
id: number;
name: string;
@ -369,34 +378,36 @@ function ReplyContent({ email, type }: { email: Email; type: 'reply' | 'reply-al
return;
}
const decoded = await decodeEmail(email.content);
// Create a formatter-compatible email object
const emailForFormatter: FormatterEmailMessage = {
id: email.id,
subject: email.subject || '',
from: [{
name: email.fromName || email.from.split('@')[0] || '',
address: email.from
}],
to: [{
name: '',
address: email.to
}],
date: new Date(email.date),
content: email.content,
html: email.content,
text: ''
};
if (mounted) {
let formattedContent = '';
if (type === 'forward') {
formattedContent = `
<div class="forwarded-message">
<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">
<p>On ${formatDate(decoded.date ? new Date(decoded.date) : null)}, ${decoded.from || ''} wrote:</p>
<blockquote>
${decoded.html || `<pre>${decoded.text || ''}</pre>`}
</blockquote>
</div>
`;
}
// Use centralized formatters
let formattedContent = '';
if (type === 'forward') {
const formatted = formatForwardedEmail(emailForFormatter);
formattedContent = formatted.content;
} else {
const formatted = formatReplyEmail(emailForFormatter, type as 'reply' | 'reply-all');
formattedContent = formatted.content;
}
if (mounted) {
setContent(formattedContent);
setError(null);
}
@ -414,7 +425,7 @@ function ReplyContent({ email, type }: { email: Email; type: 'reply' | 'reply-al
return () => {
mounted = false;
};
}, [email.content, type]);
}, [email.content, type, email.id, email.subject, email.from, email.fromName, email.to, email.date]);
if (error) {
return <div className="text-red-500">{error}</div>;
@ -1617,12 +1628,12 @@ export default function CourrierPage() {
// New helper function to directly format email content
const formatEmailAndShowCompose = (email: Email, type: 'reply' | 'reply-all' | 'forward') => {
// Create an EmailMessage compatible object for the ComposeEmail component
const emailForCompose = {
const emailForCompose: FormatterEmailMessage = {
id: email.id,
messageId: '',
subject: email.subject,
from: [{
name: email.fromName || email.from,
name: email.fromName || email.from.split('@')[0] || '',
address: email.from
}],
to: [{
@ -1631,48 +1642,26 @@ export default function CourrierPage() {
}],
date: new Date(email.date),
content: email.content,
// Add html and text properties if needed by the ComposeEmail component
html: email.content, // Use content as html
html: email.content,
text: '',
hasAttachments: email.attachments ? email.attachments.length > 0 : false,
folder: email.folder
};
// Format appropriate content with headers for reply/forward
// Use centralized formatters to ensure consistent formatting
let formattedContent = '';
const formattedDate = formatDate(new Date(email.date));
let formattedSubject = '';
let formattedTo = '';
if (type === 'reply' || type === 'reply-all') {
// Create reply quote header
formattedContent = `
<div class="reply-body">
<br/>
<div class="quote-header" style="color: #555; font-size: 13px; margin: 20px 0 10px 0;">
<div style="font-weight: 500;">On ${formattedDate}, ${email.fromName ? `${email.fromName} <${email.from}>` : email.from} wrote:</div>
</div>
<blockquote style="margin: 0; padding: 10px 0 10px 15px; border-left: 3px solid #ddd; color: #555; background-color: #f8f8f8; border-radius: 4px;">
<div class="quoted-content" style="font-size: 13px;">
${email.content || '<p>No content available</p>'}
</div>
</blockquote>
</div>
`;
const formatted = formatReplyEmail(emailForCompose, type);
formattedContent = formatted.content;
formattedSubject = formatted.subject;
formattedTo = formatted.to;
} else if (type === 'forward') {
// Create forward header
formattedContent = `
<div class="forwarded-message" style="margin-top: 20px;">
<div style="background-color: #f5f5f5; border-left: 3px solid #ddd; padding: 12px; margin-bottom: 15px; border-radius: 4px;">
<p style="margin: 0 0 8px 0; font-weight: 500; color: #555; font-size: 14px;">---------- Forwarded message ---------</p>
<p style="margin: 0 0 6px 0; font-size: 13px;"><span style="font-weight: 600; color: #444;">From:</span> ${email.fromName ? `${email.fromName} <${email.from}>` : email.from}</p>
<p style="margin: 0 0 6px 0; font-size: 13px;"><span style="font-weight: 600; color: #444;">Date:</span> ${formattedDate}</p>
<p style="margin: 0 0 6px 0; font-size: 13px;"><span style="font-weight: 600; color: #444;">Subject:</span> ${email.subject || ''}</p>
<p style="margin: 0 0 6px 0; font-size: 13px;"><span style="font-weight: 600; color: #444;">To:</span> ${email.to || ''}</p>
</div>
<div class="forwarded-content" style="border-left: 2px solid #ddd; padding-left: 15px; color: #333;">
${email.content || '<p>No content available</p>'}
</div>
</div>
`;
const formatted = formatForwardedEmail(emailForCompose);
formattedContent = formatted.content;
formattedSubject = formatted.subject;
}
// Set state for compose form
@ -1689,12 +1678,12 @@ export default function CourrierPage() {
setShowCompose(true);
if (type === 'reply' || type === 'reply-all') {
setComposeTo(type === 'reply' ? email.from : `${email.from}; ${email.to}`);
setComposeSubject(email.subject.startsWith('Re:') ? email.subject : `Re: ${email.subject}`);
setComposeTo(formattedTo);
setComposeSubject(formattedSubject);
setComposeBody(formattedContent);
} else if (type === 'forward') {
setComposeTo('');
setComposeSubject(email.subject.startsWith('Fwd:') ? email.subject : `Fwd: ${email.subject}`);
setComposeSubject(formattedSubject);
setComposeBody(formattedContent);
}
};