courrier multi account restore compose

This commit is contained in:
alma 2025-04-28 16:59:07 +02:00
parent 9801ce2f27
commit 860bfbf7a4

View File

@ -124,10 +124,7 @@ export default function CourrierPage() {
const [showAddAccountForm, setShowAddAccountForm] = useState(false); const [showAddAccountForm, setShowAddAccountForm] = useState(false);
// Email accounts for the sidebar // Email accounts for the sidebar
const [accounts, setAccounts] = useState<Account[]>([ const [accounts, setAccounts] = useState<Account[]>([]);
{ id: 'all-accounts', name: 'All', email: '', color: 'bg-gray-500', folders: [] },
{ id: 'loading-account', name: 'Loading...', email: '', color: 'bg-blue-500', folders: [] }
]);
const [selectedAccount, setSelectedAccount] = useState<Account | null>(null); const [selectedAccount, setSelectedAccount] = useState<Account | null>(null);
// Track expanded folders for each account // Track expanded folders for each account
@ -136,24 +133,20 @@ export default function CourrierPage() {
// Add state to track selected folder per account // Add state to track selected folder per account
const [selectedFolders, setSelectedFolders] = useState<Record<string, string>>({}); const [selectedFolders, setSelectedFolders] = useState<Record<string, string>>({});
// Update account folders when mailboxes change - update this to maintain account IDs // Update account folders individually
useEffect(() => { useEffect(() => {
console.log('Mailboxes updated:', mailboxes); if (mailboxes && selectedAccount) {
setAccounts(prev => { setAccounts(prev => prev.map(account => {
const updated = [...prev]; if (account.id === selectedAccount.id) {
if (updated.length > 1) { return {
// Only update folders, preserve other properties including ID ...account,
if (updated[1]) {
updated[1] = {
...updated[1],
folders: mailboxes folders: mailboxes
}; };
} }
console.log('Updated accounts with new mailboxes:', updated); return account;
}));
} }
return updated; }, [mailboxes, selectedAccount]);
});
}, [mailboxes]);
// Debug accounts state // Debug accounts state
useEffect(() => { useEffect(() => {
@ -550,7 +543,7 @@ export default function CourrierPage() {
// Reset to page 1 when changing folders // Reset to page 1 when changing folders
setPage(1); setPage(1);
// If we have a specific accountId, validate the folder exists for that account // Validate folder exists for account before changing
if (accountId && accountId !== 'all-accounts') { if (accountId && accountId !== 'all-accounts') {
const account = accounts.find(a => a.id === accountId); const account = accounts.find(a => a.id === accountId);
if (!account) { if (!account) {
@ -559,38 +552,37 @@ export default function CourrierPage() {
} }
// Check if the folder exists for this account // Check if the folder exists for this account
if (!account.folders?.includes(folder)) { const accountFolder = account.folders?.find(f =>
f === folder || f.startsWith(`${folder}-`)
);
if (!accountFolder) {
console.error(`Folder ${folder} does not exist for account ${accountId}`); console.error(`Folder ${folder} does not exist for account ${accountId}`);
// Fall back to INBOX if the folder doesn't exist return;
folder = 'INBOX';
} }
// Update the selected folder for this account // Update the selected folder for this account
setSelectedFolders(prev => ({ setSelectedFolders(prev => ({
...prev, ...prev,
[accountId]: folder [accountId]: accountFolder
})); }));
// Log the folder change with account ID // Change folder in state with the correct account-specific folder name
console.log(`Changing folder to ${folder} for account ${accountId}`); changeFolder(accountFolder, accountId);
} setCurrentView(accountFolder);
} else {
// Change folder in the state, passing the clean folder name and accountId separately // Handle "All Accounts" view
changeFolder(folder, accountId); changeFolder(folder);
setCurrentView(folder); setCurrentView(folder);
// Start prefetching additional pages for this folder
if (session?.user?.id && folder) {
// First two pages are most important - prefetch immediately
prefetchFolderEmails(session.user.id, folder, 3, 1, accountId).catch(err => {
console.error(`Error prefetching ${folder}:`, err);
});
} }
}; };
// Update the folder button rendering to show selected state based on account // Update the folder button rendering to show selected state based on account
const renderFolderButton = (folder: string, accountId: string) => { const renderFolderButton = (folder: string, accountId: string) => {
// Remove account ID suffix for display
const displayFolder = folder.split('-')[0];
const isSelected = selectedFolders[accountId] === folder; const isSelected = selectedFolders[accountId] === folder;
return ( return (
<Button <Button
key={folder} key={folder}
@ -599,9 +591,9 @@ export default function CourrierPage() {
onClick={() => handleMailboxChange(folder, accountId !== 'all-accounts' ? accountId : undefined)} onClick={() => handleMailboxChange(folder, accountId !== 'all-accounts' ? accountId : undefined)}
> >
<div className="flex items-center w-full"> <div className="flex items-center w-full">
{getFolderIcon(folder)} {getFolderIcon(displayFolder)}
<span className="ml-2 truncate text-gray-700">{formatFolderName(folder)}</span> <span className="ml-2 truncate text-gray-700">{formatFolderName(displayFolder)}</span>
{folder === 'INBOX' && unreadCount > 0 && ( {displayFolder === 'INBOX' && unreadCount > 0 && (
<span className="ml-auto bg-blue-500 text-white text-[10px] px-1.5 rounded-full"> <span className="ml-auto bg-blue-500 text-white text-[10px] px-1.5 rounded-full">
{unreadCount} {unreadCount}
</span> </span>