import { baseTemplate, heading, infoBox, primaryButton, BRAND_COLORS as C } from './base.js';

export interface AlertaItem {
  /** Identificador interno (e.g., 'lista-negra-propia'). */
  alertaId: string;
  /** Nivel: 'high' | 'medium' | 'low'. */
  nivel: 'high' | 'medium' | 'low';
  /** Título corto. */
  titulo: string;
  /** Mensaje descriptivo. */
  mensaje: string;
}

export interface AlertasNuevasData {
  /** RFC y nombre del contribuyente al que pertenecen las alertas. */
  contribuyenteRfc: string;
  contribuyenteNombre: string;
  /** Nombre del despacho. */
  despachoNombre: string;
  /** Lista de alertas nuevas (no se reportan resoluciones). */
  alertas: AlertaItem[];
  /** URL al sistema (ej. https://despachos.horuxfin.com/alertas). */
  link: string;
}

const NIVEL_BADGE: Record<AlertaItem['nivel'], { label: string; bg: string; fg: string }> = {
  high: { label: 'Alta', bg: '#FEE2E2', fg: '#991B1B' },
  medium: { label: 'Media', bg: '#FEF3C7', fg: '#92400E' },
  low: { label: 'Baja', bg: '#DBEAFE', fg: '#1E40AF' },
};

export function alertasNuevasEmail(data: AlertasNuevasData): string {
  const total = data.alertas.length;
  const conteoNivel = data.alertas.reduce<Record<AlertaItem['nivel'], number>>(
    (acc, a) => ({ ...acc, [a.nivel]: (acc[a.nivel] ?? 0) + 1 }),
    { high: 0, medium: 0, low: 0 },
  );

  const itemsHtml = data.alertas.map((a) => alertaItemHtml(a)).join('');

  return baseTemplate(`
    ${heading(`${total} alerta${total === 1 ? '' : 's'} nueva${total === 1 ? '' : 's'}`)}
    <p style="color:${C.textPrimary};margin:0 0 16px;">
      Detectamos alertas fiscales nuevas para
      <strong>${escapeHtml(data.contribuyenteNombre)}</strong>
      (RFC <span style="font-family:monospace;">${escapeHtml(data.contribuyenteRfc)}</span>)
      en el despacho <strong>${escapeHtml(data.despachoNombre)}</strong>.
    </p>
    ${infoBox(`
      <p style="margin:0 0 6px;color:${C.textMuted};font-size:13px;">Resumen</p>
      <p style="margin:0;color:${C.textPrimary};">
        ${conteoNivel.high > 0 ? `<strong style="color:${NIVEL_BADGE.high.fg};">${conteoNivel.high} alta</strong> · ` : ''}
        ${conteoNivel.medium > 0 ? `<strong style="color:${NIVEL_BADGE.medium.fg};">${conteoNivel.medium} media</strong> · ` : ''}
        ${conteoNivel.low > 0 ? `<strong style="color:${NIVEL_BADGE.low.fg};">${conteoNivel.low} baja</strong>` : ''}
      </p>
    `)}
    <div style="margin-top:20px;">
      ${itemsHtml}
    </div>
    <div style="margin-top:24px;">
      ${primaryButton('Ver alertas en el sistema', data.link)}
    </div>
    <p style="margin:24px 0 0;color:${C.textMuted};font-size:12px;">
      Recibes este correo porque eres responsable del contribuyente. Estas alertas
      ya fueron registradas — solo te avisaremos cuando aparezcan nuevas, no se
      repetirá esta notificación si la misma alerta sigue activa.
    </p>
  `);
}

function alertaItemHtml(a: AlertaItem): string {
  const badge = NIVEL_BADGE[a.nivel];
  return `
    <div style="border-left:3px solid ${badge.fg};padding:12px 14px;margin:0 0 12px;background:#FAFAFA;border-radius:0 6px 6px 0;">
      <div style="display:flex;align-items:center;justify-content:space-between;margin:0 0 6px;">
        <strong style="color:${C.textPrimary};font-size:14px;">${escapeHtml(a.titulo)}</strong>
        <span style="background:${badge.bg};color:${badge.fg};padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600;">
          ${badge.label}
        </span>
      </div>
      <p style="margin:0;color:${C.textMuted};font-size:13px;line-height:1.5;">${escapeHtml(a.mensaje)}</p>
    </div>
  `;
}

function escapeHtml(s: string): string {
  return s.replace(/[&<>"']/g, (ch) => ({
    '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;',
  })[ch]!);
}
