courrier redis

components/email/EmailList.tsx

@@ -43,6 +43,7 @@ export default function EmailList({
 }: EmailListProps) {
   const [scrollPosition, setScrollPosition] = useState(0);
   const [searchQuery, setSearchQuery] = useState('');
+  const scrollRef = React.useRef<HTMLDivElement>(null);
 
   // Handle scroll to detect when user reaches the bottom
   const handleScroll = (event: React.UIEvent<HTMLDivElement>) => {
@@ -63,6 +64,15 @@ export default function EmailList({
     }
   };
 
+  // Update title to show date sort order
+  React.useEffect(() => {
+    // Add a small indicator in the header to show emails are sorted by date
+    const headerElement = document.querySelector('.email-header-title');
+    if (headerElement) {
+      headerElement.setAttribute('title', 'Emails are sorted by date (newest first)');
+    }
+  }, []);
+
   // Handle search
   const handleSearch = (e: React.FormEvent) => {
     e.preventDefault();
@@ -149,10 +159,16 @@ export default function EmailList({
       )}
       
       <div 
+        ref={scrollRef}
         className="flex-1 overflow-y-auto"
         onScroll={handleScroll}
       >
         <div className="divide-y divide-gray-100">
+          {/* Add a small note to show emails are sorted by date */}
+          <div className="text-xs text-gray-400 py-1 px-2 bg-gray-50">
+            Sorted by date (newest first)
+          </div>
+          
           {emails.map((email) => (
             <EmailListItem
               key={email.id}

hooks/use-courrier.ts

@@ -103,12 +103,15 @@ export const useCourrier = () => {
               // Log pagination info
               console.log(`Added ${newEmails.length} cached emails from page ${currentRequestPage} to existing ${prevEmails.length} emails`);
               
-              return [...prevEmails, ...newEmails];
+              // Combine emails and sort them by date (newest first)
+              const combinedEmails = [...prevEmails, ...newEmails];
+              return combinedEmails.sort((a: Email, b: Email) => new Date(b.date).getTime() - new Date(a.date).getTime());
             });
           } else {
             // For initial load, replace emails
             console.log(`Setting ${cachedEmails.emails.length} cached emails for page ${currentRequestPage}`);
-            setEmails(cachedEmails.emails);
+            // Ensure emails are sorted by date (newest first)
+            setEmails(cachedEmails.emails.sort((a: Email, b: Email) => new Date(b.date).getTime() - new Date(a.date).getTime()));
           }
           
           // Set pagination info from cache if available
@@ -131,12 +134,15 @@ export const useCourrier = () => {
               // Log pagination info
               console.log(`Added ${newEmails.length} cached emails from page ${currentRequestPage} to existing ${prevEmails.length} emails`);
               
-              return [...prevEmails, ...newEmails];
+              // Combine emails and sort them by date (newest first)
+              const combinedEmails = [...prevEmails, ...newEmails];
+              return combinedEmails.sort((a: Email, b: Email) => new Date(b.date).getTime() - new Date(a.date).getTime());
             });
           } else {
             // For initial load, replace emails
             console.log(`Setting ${cachedEmails.length} cached emails for page ${currentRequestPage}`);
-            setEmails(cachedEmails);
+            // Ensure emails are sorted by date (newest first)
+            setEmails(cachedEmails.sort((a: Email, b: Email) => new Date(b.date).getTime() - new Date(a.date).getTime()));
           }
         } else {
           console.warn('Invalid cache format:', cachedEmails);
@@ -183,12 +189,19 @@ export const useCourrier = () => {
           // Log pagination info
           console.log(`Added ${newEmails.length} fetched emails from page ${currentRequestPage} to existing ${prev.length} emails`);
           
-          return [...prev, ...newEmails];
+          // Combine emails and sort them by date (newest first)
+          const combinedEmails = [...prev, ...newEmails];
+          return combinedEmails.sort((a: Email, b: Email) => new Date(b.date).getTime() - new Date(a.date).getTime());
         });
       } else {
         // Ensure we always set an array even if API returns invalid data
         console.log(`Setting ${data.emails?.length || 0} fetched emails for page ${currentRequestPage}`);
-        setEmails(Array.isArray(data.emails) ? data.emails : []);
+        // Ensure emails are sorted by date (newest first)
+        if (Array.isArray(data.emails)) {
+          setEmails(data.emails.sort((a: Email, b: Email) => new Date(b.date).getTime() - new Date(a.date).getTime()));
+        } else {
+          setEmails([]);
+        }
       }
       
       setTotalEmails(data.totalEmails);