courrier multi account restore compose

app/courrier/page.tsx

@@ -77,30 +77,6 @@ interface EmailWithFlags {
   };
 }
 
-interface EmailMessage {
-  id: string;
-  from: { name: string; address: string }[];
-  to: { name: string; address: string }[];
-  subject: string;
-  date: Date;
-  flags: {
-    seen: boolean;
-    flagged: boolean;
-    answered: boolean;
-    draft: boolean;
-    deleted: boolean;
-  };
-  size: number;
-  hasAttachments: boolean;
-  folder: string;
-  contentFetched: boolean;
-  accountId: string;
-  content: {
-    text: string;
-    html: string;
-  };
-}
-
 export default function CourrierPage() {
   const router = useRouter();
   const { data: session } = useSession();
@@ -157,30 +133,27 @@ export default function CourrierPage() {
   // Track expanded folders for each account
   const [expandedAccounts, setExpandedAccounts] = useState<Record<string, boolean>>({});
   
-  // Track selected folder per account
+  // Add state to track selected folder per account
   const [selectedFolders, setSelectedFolders] = useState<Record<string, string>>({});
   
-  // Track folder visibility per account
+  // Update account folders when mailboxes change - update this to maintain account IDs
-  const [visibleFolders, setVisibleFolders] = useState<Record<string, string[]>>({});
-  
-  // Update account folders when mailboxes change
   useEffect(() => {
+    console.log('Mailboxes updated:', mailboxes);
     setAccounts(prev => {
       const updated = [...prev];
-      const accountIndex = updated.findIndex(acc => acc.id === selectedAccount?.id);
+      if (updated.length > 1) {
-      if (accountIndex !== -1) {
+        // Only update folders, preserve other properties including ID
-        updated[accountIndex] = {
+        if (updated[1]) {
-          ...updated[accountIndex],
+          updated[1] = {
+            ...updated[1],
             folders: mailboxes
           };
-        setVisibleFolders(prev => ({
+        }
-          ...prev,
+        console.log('Updated accounts with new mailboxes:', updated);
-          [updated[accountIndex].id]: mailboxes
-        }));
       }
       return updated;
     });
-  }, [mailboxes, selectedAccount]);
+  }, [mailboxes]);
   
   // Debug accounts state
   useEffect(() => {
@@ -572,35 +545,58 @@ export default function CourrierPage() {
     setShowComposeModal(true);
   };
   
-  // Update handleMailboxChange to properly handle per-account folders
+  // Update handleMailboxChange to track selected folders per account
   const handleMailboxChange = (folder: string, accountId?: string) => {
+    // Reset to page 1 when changing folders
+    setPage(1);
+    
+    // If we have a specific accountId, validate the folder exists for that account
     if (accountId && accountId !== 'all-accounts') {
       const account = accounts.find(a => a.id === accountId);
-      if (!account?.folders?.includes(folder)) {
+      if (!account) {
-        folder = 'INBOX'; // Fallback to INBOX if folder doesn't exist
+        console.error(`Account ${accountId} not found`);
+        return;
       }
+      
+      // Check if the folder exists for this account
+      if (!account.folders?.includes(folder)) {
+        console.error(`Folder ${folder} does not exist for account ${accountId}`);
+        // Fall back to INBOX if the folder doesn't exist
+        folder = 'INBOX';
+      }
+      
+      // Update the selected folder for this account
       setSelectedFolders(prev => ({
         ...prev,
         [accountId]: folder
       }));
+      
+      // Log the folder change with account ID
+      console.log(`Changing folder to ${folder} for account ${accountId}`);
     }
+    
+    // Change folder in the state, passing the clean folder name and accountId separately
     changeFolder(folder, accountId);
+    setCurrentView(folder);
+    
+    // Start prefetching additional pages for this folder
+    if (session?.user?.id && folder) {
+      // First two pages are most important - prefetch immediately
+      prefetchFolderEmails(session.user.id, folder, 3, 1, accountId).catch(err => {
+        console.error(`Error prefetching ${folder}:`, err);
+      });
+    }
   };
 
   // Update the folder button rendering to show selected state based on account
   const renderFolderButton = (folder: string, accountId: string) => {
     const isSelected = selectedFolders[accountId] === folder;
-    const account = accounts.find(a => a.id === accountId);
-    const isVisible = account?.folders?.includes(folder) || false;
-    
-    if (!isVisible) return null;
-    
     return (
       <Button
         key={folder}
         variant="ghost"
         className={`w-full justify-start text-xs py-1 h-7 ${isSelected ? 'bg-gray-100' : ''}`}
-        onClick={() => handleMailboxChange(folder, accountId)}
+        onClick={() => handleMailboxChange(folder, accountId !== 'all-accounts' ? accountId : undefined)}
       >
         <div className="flex items-center w-full">
           {getFolderIcon(folder)}
@@ -617,11 +613,7 @@ export default function CourrierPage() {
 
   // Handle sending email
   const handleSendEmail = async (emailData: EmailData) => {
-    const result = await sendEmail(emailData);
+    return await sendEmail(emailData);
-    if (!result.success) {
-      throw new Error(result.error);
-    }
-    return result;
   };
 
   // Handle delete confirmation
@@ -658,27 +650,6 @@ export default function CourrierPage() {
     }
   }, [selectedAccount, showFolders]);
 
-  const handleAccountSelect = (account: Account) => {
-    setSelectedAccount(account);
-    setShowFolders(true);
-    if (account.id !== 'all-accounts') {
-      setExpandedAccounts(prev => ({
-        ...prev,
-        [account.id]: true
-      }));
-    }
-    handleMailboxChange('INBOX', account.id);
-  };
-
-  const handleAddAccount = async (accountData: AccountData) => {
-    // ... account creation logic ...
-    setAccounts(prev => [...prev, newAccount]);
-    setVisibleFolders(prev => ({
-      ...prev,
-      [newAccount.id]: newAccount.folders
-    }));
-  };
-
   return (
     <>
       <SimplifiedLoadingFix />
@@ -968,7 +939,22 @@ export default function CourrierPage() {
                         <Button
                           variant="ghost"
                           className={`w-full justify-start text-xs ${selectedAccount?.id === account.id ? 'bg-gray-100' : ''}`}
-                          onClick={() => handleAccountSelect(account)}
+                          onClick={() => {
+                            setSelectedAccount(account);
+                            setShowFolders(true);
+                            // Auto-expand this account when selected
+                            if (account.id !== 'all-accounts') {
+                              setExpandedAccounts(prev => ({
+                                ...prev,
+                                [account.id]: true
+                              }));
+                            }
+                            if (account.id === 'all-accounts') {
+                              handleMailboxChange('INBOX');
+                            } else {
+                              handleMailboxChange('INBOX', account.id);
+                            }
+                          }}
                         >
                           <div className="flex items-center w-full">
                             <div className={`w-3 h-3 rounded-full ${account.color?.startsWith('#') ? 'bg-blue-500' : account.color || 'bg-blue-500'} mr-2`}></div>