"use client";

import { useRouter } from "next/navigation";
import { useState } from "react";
import { createPosition } from "@/actions/positions";
import { Button } from "@/components/ui/Button";
import { SelectField, TextField } from "@/components/ui/Field";
import { Modal } from "@/components/ui/Modal";
import { useToast } from "@/components/ui/Toast";
import { todayIso } from "@/lib/format";

export type UnitOption = { id: string; name: string; unit_type: string; depth: number; hasChief: boolean };

// Eine Planstelle gehört zu genau einer Organisationseinheit — mehr braucht
// es nicht. Vorher musste hier eine vorgesetzte Person gesucht werden; die
// ergibt sich jetzt aus der Einheit, und die Frage kann gar nicht mehr falsch
// beantwortet werden.
export function CreatePositionModal({
  open,
  onClose,
  units,
}: {
  open: boolean;
  onClose: () => void;
  units: UnitOption[];
}) {
  const { showToast } = useToast();
  const router = useRouter();
  const [jobTitle, setJobTitle] = useState("");
  const [orgUnitId, setOrgUnitId] = useState("");
  const [isChief, setIsChief] = useState(false);
  const [validFrom, setValidFrom] = useState(todayIso);
  const [pending, setPending] = useState(false);

  const unit = units.find((u) => u.id === orgUnitId);
  // Der Unique-Index lässt nur eine gültige Leitung je Einheit zu. Das hier
  // vorwegzunehmen erspart eine Fehlermeldung, die in der Oberfläche nichts
  // erklärt.
  const chiefTaken = Boolean(unit?.hasChief);

  function reset() {
    setJobTitle("");
    setOrgUnitId("");
    setIsChief(false);
    setValidFrom(todayIso());
  }

  async function handleSubmit() {
    if (!jobTitle || !orgUnitId || !validFrom) {
      showToast("Bitte alle Pflichtfelder ausfüllen.", "error");
      return;
    }
    setPending(true);
    const result = await createPosition({
      org_unit_id: orgUnitId,
      job_title: jobTitle,
      is_chief: isChief && !chiefTaken,
      valid_from: validFrom,
    });
    setPending(false);
    if (result.success) {
      showToast("Planstelle angelegt.");
      router.refresh();
      onClose();
      reset();
    } else {
      showToast(result.error ?? "Fehler beim Anlegen.", "error");
    }
  }

  return (
    <Modal
      open={open}
      onClose={onClose}
      title="Planstelle anlegen"
      footer={
        <>
          <Button variant="ghost" onClick={onClose}>
            Abbrechen
          </Button>
          <Button onClick={handleSubmit} pending={pending}>
            Anlegen
          </Button>
        </>
      }
    >
      <div className="flex flex-col gap-4">
        <SelectField
          label="Organisationseinheit"
          required
          value={orgUnitId}
          onChange={(v) => {
            setOrgUnitId(v);
            setIsChief(false);
          }}
          placeholder="Bitte wählen…"
          options={units.map((u) => ({
            value: u.id,
            label: `${" ".repeat(u.depth * 3)}${u.name} (${u.unit_type})`,
          }))}
        />
        <TextField
          label="Tätigkeit"
          required
          value={jobTitle}
          onChange={setJobTitle}
          hint="Bestehende Tätigkeiten werden wiederverwendet; ein neuer Name legt einen Katalogeintrag an."
        />
        <label className="flex items-center gap-2 text-sm text-ink-body">
          <input type="checkbox" checked={isChief} disabled={!unit || chiefTaken} onChange={(e) => setIsChief(e.target.checked)} />
          Leitungsplanstelle für diese Einheit
        </label>
        {chiefTaken && (
          <p className="-mt-2 text-xs text-ink-muted">Für {unit?.name} besteht bereits eine Leitungsplanstelle.</p>
        )}
        <TextField label="Gültig ab" required type="date" value={validFrom} onChange={setValidFrom} />
      </div>
    </Modal>
  );
}