import { Breadcrumbs as E } from "./accelbyte-widgets190.mjs";
import { Lightbox as f } from "./accelbyte-widgets191.mjs";
import I from "./accelbyte-widgets210.mjs";
import { ItemHelper as b } from "./accelbyte-widgets192.mjs";
import { OptionboxItemDetailPageLogic as x } from "./accelbyte-widgets216.mjs";
import { gaSendErrorEvent as P } from "./accelbyte-widgets145.mjs";
import { Ctx as h } from "./accelbyte-widgets33.mjs";
import { EcommerceErrorCode as L, ItemType as O } from "./accelbyte-widgets185.mjs";
import { EcomPath as v } from "./accelbyte-widgets59.mjs";
import { ErrorPath as C } from "./accelbyte-widgets69.mjs";
import { ErrorHelper as d } from "./accelbyte-widgets120.mjs";
import { PageTitleUtils as D } from "./accelbyte-widgets188.mjs";
import e from "react";
import y from "react-helmet";
import { Trans as c } from "react-i18next";
import { Link as N } from "react-router-dom";
import { DiscountCountdownWidget as S } from "./accelbyte-widgets194.mjs";
import { AppDetailGallery as T } from "./accelbyte-widgets195.mjs";
import { CatalogItemBanner as M } from "./accelbyte-widgets196.mjs";
import k from "./accelbyte-widgets197.mjs";
import { CatalogPurchaseWidget as w } from "./accelbyte-widgets198.mjs";
import A from "./accelbyte-widgets199.mjs";
import { InAppStore as G } from "./accelbyte-widgets212.mjs";
import "./accelbyte-widgets201.mjs";
import { ItemDetailPageLoadingScreen as W, ItemDetailPageError as _ } from "./accelbyte-widgets67.mjs";
import "./accelbyte-widgets213.mjs";
import { ItemDetailPurchaseAlert as B } from "./accelbyte-widgets202.mjs";
import { CatalogOptionboxItemList as F } from "./accelbyte-widgets217.mjs";
class H extends e.Component {
  constructor(o) {
    super(o), this.openLightbox = (m) => {
      this.setState({ isLightboxOpen: !0, selectedImagePosition: m });
    }, this.closeLightbox = () => {
      this.setState({ isLightboxOpen: !1 });
    };
    const { itemId: r, country: t, language: i, user: s } = this.props;
    this.logic = new x({ itemId: r, country: t, language: i, user: s }), this.logic.subscribe(() => this.setState({})), this.state = {
      isLightboxOpen: !1,
      selectedImagePosition: 0
    };
  }
  componentDidMount() {
    this.logic.init();
  }
  render() {
    const { user: o } = this.props, { isFetching: r, optionboxItem: t, error: i, itemsInOptionbox: s, itemPublishingContent: m } = this.logic.state;
    i && d.extractServiceErrorCode(i) === L.ITEM_NOT_FOUND && P({ eventCategory: C.Error404.makePath(), eventLabel: d.errorToString(i) });
    const { purchaseLogic: n } = this.logic, p = n && n.state.currencyMap, { isLightboxOpen: g, selectedImagePosition: u } = this.state, l = b.getMedia(t, m);
    return /* @__PURE__ */ e.createElement("main", { className: "itemDetailPage" }, /* @__PURE__ */ e.createElement(
      B,
      {
        purchaseLogic: n,
        user: o,
        isFetching: r
      }
    ), /* @__PURE__ */ e.createElement(y, null, t && /* @__PURE__ */ e.createElement("title", null, D.getPageTitle(h.getAppState().state.discovery || null, t.title, t.title))), r && /* @__PURE__ */ e.createElement(W, null), i && /* @__PURE__ */ e.createElement(_, { error: i }), t && /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(M, { item: t, itemPublishingContent: m }, /* @__PURE__ */ e.createElement(E, null, /* @__PURE__ */ e.createElement(N, { to: v.GameList.makePath() }, /* @__PURE__ */ e.createElement(c, { i18nKey: "Navigation.links.games" }, "Games")), t.title)), l && /* @__PURE__ */ e.createElement(T, { itemMedias: l, openLightbox: this.openLightbox }), g && l && /* @__PURE__ */ e.createElement(
      f,
      {
        itemMedias: l,
        isOpen: g,
        onClose: this.closeLightbox,
        selectedPosition: u
      }
    ), /* @__PURE__ */ e.createElement("div", { className: "itemDetailContent" }, /* @__PURE__ */ e.createElement("div", { className: "description" }, /* @__PURE__ */ e.createElement(F, { items: s, optionboxItem: t }), /* @__PURE__ */ e.createElement(k, { item: t })), /* @__PURE__ */ e.createElement("div", { className: "detailWidget" }, /* @__PURE__ */ e.createElement(A, { item: t }, p && /* @__PURE__ */ e.createElement(S, { item: t, currencyMap: p, position: "right", showDetail: !0 })), /* @__PURE__ */ e.createElement("div", { className: "protruded" }, /* @__PURE__ */ e.createElement(w, { item: t, purchaseLogic: n })))), /* @__PURE__ */ e.createElement("div", { className: "storeContainer" }, /* @__PURE__ */ e.createElement("h2", null, /* @__PURE__ */ e.createElement(c, { i18nKey: "OptionboxItemDetailPage.relatedItems.heading" }, "Related Items")), /* @__PURE__ */ e.createElement(
      G,
      {
        baseItem: t,
        language: this.props.language,
        itemType: O.enum.OPTIONBOX,
        noItemMessage: /* @__PURE__ */ e.createElement("div", { className: "noItem" }, /* @__PURE__ */ e.createElement(c, { i18nKey: "OptionboxItemDetailPage.relatedItems.noItem" }, "Looks like there are no related items yet."))
      }
    ))));
  }
}
const ue = I(
  ({ itemId: a, language: o }) => {
    const r = h.getAppState().getUser() || void 0, t = r && r.country || void 0;
    return /* @__PURE__ */ e.createElement(H, { itemId: a, country: t, user: r, language: o });
  },
  (a, o) => a.itemId !== o.itemId || o.language !== a.language
);
export {
  ue as default
};
