From b0dc6f9aed6d55533aeb7b77a69566af8f121db8 Mon Sep 17 00:00:00 2001
From: alma <alma@governance-labs.org>
Date: Wed, 16 Apr 2025 18:40:25 +0200
Subject: [PATCH] Neah version mail design fix 4

---
 app/mail/page.tsx | 77 ++++++++++++++++++++++++++++++++++++++++++-----
 1 file changed, 69 insertions(+), 8 deletions(-)

diff --git a/app/mail/page.tsx b/app/mail/page.tsx
index 400d1fd..250b390 100644
--- a/app/mail/page.tsx
+++ b/app/mail/page.tsx
@@ -1055,14 +1055,75 @@ export default function MailPage() {
       {/* Email list header */}
       <div className="p-4 border-b border-gray-100">
         <div className="flex items-center justify-between">
-          <h2 className="text-xl font-semibold text-gray-900">
-            {currentView === 'INBOX' ? 'Inbox' :
-             currentView === 'starred' ? 'Starred' :
-             currentView.charAt(0).toUpperCase() + currentView.slice(1).toLowerCase()}
-          </h2>
-          <span className="text-sm text-gray-500">
-            {emails.length} emails
-          </span>
+          <div className="flex items-center gap-3">
+            <Checkbox
+              checked={selectedEmails.length > 0 && selectedEmails.length === emails.length}
+              onCheckedChange={toggleSelectAll}
+              className="mt-0.5"
+            />
+            <h2 className="text-xl font-semibold text-gray-900">
+              {currentView === 'INBOX' ? 'Inbox' :
+               currentView === 'starred' ? 'Starred' :
+               currentView.charAt(0).toUpperCase() + currentView.slice(1).toLowerCase()}
+            </h2>
+          </div>
+          <div className="flex items-center gap-2">
+            {selectedEmails.length > 0 && (
+              <>
+                <Button
+                  variant="ghost"
+                  size="sm"
+                  className="text-gray-600 hover:text-gray-900"
+                  onClick={() => {
+                    // Mark as read/unread
+                    const isUnread = emails.some(email => 
+                      selectedEmails.includes(email.id.toString()) && !email.read
+                    );
+                    setEmails(emails.map(email => 
+                      selectedEmails.includes(email.id.toString())
+                        ? { ...email, read: !isUnread }
+                        : email
+                    ));
+                  }}
+                >
+                  <EyeOff className="h-4 w-4 mr-1" />
+                  {emails.some(email => selectedEmails.includes(email.id.toString()) && !email.read)
+                    ? 'Mark as Read'
+                    : 'Mark as Unread'
+                  }
+                </Button>
+                <Button
+                  variant="ghost"
+                  size="sm"
+                  className="text-gray-600 hover:text-gray-900"
+                  onClick={() => {
+                    // Move to folder (Archive)
+                    setEmails(emails.map(email => 
+                      selectedEmails.includes(email.id.toString())
+                        ? { ...email, folder: 'Archive' }
+                        : email
+                    ));
+                    setSelectedEmails([]);
+                  }}
+                >
+                  <Archive className="h-4 w-4 mr-1" />
+                  Move to
+                </Button>
+                <Button
+                  variant="ghost"
+                  size="sm"
+                  className="text-red-600 hover:text-red-700"
+                  onClick={handleBulkDelete}
+                >
+                  <Trash2 className="h-4 w-4 mr-1" />
+                  Delete
+                </Button>
+              </>
+            )}
+            <span className="text-sm text-gray-500 ml-2">
+              {emails.length} emails
+            </span>
+          </div>
         </div>
       </div>