mail page imap connection mime 5 bis rest 5
This commit is contained in:
parent
8c42df9d6f
commit
22dc2a74d8
@ -448,7 +448,7 @@ export default function MailPage() {
|
||||
console.log('Processed email data:', emailData); // Debug processed data
|
||||
|
||||
// Ensure all dates are Date objects
|
||||
const processedEmails = emailData.map(email => ({
|
||||
const processedEmails = emailData.map((email: Email) => ({
|
||||
...email,
|
||||
date: email.date ? new Date(email.date) : new Date(),
|
||||
read: email.read || false,
|
||||
@ -629,6 +629,35 @@ export default function MailPage() {
|
||||
}
|
||||
};
|
||||
|
||||
// Handle reply
|
||||
const handleReply = async (type: 'reply' | 'replyAll' | 'forward') => {
|
||||
const selectedEmailData = getSelectedEmail();
|
||||
if (!selectedEmailData) return;
|
||||
|
||||
setComposeOpen(true);
|
||||
const subject = `${type === 'forward' ? 'Fwd: ' : 'Re: '}${selectedEmailData.subject}`;
|
||||
let to = '';
|
||||
let content = '';
|
||||
|
||||
switch (type) {
|
||||
case 'reply':
|
||||
to = selectedEmailData.from;
|
||||
content = `\n\nOn ${new Date(selectedEmailData.date).toLocaleString()}, ${selectedEmailData.fromName} wrote:\n> ${selectedEmailData.body.split('\n').join('\n> ')}`;
|
||||
break;
|
||||
case 'replyAll':
|
||||
to = selectedEmailData.from; // You would also need to add CC recipients here
|
||||
content = `\n\nOn ${new Date(selectedEmailData.date).toLocaleString()}, ${selectedEmailData.fromName} wrote:\n> ${selectedEmailData.body.split('\n').join('\n> ')}`;
|
||||
break;
|
||||
case 'forward':
|
||||
content = `\n\n---------- Forwarded message ----------\nFrom: ${selectedEmailData.fromName} <${selectedEmailData.from}>\nDate: ${new Date(selectedEmailData.date).toLocaleString()}\nSubject: ${selectedEmailData.subject}\n\n${selectedEmailData.body}`;
|
||||
break;
|
||||
}
|
||||
|
||||
setComposeSubject(subject);
|
||||
setComposeRecipient(to);
|
||||
setComposeContent(content);
|
||||
};
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<div className="flex h-[calc(100vh-theme(spacing.12))] items-center justify-center bg-gray-100 mt-12">
|
||||
@ -996,6 +1025,98 @@ export default function MailPage() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Email preview panel */}
|
||||
<div className="flex-1 bg-white/95 backdrop-blur-sm overflow-y-auto">
|
||||
{selectedEmail ? (
|
||||
<div className="p-6">
|
||||
<div className="flex items-center justify-between mb-6">
|
||||
<h2 className="text-xl font-semibold text-gray-900">{selectedEmail.subject}</h2>
|
||||
<div className="flex items-center gap-2">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="text-gray-400 hover:text-gray-900"
|
||||
onClick={() => handleReply('reply')}
|
||||
>
|
||||
<Reply className="h-5 w-5" />
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="text-gray-400 hover:text-gray-900"
|
||||
onClick={() => handleReply('replyAll')}
|
||||
>
|
||||
<ReplyAll className="h-5 w-5" />
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="text-gray-400 hover:text-gray-900"
|
||||
onClick={() => handleReply('forward')}
|
||||
>
|
||||
<Forward className="h-5 w-5" />
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="text-gray-400 hover:text-gray-900"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
toggleStarred(selectedEmail.id, e);
|
||||
}}
|
||||
>
|
||||
{selectedEmail.starred ? (
|
||||
<Star className="h-5 w-5 text-yellow-400" />
|
||||
) : (
|
||||
<Star className="h-5 w-5" />
|
||||
)}
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="text-gray-400 hover:text-gray-900"
|
||||
onClick={() => {
|
||||
setDeleteType('email');
|
||||
setItemToDelete(parseInt(selectedEmail.id));
|
||||
setShowDeleteConfirm(true);
|
||||
}}
|
||||
>
|
||||
<Trash2 className="h-5 w-5" />
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-4 mb-6">
|
||||
<Avatar className="h-10 w-10">
|
||||
<AvatarFallback>
|
||||
{selectedEmail.fromName?.charAt(0) || selectedEmail.from.charAt(0)}
|
||||
</AvatarFallback>
|
||||
</Avatar>
|
||||
<div>
|
||||
<p className="font-medium text-gray-900">
|
||||
{selectedEmail.fromName || selectedEmail.from}
|
||||
</p>
|
||||
<p className="text-sm text-gray-500">
|
||||
to {selectedEmail.to}
|
||||
</p>
|
||||
</div>
|
||||
<div className="ml-auto text-sm text-gray-500">
|
||||
{formatDate(selectedEmail.date.toISOString())}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="prose max-w-none">
|
||||
{selectedEmail.body}
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="flex flex-col items-center justify-center h-full">
|
||||
<Mail className="h-12 w-12 text-gray-400 mb-4" />
|
||||
<p className="text-gray-500">Select an email to view its contents</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user