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

compose mime

Browse Source
This commit is contained in:
alma 2025-04-24 20:15:07 +02:00
parent fa85613f31
commit 5bd57d731d
1 changed files with 47 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
components/ComposeEmail.tsx
View File

@ -86,6 +86,8 @@ export default function ComposeEmail({
useEffect(() => { useEffect(() => {
if (replyTo || forwardFrom) { if (replyTo || forwardFrom) {
const initializeContent = async () => { const initializeContent = async () => {
if (!composeBodyRef.current) return;
try { try {
const emailToProcess = replyTo || forwardFrom; const emailToProcess = replyTo || forwardFrom;
if (!emailToProcess?.body) { if (!emailToProcess?.body) {
@ -93,6 +95,15 @@ export default function ComposeEmail({
return; 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 // Parse the original email using the API
const response = await fetch('/api/parse-email', { const response = await fetch('/api/parse-email', {
method: 'POST', method: 'POST',
@ -107,21 +118,38 @@ export default function ComposeEmail({
} }
const parsedEmail = await response.json(); const parsedEmail = await response.json();
const originalContent = parsedEmail.html || parsedEmail.text || '';
// Format the reply/forward content // Format the reply/forward content
const prefix = replyTo ? '\n\n' : '\n\n---------- Forwarded message ----------\n\n'; const quotedContent = forwardFrom ? `
const quoteStyle = 'border-left: 2px solid #ccc; margin-left: 1em; padding-left: 1em;'; <div style="border-top: 1px solid #e5e7eb; padding-top: 20px; margin-top: 20px; color: #6b7280; font-size: 0.875rem;">
const formattedContent = ` ---------- Forwarded message ---------<br/>
<div><br/>${prefix}</div> From: ${emailToProcess.from}<br/>
<div style="${quoteStyle}"> Date: ${new Date(emailToProcess.date).toLocaleString()}<br/>
${originalContent} Subject: ${emailToProcess.subject}<br/>
To: ${emailToProcess.to}<br/>
${emailToProcess.cc ? `Cc: ${emailToProcess.cc}<br/>` : ''}
<br/>
${parsedEmail.html || parsedEmail.text || 'No content available'}
</div> </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 // Set the content in the compose area
if (composeBodyRef.current) { 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; composeBodyRef.current.innerHTML = formattedContent;
// Place cursor at the beginning // Place cursor at the beginning
const selection = window.getSelection(); const selection = window.getSelection();
const range = document.createRange(); const range = document.createRange();
@ -129,12 +157,21 @@ export default function ComposeEmail({
range.collapse(true); range.collapse(true);
selection?.removeAllRanges(); selection?.removeAllRanges();
selection?.addRange(range); selection?.addRange(range);
}
// Update compose state // Update compose state
setComposeBody(formattedContent); setComposeBody(formattedContent);
}
} catch (error) { } catch (error) {
console.error('Error initializing compose content:', 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;
}
} }
}; };