compose mime
This commit is contained in:
parent
ba829f4b6c
commit
8307ecdee3
@ -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]);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user