courrier multi account

This commit is contained in:
alma 2025-04-27 17:11:57 +02:00
parent a848ef6e06
commit b34bdee164
2 changed files with 91 additions and 10 deletions

View File

@ -1,10 +1,62 @@
'use client';
import { EmailDebug } from '../components/debug/EmailDebug';
import { useEffect, useState } from 'react';
import { toast } from '@/components/ui/use-toast';
import { Button } from '@/components/ui/button';
import { AlertTriangle } from 'lucide-react';
export default function EmailDebugTool() {
const [isVisible, setIsVisible] = useState(false);
useEffect(() => {
// Check if we have any accounts-related issue by looking for accounts div in the DOM
const checkAccounts = () => {
const accountsElements = document.querySelectorAll('.accounts-dropdown');
const foldersElements = document.querySelectorAll('.folder-item');
if (accountsElements.length === 0 || foldersElements.length === 0) {
console.log('No accounts or folders found in DOM, showing quick fix button');
setIsVisible(true);
} else {
setIsVisible(false);
}
};
// Check after a delay to allow the UI to render
const timer = setTimeout(checkAccounts, 3000);
return () => clearTimeout(timer);
}, []);
const handleQuickFix = async () => {
try {
// Force reload the page with a special param to trigger the fix
window.location.href = '/courrier?fix=folders&t=' + Date.now();
} catch (error) {
console.error('Error applying quick fix:', error);
}
};
if (process.env.NODE_ENV === 'production') {
return null;
}
// Show the quick fix button if necessary
if (isVisible) {
return (
<div className="fixed bottom-4 left-4 z-50">
<Button
size="sm"
variant="destructive"
className="bg-red-600 hover:bg-red-700 text-white shadow-lg flex items-center gap-1"
onClick={handleQuickFix}
>
<AlertTriangle className="h-4 w-4" />
<span>Quick Fix Folders</span>
</Button>
</div>
);
}
return <EmailDebug />;
}

View File

@ -65,7 +65,7 @@ function SimplifiedLoadingFix() {
}
interface Account {
id: number;
id: number | string;
name: string;
email: string;
color: string;
@ -231,12 +231,22 @@ export default function CourrierPage() {
data.allAccounts.forEach((account, index) => {
console.log(`[DEBUG] Processing account: ${account.email}, display_name: ${account.display_name}, has folders: ${!!data.mailboxes}`);
// Force include some hardcoded folders if none are present
const fallbackFolders = ['INBOX', 'Sent', 'Drafts', 'Trash', 'Junk'];
const folderList = (data.mailboxes && data.mailboxes.length > 0) ?
data.mailboxes :
(account.folders && account.folders.length > 0) ?
account.folders :
fallbackFolders;
console.log(`[DEBUG] Using folders for ${account.email}:`, folderList);
const accountWithFolders = {
id: account.id || index + 1,
name: account.display_name || account.email,
email: account.email,
color: account.color || 'bg-blue-500',
folders: data.mailboxes || []
folders: folderList
};
console.log(`[DEBUG] Adding account with ${accountWithFolders.folders.length} folders:`, accountWithFolders.folders);
updatedAccounts.push(accountWithFolders);
@ -245,12 +255,17 @@ export default function CourrierPage() {
// Fallback to single account if allAccounts is not available
console.log(`[DEBUG] Fallback to single account: ${data.email}`);
// Force include some hardcoded folders if none are present
const fallbackFolders = ['INBOX', 'Sent', 'Drafts', 'Trash', 'Junk'];
const folderList = (data.mailboxes && data.mailboxes.length > 0) ?
data.mailboxes : fallbackFolders;
updatedAccounts.push({
id: 1,
name: data.email,
email: data.email,
color: 'bg-blue-500',
folders: data.mailboxes || []
folders: folderList
});
}
@ -727,9 +742,9 @@ export default function CourrierPage() {
)}
{accountsDropdownOpen && (
<div className="space-y-1 pl-2">
<div className="space-y-1 pl-2 accounts-dropdown">
{accounts.map(account => (
<div key={account.id} className="relative group">
<div key={account.id} className="relative group account-item">
<Button
variant="ghost"
className="w-full justify-between px-2 py-1.5 text-sm group"
@ -741,6 +756,21 @@ export default function CourrierPage() {
setShowFolders(true);
}
setSelectedAccount(account);
// Force the account to have folders if it doesn't already
if (account.id !== 0 && (!account.folders || account.folders.length === 0)) {
const accountWithFolders = {
...account,
folders: ['INBOX', 'Sent', 'Drafts', 'Trash', 'Junk']
};
setSelectedAccount(accountWithFolders);
// Also update the account in the accounts array
const newAccounts = accounts.map(a =>
a.id === account.id ? accountWithFolders : a
);
setAccounts(newAccounts);
}
}}
>
<div className="flex items-center gap-2">
@ -756,17 +786,16 @@ export default function CourrierPage() {
</div>
</Button>
{/* Show folders for this account if it's selected and folders are shown
OR if it's the first account and no account is selected */}
{/* Show folders for this account if it's selected and folders are shown */}
{((selectedAccount?.id === account.id && showFolders) ||
(!selectedAccount && account.id !== 0 && account.folders)) && (
<div className="pl-4 mt-1 mb-2 space-y-0.5 border-l border-gray-200">
<div className="pl-4 mt-1 mb-2 space-y-0.5 border-l border-gray-200 folder-container">
{account.folders && account.folders.length > 0 ? (
account.folders.map((folder) => (
account.folders.map((folder, folderIndex) => (
<Button
key={folder}
variant="ghost"
className={`w-full justify-start py-1 px-2 text-xs ${
className={`w-full justify-start py-1 px-2 text-xs folder-item ${
currentView === folder ? 'bg-gray-100 text-gray-900' : 'text-gray-600 hover:text-gray-900'
}`}
onClick={(e) => {