panel 2 courier api restore

app/api/courrier/login/route.ts

@@ -11,111 +11,6 @@ const emailContentCache = new LRUCache<string, any>({
   ttl: 1000 * 60 * 15, // 15 minutes
 });
 
-export async function POST(request: Request) {
-  try {
-    const session = await getServerSession(authOptions);
-    if (!session?.user?.id) {
-      return NextResponse.json(
-        { error: 'Unauthorized' },
-        { status: 401 }
-      );
-    }
-
-    // Verify user exists
-    const user = await prisma.user.findUnique({
-      where: { id: session.user.id }
-    });
-
-    if (!user) {
-      return NextResponse.json(
-        { error: 'User not found' },
-        { status: 404 }
-      );
-    }
-
-    const { email, password, host, port } = await request.json();
-
-    if (!email || !password || !host || !port) {
-      return NextResponse.json(
-        { error: 'Missing required fields' },
-        { status: 400 }
-      );
-    }
-
-    // Test IMAP connection
-    const client = new ImapFlow({
-      host: host,
-      port: parseInt(port),
-      secure: true,
-      auth: {
-        user: email,
-        pass: password,
-      },
-      logger: false,
-      emitLogs: false,
-      tls: {
-        rejectUnauthorized: false // Allow self-signed certificates
-      }
-    });
-
-    try {
-      await client.connect();
-      await client.mailboxOpen('INBOX');
-      
-      // Store or update credentials in database
-      await prisma.mailCredentials.upsert({
-        where: {
-          userId: session.user.id
-        },
-        update: {
-          email,
-          password,
-          host,
-          port: parseInt(port)
-        },
-        create: {
-          userId: session.user.id,
-          email,
-          password,
-          host,
-          port: parseInt(port)
-        }
-      });
-
-      return NextResponse.json({ success: true });
-    } catch (error) {
-      if (error instanceof Error) {
-        if (error.message.includes('Invalid login')) {
-          return NextResponse.json(
-            { error: 'Invalid login or password' },
-            { status: 401 }
-          );
-        }
-        return NextResponse.json(
-          { error: `IMAP connection error: ${error.message}` },
-          { status: 500 }
-        );
-      }
-      return NextResponse.json(
-        { error: 'Failed to connect to email server' },
-        { status: 500 }
-      );
-    } finally {
-      try {
-        await client.logout();
-      } catch (e) {
-        console.error('Error during logout:', e);
-      }
-    }
-  } catch (error) {
-    console.error('Error in login handler:', error);
-    return NextResponse.json(
-      { error: 'An unexpected error occurred' },
-      { status: 500 }
-    );
-  }
-}
-
 export async function GET(
   request: Request,
   { params }: { params: { id: string } }

app/api/courrier/route.ts

@@ -52,13 +52,16 @@ async function getCredentialsWithCache(userId: string) {
 
 export async function GET(request: Request) {
   try {
+    console.log('Courrier API call received');
     const session = await getServerSession(authOptions);
     if (!session?.user?.id) {
+      console.log('No authenticated session found');
       return NextResponse.json(
         { error: 'Unauthorized' },
         { status: 401 }
       );
     }
+    console.log('User authenticated:', session.user.id);
 
     // Get URL parameters
     const url = new URL(request.url);
@@ -67,6 +70,7 @@ export async function GET(request: Request) {
     const limit = parseInt(url.searchParams.get('limit') || '20');
     const preview = url.searchParams.get('preview') === 'true';
     const skipCache = url.searchParams.get('skipCache') === 'true';
+    console.log('Request parameters:', { folder, page, limit, preview, skipCache });
     
     // Generate cache key based on request parameters
     const cacheKey = `${session.user.id}:${folder}:${page}:${limit}:${preview}`;
@@ -76,14 +80,17 @@ export async function GET(request: Request) {
       const { data, timestamp } = emailListCache[cacheKey];
       // Return cached data if it's fresh (less than 1 minute old)
       if (Date.now() - timestamp < 60000) {
+        console.log('Returning cached email data');
         return NextResponse.json(data);
       }
     }
 
     // Get credentials from cache or database
     const credentials = await getCredentialsWithCache(session.user.id);
+    console.log('Credentials retrieved:', credentials ? 'yes' : 'no');
 
     if (!credentials) {
+      console.log('No mail credentials found for user');
       return NextResponse.json(
         { error: 'No mail credentials found. Please configure your email account.' },
         { status: 401 }
@@ -93,8 +100,10 @@ export async function GET(request: Request) {
     // Calculate start and end sequence numbers
     const start = (page - 1) * limit + 1;
     const end = start + limit - 1;
+    console.log('Fetching emails from range:', { start, end });
 
     // Connect to IMAP server
+    console.log('Connecting to IMAP server:', credentials.host, credentials.port);
     const client = new ImapFlow({
       host: credentials.host,
       port: credentials.port,
@@ -112,13 +121,21 @@ export async function GET(request: Request) {
 
     try {
       await client.connect();
+      console.log('Connected to IMAP server');
       
       // Get list of all mailboxes first
       const mailboxes = await client.list();
       const availableFolders = mailboxes.map(box => box.path);
+      console.log('Available folders:', availableFolders);
       
       // Open the requested mailbox
+      console.log('Opening mailbox:', folder);
       const mailbox = await client.mailboxOpen(folder);
+      console.log('Mailbox stats:', { 
+        exists: mailbox.exists, 
+        name: mailbox.path,
+        flags: mailbox.flags
+      });
       
       const result = [];
       
@@ -127,6 +144,7 @@ export async function GET(request: Request) {
         // Adjust start and end to be within bounds
         const adjustedStart = Math.min(start, mailbox.exists);
         const adjustedEnd = Math.min(end, mailbox.exists);
+        console.log('Adjusted fetch range:', { adjustedStart, adjustedEnd });
         
         // Fetch both metadata and preview content
         const fetchOptions: any = { 
@@ -140,9 +158,11 @@ export async function GET(request: Request) {
           fetchOptions.bodyParts = ['TEXT'];
         }
         
+        console.log('Fetching messages with options:', fetchOptions);
         const messages = await client.fetch(`${adjustedStart}:${adjustedEnd}`, fetchOptions);
         
         for await (const message of messages) {
+          console.log('Processing message ID:', message.uid);
           const emailData: any = {
             id: message.uid,
             from: message.envelope.from?.[0]?.address || '',
@@ -164,6 +184,8 @@ export async function GET(request: Request) {
           
           result.push(emailData);
         }
+      } else {
+        console.log('No messages in mailbox');
       }
 
       const responseData = {
@@ -173,6 +195,13 @@ export async function GET(request: Request) {
         hasMore: end < mailbox.exists
       };
       
+      console.log('Response summary:', { 
+        emailCount: result.length, 
+        folderCount: availableFolders.length,
+        total: mailbox.exists,
+        hasMore: end < mailbox.exists
+      });
+      
       // Cache the result
       emailListCache[cacheKey] = {
         data: responseData,
@@ -183,6 +212,7 @@ export async function GET(request: Request) {
     } finally {
       try {
         await client.logout();
+        console.log('IMAP client logged out');
       } catch (e) {
         console.error('Error during logout:', e);
       }

app/courrier/page.tsx

@@ -98,34 +98,20 @@ function splitEmailHeadersAndBody(emailBody: string): { headers: string; body: s
   };
 }
 
-// Email content parsing cache to prevent redundant API calls
-const parsedEmailCache = new Map<string, { html?: string; text?: string }>();
-
 function EmailContent({ email }: { email: Email }) {
   const [content, setContent] = useState<React.ReactNode>(null);
   const [error, setError] = useState<string | null>(null);
   const [isLoading, setIsLoading] = useState(false);
   const [debugInfo, setDebugInfo] = useState<string | null>(null);
-  const didParseRef = useRef(false);
 
   useEffect(() => {
     let mounted = true;
-    
-    // Check if we've already parsed this email content before
-    const cacheKey = email?.id + (email?.content?.substring(0, 50) || '');
-    const cachedResult = parsedEmailCache.get(cacheKey);
 
     async function loadContent() {
       if (!email) return;
       
-      // If this is the same email, don't reload unless we need to
-      if (didParseRef.current && content) {
-        return;
-      }
-      
       setIsLoading(true);
       setDebugInfo(null);
-      
       try {
         console.log('Loading content for email:', email.id);
         console.log('Email content length:', email.content?.length || 0);
@@ -150,58 +136,6 @@ function EmailContent({ email }: { email: Email }) {
           }
           return;
         }
-        
-        // Use cached result if available
-        if (cachedResult) {
-          console.log('Using cached parsed email for:', email.id);
-          if (mounted) {
-            if (cachedResult.html) {
-              const sanitizedHtml = DOMPurify.sanitize(cachedResult.html);
-              setContent(
-                <div 
-                  className="email-content prose prose-sm max-w-none dark:prose-invert"
-                  dangerouslySetInnerHTML={{ __html: sanitizedHtml }}
-                />
-              );
-              setDebugInfo('Rendered HTML content from cache');
-            } else if (cachedResult.text) {
-              setContent(
-                <div className="email-content whitespace-pre-wrap">
-                  {cachedResult.text}
-                </div>
-              );
-              setDebugInfo('Rendered text content from cache');
-            }
-            setError(null);
-            setIsLoading(false);
-            didParseRef.current = true;
-          }
-          return;
-        }
-
-        // Check if the content is already HTML
-        if (formattedEmail.includes('<html') || formattedEmail.includes('<body')) {
-          // It's already HTML, just sanitize and render
-          const sanitizedHtml = DOMPurify.sanitize(formattedEmail);
-          
-          if (mounted) {
-            setContent(
-              <div 
-                className="email-content prose prose-sm max-w-none dark:prose-invert"
-                dangerouslySetInnerHTML={{ __html: sanitizedHtml }}
-              />
-            );
-            setDebugInfo('Rendered pre-existing HTML content');
-            
-            // Cache the result
-            parsedEmailCache.set(cacheKey, { html: formattedEmail });
-            
-            setError(null);
-            setIsLoading(false);
-            didParseRef.current = true;
-          }
-          return;
-        }
 
         console.log('Parsing email content:', formattedEmail.substring(0, 100) + '...');
         const parsedEmail = await decodeEmail(formattedEmail);
@@ -212,12 +146,6 @@ function EmailContent({ email }: { email: Email }) {
           textLength: parsedEmail.text?.length || 0
         });
         
-        // Cache the result for future use
-        parsedEmailCache.set(cacheKey, {
-          html: parsedEmail.html || undefined,
-          text: parsedEmail.text || undefined
-        });
-        
         if (mounted) {
           if (parsedEmail.html) {
             const sanitizedHtml = DOMPurify.sanitize(parsedEmail.html);
@@ -241,7 +169,6 @@ function EmailContent({ email }: { email: Email }) {
           }
           setError(null);
           setIsLoading(false);
-          didParseRef.current = true;
         }
       } catch (err) {
         console.error('Error rendering email content:', err);
@@ -259,7 +186,7 @@ function EmailContent({ email }: { email: Email }) {
     return () => {
       mounted = false;
     };
-  }, [email?.id, email?.content, content]);
+  }, [email?.id, email?.content]);
 
   if (isLoading) {
     return (
@@ -453,15 +380,6 @@ function EmailPreview({ email }: { email: Email }) {
 
       setIsLoading(true);
       try {
-        // Check if content is already a simple preview string (less than 1000 chars)
-        if (email.content.length < 1000 && !email.content.includes('Content-Type:')) {
-          setPreview(email.content.substring(0, 150) + '...');
-          setError(null);
-          setIsLoading(false);
-          return;
-        }
-
-        // Otherwise try to decode it
         const decoded = await decodeEmail(email.content);
         if (mounted) {
           if (decoded.text) {
@@ -477,9 +395,8 @@ function EmailPreview({ email }: { email: Email }) {
       } catch (err) {
         console.error('Error generating email preview:', err);
         if (mounted) {
-          // Fallback to displaying the raw content if decoding fails
+          setError('Error generating preview');
-          setPreview(email.content.substring(0, 150) + '...');
+          setPreview('');
-          setError(null);
         }
       } finally {
         if (mounted) setIsLoading(false);
@@ -600,9 +517,6 @@ export default function CourrierPage() {
     type: 'reply' | 'reply-all' | 'forward';
   } | null>(null);
 
-  // Email content cache to prevent redundant API calls
-  const emailContentCache = useRef<Map<string, any>>(new Map());
-
   // Debug logging for email distribution
   useEffect(() => {
     const emailsByFolder = emails.reduce((acc, email) => {
@@ -625,7 +539,6 @@ export default function CourrierPage() {
       try {
         console.log('Checking for stored credentials...');
         const response = await fetch('/api/courrier');
-        
         if (!response.ok) {
           const errorData = await response.json();
           console.log('API response error:', errorData);
@@ -636,66 +549,9 @@ export default function CourrierPage() {
           }
           throw new Error(errorData.error || 'Failed to check credentials');
         }
-        
+        console.log('Credentials verified, loading emails...');
-        // Process API response to get folders and emails in one go
-        const data = await response.json();
-        
-        // Update folder list first
-        if (data.folders && data.folders.length > 0) {
-          setAvailableFolders(data.folders);
-          
-          // Update sidebar items based on folders
-          const standardFolders = ['INBOX', 'Sent', 'Drafts', 'Trash', 'Junk'];
-          const customFolders = data.folders.filter(
-            (folder: string) => !standardFolders.includes(folder)
-          );
-          
-          setFolders(customFolders);
-          
-          // Update sidebar items with standard and custom folders
-          const updatedSidebarItems = [
-            ...sidebarItems.filter(item => standardFolders.includes(item.view)),
-            ...customFolders.map((folder: string) => ({
-              view: folder,
-              label: folder,
-              icon: getFolderIcon(folder)
-            }))
-          ];
-          
-          setSidebarItems(updatedSidebarItems);
-        }
-        
-        // Process emails immediately if available
-        if (data.emails && data.emails.length > 0) {
-          const processedEmails = data.emails.map((email: any) => ({
-            id: email.id,
-            accountId: 1,
-            from: email.from || '',
-            fromName: email.fromName || email.from?.split('@')[0] || '',
-            to: email.to || '',
-            subject: email.subject || '(No subject)',
-            content: email.preview || '', // Store preview as initial content
-            date: email.date || new Date().toISOString(),
-            read: email.read || false,
-            starred: email.starred || false,
-            folder: email.folder || currentView,
-            cc: email.cc,
-            bcc: email.bcc,
-            flags: email.flags || [],
-            hasAttachments: email.hasAttachments || false
-          }));
-          
-          setEmails(processedEmails);
-          
-          // Calculate unread count
-          const unreadInboxEmails = processedEmails.filter(
-            (email: any) => !email.read && email.folder === 'INBOX'
-          ).length;
-          setUnreadCount(unreadInboxEmails);
-        }
-        
-        console.log('Credentials verified, loading complete');
         setLoading(false);
+        loadEmails();
       } catch (err) {
         console.error('Error checking credentials:', err);
         setError(err instanceof Error ? err.message : 'Failed to check credentials');
@@ -705,114 +561,36 @@ export default function CourrierPage() {
 
     checkCredentials();
   }, [router]);
-  
-  // Add a refreshEmails function to handle fresh data loading
-  const refreshEmails = async () => {
-    // If we're already refreshing, don't start another refresh
-    if (isLoadingRefresh) return;
-    
-    setIsLoadingRefresh(true);
-    
-    // Clear selected email to avoid UI inconsistencies
-    setSelectedEmail(null);
-    
-    try {
-      // Force timestamp to bypass cache
-      const timestamp = Date.now();
-      
-      // Include skipCache parameter to bypass any server-side caching
-      const response = await fetch(
-        `/api/courrier?folder=${encodeURIComponent(currentView)}&page=1&limit=${emailsPerPage}&_t=${timestamp}&skipCache=true&preview=true`,
-        { 
-          cache: 'no-store',
-          headers: {
-            'Cache-Control': 'no-cache, no-store, must-revalidate',
-            'Pragma': 'no-cache'
-          }
-        }
-      );
-      
-      if (!response.ok) {
-        throw new Error('Failed to refresh emails');
-      }
-      
-      const data = await response.json();
-      
-      // Create a Set of standard folder names for more efficient lookup
-      const standardFoldersSet = new Set(['INBOX', 'Sent', 'Drafts', 'Trash', 'Junk']);
-      
-      // Always update folders on refresh
-      if (data.folders && data.folders.length > 0) {
-        setAvailableFolders(data.folders);
-        
-        // Filter custom folders more efficiently
-        const customFolders = data.folders.filter((folder: string) => !standardFoldersSet.has(folder));
-        setFolders(customFolders);
-        
-        // Create a map of existing standard sidebar items for quick lookup
-        const standardSidebarItems = initialSidebarItems.filter(item => 
-          standardFoldersSet.has(item.view)
-        );
-        
-        // Only create new items for custom folders
-        const customSidebarItems = customFolders.map((folder: string) => ({
-          view: folder,
-          label: folder,
-          icon: getFolderIcon(folder)
-        }));
-        
-        // Update sidebar items efficiently
-        setSidebarItems([...standardSidebarItems, ...customSidebarItems]);
-      }
-      
-      // Process emails with a more efficient mapping approach
-      if (data.emails && data.emails.length > 0) {
-        const processedEmails = data.emails.map((email: any) => ({
-          id: email.id,
-          accountId: 1,
-          from: email.from || '',
-          fromName: email.fromName || email.from?.split('@')[0] || '',
-          to: email.to || '',
-          subject: email.subject || '(No subject)',
-          content: email.preview || email.content || '',
-          date: email.date || new Date().toISOString(),
-          read: email.read || false,
-          starred: email.starred || false,
-          folder: email.folder || currentView,
-          cc: email.cc,
-          bcc: email.bcc,
-          flags: email.flags || [],
-          hasAttachments: email.hasAttachments || false
-        }));
-        
-        setEmails(processedEmails);
-        setHasMore(data.hasMore);
-        
-        // Calculate unread count more efficiently by directly counting during the map phase
-        if (currentView === 'INBOX') {
-          const unreadCount = processedEmails.reduce((count: number, email: Email) => 
-            (!email.read && email.folder === 'INBOX') ? count + 1 : count, 0
-          );
-          setUnreadCount(unreadCount);
-        }
-      } else {
-        // Clear emails if none were returned
-        setEmails([]);
-        setHasMore(false);
-      }
-    } catch (error) {
-      console.error('Error refreshing emails:', error);
-      setError(error instanceof Error ? error.message : 'Failed to refresh emails');
-    } finally {
-      setIsLoadingRefresh(false);
-    }
-  };
 
-  // Update the loadEmails function to prevent redundant API calls
+  // Check for email credentials
+  useEffect(() => {
+    async function checkMailCredentials() {
+      try {
+        const response = await fetch('/api/courrier/login');
+        const data = await response.json();
+        
+        if (response.status === 404 || !response.ok) {
+          console.log('Mail credentials not found');
+          setError('Please configure your email account first');
+          // Optionally redirect to login page
+          // router.push('/courrier/login');
+        } else {
+          console.log('Mail credentials found:', data.email);
+        }
+      } catch (error) {
+        console.error('Error checking mail credentials:', error);
+      }
+    }
+    
+    checkMailCredentials();
+  }, []);
+
+  // Update the loadEmails function with better debugging
   const loadEmails = async (isLoadMore = false) => {
     try {
       // Don't reload if we're already loading
       if (isLoadingInitial || isLoadingMore) {
+        console.log('Skipping email load - already loading');
         return;
       }
       
@@ -825,12 +603,13 @@ export default function CourrierPage() {
       
       // Create a cache key for this request
       const cacheKey = `${currentView}-${page}-${emailsPerPage}`;
+      console.log('Loading emails with params:', { currentView, page, emailsPerPage });
       
       // Add timestamp parameter to force fresh data when needed
       const timestamp = isLoadMore || page > 1 ? '' : `&_t=${Date.now()}`;
       
       const response = await fetch(
-        `/api/courrier?folder=${encodeURIComponent(currentView)}&page=${page}&limit=${emailsPerPage}${timestamp}&preview=true`, 
+        `/api/courrier?folder=${encodeURIComponent(currentView)}&page=${page}&limit=${emailsPerPage}${timestamp}`, 
         { cache: 'no-store' }
       );
       
@@ -841,29 +620,8 @@ export default function CourrierPage() {
       const data = await response.json();
       
       // Get available folders from the API response
-      if (data.folders && data.folders.length > 0) {
+      if (data.folders) {
         setAvailableFolders(data.folders);
-        
-        // Update sidebar items based on folders
-        const standardFolders = ['INBOX', 'Sent', 'Drafts', 'Trash', 'Junk'];
-        const customFolders = data.folders.filter(
-          (folder: string) => !standardFolders.includes(folder)
-        );
-        
-        // Set folders for display in sidebar
-        setFolders(customFolders);
-        
-        // Update sidebar items with standard and custom folders
-        const updatedSidebarItems = [
-          ...sidebarItems.filter(item => standardFolders.includes(item.view)),
-          ...customFolders.map((folder: string) => ({
-            view: folder,
-            label: folder,
-            icon: getFolderIcon(folder)
-          }))
-        ];
-        
-        setSidebarItems(updatedSidebarItems);
       }
       
       // Process emails keeping exact folder names and sort by date
@@ -875,7 +633,7 @@ export default function CourrierPage() {
           fromName: email.fromName || email.from?.split('@')[0] || '',
           to: email.to || '',
           subject: email.subject || '(No subject)',
-          content: email.preview || email.content || '', // Ensure we use preview if available
+          content: email.preview || '', // Store preview as initial content
           date: email.date || new Date().toISOString(),
           read: email.read || false,
           starred: email.starred || false,
@@ -942,141 +700,67 @@ export default function CourrierPage() {
 
   // Update handleEmailSelect to set selectedEmail correctly and ensure content is loaded
   const handleEmailSelect = async (emailId: string) => {
-    // Find the email in the current list
-    const email = emails.find(e => e.id === emailId);
-    if (!email) return;
-    
-    // Check if we have the content cached
-    const cachedContent = emailContentCache.current.get(emailId);
-    
-    // Set selected email immediately to show the UI
-    setSelectedEmail(cachedContent || email);
-    
-    // If we already have the full content cached, we don't need to fetch it again
-    if (cachedContent?.content && cachedContent.content.length > 100) {
-      // Just update read status if needed
-      if (!email.read) {
-        try {
-          fetch(`/api/courrier/${emailId}/mark-read`, {
-            method: 'POST',
-            headers: {
-              'Content-Type': 'application/json',
-            }
-          });
-          
-          // Update the email in state optimistically
-          setEmails(emails.map(e => 
-            e.id === emailId ? { ...e, read: true } : e
-          ));
-        } catch (error) {
-          console.error('Error marking as read:', error);
-        }
-      }
-      return;
-    }
-    
-    // Set loading state
-    setContentLoading(true);
-    
     try {
-      // Fetch the full email content in the background
+      setContentLoading(true);
-      const controller = new AbortController();
-      const timeoutId = setTimeout(() => controller.abort(), 10000); // 10 second timeout
       
-      // Mark as read immediately for better UX
+      // Find the email in the current list first
-      if (!email.read) {
+      const emailInList = emails.find(email => email.id === emailId);
-        try {
+      
-          fetch(`/api/courrier/${emailId}/mark-read`, {
+      // Set selected email immediately with what we have
-            method: 'POST',
+      if (emailInList) {
-            headers: {
+        setSelectedEmail(emailInList);
-              'Content-Type': 'application/json',
-            }
-          });
-          
-          // Update the email in state optimistically
-          setEmails(emails.map(e => 
-            e.id === emailId ? { ...e, read: true } : e
-          ));
-        } catch (error) {
-          console.error('Error marking as read:', error);
-        }
       }
       
       // Fetch the full email content
-      const response = await fetch(`/api/courrier/${emailId}`, {
+      const response = await fetch(`/api/courrier/${emailId}`);
-        signal: controller.signal,
-        cache: 'force-cache'
-      });
-      
-      clearTimeout(timeoutId);
       
       if (!response.ok) {
-        throw new Error('Failed to fetch email content');
+        throw new Error('Failed to fetch full email content');
       }
       
-      const emailData = await response.json();
+      const fullEmail = await response.json();
+      console.log('Fetched email content:', fullEmail);
       
-      // Pre-parse the email content on the client side to avoid additional API calls
+      // Create a complete email object by combining what we have
-      let parsedContent = emailData.content;
+      const completeEmail = {
-      
+        ...(emailInList || {}),
-      // Only make parse-email call if we need to (large emails or complex formats)
+        ...fullEmail,
-      if (emailData.content && emailData.content.length > 0 && !emailData.content.includes('<html')) {
+        id: emailId,
-        try {
+        content: fullEmail.content || '',
-          const parsedEmailResponse = await fetch('/api/parse-email', {
-            method: 'POST',
-            headers: {
-              'Content-Type': 'application/json',
-            },
-            body: JSON.stringify({ email: emailData.content }),
-          });
-          
-          if (parsedEmailResponse.ok) {
-            const parsedData = await parsedEmailResponse.json();
-            if (parsedData.html) {
-              parsedContent = parsedData.html;
-            }
-          }
-        } catch (parseError) {
-          console.error('Error parsing email:', parseError);
-          // Continue with the raw content if parsing fails
-        }
-      }
-      
-      // Create the full email object
-      const fullEmail = {
-        ...email,
-        content: parsedContent || emailData.content || '',
-        parsedContent: true, // Mark that we've parsed this email
-        attachments: emailData.attachments || []
       };
       
-      // Update the cache
+      // Update the email in the list
-      emailContentCache.current.set(emailId, fullEmail);
+      setEmails(prevEmails => prevEmails.map(email => 
-      
+        email.id === emailId ? completeEmail : email
-      // Update the selected email with full content
-      setSelectedEmail(fullEmail);
-      
-      // Update the email in the list as well
-      setEmails(emails.map(e => 
-        e.id === emailId 
-          ? fullEmail
-          : e
       ));
+      
+      // Update the selected email
+      setSelectedEmail(completeEmail);
+      
+      // Try to mark as read in the background
+      try {
+        await fetch(`/api/courrier/${emailId}/mark-read`, {
+          method: 'POST',
+        });
+        
+        // Update read status in the list
+        setEmails(prevEmails => 
+          prevEmails.map(email => 
+            email.id === emailId 
+              ? { ...email, read: true }
+              : email
+          )
+        );
+      } catch (error) {
+        console.error('Error marking email as read:', error);
+      }
     } catch (error) {
-      console.error('Error fetching email content:', error);
+      console.error('Error fetching email:', error);
-      setError(error instanceof Error ? error.message : 'Failed to fetch email content');
+      setError('Failed to load email content. Please try again.');
     } finally {
       setContentLoading(false);
     }
   };
-  
-  // Add or update the refresh handler
-  const handleRefresh = () => {
-    // Clear selected email to avoid stale data
-    setSelectedEmail(null);
-    // Use the new refresh function
-    refreshEmails();
-  };
 
   // Add these improved handlers
   const handleEmailCheckbox = (e: React.ChangeEvent<HTMLInputElement>, emailId: number) => {
@@ -1215,39 +899,55 @@ export default function CourrierPage() {
   }, [sortedEmails, searchQuery]);
 
   // Update the email list to use filtered emails
-  const renderEmailList = () => (
+  const renderEmailList = () => {
-    <div className="w-[320px] bg-white/95 backdrop-blur-sm border-r border-gray-100 flex flex-col">
+    console.log('Rendering email list with state:', {
-      {renderEmailListHeader()}
+      loading,
-      {renderBulkActionsToolbar()}
+      emailCount: emails.length,
-      
+      filteredEmailCount: filteredEmails.length,
-      <div 
+      searchQuery: searchQuery.length > 0 ? searchQuery : 'empty',
-        className="flex-1 overflow-y-auto"
+      selectedEmails: selectedEmails.length
-        onScroll={handleScroll}
+    });
-      >
+    
-        {loading ? (
+    return (
-          <div className="flex items-center justify-center h-64">
+      <div className="w-[320px] bg-white/95 backdrop-blur-sm border-r border-gray-100 flex flex-col">
-            <div className="animate-spin rounded-full h-8 w-8 border-t-2 border-b-2 border-blue-500"></div>
+        {renderEmailListHeader()}
-          </div>
+        {renderBulkActionsToolbar()}
-        ) : filteredEmails.length === 0 ? (
+        
-          <div className="flex flex-col items-center justify-center h-64">
+        <div 
-            <Mail className="h-8 w-8 text-gray-400 mb-2" />
+          className="flex-1 overflow-y-auto"
-            <p className="text-gray-500 text-sm">
+          onScroll={handleScroll}
-              {searchQuery ? 'No emails match your search' : 'No emails in this folder'}
+        >
-            </p>
+          {loading ? (
-          </div>
+            <div className="flex items-center justify-center h-64">
-        ) : (
+              <div className="animate-spin rounded-full h-8 w-8 border-t-2 border-b-2 border-blue-500"></div>
-          <div className="divide-y divide-gray-100">
+            </div>
-            {filteredEmails.map((email) => renderEmailListItem(email))}
+          ) : filteredEmails.length === 0 ? (
-            {isLoadingMore && (
+            <div className="flex flex-col items-center justify-center h-64">
-              <div className="flex items-center justify-center p-4">
+              <Mail className="h-8 w-8 text-gray-400 mb-2" />
-                <div className="animate-spin rounded-full h-4 w-4 border-t-2 border-b-2 border-blue-500"></div>
+              <p className="text-gray-500 text-sm">
-              </div>
+                {searchQuery ? 'No emails match your search' : 'No emails in this folder'}
-            )}
+              </p>
-          </div>
+              {error && (
-        )}
+                <p className="text-red-500 text-sm mt-2">{error}</p>
+              )}
+              <p className="text-gray-400 text-xs mt-4">Folder: {currentView}</p>
+              <p className="text-gray-400 text-xs mt-1">Total emails: {emails.length}</p>
+              <p className="text-gray-400 text-xs mt-1">Available folders: {availableFolders.length}</p>
+            </div>
+          ) : (
+            <div className="divide-y divide-gray-100">
+              {filteredEmails.map((email) => renderEmailListItem(email))}
+              {isLoadingMore && (
+                <div className="flex items-center justify-center p-4">
+                  <div className="animate-spin rounded-full h-4 w-4 border-t-2 border-b-2 border-blue-500"></div>
+                </div>
+              )}
+            </div>
+          )}
+        </div>
       </div>
-    </div>
+    );
-  );
+  };
 
   // Update the email count in the header to show filtered count
   const renderEmailListHeader = () => (
@@ -1531,7 +1231,7 @@ export default function CourrierPage() {
       const controller = new AbortController();
       const timeoutId = setTimeout(() => controller.abort(), 10000); // 10 second timeout
 
-      const response = await fetch(`/api/courrier?folder=${encodeURIComponent(newMailbox)}&page=1&limit=${emailsPerPage}&preview=true`, {
+      const response = await fetch(`/api/courrier?folder=${encodeURIComponent(newMailbox)}&page=1&limit=${emailsPerPage}`, {
         signal: controller.signal
       });
 
@@ -1552,7 +1252,6 @@ export default function CourrierPage() {
         to: email.to || '',
         subject: email.subject || '(No subject)',
         body: email.body || '',
-        content: email.preview || email.content || '',
         date: email.date || new Date().toISOString(),
         read: email.read || false,
         starred: email.starred || false,
@@ -1851,11 +1550,10 @@ export default function CourrierPage() {
                 <Button
                   variant="ghost"
                   size="icon"
-                  onClick={() => refreshEmails()}
+                  onClick={() => handleMailboxChange('INBOX')}
                   className="text-gray-600 hover:text-gray-900 hover:bg-gray-100"
-                  disabled={isLoadingRefresh}
                 >
-                  <RefreshCw className={`h-4 w-4 ${isLoadingRefresh ? 'animate-spin' : ''}`} />
+                  <RefreshCw className="h-4 w-4" />
                 </Button>
               </div>