"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import * as React from "react";
import { addDays } from "date-fns/addDays";
import { format } from "date-fns/format";
import { isToday } from "date-fns/isToday";
import { isTomorrow } from "date-fns/isTomorrow";
import { startOfDay } from "date-fns/startOfDay";
import { useLocale, useT } from "@open-mercato/shared/lib/i18n/context";
import { cn } from "@open-mercato/shared/lib/utils";
import { Avatar } from "@open-mercato/ui/primitives/avatar";
import { Button } from "@open-mercato/ui/primitives/button";
import { eventDisplayTitle, pluralCategory } from "../../lib/calendar/labels.js";
const MAX_AVATARS_PER_ROW = 2;
const CATEGORY_BADGE_CLASS = {
  meeting: "bg-status-info-bg text-status-info-text",
  event: "bg-status-warning-bg text-status-warning-text",
  task: "bg-primary text-primary-foreground",
  other: "bg-status-neutral-bg text-status-neutral-text"
};
const CATEGORY_LABEL = {
  meeting: { key: "customers.calendar.category.meeting", fallback: "Meeting" },
  event: { key: "customers.calendar.category.event", fallback: "Event" },
  task: { key: "customers.calendar.category.task", fallback: "Task" },
  other: { key: "customers.calendar.category.other", fallback: "Other" }
};
function dayKeyOf(date) {
  return format(date, "yyyy-MM-dd");
}
function formatUrlHost(location) {
  try {
    const url = new URL(location.startsWith("http") ? location : `https://${location}`);
    return url.hostname;
  } catch {
    return location;
  }
}
function formatTime(date) {
  return date.toLocaleTimeString(void 0, { hour: "numeric", minute: "2-digit" });
}
function groupLabelOf(date) {
  return date.toLocaleDateString(void 0, { weekday: "long", month: "short", day: "numeric" });
}
function deriveTypeLabel(interactionType) {
  const normalized = interactionType.replace(/[-_]+/g, " ").trim();
  if (!normalized) return interactionType;
  return normalized.charAt(0).toUpperCase() + normalized.slice(1);
}
function participantLabel(participant) {
  return participant.name ?? participant.email ?? participant.userId;
}
function buildDayGroups(anchor, horizonDays, items) {
  const sorted = [...items].sort((first, second) => first.start.getTime() - second.start.getTime());
  const byDay = /* @__PURE__ */ new Map();
  for (const item of sorted) {
    const key = dayKeyOf(item.start);
    const bucket = byDay.get(key);
    if (bucket) bucket.push(item);
    else byDay.set(key, [item]);
  }
  const firstDay = startOfDay(anchor);
  const groups = [];
  for (let offset = 0; offset <= horizonDays; offset += 1) {
    const day = addDays(firstDay, offset);
    const dayItems = byDay.get(dayKeyOf(day));
    if (dayItems && dayItems.length > 0) groups.push({ date: day, items: dayItems });
  }
  return groups;
}
function AgendaDayHeader({ date, count }) {
  const t = useT();
  const locale = useLocale();
  const todayMarker = isToday(date);
  const tomorrowMarker = !todayMarker && isTomorrow(date);
  const countKey = `customers.calendar.agenda.eventsCount.${pluralCategory(locale, count)}`;
  const resolvedCount = t(countKey, { count });
  const countLabel = resolvedCount === countKey ? t("customers.calendar.agenda.eventsCount.other", "{count} events", { count }) : resolvedCount;
  return /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center gap-2 bg-muted/50 px-3 py-2.5 sm:px-5", children: [
    /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-foreground", children: groupLabelOf(date) }),
    todayMarker || tomorrowMarker ? /* @__PURE__ */ jsx("span", { className: cn("text-xs font-medium", todayMarker ? "text-foreground" : "text-muted-foreground"), children: `\xB7 ${todayMarker ? t("customers.calendar.agenda.today", "Today") : t("customers.calendar.agenda.tomorrow", "Tomorrow")}` }) : null,
    /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "w-2.5 shrink-0" }),
    /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-muted-foreground", children: countLabel })
  ] });
}
function AgendaRow({
  item,
  typeLabels,
  onItemClick
}) {
  const t = useT();
  const canceled = item.status === "canceled";
  const done = item.status === "done";
  const title = eventDisplayTitle(item.title, t("customers.calendar.grid.untitled", "Untitled"));
  const typeLabel = typeLabels?.[item.interactionType] ?? deriveTypeLabel(item.interactionType);
  const platformLabels = {
    zoom: t("customers.calendar.platformFull.zoom", "Zoom"),
    meet: t("customers.calendar.platformFull.meet", "Google Meet"),
    slack: t("customers.calendar.platformFull.slack", "Slack"),
    teams: t("customers.calendar.platformFull.teams", "Microsoft Teams")
  };
  const locationLabel = item.platform ? platformLabels[item.platform] : item.locationKind === "url" && item.location ? formatUrlHost(item.location) : item.location;
  const startLabel = item.allDay ? t("customers.calendar.grid.allDay", "All day") : formatTime(item.start);
  const endLabel = item.allDay ? null : formatTime(item.end);
  const ariaTime = item.allDay ? startLabel : `${startLabel} \u2013 ${endLabel}`;
  return /* @__PURE__ */ jsxs(
    Button,
    {
      type: "button",
      variant: "ghost",
      "aria-label": `${title} \xB7 ${ariaTime}`,
      onClick: () => onItemClick(item),
      className: cn(
        "h-auto w-full justify-start whitespace-normal rounded-none bg-background px-3 py-3 text-left transition-colors hover:bg-muted/30 sm:gap-3.5 sm:px-5",
        canceled && "opacity-60"
      ),
      children: [
        /* @__PURE__ */ jsxs("div", { className: "flex w-16 shrink-0 flex-col gap-0.5 sm:w-[86px]", children: [
          /* @__PURE__ */ jsx("span", { className: cn("truncate text-sm font-semibold leading-4", done || canceled ? "text-muted-foreground" : "text-foreground"), children: startLabel }),
          endLabel ? /* @__PURE__ */ jsx("span", { className: "truncate text-xs text-muted-foreground", children: endLabel }) : null
        ] }),
        /* @__PURE__ */ jsx(
          "span",
          {
            "aria-hidden": "true",
            className: cn("h-9 w-1 shrink-0 rounded-full", !item.color && "bg-muted-foreground/40"),
            style: item.color ? { backgroundColor: item.color } : void 0
          }
        ),
        /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [
          /* @__PURE__ */ jsx(
            "span",
            {
              className: cn(
                "truncate text-sm font-semibold",
                done || canceled ? "text-muted-foreground" : "text-foreground",
                canceled && "line-through"
              ),
              children: title
            }
          ),
          /* @__PURE__ */ jsx("span", { className: "truncate text-xs text-muted-foreground", children: locationLabel ? `${typeLabel} \xB7 ${locationLabel}` : typeLabel })
        ] }),
        /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-2", children: [
          item.participants.length > 0 ? /* @__PURE__ */ jsxs("span", { className: "hidden items-center gap-0.5 sm:flex", children: [
            item.participants.slice(0, MAX_AVATARS_PER_ROW).map((participant) => /* @__PURE__ */ jsx(Avatar, { size: "xs", label: participantLabel(participant) }, participant.userId)),
            item.participants.length > MAX_AVATARS_PER_ROW ? /* @__PURE__ */ jsxs("span", { className: "ps-0.5 text-xs font-medium text-muted-foreground", children: [
              "+",
              item.participants.length - MAX_AVATARS_PER_ROW
            ] }) : null
          ] }) : null,
          /* @__PURE__ */ jsx(
            "span",
            {
              className: cn(
                "inline-flex shrink-0 items-center rounded-full px-2 py-0.5 text-overline font-medium uppercase tracking-wide",
                CATEGORY_BADGE_CLASS[item.category]
              ),
              children: t(CATEGORY_LABEL[item.category].key, CATEGORY_LABEL[item.category].fallback)
            }
          )
        ] })
      ]
    }
  );
}
function AgendaList({ anchor, horizonDays, items, typeLabels, onItemClick }) {
  const t = useT();
  const groups = React.useMemo(() => buildDayGroups(anchor, horizonDays, items), [anchor, horizonDays, items]);
  return /* @__PURE__ */ jsx("div", { className: "flex w-full flex-col divide-y divide-border overflow-hidden border border-border bg-background", children: groups.map((group) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
    /* @__PURE__ */ jsx(AgendaDayHeader, { date: group.date, count: group.items.length }),
    group.items.map((item) => /* @__PURE__ */ jsx(AgendaRow, { item, typeLabels, onItemClick }, item.id))
  ] }, dayKeyOf(group.date))) });
}
export {
  AgendaList
};
//# sourceMappingURL=AgendaList.js.map
