"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const designSystem = require("@choiceform/design-system");
const iconsReact = require("@choiceform/icons-react");
const React = require("react");
const index = require("../../../i18n/index.cjs");
const tv = require("./tv.cjs");
const LoadMoreButton = React.memo(function LoadMoreButton2(props) {
  const { hasMore, isLoading, onLoadMore, className, totalCount, loadedCount } = props;
  const loadingText = index.t("conversation", "loading");
  const loadMoreText = index.t("conversation", "load-more", {
    loaded: loadedCount ?? 0,
    total: totalCount ?? 0
  });
  const noMoreMessagesText = index.t("conversation", "no-more-messages");
  if (!hasMore) {
    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: designSystem.tcx("flex justify-center py-4", className), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-secondary-foreground text-body-small", children: noMoreMessagesText }) });
  }
  const handleLoadMore = async () => {
    try {
      await onLoadMore();
    } catch (error) {
      console.error("Load more messages failed:", error);
    }
  };
  const tv$1 = tv.LoadMoreButtonTv();
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: tv$1.root({ className }), children: /* @__PURE__ */ jsxRuntime.jsxs(
    designSystem.LinkButton,
    {
      onClick: handleLoadMore,
      disabled: isLoading,
      children: [
        isLoading ? /* @__PURE__ */ jsxRuntime.jsx(iconsReact.LoaderCircle, { className: "animate-spin" }) : /* @__PURE__ */ jsxRuntime.jsx(iconsReact.ArrowUp, {}),
        isLoading ? loadingText : loadMoreText
      ]
    }
  ) });
});
exports.LoadMoreButton = LoadMoreButton;
//# sourceMappingURL=load-more-button.cjs.map
