mail page imap connection mime 5
This commit is contained in:
parent
641d7ddb8a
commit
cd04669609
@ -451,19 +451,20 @@ export default function MailPage() {
|
|||||||
|
|
||||||
// Filter emails based on current view
|
// Filter emails based on current view
|
||||||
const filteredEmails = emails.filter(email => {
|
const filteredEmails = emails.filter(email => {
|
||||||
if (selectedAccount !== 'all' && email.accountId !== selectedAccount) {
|
if (selectedAccount === 0) return true;
|
||||||
return false;
|
return email.accountId === selectedAccount.toString();
|
||||||
}
|
}).filter(email => {
|
||||||
|
|
||||||
switch (currentView) {
|
switch (currentView) {
|
||||||
case 'starred':
|
case "inbox":
|
||||||
|
return email.category === "inbox";
|
||||||
|
case "starred":
|
||||||
return email.starred;
|
return email.starred;
|
||||||
case 'sent':
|
case "sent":
|
||||||
return email.category === 'sent';
|
return email.category === "sent";
|
||||||
case 'trash':
|
case "trash":
|
||||||
return email.category === 'trash';
|
return email.category === "trash";
|
||||||
default:
|
default:
|
||||||
return email.category === 'inbox';
|
return true;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -546,9 +547,9 @@ export default function MailPage() {
|
|||||||
await fetch('/api/mail/delete', {
|
await fetch('/api/mail/delete', {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
headers: { 'Content-Type': 'application/json' },
|
headers: { 'Content-Type': 'application/json' },
|
||||||
body: JSON.stringify({ emailIds: [itemToDelete] })
|
body: JSON.stringify({ emailIds: [itemToDelete.toString()] })
|
||||||
});
|
});
|
||||||
setEmails(emails.filter(email => email.id !== itemToDelete));
|
setEmails(emails.filter(email => email.id !== itemToDelete.toString()));
|
||||||
setSelectedEmail(null);
|
setSelectedEmail(null);
|
||||||
} else if (deleteType === 'emails') {
|
} else if (deleteType === 'emails') {
|
||||||
await fetch('/api/mail/delete', {
|
await fetch('/api/mail/delete', {
|
||||||
@ -568,7 +569,7 @@ export default function MailPage() {
|
|||||||
|
|
||||||
// Get selected email
|
// Get selected email
|
||||||
const getSelectedEmail = () => {
|
const getSelectedEmail = () => {
|
||||||
return emails.find(email => email.id === selectedEmail);
|
return emails.find(email => email.id === selectedEmail?.id);
|
||||||
};
|
};
|
||||||
|
|
||||||
// Add account management functions
|
// Add account management functions
|
||||||
@ -679,6 +680,19 @@ export default function MailPage() {
|
|||||||
setSelectedEmails([]);
|
setSelectedEmails([]);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Update the email selection handlers to use string types
|
||||||
|
const handleEmailSelection = (emailId: string) => {
|
||||||
|
setSelectedEmail(emails.find(e => e.id === emailId) || null);
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleBulkSelection = (emailId: string) => {
|
||||||
|
if (selectedEmails.includes(emailId)) {
|
||||||
|
setSelectedEmails(selectedEmails.filter(id => id !== emailId));
|
||||||
|
} else {
|
||||||
|
setSelectedEmails([...selectedEmails, emailId]);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
if (loading) {
|
if (loading) {
|
||||||
return (
|
return (
|
||||||
<div className="flex h-[calc(100vh-theme(spacing.12))] items-center justify-center bg-gray-100 mt-12">
|
<div className="flex h-[calc(100vh-theme(spacing.12))] items-center justify-center bg-gray-100 mt-12">
|
||||||
@ -995,46 +1009,48 @@ export default function MailPage() {
|
|||||||
{filteredEmails.map((email) => (
|
{filteredEmails.map((email) => (
|
||||||
<li
|
<li
|
||||||
key={email.id}
|
key={email.id}
|
||||||
className={`flex items-center p-4 hover:bg-gray-50 cursor-pointer ${
|
className={`flex items-center p-4 hover:bg-gray-50 transition-colors duration-150 cursor-pointer ${
|
||||||
selectedEmail?.id === email.id ? 'bg-blue-50' : ''
|
selectedEmail?.id === email.id ? 'bg-blue-50' : ''
|
||||||
}`}
|
} ${!email.read ? 'bg-blue-50/20' : ''}`}
|
||||||
onClick={() => handleEmailSelect(email)}
|
onClick={() => handleEmailSelect(email)}
|
||||||
>
|
>
|
||||||
<div className="flex-1 min-w-0">
|
<div className="flex-1 min-w-0">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between space-x-4">
|
||||||
<div className="flex items-center space-x-4">
|
<div className="flex items-center space-x-4 flex-1">
|
||||||
<input
|
<input
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
checked={selectedEmails.includes(email.id)}
|
checked={selectedEmails.includes(email.id)}
|
||||||
onChange={(e) => handleEmailCheckbox(e, email.id)}
|
onChange={(e) => handleEmailCheckbox(e, email.id)}
|
||||||
onClick={(e) => e.stopPropagation()}
|
onClick={(e) => e.stopPropagation()}
|
||||||
className="h-4 w-4 text-blue-600"
|
className="h-4 w-4 text-blue-600 rounded border-gray-300 focus:ring-blue-500"
|
||||||
/>
|
/>
|
||||||
<div className="min-w-0">
|
<div className="min-w-0 flex-1">
|
||||||
<p className="text-sm font-medium text-gray-900 truncate">
|
<p className={`text-sm truncate ${!email.read ? 'font-semibold' : 'font-medium'} text-gray-900`}>
|
||||||
{email.fromName || email.from}
|
{email.fromName || email.from}
|
||||||
</p>
|
</p>
|
||||||
<p className="text-sm text-gray-500 truncate">{email.subject}</p>
|
<div className="flex items-center space-x-2">
|
||||||
|
<p className={`text-sm truncate ${!email.read ? 'font-medium' : ''} text-gray-600 flex-1`}>
|
||||||
|
{email.subject}
|
||||||
|
</p>
|
||||||
|
<span className="text-xs text-gray-500 whitespace-nowrap">
|
||||||
|
{formatDate(email.date.toISOString())}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex items-center space-x-2">
|
<button
|
||||||
<span className="text-sm text-gray-500">
|
onClick={(e) => {
|
||||||
{formatDate(email.date.toISOString())}
|
e.stopPropagation();
|
||||||
</span>
|
toggleStarred(email.id, e);
|
||||||
<button
|
}}
|
||||||
onClick={(e) => {
|
className="text-gray-400 hover:text-yellow-400 transition-colors duration-150 p-1 hover:bg-gray-100 rounded-full"
|
||||||
e.stopPropagation();
|
>
|
||||||
toggleStarred(email.id, e);
|
{email.starred ? (
|
||||||
}}
|
<Star className="h-5 w-5 text-yellow-400" />
|
||||||
className="text-gray-400 hover:text-yellow-400"
|
) : (
|
||||||
>
|
<Star className="h-5 w-5" />
|
||||||
{email.starred ? (
|
)}
|
||||||
<Star className="h-5 w-5 text-yellow-400" />
|
</button>
|
||||||
) : (
|
|
||||||
<Star className="h-5 w-5" />
|
|
||||||
)}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user