compose mime
This commit is contained in:
parent
fa85613f31
commit
5bd57d731d
@ -86,6 +86,8 @@ export default function ComposeEmail({
|
||||
useEffect(() => {
|
||||
if (replyTo || forwardFrom) {
|
||||
const initializeContent = async () => {
|
||||
if (!composeBodyRef.current) return;
|
||||
|
||||
try {
|
||||
const emailToProcess = replyTo || forwardFrom;
|
||||
if (!emailToProcess?.body) {
|
||||
@ -93,6 +95,15 @@ export default function ComposeEmail({
|
||||
return;
|
||||
}
|
||||
|
||||
// Create initial content immediately
|
||||
const initialContent = `
|
||||
<div class="compose-area" contenteditable="true" style="min-height: 100px; padding: 10px; color: #000000;">
|
||||
<br/>
|
||||
<div id="reply-placeholder">Loading original message...</div>
|
||||
</div>
|
||||
`;
|
||||
composeBodyRef.current.innerHTML = initialContent;
|
||||
|
||||
// Parse the original email using the API
|
||||
const response = await fetch('/api/parse-email', {
|
||||
method: 'POST',
|
||||
@ -107,21 +118,38 @@ export default function ComposeEmail({
|
||||
}
|
||||
|
||||
const parsedEmail = await response.json();
|
||||
const originalContent = parsedEmail.html || parsedEmail.text || '';
|
||||
|
||||
// Format the reply/forward content
|
||||
const prefix = replyTo ? '\n\n' : '\n\n---------- Forwarded message ----------\n\n';
|
||||
const quoteStyle = 'border-left: 2px solid #ccc; margin-left: 1em; padding-left: 1em;';
|
||||
const formattedContent = `
|
||||
<div><br/>${prefix}</div>
|
||||
<div style="${quoteStyle}">
|
||||
${originalContent}
|
||||
const quotedContent = forwardFrom ? `
|
||||
<div style="border-top: 1px solid #e5e7eb; padding-top: 20px; margin-top: 20px; color: #6b7280; font-size: 0.875rem;">
|
||||
---------- Forwarded message ---------<br/>
|
||||
From: ${emailToProcess.from}<br/>
|
||||
Date: ${new Date(emailToProcess.date).toLocaleString()}<br/>
|
||||
Subject: ${emailToProcess.subject}<br/>
|
||||
To: ${emailToProcess.to}<br/>
|
||||
${emailToProcess.cc ? `Cc: ${emailToProcess.cc}<br/>` : ''}
|
||||
<br/>
|
||||
${parsedEmail.html || parsedEmail.text || 'No content available'}
|
||||
</div>
|
||||
` : `
|
||||
<div style="border-top: 1px solid #e5e7eb; padding-top: 20px; margin-top: 20px; color: #6b7280; font-size: 0.875rem;">
|
||||
On ${new Date(emailToProcess.date).toLocaleString()}, ${emailToProcess.from} wrote:
|
||||
</div>
|
||||
<blockquote style="margin: 0; padding-left: 1em; border-left: 2px solid #e5e7eb; color: #6b7280;">
|
||||
${parsedEmail.html || parsedEmail.text || 'No content available'}
|
||||
</blockquote>
|
||||
`;
|
||||
|
||||
// Set the content in the compose area
|
||||
if (composeBodyRef.current) {
|
||||
const formattedContent = `
|
||||
<div class="compose-area" contenteditable="true" style="min-height: 100px; padding: 10px; color: #000000;">
|
||||
<br/>
|
||||
${quotedContent}
|
||||
</div>
|
||||
`;
|
||||
composeBodyRef.current.innerHTML = formattedContent;
|
||||
|
||||
// Place cursor at the beginning
|
||||
const selection = window.getSelection();
|
||||
const range = document.createRange();
|
||||
@ -129,12 +157,21 @@ export default function ComposeEmail({
|
||||
range.collapse(true);
|
||||
selection?.removeAllRanges();
|
||||
selection?.addRange(range);
|
||||
}
|
||||
|
||||
// Update compose state
|
||||
setComposeBody(formattedContent);
|
||||
// Update compose state
|
||||
setComposeBody(formattedContent);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error initializing compose content:', error);
|
||||
if (composeBodyRef.current) {
|
||||
const errorContent = `
|
||||
<div class="compose-area" contenteditable="true" style="min-height: 100px; padding: 10px; color: #000000;">
|
||||
<br/>
|
||||
<div style="color: #ef4444;">Error loading original message.</div>
|
||||
</div>
|
||||
`;
|
||||
composeBodyRef.current.innerHTML = errorContent;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user