import { type NextRequest, NextResponse } from "next/server"
import { createClient } from "@/lib/supabase/server"

export async function POST(request: NextRequest) {
  try {
    const { type, email, voucher, studentType, data } = await request.json()

    if (!email) {
      return NextResponse.json(
        {
          success: false,
          message: "Email address is required",
        },
        { status: 400 },
      )
    }

    const supabase = await createClient()
    let emailContent = ""
    let subject = ""

    switch (type) {
      case "voucher_delivery":
        if (!voucher) {
          return NextResponse.json(
            {
              success: false,
              message: "Voucher data is required",
            },
            { status: 400 },
          )
        }

        subject = "Your Fanaka University Application Voucher - Ready to Use!"
        emailContent = generateVoucherEmail(voucher, studentType)
        break

      case "application_submitted":
        subject = "Application Submitted Successfully - Fanaka University"
        emailContent = generateApplicationSubmittedEmail(data)
        break

      case "application_status_update":
        subject = `Application Status Update - ${data.status} - Fanaka University`
        emailContent = generateStatusUpdateEmail(data)
        break

      default:
        return NextResponse.json(
          {
            success: false,
            message: "Invalid email type",
          },
          { status: 400 },
        )
    }

    // Log email in database
    const { error: logError } = await supabase.from("email_logs").insert({
      recipient_email: email,
      subject,
      email_type: type,
      voucher_id: voucher?.id,
      student_id: data?.studentId,
      status: "sent",
    })

    if (logError) {
      console.error("Email logging error:", logError)
    }

    // In production, integrate with email service like SendGrid, Mailgun, or Resend
    // For now, we'll simulate email sending and log the content
    console.log("Email sent:", { to: email, subject, type })
    console.log("Email content preview:", emailContent.substring(0, 200) + "...")

    return NextResponse.json({
      success: true,
      message: "Email sent successfully",
      emailId: `email_${Date.now()}`,
    })
  } catch (error) {
    console.error("Email sending error:", error)

    // Log failed email
    try {
      const supabase = await createClient()
      const email = "" // Declare email variable
      const subject = "" // Declare subject variable
      const type = "" // Declare type variable
      await supabase.from("email_logs").insert({
        recipient_email: email || "unknown",
        subject: subject || "Email Error",
        email_type: type || "error",
        status: "failed",
        error_message: error instanceof Error ? error.message : "Unknown error",
      })
    } catch (logError) {
      console.error("Failed to log email error:", logError)
    }

    return NextResponse.json(
      {
        success: false,
        message: "Failed to send email",
      },
      { status: 500 },
    )
  }
}

