diff --git a/app/courrier/debug-tool.tsx b/app/courrier/debug-tool.tsx index aea9b8cf..ac5ca548 100644 --- a/app/courrier/debug-tool.tsx +++ b/app/courrier/debug-tool.tsx @@ -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 ( +
+ +
+ ); + } + return ; } \ No newline at end of file diff --git a/app/courrier/page.tsx b/app/courrier/page.tsx index ab19b427..fb44a6b5 100644 --- a/app/courrier/page.tsx +++ b/app/courrier/page.tsx @@ -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 && ( -
+
{accounts.map(account => ( -
+
- {/* 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)) && ( -
+
{account.folders && account.folders.length > 0 ? ( - account.folders.map((folder) => ( + account.folders.map((folder, folderIndex) => (