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 20:58:45 +02:00
parent 3da88387c5
commit 9db7762e38
2 changed files with 49 additions and 16 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 with proper structure
// 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" dir="auto">${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" dir="auto">${content}</div>
</div>
<div class="email-content" dir="auto">
${content}
</div>
</div>
`;

19
components/ComposeEmail.tsx
View File

@ -68,7 +68,21 @@ export default function ComposeEmail({
const handleInput = (e: React.FormEvent<HTMLDivElement>) => {
if (composeBodyRef.current) {
const encodedContent = encodeComposeContent(composeBodyRef.current.innerHTML);
// Get the current content
const content = composeBodyRef.current.innerHTML;
// Create a temporary div to parse the content
const tempDiv = document.createElement('div');
tempDiv.innerHTML = content;
// Check if the content contains RTL text
const hasRTL = /[\u0591-\u07FF\u200F\u202B\u202E\uFB1D-\uFDFD\uFE70-\uFEFC]/.test(content);
// Set the appropriate direction
composeBodyRef.current.dir = hasRTL ? 'rtl' : 'ltr';
// Encode the content
const encodedContent = encodeComposeContent(content);
setComposeBody(encodedContent);
}
};
@ -253,11 +267,10 @@ export default function ComposeEmail({
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>