diff --git a/hooks/use-email-state.ts b/hooks/use-email-state.ts index 84d6f6a1..fdcb6413 100644 --- a/hooks/use-email-state.ts +++ b/hooks/use-email-state.ts @@ -72,7 +72,7 @@ export const useEmailState = () => { const { normalizedFolder, effectiveAccountId, prefixedFolder } = normalizeFolderAndAccount(state.currentFolder, accountId); - logEmailOp('LOAD_EMAILS', `Loading emails for ${prefixedFolder} (account: ${effectiveAccountId})`); + logEmailOp('LOAD_EMAILS', `Loading emails for ${prefixedFolder} (account: ${effectiveAccountId}, isLoadMore: ${isLoadMore}, page: ${state.page})`); // Construct query parameters const queryParams = new URLSearchParams({ @@ -82,6 +82,11 @@ export const useEmailState = () => { accountId: effectiveAccountId }); + // Debug log existing emails count + if (isLoadMore) { + console.log(`[DEBUG-PAGINATION] Loading more emails. Current page: ${state.page}, existing emails: ${state.emails.length}`); + } + // Try to get cached emails first logEmailOp('CACHE_CHECK', `Checking cache for ${prefixedFolder}, page: ${state.page}`); const cachedEmails = await getCachedEmailsWithTimeout( @@ -94,7 +99,7 @@ export const useEmailState = () => { ); if (cachedEmails) { - logEmailOp('CACHE_HIT', `Using cached data for ${prefixedFolder}`); + logEmailOp('CACHE_HIT', `Using cached data for ${prefixedFolder}, page: ${state.page}, emails: ${cachedEmails.emails?.length || 0}`); // Ensure cached data has emails array property if (Array.isArray(cachedEmails.emails)) { @@ -162,13 +167,13 @@ export const useEmailState = () => { } const data = await response.json(); - console.log(`[DEBUG-API_RESPONSE] Got response with ${data.emails?.length || 0} emails, totalPages: ${data.totalPages}, totalEmails: ${data.totalEmails}`); + console.log(`[DEBUG-API_RESPONSE] Got response with ${data.emails?.length || 0} emails, totalPages: ${data.totalPages}, totalEmails: ${data.totalEmails}, isLoadMore: ${isLoadMore}`); // CRITICAL FIX: Enhanced empty results handling if (!data.emails || data.emails.length === 0) { console.log(`[DEBUG-EMPTY] No emails in response for page ${state.page}`); // If we're at a page > 1 and got no results, the paging is off, so try again with page 1 - if (state.page > 1) { + if (state.page > 1 && !isLoadMore) { logEmailOp('EMPTY_RESULTS', `No emails returned for page ${state.page}, resetting to page 1`); dispatch({ type: 'SET_PAGE', payload: 1 }); dispatch({ type: 'SET_LOADING', payload: false }); @@ -176,10 +181,15 @@ export const useEmailState = () => { } // If we're already at page 1, just update the state with no emails - logEmailOp('EMPTY_RESULTS', `No emails found in ${state.currentFolder}`); - dispatch({ type: 'SET_EMAILS', payload: [] }); - dispatch({ type: 'SET_TOTAL_EMAILS', payload: 0 }); - dispatch({ type: 'SET_TOTAL_PAGES', payload: 0 }); + if (!isLoadMore) { + logEmailOp('EMPTY_RESULTS', `No emails found in ${state.currentFolder}`); + dispatch({ type: 'SET_EMAILS', payload: [] }); + dispatch({ type: 'SET_TOTAL_EMAILS', payload: 0 }); + dispatch({ type: 'SET_TOTAL_PAGES', payload: 0 }); + } else { + // For load more, just set loading to false but keep existing emails + dispatch({ type: 'SET_LOADING', payload: false }); + } return; } @@ -233,6 +243,11 @@ export const useEmailState = () => { payload: Array.isArray(data.emails) ? data.emails : [] }); + // Double-check that we've updated the email list correctly after dispatch + setTimeout(() => { + console.log(`[DEBUG-AFTER-DISPATCH] Email count is now: ${state.emails.length}, should include the ${data.emails?.length || 0} new emails we just loaded`); + }, 0); + if (data.totalEmails) { dispatch({ type: 'SET_TOTAL_EMAILS', payload: data.totalEmails }); } @@ -257,7 +272,7 @@ export const useEmailState = () => { description: err instanceof Error ? err.message : 'Failed to load emails' }); } - }, [session?.user?.id, state.currentFolder, state.page, state.perPage, toast, logEmailOp]); + }, [session?.user?.id, state.currentFolder, state.page, state.perPage, state.emails.length, toast, logEmailOp]); // Change folder const changeFolder = useCallback(async (folder: string, accountId?: string) => { diff --git a/lib/reducers/emailReducer.ts b/lib/reducers/emailReducer.ts index 32d71ff4..b41cb706 100644 --- a/lib/reducers/emailReducer.ts +++ b/lib/reducers/emailReducer.ts @@ -266,8 +266,12 @@ export function emailReducer(state: EmailState, action: EmailAction): EmailState ); } - // Combine and sort emails by date (newest first) - const combinedEmails = [...state.emails, ...newEmails].sort( + // FIXED: Properly combine existing and new emails + // We need to ensure we keep ALL emails when appending + const combinedEmails = [...state.emails, ...newEmails]; + + // Sort combined emails by date (newest first) + const sortedEmails = combinedEmails.sort( (a, b) => { // Convert all dates to timestamps for comparison let dateA: number, dateB: number; @@ -294,11 +298,11 @@ export function emailReducer(state: EmailState, action: EmailAction): EmailState } ); - console.log(`[DEBUG-REDUCER] Final combined list has ${combinedEmails.length} emails`); + console.log(`[DEBUG-REDUCER] Final combined list has ${sortedEmails.length} emails (${state.emails.length} old + ${newEmails.length} new)`); return { ...state, - emails: combinedEmails, + emails: sortedEmails, isLoading: false }; }