78 lines
2.0 KiB
TypeScript
78 lines
2.0 KiB
TypeScript
'use client';
|
|
|
|
import React from 'react';
|
|
import { EmailContent } from '@/types/email';
|
|
|
|
interface EmailContentDisplayProps {
|
|
content: EmailContent | null | undefined;
|
|
className?: string;
|
|
showQuotedText?: boolean;
|
|
type?: 'html' | 'text' | 'auto';
|
|
debug?: boolean;
|
|
}
|
|
|
|
/**
|
|
* Unified component for displaying email content in a consistent way
|
|
* This handles both HTML and plain text content with proper styling
|
|
*/
|
|
const EmailContentDisplay: React.FC<EmailContentDisplayProps> = ({
|
|
content,
|
|
className = '',
|
|
showQuotedText = true,
|
|
type = 'auto',
|
|
debug = false
|
|
}) => {
|
|
if (!content) {
|
|
return <div className={className}>No content available</div>;
|
|
}
|
|
|
|
let htmlContent = '';
|
|
|
|
// Simple content rendering
|
|
if (content.isHtml && content.html) {
|
|
// Use HTML content
|
|
htmlContent = content.html;
|
|
} else if (content.text) {
|
|
// Format text content with line breaks
|
|
htmlContent = content.text
|
|
.replace(/&/g, '&')
|
|
.replace(/</g, '<')
|
|
.replace(/>/g, '>')
|
|
.replace(/\n/g, '<br>');
|
|
} else {
|
|
// No content available
|
|
htmlContent = 'No content available';
|
|
}
|
|
|
|
return (
|
|
<div className={`email-content-display ${className}`}>
|
|
<div
|
|
className="email-content-inner"
|
|
dangerouslySetInnerHTML={{ __html: htmlContent }}
|
|
/>
|
|
|
|
{/* Debug output if enabled */}
|
|
{debug && (
|
|
<div className="mt-4 p-2 text-xs bg-gray-100 border rounded">
|
|
<p><strong>Content Type:</strong> {content.isHtml ? 'HTML' : 'Text'}</p>
|
|
<p><strong>Direction:</strong> {content.direction}</p>
|
|
<p><strong>HTML Length:</strong> {content.html?.length || 0}</p>
|
|
<p><strong>Text Length:</strong> {content.text?.length || 0}</p>
|
|
</div>
|
|
)}
|
|
|
|
<style jsx>{`
|
|
.email-content-display {
|
|
width: 100%;
|
|
}
|
|
|
|
.email-content-inner img {
|
|
max-width: 100%;
|
|
height: auto;
|
|
}
|
|
`}</style>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default EmailContentDisplay;
|