import { jsxs, jsx } from "react/jsx-runtime";
import { Link } from "@tanstack/react-router";
import { useState, useEffect } from "react";
import { s as supabase } from "./client-Dz5aErML.js";
import "@supabase/supabase-js";
function AdminUsers() {
  const [admins, setAdmins] = useState([]);
  const [loading, setLoading] = useState(true);
  const [email, setEmail] = useState("");
  const [password, setPassword] = useState("");
  const [submitting, setSubmitting] = useState(false);
  const [message, setMessage] = useState(null);
  const refresh = async () => {
    const {
      data
    } = await supabase.from("user_roles").select("*").eq("role", "admin").order("created_at", {
      ascending: false
    });
    setAdmins(data ?? []);
    setLoading(false);
  };
  useEffect(() => {
    refresh();
  }, []);
  const handleAdd = async (e) => {
    e.preventDefault();
    setMessage(null);
    setSubmitting(true);
    const {
      data,
      error
    } = await supabase.auth.signUp({
      email,
      password,
      options: {
        emailRedirectTo: `${window.location.origin}/admin/login`
      }
    });
    if (error || !data.user) {
      setSubmitting(false);
      setMessage({
        type: "err",
        text: error?.message ?? "Gagal membuat akun"
      });
      return;
    }
    const {
      error: roleErr
    } = await supabase.from("user_roles").insert({
      user_id: data.user.id,
      role: "admin"
    });
    setSubmitting(false);
    if (roleErr) {
      setMessage({
        type: "err",
        text: "Akun dibuat tapi role gagal: " + roleErr.message
      });
      return;
    }
    setMessage({
      type: "ok",
      text: `Admin baru ditambahkan: ${email}. Email konfirmasi mungkin perlu diaktifkan.`
    });
    setEmail("");
    setPassword("");
    refresh();
  };
  return /* @__PURE__ */ jsxs("div", { children: [
    /* @__PURE__ */ jsx(Link, { to: "/adminpergam", className: "text-xs text-muted-foreground hover:text-foreground", children: "← Kembali" }),
    /* @__PURE__ */ jsx("h1", { className: "font-display text-3xl font-bold mt-2 mb-6", children: "Akun Admin" }),
    /* @__PURE__ */ jsxs("div", { className: "grid lg:grid-cols-2 gap-6", children: [
      /* @__PURE__ */ jsxs("div", { className: "card-surface rounded-2xl p-6", children: [
        /* @__PURE__ */ jsx("h2", { className: "font-display font-bold text-lg mb-4", children: "Tambah Admin Baru" }),
        /* @__PURE__ */ jsxs("form", { onSubmit: handleAdd, className: "space-y-3", children: [
          /* @__PURE__ */ jsxs("div", { children: [
            /* @__PURE__ */ jsx("label", { className: "text-xs uppercase tracking-wider text-muted-foreground", children: "Email" }),
            /* @__PURE__ */ jsx("input", { type: "email", required: true, value: email, onChange: (e) => setEmail(e.target.value), className: "input mt-1" })
          ] }),
          /* @__PURE__ */ jsxs("div", { children: [
            /* @__PURE__ */ jsx("label", { className: "text-xs uppercase tracking-wider text-muted-foreground", children: "Password (min 6 karakter)" }),
            /* @__PURE__ */ jsx("input", { type: "password", required: true, minLength: 6, value: password, onChange: (e) => setPassword(e.target.value), className: "input mt-1" })
          ] }),
          message && /* @__PURE__ */ jsx("div", { className: `text-sm rounded-xl px-4 py-2 ${message.type === "ok" ? "bg-primary/10 text-primary-glow border border-primary/30" : "bg-destructive/10 text-destructive border border-destructive/30"}`, children: message.text }),
          /* @__PURE__ */ jsx("button", { disabled: submitting, className: "px-5 py-2.5 rounded-full bg-primary text-primary-foreground text-sm font-semibold disabled:opacity-60", children: submitting ? "Memproses..." : "Tambah Admin" })
        ] })
      ] }),
      /* @__PURE__ */ jsxs("div", { className: "card-surface rounded-2xl p-6", children: [
        /* @__PURE__ */ jsx("h2", { className: "font-display font-bold text-lg mb-4", children: "Daftar Admin Aktif" }),
        loading ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "Memuat..." }) : admins.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "Belum ada admin." }) : /* @__PURE__ */ jsx("ul", { className: "space-y-2", children: admins.map((a) => /* @__PURE__ */ jsxs("li", { className: "flex items-center justify-between p-3 rounded-xl bg-muted/30 border border-border", children: [
          /* @__PURE__ */ jsxs("div", { children: [
            /* @__PURE__ */ jsxs("div", { className: "text-xs font-mono text-muted-foreground", children: [
              a.user_id.slice(0, 8),
              "..."
            ] }),
            /* @__PURE__ */ jsxs("div", { className: "text-[10px] text-muted-foreground mt-0.5", children: [
              "Sejak ",
              new Date(a.created_at).toLocaleDateString("id-ID")
            ] })
          ] }),
          /* @__PURE__ */ jsx("span", { className: "text-[10px] px-2 py-0.5 rounded-full bg-primary/15 text-primary border border-primary/30", children: "admin" })
        ] }, a.id)) })
      ] })
    ] })
  ] });
}
export {
  AdminUsers as component
};
