Neah version mail design fix 7 bis ???
This commit is contained in:
parent
d35d89ea9d
commit
820d444180
@ -756,20 +756,22 @@ export default function MailPage() {
|
||||
</div>
|
||||
);
|
||||
|
||||
// Add a fixed bottom toolbar for bulk actions
|
||||
// Update the bulk actions toolbar to fit within email list panel
|
||||
const renderBulkActionsToolbar = () => {
|
||||
if (selectedEmails.length === 0) return null;
|
||||
|
||||
return (
|
||||
<div className="fixed bottom-0 left-0 right-0 bg-white border-t border-gray-200 px-4 py-2 flex items-center justify-between shadow-lg">
|
||||
<div className="flex items-center gap-1">
|
||||
<span className="text-sm text-gray-600 mr-4">
|
||||
<div className="bg-white border-b border-gray-100 px-4 py-2">
|
||||
<div className="flex items-center gap-2 mb-2">
|
||||
<span className="text-sm text-gray-600">
|
||||
{selectedEmails.length} selected
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
className="text-gray-600 hover:text-gray-900"
|
||||
className="text-gray-600 hover:text-gray-900 h-8"
|
||||
onClick={() => {
|
||||
const allSelectedRead = selectedEmails.every(id =>
|
||||
emails.find(email => email.id.toString() === id)?.read
|
||||
@ -777,38 +779,41 @@ export default function MailPage() {
|
||||
handleBulkAction(allSelectedRead ? 'mark-unread' : 'mark-read');
|
||||
}}
|
||||
>
|
||||
<EyeOff className="h-4 w-4 mr-2" />
|
||||
Mark as {selectedEmails.every(id =>
|
||||
emails.find(email => email.id.toString() === id)?.read
|
||||
) ? 'unread' : 'read'}
|
||||
<EyeOff className="h-4 w-4 mr-1.5" />
|
||||
<span className="text-sm">
|
||||
Mark {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"
|
||||
className="text-gray-600 hover:text-gray-900 h-8"
|
||||
onClick={() => handleBulkAction('archive')}
|
||||
>
|
||||
<Archive className="h-4 w-4 mr-2" />
|
||||
Archive
|
||||
<Archive className="h-4 w-4 mr-1.5" />
|
||||
<span className="text-sm">Archive</span>
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
className="text-red-600 hover:text-red-700"
|
||||
className="text-red-600 hover:text-red-700 h-8"
|
||||
onClick={() => handleBulkAction('delete')}
|
||||
>
|
||||
<Trash2 className="h-4 w-4 mr-2" />
|
||||
Delete
|
||||
<Trash2 className="h-4 w-4 mr-1.5" />
|
||||
<span className="text-sm">Delete</span>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
// Update the email list wrapper to include the bulk actions toolbar
|
||||
// Update the email list to include the toolbar right after the header
|
||||
const renderEmailList = () => (
|
||||
<div className="w-[320px] bg-white/95 backdrop-blur-sm border-r border-gray-100 flex flex-col relative">
|
||||
<div className="w-[320px] bg-white/95 backdrop-blur-sm border-r border-gray-100 flex flex-col">
|
||||
{renderEmailListHeader()}
|
||||
{renderBulkActionsToolbar()}
|
||||
|
||||
<div
|
||||
className="flex-1 overflow-y-auto"
|
||||
@ -834,8 +839,6 @@ export default function MailPage() {
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{renderBulkActionsToolbar()}
|
||||
</div>
|
||||
);
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user