courrier formatting

components/email/EmailList.tsx

@@ -51,8 +51,13 @@ export default function EmailList({
     
     setScrollPosition(scrollTop);
     
-    // If user scrolls near the bottom and we have more emails, load more
+    // Calculate how close to the bottom we are (in pixels)
-    if (scrollHeight - scrollTop - clientHeight < 200 && hasMoreEmails && !isLoading) {
+    const distanceToBottom = scrollHeight - scrollTop - clientHeight;
+    
+    // More aggressive threshold - load more when within 300px of bottom
+    // Only trigger if we have more emails and aren't already loading
+    if (distanceToBottom < 300 && hasMoreEmails && !isLoading) {
+      console.log(`[EMAIL_LIST] Near bottom (${distanceToBottom}px), loading more emails`);
       onLoadMore();
     }
   };

hooks/use-email-state.ts

@@ -584,9 +584,15 @@ export const useEmailState = () => {
   // Handle loading more emails
   const handleLoadMore = useCallback(() => {
     if (state.page < state.totalPages && !state.isLoading) {
+      logEmailOp('LOAD_MORE', `Loading more emails: page ${state.page + 1}/${state.totalPages}`);
       dispatch({ type: 'INCREMENT_PAGE' });
+      // The actual loading will be handled by the useEffect that watches page changes
+    } else if (state.page >= state.totalPages) {
+      logEmailOp('LOAD_MORE', `No more emails to load: page ${state.page}/${state.totalPages}`);
+    } else if (state.isLoading) {
+      logEmailOp('LOAD_MORE', `Skipping load more request - already loading`);
     }
-  }, [state.page, state.totalPages, state.isLoading]);
+  }, [state.page, state.totalPages, state.isLoading, logEmailOp]);
 
   // Effect to load emails when folder changes
   useEffect(() => {