diff --git a/components/email/EmailList.tsx b/components/email/EmailList.tsx index 165e91fd..a973bead 100644 --- a/components/email/EmailList.tsx +++ b/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(null); // Handle scroll to detect when user reaches the bottom const handleScroll = (event: React.UIEvent) => { @@ -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({ )}
+ {/* Add a small note to show emails are sorted by date */} +
+ Sorted by date (newest first) +
+ {emails.map((email) => ( { // 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);