panel 2 courier api restore
This commit is contained in:
parent
2abeec4a8c
commit
e71289c911
@ -159,17 +159,9 @@ export default function ComposeEmail({
|
||||
// Now proceed with the usual decoding
|
||||
const type = replyTo ? 'reply' : 'forward';
|
||||
|
||||
// ========== MATCH PANEL 3 CONTENT HANDLING ==========
|
||||
// DIRECTLY MATCH PANEL 3 IMPLEMENTATION
|
||||
try {
|
||||
// Get the actual email content - similar to panel 3
|
||||
const formattedEmail = emailToProcess.content.trim();
|
||||
if (!formattedEmail) {
|
||||
throw new Error("Email content is empty");
|
||||
}
|
||||
|
||||
// Parse the email just like panel 3
|
||||
const decoded = await decodeEmail(formattedEmail);
|
||||
|
||||
const decoded = await decodeEmail(emailToProcess.content);
|
||||
console.log('[DEBUG] Decoded email for compose:', {
|
||||
hasHtml: !!decoded.html,
|
||||
hasText: !!decoded.text,
|
||||
@ -177,79 +169,43 @@ export default function ComposeEmail({
|
||||
subject: decoded.subject
|
||||
});
|
||||
|
||||
// Get clean content similar to Panel 3
|
||||
let cleanContent = '';
|
||||
let formattedContent = '';
|
||||
|
||||
if (decoded.html) {
|
||||
// Sanitize HTML exactly as in Panel 3
|
||||
cleanContent = DOMPurify.sanitize(decoded.html);
|
||||
} else if (decoded.text) {
|
||||
// Format text content with proper whitespace like Panel 3
|
||||
cleanContent = `<div class="whitespace-pre-wrap">${decoded.text}</div>`;
|
||||
if (type === 'forward') {
|
||||
// EXACTLY MATCH THE FORMAT USED IN PANEL 3 (from ReplyContent in app/courrier/page.tsx)
|
||||
formattedContent = `
|
||||
<div class="forwarded-message">
|
||||
<p>---------- Forwarded message ---------</p>
|
||||
<p>From: ${decoded.from || ''}</p>
|
||||
<p>Date: ${formatDate(decoded.date ? new Date(decoded.date) : null)}</p>
|
||||
<p>Subject: ${decoded.subject || ''}</p>
|
||||
<p>To: ${decoded.to || ''}</p>
|
||||
<br>
|
||||
${decoded.html || `<pre>${decoded.text || ''}</pre>`}
|
||||
</div>
|
||||
`;
|
||||
} else {
|
||||
// Fallback to raw content if parsing failed
|
||||
if (formattedEmail.startsWith('<') && formattedEmail.endsWith('>')) {
|
||||
cleanContent = DOMPurify.sanitize(formattedEmail);
|
||||
} else {
|
||||
cleanContent = `<div class="whitespace-pre-wrap">${formattedEmail}</div>`;
|
||||
}
|
||||
formattedContent = `
|
||||
<div class="quoted-message">
|
||||
<p>On ${formatDate(decoded.date ? new Date(decoded.date) : null)}, ${decoded.from || ''} wrote:</p>
|
||||
<blockquote>
|
||||
${decoded.html || `<pre>${decoded.text || ''}</pre>`}
|
||||
</blockquote>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
// Extract reliable metadata
|
||||
const from = decoded.from ||
|
||||
(emailToProcess.fromName ? `${emailToProcess.fromName} <${emailToProcess.from}>` : emailToProcess.from) ||
|
||||
'Unknown Sender';
|
||||
|
||||
const date = decoded.date ?
|
||||
new Date(decoded.date).toLocaleString() :
|
||||
(emailToProcess.date ? new Date(emailToProcess.date).toLocaleString() : new Date().toLocaleString());
|
||||
|
||||
const subject = decoded.subject || emailToProcess.subject || 'No Subject';
|
||||
|
||||
const to = decoded.to ||
|
||||
(emailToProcess.to && Array.isArray(emailToProcess.to) ?
|
||||
emailToProcess.to.map((t: any) => t.address || t.name || '').filter(Boolean).join(', ') :
|
||||
emailToProcess.to) ||
|
||||
'';
|
||||
|
||||
const cc = decoded.cc ||
|
||||
(emailToProcess.cc && Array.isArray(emailToProcess.cc) ?
|
||||
emailToProcess.cc.map((c: any) => c.address || c.name || '').filter(Boolean).join(', ') :
|
||||
emailToProcess.cc) ||
|
||||
'';
|
||||
|
||||
// Format the content based on reply type
|
||||
const quotedContent = type === 'forward' ? `
|
||||
<div class="forwarded-message" style="border-top: 1px solid #e5e7eb; padding-top: 20px; margin-top: 20px; color: #6b7280; font-size: 0.875rem;">
|
||||
---------- Forwarded message ---------<br/>
|
||||
From: ${from}<br/>
|
||||
Date: ${date}<br/>
|
||||
Subject: ${subject}<br/>
|
||||
To: ${to}<br/>
|
||||
${cc ? `Cc: ${cc}<br/>` : ''}
|
||||
</div>
|
||||
<div class="message-content prose prose-sm max-w-none" style="margin-top: 10px; border: 1px solid #e5e7eb; padding: 10px; border-radius: 4px; max-height: 300px; overflow-y: auto; color: #374151;">
|
||||
${cleanContent || '<div>No content available</div>'}
|
||||
</div>
|
||||
` : `
|
||||
<div class="quoted-message" style="border-top: 1px solid #e5e7eb; padding-top: 20px; margin-top: 20px; color: #6b7280; font-size: 0.875rem;">
|
||||
On ${date}, ${from} wrote:
|
||||
</div>
|
||||
<div class="message-content prose prose-sm max-w-none" style="margin: 10px 0 0 10px; padding: 10px; border-left: 2px solid #e5e7eb; border: 1px solid #e5e7eb; border-radius: 4px; max-height: 300px; overflow-y: auto; color: #374151;">
|
||||
${cleanContent || '<div>No content available</div>'}
|
||||
</div>
|
||||
`;
|
||||
|
||||
// Set the content in the compose area with proper structure
|
||||
const formattedContent = `
|
||||
const sanitizedContent = DOMPurify.sanitize(formattedContent);
|
||||
const wrappedContent = `
|
||||
<div class="compose-area" contenteditable="true" style="min-height: 100px; padding: 10px;">
|
||||
<div class="cursor-position" style="min-height: 20px; cursor: text;"><br/></div>
|
||||
${quotedContent}
|
||||
${sanitizedContent}
|
||||
</div>
|
||||
`;
|
||||
|
||||
if (composeBodyRef.current) {
|
||||
composeBodyRef.current.innerHTML = formattedContent;
|
||||
composeBodyRef.current.innerHTML = wrappedContent;
|
||||
|
||||
// Place cursor at the beginning before the quoted content
|
||||
const selection = window.getSelection();
|
||||
@ -264,7 +220,7 @@ export default function ComposeEmail({
|
||||
}
|
||||
|
||||
// After setting the HTML content, add event listeners for scrolling
|
||||
const messageContents = composeBodyRef.current.querySelectorAll('.message-content');
|
||||
const messageContents = composeBodyRef.current.querySelectorAll('.message-content, .forwarded-message, .quoted-message');
|
||||
messageContents.forEach(container => {
|
||||
// Make sure the container is properly styled for scrolling
|
||||
(container as HTMLElement).style.maxHeight = '300px';
|
||||
@ -296,8 +252,8 @@ export default function ComposeEmail({
|
||||
});
|
||||
|
||||
// Update compose state
|
||||
setComposeBody(formattedContent);
|
||||
setLocalContent(formattedContent);
|
||||
setComposeBody(wrappedContent);
|
||||
setLocalContent(wrappedContent);
|
||||
console.log('[DEBUG] Successfully set compose content with scrollable message area');
|
||||
}
|
||||
} catch (error) {
|
||||
@ -485,6 +441,18 @@ export default function ComposeEmail({
|
||||
}
|
||||
};
|
||||
|
||||
// Add formatDate function to match Panel 3 exactly
|
||||
function formatDate(date: Date | null): string {
|
||||
if (!date) return '';
|
||||
return new Intl.DateTimeFormat('fr-FR', {
|
||||
day: '2-digit',
|
||||
month: '2-digit',
|
||||
year: 'numeric',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit'
|
||||
}).format(date);
|
||||
}
|
||||
|
||||
if (!showCompose) return null;
|
||||
|
||||
return (
|
||||
|
||||
Loading…
Reference in New Issue
Block a user