diff --git a/app/courrier/page.tsx b/app/courrier/page.tsx index 3dccc8a0..eb20d648 100644 --- a/app/courrier/page.tsx +++ b/app/courrier/page.tsx @@ -154,6 +154,7 @@ export default function CourrierPage() { searchQuery, page, totalPages, + totalEmails, loadEmails, handleEmailSelect, markEmailAsRead, @@ -609,10 +610,10 @@ export default function CourrierPage() { // Update handleMailboxChange to ensure consistent folder naming and prevent race conditions const handleMailboxChange = (folder: string, accountId?: string) => { // Enhanced logging to trace the flow - logEmailOp('MAILBOX-CHANGE', `Starting mailbox change to folder=${folder}, accountId=${accountId || 'undefined'}`); + logEmailOp('MAILBOX-CHANGE-V2', `Starting mailbox change to folder=${folder}, accountId=${accountId || 'undefined'}`); if (!accountId || accountId === 'loading-account') { - logEmailOp('MAILBOX-CHANGE', 'No valid accountId provided, using default flow', { folder }); + logEmailOp('MAILBOX-CHANGE-V2', 'No valid accountId provided, using default flow', { folder }); changeFolder(folder); return; } @@ -625,7 +626,7 @@ export default function CourrierPage() { const account = accounts.find(a => a.id.toString() === accountId.toString()); if (!account) { - logEmailOp('MAILBOX-CHANGE', `ERROR: Account not found: ${accountId}`); + logEmailOp('MAILBOX-CHANGE-V2', `ERROR: Account not found: ${accountId}`); toast({ title: "Account not found", description: `The account ${accountId} could not be found.`, @@ -635,7 +636,7 @@ export default function CourrierPage() { return; } - logEmailOp('MAILBOX-CHANGE', `Found account: ${account.email}`, { + logEmailOp('MAILBOX-CHANGE-V2', `Found account: ${account.email}`, { folderCount: account.folders?.length || 0, folder: folder }); @@ -649,12 +650,12 @@ export default function CourrierPage() { folderAccountId = parts[0]; baseFolder = parts[1]; - logEmailOp('MAILBOX-CHANGE', `Parsed folder: accountId=${folderAccountId}, baseFolder=${baseFolder}`); + logEmailOp('MAILBOX-CHANGE-V2', `Parsed folder: accountId=${folderAccountId}, baseFolder=${baseFolder}`); // CRITICAL FIX: If the folder has an account prefix that doesn't match the requested account, // log a warning and ALWAYS use the requested accountId if (folderAccountId !== accountId.toString()) { - logEmailOp('MAILBOX-CHANGE', `WARNING: Folder prefix mismatch - FIXING`, { + logEmailOp('MAILBOX-CHANGE-V2', `WARNING: Folder prefix mismatch - FIXING`, { folderAccount: folderAccountId, requestedAccount: accountId, originalFolder: folder, @@ -667,7 +668,14 @@ export default function CourrierPage() { // ALWAYS create a consistent folder name with REQUESTED account prefix const prefixedFolder = `${accountId}:${baseFolder}`; - logEmailOp('MAILBOX-CHANGE', `Normalized folder name: ${prefixedFolder}`); + logEmailOp('MAILBOX-CHANGE-V2', `Normalized folder name: ${prefixedFolder}`); + + // Check if we're already on this folder to avoid unnecessary refreshes + if (currentFolder === prefixedFolder) { + logEmailOp('MAILBOX-CHANGE-V2', `Already on folder ${prefixedFolder}, skipping change`); + setLoading(false); + return; + } // CRITICAL FIX: Lock in the selected folder BEFORE changing it in the system // This prevents any race conditions where the folder gets reset to INBOX @@ -676,18 +684,17 @@ export default function CourrierPage() { ...prev, [accountId]: prefixedFolder }; - logEmailOp('MAILBOX-CHANGE', `Updated selected folders map`, updated); + logEmailOp('MAILBOX-CHANGE-V2', `Updated selected folders map`, updated); return updated; }); - // Call changeFolder with the prefixed folder name and explicit accountId - // This ensures that both the folder name and accountId parameter are consistent + // Now use the changeFolder function from the hook with our properly formatted folder name changeFolder(prefixedFolder, accountId) .then(() => { - logEmailOp('MAILBOX-CHANGE', `Successfully changed to folder ${prefixedFolder}`); + logEmailOp('MAILBOX-CHANGE-V2', `Successfully changed to folder ${prefixedFolder}`); }) .catch(error => { - logEmailOp('MAILBOX-CHANGE', `ERROR: Failed to change to folder ${prefixedFolder}`, { error }); + logEmailOp('MAILBOX-CHANGE-V2', `ERROR: Failed to change to folder ${prefixedFolder}`, { error }); toast({ title: "Error changing folders", description: `Failed to change to folder ${baseFolder}. ${error instanceof Error ? error.message : String(error)}`, diff --git a/hooks/use-courrier.ts b/hooks/use-courrier.ts index 76749596..3d88ba41 100644 --- a/hooks/use-courrier.ts +++ b/hooks/use-courrier.ts @@ -289,21 +289,26 @@ export const useCourrier = () => { } }, [loadEmails]); - // Load emails when folder or page changes + // Load emails when page changes for pagination only useEffect(() => { - if (session?.user?.id) { - // If page is greater than 1, we're loading more emails - const isLoadingMore = page > 1; - loadEmails(isLoadingMore); + // We ONLY want this to run when page changes, not when currentFolder changes + // This prevents race conditions when switching folders + if (session?.user?.id && page > 1) { + // Log what we're doing + console.log(`[PAGINATION] Loading page ${page} for folder ${currentFolder}`); - // If we're loading the first page, publish an event to reset scroll position - if (page === 1 && typeof window !== 'undefined') { - // Use a custom event to communicate with the EmailList component - const event = new CustomEvent('reset-email-scroll'); - window.dispatchEvent(event); - } + // Simple approach that doesn't require complex parameter handling + changeFolder(currentFolder) + .catch(err => { + console.error(`[PAGINATION] Error loading more emails:`, err); + }); } - }, [currentFolder, page, perPage, session?.user?.id, loadEmails]); + }, [page, session?.user?.id, changeFolder]); // Deliberately NOT including currentFolder here + + // ADDING DEBUG LOGS to track currentFolder changes + useEffect(() => { + console.log(`[DEBUG] currentFolder changed to: ${currentFolder}`); + }, [currentFolder]); // Fetch a single email's content const fetchEmailContent = useCallback(async (emailId: string, accountId?: string, folderOverride?: string) => {