alma/NeahFront9
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

mail page ui correction maj compose 20 bis 7

Browse Source
This commit is contained in:
alma 2025-04-16 14:10:12 +02:00
parent ef2a171ab1
commit b898907b4c
1 changed files with 55 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
app/mail/page.tsx
View File

@ -466,6 +466,7 @@ export default function MailPage() {
const [contentLoading, setContentLoading] = useState(false);
const [attachments, setAttachments] = useState<Attachment[]>([]);
const [folders, setFolders] = useState<string[]>([]);
const [unreadCount, setUnreadCount] = useState(0);
// Add this logging to see what data we're working with
useEffect(() => {
@ -476,12 +477,24 @@ export default function MailPage() {
// Update the filteredEmails logic
const filteredEmails = useMemo(() => {
console.log('Filtering emails for view:', currentView);
console.log('Current view:', currentView);
console.log('Total emails:', emails.length);
// We don't need complex filtering anymore since we're fetching from the correct folder
return emails;
}, [emails]);
return emails.filter(email => {
switch (currentView) {
case 'inbox':
return !email.deleted && email.folder === 'inbox';
case 'starred':
return !email.deleted && email.starred === true;
case 'sent':
return !email.deleted && email.from.toLowerCase().includes('a.tmiri@governance-labs.org');
case 'trash':
return email.deleted === true;
default:
return true;
}
});
}, [emails, currentView]);
// Move getSelectedEmail inside the component
const getSelectedEmail = () => {
@ -517,24 +530,20 @@ export default function MailPage() {
checkCredentials();
}, [router]);
// Update the loadEmails function to fetch emails from the correct folder
// Update the loadEmails function to handle different folders correctly
const loadEmails = async () => {
try {
setLoading(true);
setError(null);
// Determine which folder to fetch based on currentView
const folder = currentView === 'sent' ? 'Sent' :
currentView === 'trash' ? 'Trash' :
currentView === 'starred' ? 'Starred' : 'INBOX';
const response = await fetch(`/api/mail?folder=${folder}`);
// Fetch emails based on the current view
const response = await fetch('/api/mail');
if (!response.ok) {
throw new Error('Failed to load emails');
}
const data = await response.json();
console.log(`Loading emails from ${folder} folder:`, data);
console.log('Raw email data:', data);
// Process the emails
const processedEmails = data.emails.map((email: any) => ({
@ -545,9 +554,17 @@ export default function MailPage() {
subject: email.subject || '(No subject)',
body: email.body || '',
date: email.date || new Date().toISOString(),
folder: folder.toLowerCase(),
read: email.read || false
read: email.read || false,
starred: email.starred || false,
deleted: email.deleted || false,
folder: email.folder || 'inbox'
}));
// Update unread count for inbox
const unreadInboxEmails = processedEmails.filter(
email => !email.read && !email.deleted && email.folder === 'inbox'
).length;
setUnreadCount(unreadInboxEmails);
setEmails(processedEmails);
} catch (err) {
@ -1043,22 +1060,30 @@ export default function MailPage() {
<li>
<Button
variant={currentView === 'inbox' ? 'secondary' : 'ghost'}
className={`w-full justify-start py-2 ${currentView === 'inbox' ? 'bg-gray-100 text-gray-900' : 'text-gray-600 hover:text-gray-900'}`}
className={`w-full justify-start py-2 ${
currentView === 'inbox' ? 'bg-gray-100 text-gray-900' : 'text-gray-600 hover:text-gray-900'
}`}
onClick={() => {setCurrentView('inbox'); setSelectedEmail(null);}}
>
<Inbox className="h-4 w-4 mr-2" />
<span>Inbox</span>
{emails.filter(e => !e.read && e.category === 'inbox').length > 0 && (
<span className="ml-auto bg-blue-600 text-white text-xs px-2 py-0.5 rounded-full">
{emails.filter(e => !e.read && e.category === 'inbox').length}
</span>
)}
<div className="flex items-center justify-between w-full">
<div className="flex items-center">
<Inbox className="h-4 w-4 mr-2" />
<span>Inbox</span>
</div>
{unreadCount > 0 && (
<span className="ml-auto bg-blue-600 text-white text-xs px-2 py-0.5 rounded-full">
{unreadCount}
</span>
)}
</div>
</Button>
</li>
<li>
<Button
variant={currentView === 'starred' ? 'secondary' : 'ghost'}
className={`w-full justify-start py-2 ${currentView === 'starred' ? 'bg-gray-100 text-gray-900' : 'text-gray-600 hover:text-gray-900'}`}
className={`w-full justify-start py-2 ${
currentView === 'starred' ? 'bg-gray-100 text-gray-900' : 'text-gray-600 hover:text-gray-900'
}`}
onClick={() => {setCurrentView('starred'); setSelectedEmail(null);}}
>
<Star className="h-4 w-4 mr-2" />
@ -1068,7 +1093,9 @@ export default function MailPage() {
<li>
<Button
variant={currentView === 'sent' ? 'secondary' : 'ghost'}
className={`w-full justify-start py-2 ${currentView === 'sent' ? 'bg-gray-100 text-gray-900' : 'text-gray-600 hover:text-gray-900'}`}
className={`w-full justify-start py-2 ${
currentView === 'sent' ? 'bg-gray-100 text-gray-900' : 'text-gray-600 hover:text-gray-900'
}`}
onClick={() => {setCurrentView('sent'); setSelectedEmail(null);}}
>
<Send className="h-4 w-4 mr-2" />
@ -1078,7 +1105,9 @@ export default function MailPage() {
<li>
<Button
variant={currentView === 'trash' ? 'secondary' : 'ghost'}
className={`w-full justify-start py-2 ${currentView === 'trash' ? 'bg-gray-100 text-gray-900' : 'text-gray-600 hover:text-gray-900'}`}
className={`w-full justify-start py-2 ${
currentView === 'trash' ? 'bg-gray-100 text-gray-900' : 'text-gray-600 hover:text-gray-900'
}`}
onClick={() => {setCurrentView('trash'); setSelectedEmail(null);}}
>
<Trash className="h-4 w-4 mr-2" />