courrier multi account restore compose

app/courrier/page.tsx

@@ -77,6 +77,30 @@ 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();
@@ -133,27 +157,30 @@ export default function CourrierPage() {
   // Track expanded folders for each account
   const [expandedAccounts, setExpandedAccounts] = useState<Record<string, boolean>>({});
   
-  // Add state to track selected folder per account
+  // Track selected folder per account
   const [selectedFolders, setSelectedFolders] = useState<Record<string, string>>({});
   
-  // Update account folders when mailboxes change - update this to maintain account IDs
+  // Track folder visibility per account
+  const [visibleFolders, setVisibleFolders] = useState<Record<string, string[]>>({});
+  
+  // Update account folders when mailboxes change
   useEffect(() => {
-    console.log('Mailboxes updated:', mailboxes);
     setAccounts(prev => {
       const updated = [...prev];
-      if (updated.length > 1) {
-        // Only update folders, preserve other properties including ID
-        if (updated[1]) {
-          updated[1] = {
-            ...updated[1],
-            folders: mailboxes
-          };
-        }
-        console.log('Updated accounts with new mailboxes:', updated);
+      const accountIndex = updated.findIndex(acc => acc.id === selectedAccount?.id);
+      if (accountIndex !== -1) {
+        updated[accountIndex] = {
+          ...updated[accountIndex],
+          folders: mailboxes
+        };
+        setVisibleFolders(prev => ({
+          ...prev,
+          [updated[accountIndex].id]: mailboxes
+        }));
       }
       return updated;
     });
-  }, [mailboxes]);
+  }, [mailboxes, selectedAccount]);
   
   // Debug accounts state
   useEffect(() => {
@@ -545,58 +572,35 @@ export default function CourrierPage() {
     setShowComposeModal(true);
   };
   
-  // Update handleMailboxChange to track selected folders per account
+  // Update handleMailboxChange to properly handle per-account folders
   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) {
-        console.error(`Account ${accountId} not found`);
-        return;
+      if (!account?.folders?.includes(folder)) {
+        folder = 'INBOX'; // Fallback to INBOX if folder doesn't exist
       }
-      
-      // 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 !== 'all-accounts' ? accountId : undefined)}
+        onClick={() => handleMailboxChange(folder, accountId)}
       >
         <div className="flex items-center w-full">
           {getFolderIcon(folder)}
@@ -613,7 +617,11 @@ export default function CourrierPage() {
 
   // Handle sending email
   const handleSendEmail = async (emailData: EmailData) => {
-    return await sendEmail(emailData);
+    const result = await sendEmail(emailData);
+    if (!result.success) {
+      throw new Error(result.error);
+    }
+    return result;
   };
 
   // Handle delete confirmation
@@ -650,6 +658,27 @@ 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 />
@@ -939,22 +968,7 @@ export default function CourrierPage() {
                         <Button
                           variant="ghost"
                           className={`w-full justify-start text-xs ${selectedAccount?.id === account.id ? 'bg-gray-100' : ''}`}
-                          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);
-                            }
-                          }}
+                          onClick={() => handleAccountSelect(account)}
                         >
                           <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>