import { requireWehrAdmin } from "@/lib/auth/guards";
import { listUsersForBrigade } from "@/server/data/brigade-users";
import { de } from "@/lib/i18n/de";
import { Badge } from "@/components/ui/badge";
import {
  BrigadeUserForm,
  DeactivateUserButton,
} from "@/components/verwaltung/BrigadeUserForm";

const ROLLE_LABEL: Record<string, string> = {
  wehr_admin: de.verwaltung.rolleAdmin,
  wehr_read: de.verwaltung.rolleRead,
  platform_admin: "Plattform-Admin",
};

export default async function BenutzerPage() {
  const s = await requireWehrAdmin();
  const users = await listUsersForBrigade(s.user.brigadeId);

  return (
    <div className="space-y-6">
      <h1 className="font-display text-2xl font-semibold text-navy">
        {de.verwaltung.navBenutzer}
      </h1>

      <BrigadeUserForm />

      {users.length === 0 ? (
        <p className="rounded border border-rand bg-white p-6 text-sm text-anthrazit/60">
          {de.verwaltung.keineBenutzer}
        </p>
      ) : (
        <ul className="divide-y divide-rand rounded border border-rand bg-white">
          {users.map((u) => (
            <li
              key={u.id}
              className="flex items-center justify-between gap-4 px-4 py-3"
            >
              <div className="min-w-0">
                <p className="font-medium text-anthrazit">
                  {u.name}
                  {u.id === s.user.id ? (
                    <span className="ml-2 text-xs text-anthrazit/50">(Sie)</span>
                  ) : null}
                </p>
                <p className="truncate text-sm text-anthrazit/60">{u.email}</p>
              </div>
              <div className="flex items-center gap-2">
                <Badge>{ROLLE_LABEL[u.rolle] ?? u.rolle}</Badge>
                <Badge>
                  {u.authTyp === "local"
                    ? de.verwaltung.authLokal
                    : de.verwaltung.authAuthentik}
                </Badge>
                <Badge
                  className={
                    u.aktiv
                      ? "border-bereit/30 bg-bereit/10 text-bereit"
                      : "border-anthrazit/30 bg-anthrazit/10 text-anthrazit"
                  }
                >
                  {u.aktiv ? de.verwaltung.aktiv : de.verwaltung.inaktiv}
                </Badge>
                {u.aktiv ? (
                  <DeactivateUserButton
                    userId={u.id}
                    disabled={u.id === s.user.id}
                  />
                ) : null}
              </div>
            </li>
          ))}
        </ul>
      )}
    </div>
  );
}
