diff --git a/app/courrier/page.tsx b/app/courrier/page.tsx index 43423fc6..e91dfa09 100644 --- a/app/courrier/page.tsx +++ b/app/courrier/page.tsx @@ -133,15 +133,21 @@ export default function CourrierPage() { ]); const [selectedAccount, setSelectedAccount] = useState(null); - // Update account folders when mailboxes change + // Update account folders when mailboxes change - update this to maintain account IDs useEffect(() => { console.log('Mailboxes updated:', mailboxes); setAccounts(prev => { const updated = [...prev]; - if (updated[1]) { - updated[1].folders = mailboxes; + 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); } - console.log('Updated accounts with new mailboxes:', updated); return updated; }); }, [mailboxes]); @@ -264,10 +270,8 @@ export default function CourrierPage() { console.log('Session initialized, prefetch status:', data.prefetchStarted ? 'running' : 'not started'); setPrefetchStarted(Boolean(data.prefetchStarted)); - // Update accounts with the default email as fallback - const updatedAccounts: Account[] = [ - { id: 'all-accounts', name: 'All', email: '', color: 'bg-gray-500' } - ]; + // Create a copy of the current accounts to update + const updatedAccounts = [...accounts]; // Check if we have multiple accounts returned if (data.allAccounts && Array.isArray(data.allAccounts) && data.allAccounts.length > 0) { @@ -286,81 +290,101 @@ export default function CourrierPage() { }); }); - // Add each account from the server - data.allAccounts.forEach((account: any, index: number) => { - // Check if the account has a valid folders array - if (!account.folders || !Array.isArray(account.folders)) { - console.warn(`[WARN] Account ${account.email} has invalid folders structure:`, account.folders); - // Use the global mailboxes as a fallback if available - account.folders = data.mailboxes && Array.isArray(data.mailboxes) ? - data.mailboxes : ['INBOX', 'Sent', 'Drafts', 'Trash', 'Junk']; - console.log(`[DEBUG] Using fallback folders for ${account.email}:`, account.folders); - } - - updatedAccounts.push({ - id: account.id || `account-${index}`, - name: account.display_name || account.email, - email: account.email, - color: account.color || 'bg-blue-500', - folders: account.folders - }); - }); - } else if (data.email) { - // Check if we have a single account from the API - if (data.allAccounts && Array.isArray(data.allAccounts) && data.allAccounts.length === 1) { - const singleAccount = data.allAccounts[0]; - console.log('[DEBUG] Single account detected:', - { id: singleAccount.id, email: singleAccount.email, folders: singleAccount.folders?.length }); - - // Force include some hardcoded folders if none are present - const fallbackFolders = ['INBOX', 'Sent', 'Drafts', 'Trash', 'Junk']; - - // Fix: Check for account-specific folders first, then global mailboxes - const accountFolders = (singleAccount.folders && singleAccount.folders.length > 0) ? - singleAccount.folders : - (data.mailboxes && data.mailboxes.length > 0) ? - data.mailboxes : - fallbackFolders; - - console.log(`[DEBUG] Using folders for single account ${singleAccount.email}:`, accountFolders); - - updatedAccounts.push({ - id: singleAccount.id || 'account-1', - name: singleAccount.display_name || singleAccount.email, - email: singleAccount.email, - color: singleAccount.color || 'bg-blue-500', - folders: accountFolders - } as Account); - } else { - // Fallback to single account if allAccounts is not available - console.log(`[DEBUG] Fallback to single account: ${data.email}`); - - // Force include some hardcoded folders if none are present - const fallbackFolders = ['INBOX', 'Sent', 'Drafts', 'Trash', 'Junk']; - - // Prioritize mailboxes from IMAP if available - const folderList = (data.mailboxes && data.mailboxes.length > 0) ? - data.mailboxes : fallbackFolders; + // Keep the All account at position 0 + if (updatedAccounts.length > 0) { + // Replace the loading account with the real one + data.allAccounts.forEach((account: any, index: number) => { + // Ensure folders are valid + const accountFolders = (account.folders && Array.isArray(account.folders)) + ? account.folders + : (data.mailboxes && Array.isArray(data.mailboxes)) + ? data.mailboxes + : ['INBOX', 'Sent', 'Drafts', 'Trash', 'Junk']; - console.log(`[DEBUG] Using folders for fallback account ${data.email}:`, folderList); + // If we're updating the first real account (index 0 in API, position 1 in our array) + if (index === 0 && updatedAccounts.length > 1) { + // Update the loading account in place to maintain references + updatedAccounts[1] = { + id: account.id, // Use the real account ID + name: account.display_name || account.email, + email: account.email, + color: account.color || 'bg-blue-500', + folders: accountFolders + }; + console.log(`[DEBUG] Updated loading account to real account: ${account.email} with ID ${account.id}`); + } else { + // Add additional accounts as new entries + updatedAccounts.push({ + id: account.id || `account-${index}`, + name: account.display_name || account.email, + email: account.email, + color: account.color || 'bg-blue-500', + folders: accountFolders + }); + } + }); + } else { + // Fallback if accounts array is empty for some reason + updatedAccounts.push({ id: 'all-accounts', name: 'All', email: '', color: 'bg-gray-500' }); + const firstAccount = data.allAccounts[0]; + const accountFolders = (firstAccount.folders && Array.isArray(firstAccount.folders)) + ? firstAccount.folders + : (data.mailboxes && Array.isArray(data.mailboxes)) + ? data.mailboxes + : ['INBOX', 'Sent', 'Drafts', 'Trash', 'Junk']; + + updatedAccounts.push({ + id: firstAccount.id, + name: firstAccount.display_name || firstAccount.email, + email: firstAccount.email, + color: firstAccount.color || 'bg-blue-500', + folders: accountFolders + }); + } + } else if (data.email) { + // Fallback to single account if allAccounts is not available + console.log(`[DEBUG] Fallback to single account: ${data.email}`); + + // Force include some hardcoded folders if none are present + const fallbackFolders = ['INBOX', 'Sent', 'Drafts', 'Trash', 'Junk']; + + // Prioritize mailboxes from IMAP if available + const folderList = (data.mailboxes && data.mailboxes.length > 0) ? + data.mailboxes : fallbackFolders; + + // Update the loading account if it exists + if (updatedAccounts.length > 1) { + updatedAccounts[1] = { + id: 'default-account', // Use consistent ID + name: data.displayName || data.email, + email: data.email, + color: 'bg-blue-500', + folders: folderList + }; + } else { + // Fallback if accounts array is empty + updatedAccounts.push({ id: 'all-accounts', name: 'All', email: '', color: 'bg-gray-500' }); updatedAccounts.push({ id: 'default-account', name: data.displayName || data.email, email: data.email, color: 'bg-blue-500', folders: folderList - } as Account); + }); } } console.log('Setting accounts:', updatedAccounts); + // Debug each account's folders updatedAccounts.forEach((acc: Account, idx: number) => { console.log(`Account ${idx + 1}: ${acc.name} (${acc.email}) - Folders:`, acc.folders ? acc.folders.length : 0, acc.folders || []); }); + + // Update the accounts state setAccounts(updatedAccounts); // Auto-select the first non-All account if available @@ -410,7 +434,7 @@ export default function CourrierPage() { return () => { isMounted = false; }; - }, [session?.user?.id, loadEmails]); + }, [session?.user?.id, loadEmails, accounts, currentFolder]); // Helper to get folder icons const getFolderIcon = (folder: string) => {