alma/NeahFront9
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Neah version mail design fix 7

Browse Source
This commit is contained in:
alma 2025-04-16 19:03:14 +02:00
parent ee22f64621
commit 2f8d83b5b7
1 changed files with 25 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
app/mail/page.tsx
View File

@ -737,64 +737,65 @@ export default function MailPage() {
}
};
// Update the email list header with better aligned checkbox and bulk actions
// Update the email list header with inline bulk actions
const renderEmailListHeader = () => (
<div className="border-b border-gray-100">
{/* Main header row */}
<div className="flex items-center px-4 h-14">
{/* Left side with checkbox and title */}
<div className="flex items-center gap-3">
<Checkbox
checked={emails.length > 0 && selectedEmails.length === emails.length}
onCheckedChange={toggleSelectAll}
className="mt-0.5"
/>
<h2 className="text-base font-semibold text-gray-900">
{currentView === 'INBOX' ? 'Inbox' :
currentView === 'starred' ? 'Starred' :
currentView.charAt(0).toUpperCase() + currentView.slice(1).toLowerCase()}
</h2>
<h2 className="text-base font-semibold text-gray-900">Inbox</h2>
<span className="text-sm text-gray-600">
{emails.length} emails
</span>
</div>
<span className="text-sm text-gray-600 ml-3">
{emails.length} emails
</span>
{/* Bulk actions aligned to the right */}
{selectedEmails.length > 0 && (
<div className="flex items-center gap-1 ml-auto">
{/* Bulk actions right after the title */}
{selectedEmails.length > 0 ? (
<div className="flex items-center gap-2 ml-6">
<Button
variant="ghost"
size="sm"
className="text-gray-600 hover:text-gray-900 px-2 py-1 h-8"
className="text-gray-600 hover:text-gray-900 h-8 px-2 py-1"
onClick={() => {
const someUnread = emails.some(email =>
selectedEmails.includes(email.id.toString()) && !email.read
// Check if all selected emails are read
const allSelectedRead = selectedEmails.every(id =>
emails.find(email => email.id.toString() === id)?.read
);
handleBulkAction(someUnread ? 'mark-read' : 'mark-unread');
handleBulkAction(allSelectedRead ? 'mark-unread' : 'mark-read');
}}
>
<EyeOff className="h-4 w-4" />
<span className="ml-2 text-sm">Mark as Read</span>
<span className="ml-1.5 text-sm">
Mark as {selectedEmails.every(id =>
emails.find(email => email.id.toString() === id)?.read
) ? 'unread' : 'read'}
</span>
</Button>
<Button
variant="ghost"
size="sm"
className="text-gray-600 hover:text-gray-900 px-2 py-1 h-8"
className="text-gray-600 hover:text-gray-900 h-8 px-2 py-1"
onClick={() => handleBulkAction('archive')}
>
<Archive className="h-4 w-4" />
<span className="ml-2 text-sm">Archive</span>
<span className="ml-1.5 text-sm">Archive</span>
</Button>
<Button
variant="ghost"
size="sm"
className="text-red-600 hover:text-red-700 px-2 py-1 h-8"
className="text-red-600 hover:text-red-700 h-8 px-2 py-1"
onClick={() => handleBulkAction('delete')}
>
<Trash2 className="h-4 w-4" />
<span className="ml-2 text-sm">Delete</span>
<span className="ml-1.5 text-sm">Delete</span>
</Button>
</div>
)}
) : null}
</div>
</div>
);