import { CommonError as c } from "./accelbyte-widgets124.mjs";
import { Loading as u, LoadingSize as d } from "./accelbyte-widgets136.mjs";
import h from "./accelbyte-widgets210.mjs";
import { Ctx as y } from "./accelbyte-widgets33.mjs";
import t from "react";
import { Trans as l } from "react-i18next";
import { StoreGridItem as g } from "./accelbyte-widgets416.mjs";
import "./accelbyte-widgets417.mjs";
import { RelatedProductKeyLogic as p } from "./accelbyte-widgets418.mjs";
const I = 8;
class E extends t.Component {
  constructor(e) {
    super(e), this.initialShownItem = I, e.initialShownItem && (this.initialShownItem = e.initialShownItem), this.logic = new p({
      baseItem: e.baseItem,
      itemType: e.itemType,
      appType: e.appType,
      country: e.country,
      language: e.language
    }), this.logic.subscribe(() => this.setState({})), this.state = {
      open: !1
    };
  }
  componentDidMount() {
    this.logic.init();
  }
  renderContent() {
    const { noItemMessage: e } = this.props, { items: n, isFetching: i, error: a, currencyMap: o } = this.logic.state, { open: m } = this.state;
    return /* @__PURE__ */ t.createElement("div", { className: "relatedProductKeys list" }, /* @__PURE__ */ t.createElement("div", { className: "relatedProductKeysData" }, i && /* @__PURE__ */ t.createElement(u, { className: d.medium }), a && /* @__PURE__ */ t.createElement("div", { className: "errorContainer" }, /* @__PURE__ */ t.createElement(c, { error: a })), n && n.length === 0 && /* @__PURE__ */ t.createElement(t.Fragment, null, e, !e && /* @__PURE__ */ t.createElement(l, { i18nKey: "RelatedProductKey.grid.empty" }, "No Items Available")), /* @__PURE__ */ t.createElement("div", { className: "relatedProductKeysGrid" }, n && o && (m ? n : n.slice(0, this.initialShownItem)).map((s) => /* @__PURE__ */ t.createElement(g, { key: s.itemId, item: s, currencyMap: o })))), n && n.length > this.initialShownItem && !m && /* @__PURE__ */ t.createElement("div", { className: "showMoreButton" }, /* @__PURE__ */ t.createElement("button", { className: "btn btn-primary", type: "button", onClick: () => this.setState({ open: !0 }) }, /* @__PURE__ */ t.createElement(l, { i18nKey: "RelatedProductKey.showAllButton" }, "Show All"))));
  }
  render() {
    const { withWrapper: e } = this.props, { items: n, error: i } = this.logic.state;
    return e ? /* @__PURE__ */ t.createElement(t.Fragment, null, (n && n.length > 0 || i) && e(this.renderContent())) : /* @__PURE__ */ t.createElement(t.Fragment, null, this.renderContent());
  }
}
h(
  (r) => {
    const e = y.getAppState();
    return /* @__PURE__ */ t.createElement(E, { country: (e.getUser() || { country: void 0 }).country, ...r });
  },
  (r, e) => r.baseItem !== e.baseItem || r.country !== e.country
);
export {
  E as RelatedProductKey
};
