"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import * as React from "react";
import { UserCircle2 } from "lucide-react";
import {
  Dialog,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle
} from "@open-mercato/ui/primitives/dialog";
import { Button } from "@open-mercato/ui/primitives/button";
import { Input } from "@open-mercato/ui/primitives/input";
import { Avatar } from "@open-mercato/ui/primitives/avatar";
import { Spinner } from "@open-mercato/ui/primitives/spinner";
import { useT } from "@open-mercato/shared/lib/i18n/context";
import { translateWithFallback } from "@open-mercato/shared/lib/i18n/translate";
import {
  fetchAssignableStaffMembers
} from "../../../../../components/detail/assignableStaff.js";
function ChangeOwnerDialog({
  open,
  selectedCount,
  isSubmitting,
  onClose,
  onConfirm
}) {
  const t = useT();
  const [query, setQuery] = React.useState("");
  const [items, setItems] = React.useState([]);
  const [isLoading, setIsLoading] = React.useState(false);
  const [selectedUserId, setSelectedUserId] = React.useState(null);
  React.useEffect(() => {
    if (!open) return;
    setQuery("");
    setSelectedUserId(null);
  }, [open]);
  React.useEffect(() => {
    if (!open) return;
    let cancelled = false;
    const controller = new AbortController();
    setIsLoading(true);
    fetchAssignableStaffMembers(query, { pageSize: 50, signal: controller.signal }).then((next) => {
      if (cancelled) return;
      setItems(next);
      if (!selectedUserId && next.length > 0) setSelectedUserId(next[0].userId);
    }).catch(() => {
      if (!cancelled) setItems([]);
    }).finally(() => {
      if (!cancelled) setIsLoading(false);
    });
    return () => {
      cancelled = true;
      controller.abort();
    };
  }, [open, query]);
  const handleConfirm = () => {
    onConfirm(selectedUserId);
  };
  const handleKeyDown = (event) => {
    if ((event.metaKey || event.ctrlKey) && event.key === "Enter") {
      event.preventDefault();
      handleConfirm();
    }
  };
  return /* @__PURE__ */ jsx(
    Dialog,
    {
      open,
      onOpenChange: (next) => {
        if (!next && !isSubmitting) onClose();
      },
      children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-md", onKeyDown: handleKeyDown, children: [
        /* @__PURE__ */ jsxs(DialogHeader, { children: [
          /* @__PURE__ */ jsxs(DialogTitle, { className: "flex items-center gap-2", children: [
            /* @__PURE__ */ jsx(UserCircle2, { className: "size-4", "aria-hidden": "true" }),
            translateWithFallback(
              t,
              "customers.deals.kanban.bulk.changeOwner.title",
              "Change owner for {count} deals",
              { count: selectedCount }
            )
          ] }),
          /* @__PURE__ */ jsx(DialogDescription, { children: translateWithFallback(
            t,
            "customers.deals.kanban.bulk.changeOwner.helper",
            "Pick a staff member who will own all selected deals."
          ) })
        ] }),
        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
          /* @__PURE__ */ jsx(
            Input,
            {
              value: query,
              onChange: (event) => setQuery(event.target.value),
              placeholder: translateWithFallback(
                t,
                "customers.deals.kanban.bulk.changeOwner.search",
                "Search by name or email\u2026"
              ),
              autoFocus: true
            }
          ),
          /* @__PURE__ */ jsx("div", { className: "flex max-h-72 flex-col gap-1 overflow-y-auto pr-1", children: isLoading ? /* @__PURE__ */ jsx("div", { className: "flex justify-center py-4", children: /* @__PURE__ */ jsx(Spinner, {}) }) : items.length === 0 ? /* @__PURE__ */ jsx("span", { className: "px-3 py-2 text-sm text-muted-foreground", children: translateWithFallback(
            t,
            "customers.deals.kanban.bulk.changeOwner.empty",
            "No staff members found."
          ) }) : items.map((member) => {
            const isSelected = selectedUserId === member.userId;
            return /* @__PURE__ */ jsxs(
              Button,
              {
                variant: "ghost",
                size: "default",
                type: "button",
                onClick: () => setSelectedUserId(member.userId),
                className: `flex h-auto w-full items-center justify-start gap-3 whitespace-normal rounded-md px-3 py-2 text-left transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 ${isSelected ? "bg-muted" : ""}`,
                children: [
                  /* @__PURE__ */ jsx(Avatar, { label: member.displayName, size: "sm" }),
                  /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 flex-1 flex-col items-start", children: [
                    /* @__PURE__ */ jsx("span", { className: "truncate text-sm font-medium text-foreground", children: member.displayName }),
                    member.email ? /* @__PURE__ */ jsx("span", { className: "truncate text-xs text-muted-foreground", children: member.email }) : null
                  ] })
                ]
              },
              member.teamMemberId
            );
          }) })
        ] }),
        /* @__PURE__ */ jsxs(DialogFooter, { children: [
          /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: onClose, type: "button", disabled: isSubmitting, children: translateWithFallback(t, "customers.deals.kanban.filter.cancel", "Cancel") }),
          /* @__PURE__ */ jsx(
            Button,
            {
              type: "button",
              onClick: handleConfirm,
              disabled: !selectedUserId || isSubmitting,
              children: translateWithFallback(
                t,
                "customers.deals.kanban.bulk.changeOwner.confirm",
                "Reassign {count} deals",
                { count: selectedCount }
              )
            }
          )
        ] })
      ] })
    }
  );
}
var ChangeOwnerDialog_default = ChangeOwnerDialog;
export {
  ChangeOwnerDialog,
  ChangeOwnerDialog_default as default
};
//# sourceMappingURL=ChangeOwnerDialog.js.map
