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) => ( {accounts.map((account) => (
<div key={account.id} className="mb-1"> <div key={account.id} className="mb-1">
<Button <div className={`flex items-center w-full px-1 py-1 rounded-md cursor-pointer ${selectedAccount?.id === account.id ? 'bg-gray-100' : ''}`}
variant="ghost"
className={`w-full justify-start text-xs ${selectedAccount?.id === account.id ? 'bg-gray-100' : ''}`}
onClick={() => handleAccountSelect(account)} 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>
<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>
<span className="truncate text-gray-700">{account.name}</span> {/* More options button */}
{/* More options button */} {account.id !== 'all-accounts' && (
{account.id !== 'all-accounts' && ( <DropdownMenu>
<DropdownMenu> <DropdownMenuTrigger asChild>
<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()}>
<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()}> <MoreVertical className="h-4 w-4" />
<MoreHorizontal className="h-4 w-4" /> </button>
</Button> </DropdownMenuTrigger>
</DropdownMenuTrigger> <DropdownMenuContent align="end">
<DropdownMenuContent align="end"> <DropdownMenuItem onClick={e => { e.stopPropagation(); setAccountToEdit(account); setShowEditModal(true); }}>Edit</DropdownMenuItem>
<DropdownMenuItem onClick={e => { e.stopPropagation(); setAccountToEdit(account); setShowEditModal(true); }}>Edit</DropdownMenuItem> <DropdownMenuItem onClick={e => { e.stopPropagation(); setAccountToDelete(account); setShowDeleteDialog(true); }}>Delete</DropdownMenuItem>
<DropdownMenuItem onClick={e => { e.stopPropagation(); setAccountToDelete(account); setShowDeleteDialog(true); }}>Delete</DropdownMenuItem> </DropdownMenuContent>
</DropdownMenuContent> </DropdownMenu>
</DropdownMenu> )}
)} {account.id !== 'all-accounts' && (
{account.id !== 'all-accounts' && ( <button
<span type="button"
className="ml-1 text-gray-400 hover:text-gray-600 cursor-pointer" className="ml-1 text-gray-400 hover:text-gray-600 cursor-pointer flex items-center justify-center h-5 w-5"
onClick={e => { e.stopPropagation(); setExpandedAccounts(prev => ({ ...prev, [account.id]: !prev[account.id] })); }} 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" />} >
</span> {expandedAccounts[account.id] ? <ChevronUp className="h-3 w-3" /> : <ChevronDown className="h-3 w-3" />}
)} </button>
</div> )}
</Button> </div>
{/* Show folders for this account if expanded */} {/* Show folders for this account if expanded */}
{(() => { {(() => {
const isExpanded = expandedAccounts[account.id]; const isExpanded = expandedAccounts[account.id];
const hasFolders = account.folders && account.folders.length > 0; 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 && ( return isExpanded && account.id !== 'all-accounts' && hasFolders && (
<div className="pl-4"> <div className="pl-4">
{account.folders.map((folder) => renderFolderButton(folder, account.id))} {account.folders.map((folder) => renderFolderButton(folder, account.id))}