courrier formatting

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}`);
+        if (!isLoadMore) {
-        dispatch({ type: 'SET_EMAILS', payload: [] });
+          logEmailOp('EMPTY_RESULTS', `No emails found in ${state.currentFolder}`);
-        dispatch({ type: 'SET_TOTAL_EMAILS', payload: 0 });
+          dispatch({ type: 'SET_EMAILS', payload: [] });
-        dispatch({ type: 'SET_TOTAL_PAGES', payload: 0 });
+          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) => {

lib/reducers/emailReducer.ts

@@ -266,8 +266,12 @@ export function emailReducer(state: EmailState, action: EmailAction): EmailState
         );
       }
       
-      // Combine and sort emails by date (newest first)
+      // FIXED: Properly combine existing and new emails
-      const combinedEmails = [...state.emails, ...newEmails].sort(
+      // 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
       };
     }