"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import { useState } from "react";
import { useTranslations } from "next-intl";
import {
  Dialog,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle
} from "../ui/dialog";
import { Button } from "../ui/button";
import { Input } from "../ui/input";
import { Label } from "../ui/label";
import { Textarea } from "../ui/textarea";
import { useTeams } from "../../hooks/useTeams";
import { useTeamContext } from "../../contexts/TeamContext";
import { toast } from "sonner";
function CreateTeamDialog({ open, onOpenChange }) {
  const t = useTranslations("teams");
  const { createTeamAsync, isCreating } = useTeams();
  const { refreshTeams } = useTeamContext();
  const [name, setName] = useState("");
  const [slug, setSlug] = useState("");
  const [description, setDescription] = useState("");
  const handleSubmit = async (e) => {
    e.preventDefault();
    try {
      await createTeamAsync({
        name,
        slug,
        description: description || void 0
      });
      toast.success(t("messages.created"));
      await refreshTeams();
      onOpenChange(false);
      setName("");
      setSlug("");
      setDescription("");
    } catch (error) {
      toast.error(error instanceof Error ? error.message : t("errors.unauthorized"));
    }
  };
  const handleNameChange = (value) => {
    setName(value);
    if (!slug) {
      setSlug(
        value.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "")
      );
    }
  };
  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsx(DialogContent, { "data-cy": "create-team-dialog", children: /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, children: [
    /* @__PURE__ */ jsxs(DialogHeader, { children: [
      /* @__PURE__ */ jsx(DialogTitle, { children: t("actions.create") }),
      /* @__PURE__ */ jsx(DialogDescription, { children: t("entity.description") })
    ] }),
    /* @__PURE__ */ jsxs("div", { className: "grid gap-4 py-4", children: [
      /* @__PURE__ */ jsxs("div", { className: "grid gap-2", children: [
        /* @__PURE__ */ jsx(Label, { htmlFor: "team-name", children: t("fields.name") }),
        /* @__PURE__ */ jsx(
          Input,
          {
            id: "team-name",
            name: "name",
            value: name,
            onChange: (e) => handleNameChange(e.target.value),
            placeholder: t("fields.name"),
            required: true,
            "data-cy": "team-name-input"
          }
        )
      ] }),
      /* @__PURE__ */ jsxs("div", { className: "grid gap-2", children: [
        /* @__PURE__ */ jsx(Label, { htmlFor: "team-slug", children: t("fields.slug") }),
        /* @__PURE__ */ jsx(
          Input,
          {
            id: "team-slug",
            name: "slug",
            value: slug,
            onChange: (e) => setSlug(e.target.value),
            placeholder: "team-url-slug",
            pattern: "^[a-z0-9]+(?:-[a-z0-9]+)*$",
            required: true,
            "data-cy": "team-slug-input"
          }
        ),
        /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: t("fields.slug") })
      ] }),
      /* @__PURE__ */ jsxs("div", { className: "grid gap-2", children: [
        /* @__PURE__ */ jsx(Label, { htmlFor: "team-description", children: t("fields.description") }),
        /* @__PURE__ */ jsx(
          Textarea,
          {
            id: "team-description",
            name: "description",
            value: description,
            onChange: (e) => setDescription(e.target.value),
            placeholder: t("fields.description"),
            rows: 3,
            "data-cy": "team-description-input"
          }
        )
      ] })
    ] }),
    /* @__PURE__ */ jsxs(DialogFooter, { children: [
      /* @__PURE__ */ jsx(
        Button,
        {
          type: "button",
          variant: "outline",
          onClick: () => onOpenChange(false),
          disabled: isCreating,
          "data-cy": "cancel-create-team",
          children: t("actions.cancel")
        }
      ),
      /* @__PURE__ */ jsx(
        Button,
        {
          type: "submit",
          disabled: isCreating,
          "data-cy": "submit-create-team",
          children: isCreating ? t("actions.creating") : t("actions.create")
        }
      )
    ] })
  ] }) }) });
}
export {
  CreateTeamDialog
};
