import { useState, useCallback } from 'react';

export interface Mail {
  id: string;
  from: string;
  to: string;
  subject: string;
  body: string;
  date: string;
  read: boolean;
  starred: boolean;
  folder: string;
  cc?: string[];
  bcc?: string[];
  flags?: string[];
}

export const useMail = () => {
  const [mails, setMails] = useState<Mail[]>([]);
  const [isLoading, setIsLoading] = useState(false);
  const [error, setError] = useState<string | null>(null);

  const fetchMails = useCallback(async () => {
    setIsLoading(true);
    setError(null);
    try {
      const response = await fetch('/api/mail');
      if (!response.ok) {
        const errorData = await response.json();
        throw new Error(errorData.error || 'Failed to fetch mails');
      }
      const data = await response.json();
      // Map the API response to our Mail interface
      const formattedMails = data.map((mail: any) => ({
        id: mail.id.toString(),
        from: mail.from,
        to: '', // Will be populated when viewing individual mail
        subject: mail.subject || '(No subject)',
        body: '', // Will be populated when viewing individual mail
        date: new Date(mail.date).toISOString(),
        read: false, // Default to unread
        starred: false, // Default to not starred
        folder: 'INBOX', // Default to INBOX
      }));
      setMails(formattedMails);
    } catch (err) {
      setError(err instanceof Error ? err.message : 'Failed to fetch mails');
      setMails([]);
    } finally {
      setIsLoading(false);
    }
  }, []);

  return {
    mails,
    isLoading,
    error,
    fetchMails,
  };
};