"use client";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import { useState } from "react";
import { ChevronDown, Plus, Users, Check } from "lucide-react";
import { useTranslations } from "next-intl";
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuLabel,
  DropdownMenuSeparator,
  DropdownMenuTrigger
} from "../ui/dropdown-menu";
import { Button } from "../ui/button";
import { Avatar, AvatarFallback, AvatarImage } from "../ui/avatar";
import { useTeamContext } from "../../contexts/TeamContext";
import { useTeamsConfig } from "../../hooks/useTeamsConfig";
import { CreateTeamDialog } from "./CreateTeamDialog";
import { cn } from "../../lib/utils";
function TeamSwitcher({ className }) {
  const t = useTranslations("teams");
  const { currentTeam, userTeams, switchTeam, isLoading } = useTeamContext();
  const { canSwitch, canCreate } = useTeamsConfig();
  const [showCreateDialog, setShowCreateDialog] = useState(false);
  if (!canSwitch) {
    return null;
  }
  if (isLoading) {
    return /* @__PURE__ */ jsx("div", { className: cn("h-10 w-48 bg-muted animate-pulse rounded-md", className) });
  }
  if (!currentTeam) {
    return null;
  }
  const getTeamInitials = (name) => {
    return name.split(" ").map((word) => word[0]).join("").toUpperCase().slice(0, 2);
  };
  return /* @__PURE__ */ jsxs(Fragment, { children: [
    /* @__PURE__ */ jsxs(DropdownMenu, { children: [
      /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
        Button,
        {
          variant: "outline",
          className: cn("w-full justify-between gap-2", className),
          "data-cy": "team-switcher",
          "aria-label": t("actions.switch"),
          children: [
            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 overflow-hidden", children: [
              /* @__PURE__ */ jsxs(Avatar, { className: "h-6 w-6", children: [
                /* @__PURE__ */ jsx(AvatarImage, { src: currentTeam.avatarUrl || void 0, alt: currentTeam.name }),
                /* @__PURE__ */ jsx(AvatarFallback, { className: "text-xs", children: getTeamInitials(currentTeam.name) })
              ] }),
              /* @__PURE__ */ jsx("span", { className: "truncate", children: currentTeam.name })
            ] }),
            /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4 opacity-50" })
          ]
        }
      ) }),
      /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "start", className: "w-[240px]", children: [
        /* @__PURE__ */ jsx(DropdownMenuLabel, { children: t("title") }),
        /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
        userTeams.map((membership) => {
          const isActive = currentTeam.id === membership.team.id;
          return /* @__PURE__ */ jsxs(
            DropdownMenuItem,
            {
              onClick: () => switchTeam(membership.team.id),
              className: "cursor-pointer",
              "data-cy": `team-option-${membership.team.slug}`,
              children: [
                /* @__PURE__ */ jsx(Users, { className: "mr-2 h-4 w-4", "aria-hidden": "true" }),
                /* @__PURE__ */ jsxs("div", { className: "flex-1 flex flex-col", children: [
                  /* @__PURE__ */ jsx("span", { children: membership.team.name }),
                  /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: t(`roles.${membership.role}`) })
                ] }),
                isActive && /* @__PURE__ */ jsx(Check, { className: "h-4 w-4", "aria-label": t("actions.switch") })
              ]
            },
            membership.team.id
          );
        }),
        canCreate && /* @__PURE__ */ jsxs(Fragment, { children: [
          /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
          /* @__PURE__ */ jsxs(
            DropdownMenuItem,
            {
              onClick: () => setShowCreateDialog(true),
              className: "cursor-pointer",
              "data-cy": "create-team-button",
              children: [
                /* @__PURE__ */ jsx(Plus, { className: "mr-2 h-4 w-4", "aria-hidden": "true" }),
                t("actions.create")
              ]
            }
          )
        ] })
      ] })
    ] }),
    /* @__PURE__ */ jsx(
      CreateTeamDialog,
      {
        open: showCreateDialog,
        onOpenChange: setShowCreateDialog
      }
    )
  ] });
}
export {
  TeamSwitcher
};
