diff --git a/app/api/mail/route.ts b/app/api/mail/route.ts
index 8febce3d..3fdf769a 100644
--- a/app/api/mail/route.ts
+++ b/app/api/mail/route.ts
@@ -43,15 +43,33 @@ export async function GET() {
 
       await client.connect();
       const mailbox = await client.mailboxOpen('INBOX');
-      const messages = await client.fetch('1:10', { envelope: true });
+      
+      // Fetch the last 20 messages
+      const messages = await client.fetch('1:20', { 
+        envelope: true,
+        bodyStructure: true,
+        flags: true
+      });
       
       const result = [];
       for await (const message of messages) {
+        // Get the message body
+        const body = await client.download(message.uid.toString(), 'TEXT');
+
         result.push({
-          id: message.uid,
-          subject: message.envelope.subject,
+          id: message.uid.toString(),
           from: message.envelope.from[0].address,
-          date: message.envelope.date,
+          subject: message.envelope.subject || '(No subject)',
+          date: message.envelope.date.toISOString(),
+          read: message.flags.has('\\Seen'),
+          starred: message.flags.has('\\Flagged'),
+          folder: mailbox.path,
+          // Additional fields that might be useful
+          to: message.envelope.to?.map(addr => addr.address).join(', ') || '',
+          cc: message.envelope.cc?.map(addr => addr.address) || [],
+          bcc: message.envelope.bcc?.map(addr => addr.address) || [],
+          flags: Array.from(message.flags),
+          body: body?.content?.toString() || ''
         });
       }
 
diff --git a/hooks/use-mail.ts b/hooks/use-mail.ts
index 37f0c1ad..c37dfb9f 100644
--- a/hooks/use-mail.ts
+++ b/hooks/use-mail.ts
@@ -26,10 +26,23 @@ export const useMail = () => {
     try {
       const response = await fetch('/api/mail');
       if (!response.ok) {
-        throw new Error('Failed to fetch mails');
+        const errorData = await response.json();
+        throw new Error(errorData.error || 'Failed to fetch mails');
       }
       const data = await response.json();
-      setMails(data.emails || []);
+      // Map the API response to our Mail interface
+      const formattedMails = data.map((mail: any) => ({
+        id: mail.id.toString(),
+        from: mail.from,
+        to: '', // Will be populated when viewing individual mail
+        subject: mail.subject || '(No subject)',
+        body: '', // Will be populated when viewing individual mail
+        date: new Date(mail.date).toISOString(),
+        read: false, // Default to unread
+        starred: false, // Default to not starred
+        folder: 'INBOX', // Default to INBOX
+      }));
+      setMails(formattedMails);
     } catch (err) {
       setError(err instanceof Error ? err.message : 'Failed to fetch mails');
       setMails([]);