'use client';

import { useState } from 'react';
import { Button } from '@/components/ui/button';
import { toast } from '@/components/ui/use-toast';
import { AlertCircle, Bug, RefreshCw } from 'lucide-react';

export function EmailDebug() {
  const [loading, setLoading] = useState(false);
  
  const handleDebug = async () => {
    try {
      setLoading(true);
      const response = await fetch('/api/courrier/debug-account');
      const data = await response.json();
      console.log('Account Debug Data:', data);
      
      // Show toast with basic info
      toast({
        title: "Debug Information",
        description: `Found ${data.database.accountCount || 0} accounts and ${data.redis.session?.folderCount || 0} folders`,
        duration: 5000
      });
    } catch (error) {
      console.error('Debug error:', error);
      toast({
        title: "Debug Error",
        description: error instanceof Error ? error.message : 'Unknown error',
        variant: "destructive",
        duration: 5000
      });
    } finally {
      setLoading(false);
    }
  };
  
  const handleFixFolders = async () => {
    try {
      setLoading(true);
      toast({
        title: "Fixing Folders",
        description: "Connecting to IMAP server to refresh folders...",
        duration: 5000
      });
      
      const response = await fetch('/api/courrier/fix-folders', {
        method: 'POST'
      });
      
      const data = await response.json();
      console.log('Fix Folders Result:', data);
      
      if (data.success) {
        toast({
          title: "Folders Updated",
          description: `Processed ${data.accountsProcessed} accounts and found ${data.foldersFound} folders`,
          duration: 5000
        });
        
        // Refresh the page to see changes
        setTimeout(() => {
          window.location.reload();
        }, 2000);
      } else {
        toast({
          title: "Failed to Update Folders",
          description: data.error || 'Unknown error',
          variant: "destructive",
          duration: 5000
        });
      }
    } catch (error) {
      console.error('Fix folders error:', error);
      toast({
        title: "Folder Update Error",
        description: error instanceof Error ? error.message : 'Unknown error',
        variant: "destructive",
        duration: 5000
      });
    } finally {
      setLoading(false);
    }
  };
  
  return (
    <div className="fixed bottom-4 right-4 z-50 flex gap-2">
      <Button
        size="sm"
        variant="outline"
        className="bg-white text-gray-700 hover:text-gray-900 shadow-md"
        onClick={handleDebug}
        disabled={loading}
      >
        <Bug className="h-3.5 w-3.5 mr-1" />
        Debug
      </Button>
      
      <Button
        size="sm"
        variant="outline"
        className="bg-white text-gray-700 hover:text-gray-900 shadow-md"
        onClick={handleFixFolders}
        disabled={loading}
      >
        {loading ? (
          <RefreshCw className="h-3.5 w-3.5 mr-1 animate-spin" />
        ) : (
          <AlertCircle className="h-3.5 w-3.5 mr-1" />
        )}
        Fix Folders
      </Button>
    </div>
  );
}