function generateVoucherEmail(voucher: any, studentType: string) {
  const baseUrl = process.env.NEXT_PUBLIC_BASE_URL || "http://localhost:3000"
  const logoUrl = `${baseUrl}/images/fanaka-logo.png`
  const loginUrl = `${baseUrl}/login?type=${studentType}`

  return `
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Your Fanaka University Application Voucher</title>
    <style>
        body { font-family: Arial, sans-serif; line-height: 1.6; color: #333; margin: 0; padding: 0; background-color: #f4f4f4; }
        .container { max-width: 600px; margin: 0 auto; background-color: #ffffff; }
        .header { background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%); color: white; padding: 30px 20px; text-align: center; }
        .logo { max-width: 200px; height: auto; margin-bottom: 10px; }
        .content { padding: 30px 20px; }
        .voucher-box { background: #f8fafc; border: 2px solid #3b82f6; border-radius: 12px; padding: 25px; margin: 25px 0; text-align: center; }
        .voucher-code { font-size: 24px; font-weight: bold; color: #1e3a8a; margin: 10px 0; font-family: monospace; letter-spacing: 2px; }
        .voucher-pin { font-size: 20px; font-weight: bold; color: #059669; margin: 10px 0; font-family: monospace; }
        .info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin: 20px 0; }
        .info-item { background: #f1f5f9; padding: 15px; border-radius: 8px; text-align: center; }
        .info-label { font-size: 12px; color: #64748b; text-transform: uppercase; font-weight: bold; }
        .info-value { font-size: 16px; color: #1e293b; font-weight: bold; margin-top: 5px; }
        .cta-button { display: inline-block; background: #3b82f6; color: white; padding: 15px 30px; text-decoration: none; border-radius: 8px; font-weight: bold; margin: 20px 0; }
        .steps { background: #fef3c7; border-left: 4px solid #f59e0b; padding: 20px; margin: 25px 0; }
        .step { margin: 10px 0; }
        .footer { background: #1e293b; color: #94a3b8; padding: 20px; text-align: center; font-size: 14px; }
        .highlight { background: #dbeafe; padding: 2px 6px; border-radius: 4px; }
    </style>
</head>
<body>
    <div class="container">
        <div class="header">
            <img src="${logoUrl}" alt="Fanaka University Logo" class="logo">
            <h1 style="margin: 0; font-size: 28px;">Application Voucher Ready!</h1>
            <p style="margin: 10px 0 0 0; opacity: 0.9;">Your gateway to academic excellence</p>
        </div>
        
        <div class="content">
            <h2 style="color: #1e3a8a; margin-bottom: 20px;">🎉 Payment Successful!</h2>
            
            <p>Dear ${studentType === "foreign" ? "International" : "Local"} Student,</p>
            
            <p>Congratulations! Your payment has been successfully processed, and your application voucher is now ready. You can now access the full Fanaka University application portal.</p>
            
            <div class="voucher-box">
                <h3 style="color: #1e3a8a; margin-top: 0;">Your Voucher Credentials</h3>
                
                <div style="margin: 20px 0;">
                    <div style="margin-bottom: 15px;">
                        <div class="info-label">Serial Number</div>
                        <div class="voucher-code">${voucher.serial_number}</div>
                    </div>
                    
                    <div>
                        <div class="info-label">PIN</div>
                        <div class="voucher-pin">${voucher.pin}</div>
                    </div>
                </div>
                
                <div class="info-grid">
                    <div class="info-item">
                        <div class="info-label">Amount Paid</div>
                        <div class="info-value">${voucher.currency} ${voucher.price}</div>
                    </div>
                    <div class="info-item">
                        <div class="info-label">Student Type</div>
                        <div class="info-value">${studentType === "foreign" ? "International" : "Local"}</div>
                    </div>
                    <div class="info-item">
                        <div class="info-label">Valid Until</div>
                        <div class="info-value">${new Date(voucher.expiry_date).toLocaleDateString()}</div>
                    </div>
                    <div class="info-item">
                        <div class="info-label">Status</div>
                        <div class="info-value" style="color: #059669;">Active</div>
                    </div>
                </div>
            </div>
            
            <div style="text-align: center; margin: 30px 0;">
                <a href="${loginUrl}" class="cta-button">Access Application Portal</a>
            </div>
            
            <div class="steps">
                <h3 style="color: #92400e; margin-top: 0;">📋 Next Steps:</h3>
                <div class="step"><strong>1.</strong> Click the button above or visit <span class="highlight">${loginUrl}</span></div>
                <div class="step"><strong>2.</strong> Enter your <strong>Serial Number</strong> and <strong>PIN</strong> to login</div>
                <div class="step"><strong>3.</strong> Complete your application with all required information</div>
                <div class="step"><strong>4.</strong> Upload necessary documents</div>
                <div class="step"><strong>5.</strong> Submit your application for review</div>
            </div>
            
            <div style="background: #ecfdf5; border: 1px solid #10b981; border-radius: 8px; padding: 20px; margin: 25px 0;">
                <h4 style="color: #065f46; margin-top: 0;">💡 Important Notes:</h4>
                <ul style="color: #047857; margin: 0; padding-left: 20px;">
                    <li>Keep your voucher credentials safe and confidential</li>
                    <li>Your voucher is valid for one year from the purchase date</li>
                    <li>You can save and edit your application multiple times before submission</li>
                    <li>Contact our admissions office if you need any assistance</li>
                </ul>
            </div>
            
            <p style="margin-top: 30px;">If you have any questions or need assistance, please don't hesitate to contact our admissions team.</p>
            
            <p><strong>Welcome to your journey with Fanaka University!</strong></p>
            
            <p style="margin-top: 30px;">
                Best regards,<br>
                <strong>Fanaka University Admissions Team</strong><br>
                <em>Aspire • Accelerate • Achieve</em>
            </p>
        </div>
        
        <div class="footer">
            <p><strong>Fanaka International University College</strong></p>
            <p>Email: admissions@fanaka.edu.gh | Phone: +233 XXX XXX XXX</p>
            <p style="margin-top: 15px; font-size: 12px; opacity: 0.8;">
                This email was sent to ${voucher.email}. Please keep this email for your records.
            </p>
        </div>
    </div>
</body>
</html>
  `
}

