mail page ui correction maj 5

This commit is contained in:
alma 2025-04-16 11:45:45 +02:00
parent 2f65bd2ca1
commit 0ad7e04bfb

View File

@ -996,35 +996,37 @@ export default function MailPage() {
{(() => {
try {
const parsed = parseFullEmail(selectedEmail.body);
return parsed.html || parsed.text || selectedEmail.body;
return (
<div>
{/* Display HTML content if available, otherwise fallback to text */}
<div dangerouslySetInnerHTML={{
__html: parsed.html || parsed.text || decodeMimeContent(selectedEmail.body)
}} />
{/* Display attachments if present */}
{parsed.attachments && parsed.attachments.length > 0 && (
<div className="mt-6 border-t border-gray-200 pt-6">
<h3 className="text-sm font-semibold text-gray-900 mb-4">Attachments</h3>
<div className="grid grid-cols-2 gap-4">
{parsed.attachments.map((attachment, index) => (
<div key={index} className="flex items-center space-x-2 p-2 border rounded">
<Paperclip className="h-4 w-4 text-gray-400" />
<span className="text-sm text-gray-600 truncate">
{attachment.filename}
</span>
</div>
))}
</div>
</div>
)}
</div>
);
} catch (e) {
console.error('Error parsing email content:', e);
console.error('Error parsing email:', e);
return selectedEmail.body;
}
})()}
</div>
{(() => {
try {
const parsed = parseFullEmail(selectedEmail.body);
return parsed?.attachments?.length > 0 ? (
<div className="mt-6 border-t border-gray-200 pt-6">
<h3 className="text-sm font-semibold text-gray-900 mb-4">Attachments</h3>
<div className="grid grid-cols-2 gap-4">
{parsed.attachments.map((attachment, index) => (
<div key={index} className="flex items-center space-x-2 p-2 border rounded">
<Paperclip className="h-4 w-4 text-gray-400" />
<span className="text-sm text-gray-600 truncate">{attachment.filename}</span>
</div>
))}
</div>
</div>
) : null;
} catch (e) {
console.error('Error parsing email attachments:', e);
return null;
}
})()}
</div>
) : (
<div className="flex flex-col items-center justify-center h-full">
@ -1074,6 +1076,39 @@ export default function MailPage() {
onChange={(e) => setComposeTo(e.target.value)}
/>
</div>
{/* CC/BCC controls */}
<div className="flex items-center gap-2">
<Button
variant="ghost"
size="sm"
onClick={() => setShowCc(!showCc)}
>
{showCc ? 'Hide' : 'Show'} CC/BCC
</Button>
</div>
{showCc && (
<>
<div>
<Label htmlFor="cc">CC</Label>
<Input
id="cc"
value={composeCc}
onChange={(e) => setComposeCc(e.target.value)}
/>
</div>
<div>
<Label htmlFor="bcc">BCC</Label>
<Input
id="bcc"
value={composeBcc}
onChange={(e) => setComposeBcc(e.target.value)}
/>
</div>
</>
)}
<div>
<Label htmlFor="subject">Subject</Label>
<Input
@ -1082,6 +1117,7 @@ export default function MailPage() {
onChange={(e) => setComposeSubject(e.target.value)}
/>
</div>
<div className="flex-1">
<Label htmlFor="body">Message</Label>
<Textarea
@ -1092,6 +1128,7 @@ export default function MailPage() {
/>
</div>
</div>
<div className="p-4 border-t flex justify-end gap-2">
<Button variant="outline" onClick={() => setShowCompose(false)}>
Cancel