mail page fix

This commit is contained in:
alma 2025-04-21 18:49:27 +02:00
parent 1cb76c1c2f
commit b983d5fdc9

View File

@ -134,10 +134,10 @@ function renderEmailContent(email: Email) {
let htmlContent = ''; let htmlContent = '';
let textContent = ''; let textContent = '';
let attachments: { filename: string; content: string }[] = []; let attachments: { filename: string; content: string }[] = [];
for (const part of parts) { for (const part of parts) {
if (!part.trim()) continue; if (!part.trim()) continue;
const [partHeaders, ...partBodyParts] = part.split('\r\n\r\n'); const [partHeaders, ...partBodyParts] = part.split('\r\n\r\n');
if (!partHeaders || partBodyParts.length === 0) continue; if (!partHeaders || partBodyParts.length === 0) continue;
@ -152,11 +152,11 @@ function renderEmailContent(email: Email) {
decodedContent = decodeBase64(partBody, charset); decodedContent = decodeBase64(partBody, charset);
} else if (encoding === 'quoted-printable') { } else if (encoding === 'quoted-printable') {
decodedContent = decodeQuotedPrintable(partBody, charset); decodedContent = decodeQuotedPrintable(partBody, charset);
} else { } else {
decodedContent = convertCharset(partBody, charset); decodedContent = convertCharset(partBody, charset);
} }
if (contentType.includes('text/html')) { if (contentType.includes('text/html')) {
// For HTML content, we want to preserve the HTML structure // For HTML content, we want to preserve the HTML structure
// Only clean up problematic elements while keeping the formatting // Only clean up problematic elements while keeping the formatting
htmlContent = decodedContent htmlContent = decodedContent
@ -225,23 +225,23 @@ function renderEmailContent(email: Email) {
decodedBody = decodeBase64(body, charset); decodedBody = decodeBase64(body, charset);
} else if (encoding === 'quoted-printable') { } else if (encoding === 'quoted-printable') {
decodedBody = decodeQuotedPrintable(body, charset); decodedBody = decodeQuotedPrintable(body, charset);
} else { } else {
decodedBody = convertCharset(body, charset); decodedBody = convertCharset(body, charset);
} }
if (contentType.includes('text/html')) { if (contentType.includes('text/html')) {
// For HTML content, preserve the HTML structure // For HTML content, preserve the HTML structure
const cleanedHtml = decodedBody const cleanedHtml = decodedBody
.replace(/<style[^>]*>[\s\S]*?<\/style>/gi, '') .replace(/<style[^>]*>[\s\S]*?<\/style>/gi, '')
.replace(/<script[^>]*>[\s\S]*?<\/script>/gi, '') .replace(/<script[^>]*>[\s\S]*?<\/script>/gi, '')
.replace(/<meta[^>]*>/gi, '') .replace(/<meta[^>]*>/gi, '')
.replace(/<link[^>]*>/gi, '') .replace(/<link[^>]*>/gi, '')
.replace(/<base[^>]*>/gi, '') .replace(/<base[^>]*>/gi, '')
.replace(/<title[^>]*>[\s\S]*?<\/title>/gi, '') .replace(/<title[^>]*>[\s\S]*?<\/title>/gi, '')
.replace(/<head[^>]*>[\s\S]*?<\/head>/gi, '') .replace(/<head[^>]*>[\s\S]*?<\/head>/gi, '')
.replace(/<body[^>]*>/gi, '') .replace(/<body[^>]*>/gi, '')
.replace(/<\/body>/gi, '') .replace(/<\/body>/gi, '')
.replace(/<html[^>]*>/gi, '') .replace(/<html[^>]*>/gi, '')
.replace(/<\/html>/gi, ''); .replace(/<\/html>/gi, '');
return ( return (
@ -252,13 +252,13 @@ function renderEmailContent(email: Email) {
} else { } else {
return ( return (
<div className="email-content"> <div className="email-content">
<div className="whitespace-pre-wrap font-sans text-base leading-relaxed"> <div className="whitespace-pre-wrap font-sans text-base leading-relaxed">
{decodedBody.split('\n').map((line: string, i: number) => ( {decodedBody.split('\n').map((line: string, i: number) => (
<p key={i} className="mb-2">{line}</p> <p key={i} className="mb-2">{line}</p>
))} ))}
</div>
</div> </div>
); </div>
);
} }
} catch (decodeError) { } catch (decodeError) {
console.error('Error decoding email body:', decodeError); console.error('Error decoding email body:', decodeError);
@ -398,24 +398,20 @@ function getReplyBody(email: Email, type: 'reply' | 'reply-all' | 'forward'): st
if (type === 'forward') { if (type === 'forward') {
return ` return `
<div class="email-content"> <div class="prose max-w-none" style="border-left: 2px solid #ccc; padding-left: 1em; margin-left: 0.5em;">
<div class="prose max-w-none" style="border-left: 2px solid #ccc; padding-left: 1em; margin-left: 0.5em;"> <p><strong>From:</strong> ${email.from}</p>
<p><strong>From:</strong> ${email.from}</p> <p><strong>Date:</strong> ${date}</p>
<p><strong>Date:</strong> ${date}</p> <p><strong>Subject:</strong> ${email.subject}</p>
<p><strong>Subject:</strong> ${email.subject}</p> <p><strong>To:</strong> ${Array.isArray(email.to) ? email.to.join(', ') : email.to}</p>
<p><strong>To:</strong> ${Array.isArray(email.to) ? email.to.join(', ') : email.to}</p> <br/>
<br/> <div class="prose max-w-none">${content}</div>
<div class="prose max-w-none">${content}</div>
</div>
</div> </div>
`; `;
} else { } else {
return ` return `
<div class="email-content"> <div class="prose max-w-none" style="border-left: 2px solid #ccc; padding-left: 1em; margin-left: 0.5em;">
<div class="prose max-w-none" style="border-left: 2px solid #ccc; padding-left: 1em; margin-left: 0.5em;"> <p>On ${date}, ${email.from} wrote:</p>
<p>On ${date}, ${email.from} wrote:</p> <div class="prose max-w-none">${content}</div>
<div class="prose max-w-none">${content}</div>
</div>
</div> </div>
`; `;
} }
@ -601,7 +597,7 @@ export default function CourrierPage() {
).length; ).length;
setUnreadCount(unreadInboxEmails); setUnreadCount(unreadInboxEmails);
} }
if (isLoadMore) { if (isLoadMore) {
setEmails(prev => [...prev, ...processedEmails]); setEmails(prev => [...prev, ...processedEmails]);
setPage(prev => prev + 1); setPage(prev => prev + 1);
@ -1122,9 +1118,9 @@ export default function CourrierPage() {
{email.fromName || email.from} {email.fromName || email.from}
</span> </span>
</div> </div>
<span className="text-xs text-gray-500 whitespace-nowrap"> <span className="text-xs text-gray-500 whitespace-nowrap">
{formatDate(email.date)} {formatDate(email.date)}
</span> </span>
</div> </div>
<h3 className="text-sm text-gray-900 truncate"> <h3 className="text-sm text-gray-900 truncate">
{email.subject || '(No subject)'} {email.subject || '(No subject)'}
@ -1152,7 +1148,7 @@ export default function CourrierPage() {
// Parse headers using our MIME decoder // Parse headers using our MIME decoder
const headerInfo = parseEmailHeaders(headersPart); const headerInfo = parseEmailHeaders(headersPart);
const boundary = extractBoundary(headersPart); const boundary = extractBoundary(headersPart);
let preview = ''; let preview = '';
// If it's a multipart email // If it's a multipart email
@ -1382,7 +1378,7 @@ export default function CourrierPage() {
const getReplyTo = () => { const getReplyTo = () => {
if (type === 'forward') return ''; if (type === 'forward') return '';
return selectedEmail.from; return selectedEmail.from;
}; };
const getReplyCc = () => { const getReplyCc = () => {
@ -1392,7 +1388,7 @@ export default function CourrierPage() {
const getReplySubject = () => { const getReplySubject = () => {
const subject = selectedEmail.subject || ''; const subject = selectedEmail.subject || '';
if (type === 'forward') { if (type === 'forward') {
return subject.startsWith('Fwd:') ? subject : `Fwd: ${subject}`; return subject.startsWith('Fwd:') ? subject : `Fwd: ${subject}`;
} }
return subject.startsWith('Re:') ? subject : `Re: ${subject}`; return subject.startsWith('Re:') ? subject : `Re: ${subject}`;