courrier multi account restore compose

This commit is contained in:
alma 2025-04-28 18:30:46 +02:00
parent 325961c8ba
commit f7b9c14db3

View File

@ -1026,50 +1026,43 @@ export default function CourrierPage() {
{accounts.map((account) => (
<div key={account.id} className="mb-1">
<Button
variant="ghost"
className={`w-full justify-start text-xs ${selectedAccount?.id === account.id ? 'bg-gray-100' : ''}`}
<div className={`flex items-center w-full px-1 py-1 rounded-md cursor-pointer ${selectedAccount?.id === account.id ? 'bg-gray-100' : ''}`}
onClick={() => handleAccountSelect(account)}
tabIndex={0}
role="button"
onKeyDown={e => { if (e.key === 'Enter' || e.key === ' ') handleAccountSelect(account); }}
>
<div className="flex items-center w-full">
<div className={`w-3 h-3 rounded-full ${account.color?.startsWith('#') ? 'bg-blue-500' : account.color || 'bg-blue-500'} mr-2`}></div>
<span className="truncate text-gray-700">{account.name}</span>
{/* More options button */}
{account.id !== 'all-accounts' && (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon" className="ml-1 h-5 w-5 p-0 text-gray-400 hover:text-gray-600" onClick={e => e.stopPropagation()}>
<MoreHorizontal className="h-4 w-4" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuItem onClick={e => { e.stopPropagation(); setAccountToEdit(account); setShowEditModal(true); }}>Edit</DropdownMenuItem>
<DropdownMenuItem onClick={e => { e.stopPropagation(); setAccountToDelete(account); setShowDeleteDialog(true); }}>Delete</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
)}
{account.id !== 'all-accounts' && (
<span
className="ml-1 text-gray-400 hover:text-gray-600 cursor-pointer"
onClick={e => { e.stopPropagation(); setExpandedAccounts(prev => ({ ...prev, [account.id]: !prev[account.id] })); }}
>
{expandedAccounts[account.id] ? <ChevronUp className="h-3 w-3" /> : <ChevronDown className="h-3 w-3" />}
</span>
)}
</div>
</Button>
<div className={`w-3 h-3 rounded-full ${account.color?.startsWith('#') ? 'bg-blue-500' : account.color || 'bg-blue-500'} mr-2`}></div>
<span className="truncate text-gray-700 flex-1">{account.name}</span>
{/* More options button */}
{account.id !== 'all-accounts' && (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<button type="button" className="ml-1 h-5 w-5 p-0 text-gray-400 hover:text-gray-600 flex items-center justify-center" onClick={e => e.stopPropagation()}>
<MoreVertical className="h-4 w-4" />
</button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuItem onClick={e => { e.stopPropagation(); setAccountToEdit(account); setShowEditModal(true); }}>Edit</DropdownMenuItem>
<DropdownMenuItem onClick={e => { e.stopPropagation(); setAccountToDelete(account); setShowDeleteDialog(true); }}>Delete</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
)}
{account.id !== 'all-accounts' && (
<button
type="button"
className="ml-1 text-gray-400 hover:text-gray-600 cursor-pointer flex items-center justify-center h-5 w-5"
tabIndex={-1}
onClick={e => { e.stopPropagation(); setExpandedAccounts(prev => ({ ...prev, [account.id]: !prev[account.id] })); }}
>
{expandedAccounts[account.id] ? <ChevronUp className="h-3 w-3" /> : <ChevronDown className="h-3 w-3" />}
</button>
)}
</div>
{/* Show folders for this account if expanded */}
{(() => {
const isExpanded = expandedAccounts[account.id];
const hasFolders = account.folders && account.folders.length > 0;
console.log('[DEBUG] Folder rendering check:', {
accountId: account.id,
isExpanded,
hasFolders,
folders: account.folders
});
return isExpanded && account.id !== 'all-accounts' && hasFolders && (
<div className="pl-4">
{account.folders.map((folder) => renderFolderButton(folder, account.id))}