diff --git a/components/email/EmailList.tsx b/components/email/EmailList.tsx
index 3582fc4e..dbdcf015 100644
--- a/components/email/EmailList.tsx
+++ b/components/email/EmailList.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import React, { useState, useEffect, useRef } from 'react';
+import React, { useState } from 'react';
 import { Loader2, Mail, Search, X } from 'lucide-react';
 import { Email } from '@/hooks/use-courrier';
 import EmailListItem from './EmailListItem';
@@ -43,15 +43,6 @@ export default function EmailList({
 }: EmailListProps) {
   const [scrollPosition, setScrollPosition] = useState(0);
   const [searchQuery, setSearchQuery] = useState('');
-  const listRef = useRef<HTMLDivElement>(null);
-  const isLoadingMoreRef = useRef(false);
-  
-  // Reset loading state when isLoading changes
-  useEffect(() => {
-    if (!isLoading) {
-      isLoadingMoreRef.current = false;
-    }
-  }, [isLoading]);
 
   // Handle scroll to detect when user reaches the bottom
   const handleScroll = (event: React.UIEvent<HTMLDivElement>) => {
@@ -63,37 +54,13 @@ export default function EmailList({
     // Calculate how close to the bottom we are (in pixels)
     const distanceToBottom = scrollHeight - scrollTop - clientHeight;
     
-    // Debug logging to help diagnose scrolling issues
-    console.log(`[EMAIL_LIST] Scroll metrics - scrollHeight: ${scrollHeight}, scrollTop: ${scrollTop}, clientHeight: ${clientHeight}, distanceToBottom: ${distanceToBottom}`);
-    
-    // Only trigger if we have more emails, aren't already loading, and we're near the bottom
-    const LOAD_MORE_THRESHOLD = 400; // Increased threshold for more reliable loading
-    
-    if (distanceToBottom < LOAD_MORE_THRESHOLD && hasMoreEmails && !isLoading && !isLoadingMoreRef.current) {
-      console.log(`[EMAIL_LIST] Near bottom (${distanceToBottom}px), loading more emails. hasMoreEmails: ${hasMoreEmails}, isLoading: ${isLoading}`);
-      isLoadingMoreRef.current = true; // Prevent multiple load more triggers
+    // 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();
     }
   };
-  
-  // Also check on component mount and email changes if we need to load more
-  useEffect(() => {
-    if (!listRef.current) return;
-    
-    const checkScroll = () => {
-      const { scrollHeight, clientHeight } = listRef.current as HTMLDivElement;
-      
-      // If the content doesn't fill the container, and we have more to load
-      if (scrollHeight <= clientHeight && hasMoreEmails && !isLoading && !isLoadingMoreRef.current) {
-        console.log("[EMAIL_LIST] Content doesn't fill container, loading more emails");
-        isLoadingMoreRef.current = true;
-        onLoadMore();
-      }
-    };
-    
-    // Check after render and when emails change
-    requestAnimationFrame(checkScroll);
-  }, [emails, hasMoreEmails, isLoading, onLoadMore]);
 
   // Handle search
   const handleSearch = (e: React.FormEvent) => {
@@ -182,8 +149,7 @@ export default function EmailList({
       )}
       
       <div 
-        ref={listRef}
-        className="flex-1 overflow-y-auto scroll-smooth"
+        className="flex-1 overflow-y-auto"
         onScroll={handleScroll}
       >
         <div className="divide-y divide-gray-100">
@@ -205,18 +171,9 @@ export default function EmailList({
             />
           ))}
           
-          {/* Make loading indicator more visible */}
-          {isLoading && (
-            <div className="flex items-center justify-center p-4 bg-gray-50">
-              <Loader2 className="h-5 w-5 text-blue-500 animate-spin mr-2" />
-              <span className="text-sm text-gray-600">Loading more emails...</span>
-            </div>
-          )}
-          
-          {/* Visual indicator when all emails are loaded */}
-          {!hasMoreEmails && emails.length > 0 && (
-            <div className="p-3 text-center text-xs text-gray-500 bg-gray-50">
-              End of emails in this folder
+          {isLoading && emails.length > 0 && (
+            <div className="flex items-center justify-center p-4">
+              <div className="animate-spin rounded-full h-4 w-4 border-t-2 border-b-2 border-blue-500"></div>
             </div>
           )}
         </div>