"use client";

import type { NotificationFlags } from "@/lib/api";

/**
 * The "Flags del envío" panel. It lives in the /notificaciones shell above the
 * tabs, not inside one of them, because the flags are platform-wide: `debug`
 * governs the pólizas avisos exactly as it governs the four servicios jobs,
 * and a switch that only protected half the screen was the bug this fixes.
 *
 * State is per-visit, never persisted — see the note on the schedule card. A
 * stored `debug` would survive a reload and silently swallow real customer
 * mail; the automatic corridas therefore always send for real.
 */

export function NotificationFlagsCard({
  flags,
  onChange,
  disabled = false,
}: {
  flags: NotificationFlags;
  onChange: (next: NotificationFlags) => void;
  disabled?: boolean;
}) {
  const set = (patch: Partial<NotificationFlags>) =>
    onChange({ ...flags, ...patch });

  return (
    <section className="card" style={{ padding: 20 }}>
      <h2 className="section-title">Flags del envío</h2>
      <p className="muted small" style={{ marginTop: 4, marginBottom: 0, maxWidth: 620 }}>
        Se aplican a todo lo que se envía desde esta pantalla — servicios y
        pólizas — y solo a los envíos manuales. Las corridas automáticas siempre
        mandan de verdad.
      </p>
      <div style={{ display: "grid", gap: 4, marginTop: 14 }}>
        <label
          className="field"
          style={{ display: "flex", gap: 8, alignItems: "flex-start", marginBottom: 8 }}
        >
          <input
            type="checkbox"
            checked={!!flags.debug}
            disabled={disabled}
            onChange={(e) => set({ debug: e.target.checked })}
            style={{ marginTop: 2 }}
          />
          <span className="small">
            <strong>debug</strong> — reescribe todos los destinatarios a{" "}
            <code>rmancinas@freakma.net</code>. Ningún cliente real recibe el
            correo mientras esté activo. Un aviso de renovación enviado en debug
            NO se marca como enviado: sigue pendiente en la lista.
          </span>
        </label>
        <label
          className="field"
          style={{ display: "flex", gap: 8, alignItems: "flex-start", marginBottom: 8 }}
        >
          <input
            type="checkbox"
            checked={!!flags.ignoreDayRestriction}
            disabled={disabled}
            onChange={(e) => set({ ignoreDayRestriction: e.target.checked })}
            style={{ marginTop: 2 }}
          />
          <span className="small">
            <strong>ignoreDayRestriction</strong> — salta los gates de
            Mon/Wed/Fri del estado de cuenta. Útil para disparar en cualquier
            día sin esperar a la próxima corrida. Solo aplica a servicios.
          </span>
        </label>
        <label
          className="field"
          style={{ display: "flex", gap: 8, alignItems: "flex-start", marginBottom: 0 }}
        >
          <input
            type="checkbox"
            checked={!!flags.useEmailLimit}
            disabled={disabled}
            onChange={(e) => set({ useEmailLimit: e.target.checked })}
            style={{ marginTop: 2 }}
          />
          <span className="small">
            <strong>useEmailLimit</strong> — pausa el estado de cuenta cada 100
            correos durante 1 hora. Vestigio de la era SMTP; SES no lo necesita.
            Solo aplica a servicios.
          </span>
        </label>
      </div>
    </section>
  );
}