const { getNotification } = require('../../notifications/helpers');

function escapeHtml(value) {
  return String(value)
    .replace(/&/g, '&amp;')
    .replace(/</g, '&lt;')
    .replace(/>/g, '&gt;')
    .replace(/"/g, '&quot;')
    .replace(/'/g, '&#039;');
}

module.exports = class EmailOtpEmail {
  constructor(to, otp, expiresInMinutes) {
    this.to = to;
    this.otp = otp;
    this.expiresInMinutes = expiresInMinutes;
  }

  get subject() {
    return `Kode OTP ${getNotification('app.title')}`;
  }

  async html() {
    const appTitle = escapeHtml(getNotification('app.title'));
    const otp = escapeHtml(this.otp);
    const expiresInMinutes = escapeHtml(this.expiresInMinutes);

    return `
      <!DOCTYPE html>
      <html>
        <head>
          <style>
            .email-container { max-width: 600px; margin: auto; background: #ffffff; border: 1px solid #e2e8f0; border-radius: 8px; overflow: hidden; font-family: Arial, sans-serif; }
            .email-header { background: #3498db; color: #ffffff; padding: 16px; text-align: center; font-size: 18px; font-weight: bold; }
            .email-body { padding: 20px; color: #1f2937; }
            .otp-code { display: inline-block; letter-spacing: 6px; font-size: 30px; font-weight: bold; background: #f3f4f6; border-radius: 8px; padding: 12px 18px; margin: 12px 0; }
            .email-footer { padding: 16px; background: #f7fafc; text-align: center; color: #4a5568; font-size: 14px; }
          </style>
        </head>
        <body>
          <div class="email-container">
            <div class="email-header">Kode OTP untuk ${appTitle}</div>
            <div class="email-body">
              <p>Halo,</p>
              <p>Gunakan kode berikut untuk masuk atau daftar sebagai Anggota:</p>
              <div class="otp-code">${otp}</div>
              <p>Kode ini berlaku selama ${expiresInMinutes} menit.</p>
              <p>Jika Anda tidak meminta kode ini, abaikan email ini.</p>
            </div>
            <div class="email-footer">
              Terima kasih,<br />Tim ${appTitle}
            </div>
          </div>
        </body>
      </html>
    `;
  }
};
