compose mime

This commit is contained in:
alma 2025-04-24 18:00:37 +02:00
parent ba829f4b6c
commit 8307ecdee3

View File

@ -9,6 +9,7 @@ import { Textarea } from '@/components/ui/textarea';
import { decodeComposeContent, encodeComposeContent } from '@/lib/compose-mime-decoder';
import { Email } from '@/app/courrier/page';
import mime from 'mime';
import { simpleParser } from 'mailparser';
interface ComposeEmailProps {
showCompose: boolean;
@ -90,49 +91,79 @@ export default function ComposeEmail({
// Get the original email content
const originalContent = replyTo?.body || forwardFrom?.body || '';
// Create the reply/forward structure
content = `
<div class="compose-area" contenteditable="true" style="min-height: 100px; padding: 10px; border: 1px solid #e5e7eb; border-radius: 4px; margin-bottom: 20px;"></div>
<div class="quoted-content" contenteditable="false" style="color: #6b7280; font-size: 0.875rem;">
${forwardFrom ? `
<div style="margin-bottom: 10px;">
---------- Forwarded message ---------<br/>
From: ${forwardFrom.from}<br/>
Date: ${new Date(forwardFrom.date).toLocaleString()}<br/>
Subject: ${forwardFrom.subject}<br/>
To: ${forwardFrom.to}<br/>
${forwardFrom.cc ? `Cc: ${forwardFrom.cc}<br/>` : ''}
<br/>
${originalContent}
</div>
` : `
<div style="margin-bottom: 10px;">
On ${new Date(replyTo?.date || '').toLocaleString()}, ${replyTo?.from} wrote:
</div>
<blockquote style="margin: 0; padding-left: 1em; border-left: 2px solid #e5e7eb;">
${originalContent}
</blockquote>
`}
</div>
`;
// Parse the original email content using the API
fetch('/api/parse-email', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ emailContent: originalContent }),
})
.then(response => response.json())
.then(parsed => {
// Create the reply/forward structure
content = `
<div class="compose-area" contenteditable="true" style="min-height: 100px; padding: 10px; border: 1px solid #e5e7eb; border-radius: 4px; margin-bottom: 20px;"></div>
<div class="quoted-content" contenteditable="false" style="color: #6b7280; font-size: 0.875rem;">
${forwardFrom ? `
<div style="margin-bottom: 10px;">
---------- Forwarded message ---------<br/>
From: ${forwardFrom.from}<br/>
Date: ${new Date(forwardFrom.date).toLocaleString()}<br/>
Subject: ${forwardFrom.subject}<br/>
To: ${forwardFrom.to}<br/>
${forwardFrom.cc ? `Cc: ${forwardFrom.cc}<br/>` : ''}
<br/>
${parsed.html || parsed.text}
</div>
` : `
<div style="margin-bottom: 10px;">
On ${new Date(replyTo?.date || '').toLocaleString()}, ${replyTo?.from} wrote:
</div>
<blockquote style="margin: 0; padding-left: 1em; border-left: 2px solid #e5e7eb;">
${parsed.html || parsed.text}
</blockquote>
`}
</div>
`;
if (composeBodyRef.current) {
composeBodyRef.current.innerHTML = content;
setIsInitialized(true);
// Place cursor at the beginning of the compose area
const composeArea = composeBodyRef.current.querySelector('.compose-area');
if (composeArea) {
const range = document.createRange();
const sel = window.getSelection();
range.setStart(composeArea, 0);
range.collapse(true);
sel?.removeAllRanges();
sel?.addRange(range);
(composeArea as HTMLElement).focus();
}
}
})
.catch(error => {
console.error('Error parsing email:', error);
});
} else {
// For new messages
content = `<div class="compose-area" contenteditable="true" style="min-height: 100px; padding: 10px; border: 1px solid #e5e7eb; border-radius: 4px;"></div>`;
}
composeBodyRef.current.innerHTML = content;
setIsInitialized(true);
// Place cursor at the beginning of the compose area
const composeArea = composeBodyRef.current.querySelector('.compose-area');
if (composeArea) {
const range = document.createRange();
const sel = window.getSelection();
range.setStart(composeArea, 0);
range.collapse(true);
sel?.removeAllRanges();
sel?.addRange(range);
(composeArea as HTMLElement).focus();
composeBodyRef.current.innerHTML = content;
setIsInitialized(true);
// Place cursor at the beginning of the compose area
const composeArea = composeBodyRef.current.querySelector('.compose-area');
if (composeArea) {
const range = document.createRange();
const sel = window.getSelection();
range.setStart(composeArea, 0);
range.collapse(true);
sel?.removeAllRanges();
sel?.addRange(range);
(composeArea as HTMLElement).focus();
}
}
}
}, [composeBody, replyTo, forwardFrom, isInitialized]);