"use client";
import { jsx } from "react/jsx-runtime";
import * as React from "react";
import { Page, PageBody } from "@open-mercato/ui/backend/Page";
import { DataTable } from "@open-mercato/ui/backend/DataTable";
import { Tag } from "@open-mercato/ui/primitives/tag";
import { apiCall } from "@open-mercato/ui/backend/utils/apiCall";
import { useT } from "@open-mercato/shared/lib/i18n/context";
function ChannelsListPage() {
  const t = useT();
  const [rows, setRows] = React.useState([]);
  const [total, setTotal] = React.useState(0);
  const [totalPages, setTotalPages] = React.useState(1);
  const [page, setPage] = React.useState(1);
  const [isLoading, setIsLoading] = React.useState(true);
  const [errorMessage, setErrorMessage] = React.useState(null);
  const pageSize = 50;
  React.useEffect(() => {
    let cancelled = false;
    async function load() {
      setIsLoading(true);
      setErrorMessage(null);
      const response = await apiCall(
        `/api/communication_channels/channels?page=${page}&pageSize=${pageSize}`
      ).catch((err) => {
        return {
          ok: false,
          result: { error: err instanceof Error ? err.message : "Failed to load channels" }
        };
      });
      if (cancelled) return;
      if (!response.ok) {
        const errBody = response.result;
        setErrorMessage(
          errBody?.error ?? t("communication_channels.errors.loadList", "Failed to load channels")
        );
        setRows([]);
        setTotal(0);
        setTotalPages(1);
      } else {
        const data = response.result ?? {};
        setRows(Array.isArray(data.items) ? data.items : []);
        setTotal(typeof data.total === "number" ? data.total : 0);
        setTotalPages(typeof data.totalPages === "number" ? data.totalPages : 1);
      }
      setIsLoading(false);
    }
    void load();
    return () => {
      cancelled = true;
    };
  }, [page, t]);
  const columns = React.useMemo(
    () => [
      {
        header: t("communication_channels.columns.displayName", "Channel"),
        accessorKey: "displayName"
      },
      {
        header: t("communication_channels.columns.provider", "Provider"),
        accessorKey: "providerKey"
      },
      {
        header: t("communication_channels.columns.type", "Type"),
        accessorKey: "channelType"
      },
      {
        header: t("communication_channels.columns.identifier", "External ID"),
        accessorKey: "externalIdentifier",
        cell: ({ row }) => row.original.externalIdentifier ?? "\u2014",
        meta: { truncate: true, maxWidth: 240 }
      },
      {
        header: t("communication_channels.columns.status", "Status"),
        accessorKey: "isActive",
        cell: ({ row }) => row.original.isActive ? /* @__PURE__ */ jsx(Tag, { variant: "success", dot: true, children: t("communication_channels.status.active", "Active") }) : /* @__PURE__ */ jsx(Tag, { variant: "neutral", children: t("communication_channels.status.inactive", "Inactive") })
      }
    ],
    [t]
  );
  return /* @__PURE__ */ jsx(Page, { children: /* @__PURE__ */ jsx(PageBody, { children: /* @__PURE__ */ jsx(
    DataTable,
    {
      title: t("communication_channels.nav.title", "Communication Channels"),
      extensionTableId: "communication_channels.channels",
      columns,
      data: rows,
      isLoading,
      error: errorMessage,
      emptyState: t(
        "communication_channels.emptyState",
        "No shared channels yet. This page lists shared, tenant-wide channels. Your personal email mailbox is private \u2014 connect and manage it under Profile \u2192 Communication Channels."
      ),
      pagination: {
        page,
        pageSize,
        total,
        totalPages,
        onPageChange: setPage
      }
    }
  ) }) });
}
export {
  ChannelsListPage as default
};
//# sourceMappingURL=page.js.map
