alma/Neah
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

mail page fix design

Browse Source
This commit is contained in:
alma 2025-04-21 21:07:03 +02:00
parent 202f975e97
commit cfd984d0aa
2 changed files with 36 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
app/courrier/page.tsx
View File

@ -370,11 +370,20 @@ function getReplyBody(email: Email, type: 'reply' | 'reply-all' | 'forward' = 'r
decodedContent = convertCharset(partBody, partHeaderInfo.charset);
}
// Preserve the original MIME structure
if (partHeaderInfo.contentType.includes('text/html')) {
content = decodedContent;
content = `
<div class="email-part" data-mime-type="text/html" data-charset="${partHeaderInfo.charset}">
${decodedContent}
</div>
`;
break;
} else if (partHeaderInfo.contentType.includes('text/plain') && !content) {
content = decodedContent;
content = `
<div class="email-part" data-mime-type="text/plain" data-charset="${partHeaderInfo.charset}">
<pre style="white-space: pre-wrap; font-family: inherit;">${decodedContent}</pre>
</div>
`;
}
} catch (error) {
console.error('Error decoding email part:', error);
@ -383,43 +392,54 @@ function getReplyBody(email: Email, type: 'reply' | 'reply-all' | 'forward' = 'r
} else {
// Handle simple email
try {
let decodedBody = '';
if (headerInfo.encoding === 'base64') {
content = decodeBase64(body, headerInfo.charset);
decodedBody = decodeBase64(body, headerInfo.charset);
} else if (headerInfo.encoding === 'quoted-printable') {
content = decodeQuotedPrintable(body, headerInfo.charset);
decodedBody = decodeQuotedPrintable(body, headerInfo.charset);
} else {
content = convertCharset(body, headerInfo.charset);
decodedBody = convertCharset(body, headerInfo.charset);
}
content = `
<div class="email-part" data-mime-type="${headerInfo.contentType}" data-charset="${headerInfo.charset}">
${headerInfo.contentType.includes('text/html') ? decodedBody : `<pre style="white-space: pre-wrap; font-family: inherit;">${decodedBody}</pre>`}
</div>
`;
} catch (error) {
console.error('Error decoding email body:', error);
content = body;
}
}
// Clean and sanitize HTML content
// Clean and sanitize HTML content while preserving structure
content = cleanHtml(content);
// Format the reply/forward content
// Format the reply/forward content with proper structure and direction
let formattedContent = '';
if (type === 'forward') {
formattedContent = `
<div class="prose max-w-none" dir="ltr">
<div class="border-l-4 border-gray-300 pl-4 my-4">
<div class="email-container" dir="ltr">
<div class="email-header" dir="ltr">
<p class="text-sm text-gray-600 mb-2">Forwarded message from ${email.from}</p>
<p class="text-sm text-gray-600 mb-2">Date: ${new Date(email.date).toLocaleString()}</p>
<p class="text-sm text-gray-600 mb-2">Subject: ${email.subject}</p>
<p class="text-sm text-gray-600 mb-2">To: ${email.to}</p>
${email.cc ? `<p class="text-sm text-gray-600 mb-2">Cc: ${email.cc}</p>` : ''}
<div class="mt-4 prose-sm whitespace-pre-wrap">${content}</div>
</div>
<div class="email-content" dir="auto">
${content}
</div>
</div>
`;
} else {
formattedContent = `
<div class="prose max-w-none" dir="ltr">
<div class="border-l-4 border-gray-300 pl-4 my-4">
<div class="email-container" dir="ltr">
<div class="email-header" dir="ltr">
<p class="text-sm text-gray-600 mb-2">On ${new Date(email.date).toLocaleString()}, ${email.from} wrote:</p>
<div class="mt-4 prose-sm whitespace-pre-wrap">${content}</div>
</div>
<div class="email-content" dir="auto">
${content}
</div>
</div>
`;

7
components/ComposeEmail.tsx
View File

@ -258,20 +258,19 @@ export default function ComposeEmail({
)}
{/* Message Body */}
<div className="flex-1 min-h-[200px]">
<div className="flex-1">
<Label htmlFor="message" className="block text-sm font-medium text-gray-700">Message</Label>
<div
ref={composeBodyRef}
contentEditable
onInput={handleInput}
className="w-full h-full mt-1 bg-white border border-gray-300 rounded-md p-4 text-gray-900 overflow-y-auto"
className="w-full h-full mt-1 bg-white border border-gray-300 rounded-md p-2 text-gray-900 overflow-y-auto"
style={{
minHeight: '200px',
direction: 'ltr',
textAlign: 'left',
unicodeBidi: 'bidi-override'
}}
dir="ltr"
dir="auto"
/>
</div>
</div>