"use client";

/**
 * „Alle auswählen“ fuer den Massenwiderruf (#024): setzt alle aktivierbaren Kaestchen, die zum
 * Formular gehoeren. Die Auswahl selbst bleibt ein schlichtes GET-Formular – ohne JavaScript
 * waehlt man eben einzeln.
 */
export function AlleAuswaehlen({ formular }: { formular: string }) {
  return (
    <label className="hover:bg-raised/60 rounded-box flex min-h-11 cursor-pointer items-center gap-3 px-2 text-[14px]">
      <input
        type="checkbox"
        className="accent-accent size-[18px] cursor-pointer"
        onChange={(e) => {
          const kaestchen = document.querySelectorAll<HTMLInputElement>(
            `input[type="checkbox"][form="${formular}"]:not(:disabled)`,
          );
          for (const k of kaestchen) k.checked = e.target.checked;
        }}
      />
      Alle auswählen
    </label>
  );
}