diff --git a/app/mail/page.tsx b/app/mail/page.tsx
index a500e65..2a59ef4 100644
--- a/app/mail/page.tsx
+++ b/app/mail/page.tsx
@@ -1533,6 +1533,34 @@ export default function MailPage() {
     </AlertDialog>
   );
 
+  const handleMailboxChange = async (newMailbox: string) => {
+    setCurrentView(newMailbox);
+    setSelectedEmails([]);
+    setSearchQuery('');
+    setEmails([]);
+    setLoading(true);
+    setError(null);
+    setHasMore(true);
+    setPage(1);
+
+    try {
+      const response = await fetch(`/api/mail?folder=${encodeURIComponent(newMailbox)}`);
+      if (!response.ok) {
+        throw new Error('Failed to fetch emails');
+      }
+      const data = await response.json();
+      setEmails(data.emails);
+      // Only update unread count if we're in the Inbox
+      if (newMailbox === 'INBOX') {
+        setUnreadCount(data.unreadCount);
+      }
+    } catch (err) {
+      setError(err instanceof Error ? err.message : 'Failed to fetch emails');
+    } finally {
+      setLoading(false);
+    }
+  };
+
   if (error) {
     return (
       <div className="flex h-[calc(100vh-theme(spacing.12))] items-center justify-center bg-gray-100 mt-12">
@@ -1589,7 +1617,7 @@ export default function MailPage() {
             <Button
               variant="ghost"
               size="icon"
-              onClick={() => loadEmails()}
+              onClick={() => handleMailboxChange('INBOX')}
               className="text-gray-600 hover:text-gray-900 hover:bg-gray-100"
             >
               <RefreshCw className="h-4 w-4" />