function generateApplicationSubmittedEmail(data: any) {
  const baseUrl = process.env.NEXT_PUBLIC_BASE_URL || "http://localhost:3000"
  const logoUrl = `${baseUrl}/images/fanaka-logo.png`

  return `
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Application Submitted Successfully</title>
    <style>
        body { font-family: Arial, sans-serif; line-height: 1.6; color: #333; margin: 0; padding: 0; background-color: #f4f4f4; }
        .container { max-width: 600px; margin: 0 auto; background-color: #ffffff; }
        .header { background: linear-gradient(135deg, #059669 0%, #10b981 100%); color: white; padding: 30px 20px; text-align: center; }
        .logo { max-width: 200px; height: auto; margin-bottom: 10px; }
        .content { padding: 30px 20px; }
        .success-box { background: #ecfdf5; border: 2px solid #10b981; border-radius: 12px; padding: 25px; margin: 25px 0; text-align: center; }
        .footer { background: #1e293b; color: #94a3b8; padding: 20px; text-align: center; font-size: 14px; }
    </style>
</head>
<body>
    <div class="container">
        <div class="header">
            <img src="${logoUrl}" alt="Fanaka University Logo" class="logo">
            <h1 style="margin: 0; font-size: 28px;">Application Submitted!</h1>
        </div>
        
        <div class="content">
            <div class="success-box">
                <h2 style="color: #065f46; margin-top: 0;">✅ Submission Successful</h2>
                <p>Your application has been successfully submitted and is now under review.</p>
            </div>
            
            <p>Dear ${data.name},</p>
            <p>Thank you for submitting your application to Fanaka University. We have received all your information and documents.</p>
            
            <p><strong>Application Reference:</strong> ${data.applicationId}</p>
            <p><strong>Program:</strong> ${data.program}</p>
            <p><strong>Submission Date:</strong> ${data.submissionDate}</p>
            
            <p>You can track your application status in your student portal dashboard.</p>
            
            <p>Best regards,<br><strong>Fanaka University Admissions Team</strong></p>
        </div>
        
        <div class="footer">
            <p><strong>Fanaka International University College</strong></p>
            <p>Aspire • Accelerate • Achieve</p>
        </div>
    </div>
</body>
</html>
  `
}

function generateStatusUpdateEmail(data: any) {
  const baseUrl = process.env.NEXT_PUBLIC_BASE_URL || "http://localhost:3000"
  const logoUrl = `${baseUrl}/images/fanaka-logo.png`

  return `
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Application Status Update</title>
    <style>
        body { font-family: Arial, sans-serif; line-height: 1.6; color: #333; margin: 0; padding: 0; background-color: #f4f4f4; }
        .container { max-width: 600px; margin: 0 auto; background-color: #ffffff; }
        .header { background: linear-gradient(135deg, #7c3aed 0%, #a855f7 100%); color: white; padding: 30px 20px; text-align: center; }
        .logo { max-width: 200px; height: auto; margin-bottom: 10px; }
        .content { padding: 30px 20px; }
        .status-box { background: #faf5ff; border: 2px solid #a855f7; border-radius: 12px; padding: 25px; margin: 25px 0; text-align: center; }
        .footer { background: #1e293b; color: #94a3b8; padding: 20px; text-align: center; font-size: 14px; }
    </style>
</head>
<body>
    <div class="container">
        <div class="header">
            <img src="${logoUrl}" alt="Fanaka University Logo" class="logo">
            <h1 style="margin: 0; font-size: 28px;">Status Update</h1>
        </div>
        
        <div class="content">
            <div class="status-box">
                <h2 style="color: #7c3aed; margin-top: 0;">📋 Application Status: ${data.status}</h2>
                <p>${data.message}</p>
            </div>
            
            <p>Dear ${data.name},</p>
            <p>We wanted to update you on the status of your application to Fanaka University.</p>
            
            <p><strong>Application Reference:</strong> ${data.applicationId}</p>
            <p><strong>New Status:</strong> ${data.status}</p>
            <p><strong>Update Date:</strong> ${data.updateDate}</p>
            
            <p>You can view more details in your student portal dashboard.</p>
            
            <p>Best regards,<br><strong>Fanaka University Admissions Team</strong></p>
        </div>
        
        <div class="footer">
            <p><strong>Fanaka International University College</strong></p>
            <p>Aspire • Accelerate • Achieve</p>
        </div>
    </div>
</body>
</html>
  `
}
