import { CommonError as l } from "./accelbyte-widgets124.mjs";
import { Loading as g, LoadingSize as u } from "./accelbyte-widgets136.mjs";
import { Pagination as d } from "./accelbyte-widgets256.mjs";
import { t as p } from "./accelbyte-widgets58.mjs";
import c from "./accelbyte-widgets210.mjs";
import { SkeletonGameCards as h } from "./accelbyte-widgets531.mjs";
import { Ctx as a } from "./accelbyte-widgets33.mjs";
import { ItemType as S } from "./accelbyte-widgets185.mjs";
import { EcomPath as s } from "./accelbyte-widgets59.mjs";
import { PageTitleUtils as f } from "./accelbyte-widgets188.mjs";
import { ItemListingAppManager as x } from "./accelbyte-widgets532.mjs";
import o from "react";
import { Helmet as b } from "react-helmet";
import { Trans as E } from "react-i18next";
import "./accelbyte-widgets535.mjs";
import { StoreGridItem as L } from "./accelbyte-widgets416.mjs";
class O extends o.Component {
  constructor(t) {
    super(t), this.appStoreLogic = new x(a.getAppState().getSdk()), this.appStoreLogic.subscribe(() => this.setState({}));
  }
  componentDidMount() {
    const { page: t, pageSize: e, country: r, language: n } = this.props;
    this.appStoreLogic.getItemsByCriteria({ page: t, pageSize: e, country: r, language: n, itemType: S.enum.OPTIONBOX }), this.appStoreLogic.getCurrencyMap();
  }
  renderOptionboxItems() {
    const { platformItemsList: t, currencyMap: e } = this.appStoreLogic.state;
    return /* @__PURE__ */ o.createElement("div", { className: "optionboxList" }, !e && /* @__PURE__ */ o.createElement(h, { numberOfCards: t == null ? void 0 : t.data.length }), !!t && e && t.data.map((r) => /* @__PURE__ */ o.createElement(L, { key: r.itemId, item: r, currencyMap: e })));
  }
  renderOptionboxPagination() {
    const { platformItemsList: t } = this.appStoreLogic.state;
    if (!t)
      return;
    const { paging: e } = t, r = !!(e != null && e.next), n = !!(e != null && e.previous), m = this.props.page;
    return /* @__PURE__ */ o.createElement("div", { className: "pagination" }, /* @__PURE__ */ o.createElement(
      d,
      {
        next: r && s.OptionboxList.withSearchParams({
          page: m + 1
        }),
        prev: n && s.OptionboxList.withSearchParams({
          page: m - 1
        })
      }
    ));
  }
  render() {
    const { error: t, isFetching: e, platformItemsList: r } = this.appStoreLogic.state;
    return /* @__PURE__ */ o.createElement("div", { className: "storeContainer" }, /* @__PURE__ */ o.createElement(b, null, /* @__PURE__ */ o.createElement("title", null, f.getPageTitle(a.getAppState().state.discovery || null, p("OptionboxStore.title"), p("OptionboxStore.title")))), e && /* @__PURE__ */ o.createElement(g, { className: u.medium }, /* @__PURE__ */ o.createElement(E, { i18nKey: "OptionboxStore.loading" }, "Loading optionbox...")), !e && t && /* @__PURE__ */ o.createElement("div", null, /* @__PURE__ */ o.createElement(l, { error: t })), !e && r && this.renderOptionboxItems(), !e && r && this.renderOptionboxPagination());
  }
}
const y = c(O, (i, t) => i.country !== t.country);
c(
  ({ page: i, pageSize: t, language: e }) => {
    const r = a.getAppState().getUser(), n = r && r.country || void 0;
    return /* @__PURE__ */ o.createElement(y, { page: i, pageSize: t, country: n, language: e });
  },
  (i, t) => t.page !== i.page || t.language !== i.language
);
export {
  O as OptionboxStore
};
