import { t, A as ArrowIcon, e as ArrowIconStyles, s as styles, a as Ctx, E as ErrorHelper, p as ErrorEntity, q as EcommerceErrorCode, g as AccPath, k as UIEvent, D as DesktopChecker, L as Loading, I as InputValidationOutdatedModal } from "./index.js";
import { c as classNames } from "./reactSlick.js";
import React__default from "react";
import { NavLink } from "react-router-dom";
import { N as NavItemPlaceholder } from "./NavItemPlaceholder.js";
import "./dateFns.js";
import "./validator.js";
import "./reactPlayer.js";
class AccountPageMobileNavigation extends React__default.Component {
  constructor(props) {
    super(props);
    this.getCurrentLocationLabel = () => {
      const currentLocation = this.props.accountPageNav.find((item) => {
        return item.type === "link" && this.props.location.pathname.startsWith(item.to);
      });
      return currentLocation ? t(currentLocation.label) : null;
    };
    this.state = {
      menuOpen: false
    };
  }
  render() {
    const { isLoading, listHiddenMenu, accountPageNav } = this.props;
    return /* @__PURE__ */ React__default.createElement("div", {
      className: "accountNavMobile"
    }, !isLoading && /* @__PURE__ */ React__default.createElement("div", {
      className: "menuToggleContainer"
    }, /* @__PURE__ */ React__default.createElement("button", {
      className: "menuToggle btn",
      onClick: () => this.setState((prevState) => ({ menuOpen: !prevState.menuOpen }))
    }, /* @__PURE__ */ React__default.createElement("span", null, this.getCurrentLocationLabel()), /* @__PURE__ */ React__default.createElement(ArrowIcon, {
      className: classNames("activeArrow", ArrowIconStyles.down)
    }))), this.state.menuOpen && !isLoading && /* @__PURE__ */ React__default.createElement("div", {
      className: "menuContainer"
    }, /* @__PURE__ */ React__default.createElement("div", null, /* @__PURE__ */ React__default.createElement("nav", {
      className: "navigationMobile"
    }, accountPageNav.map((navItem, index) => {
      if (navItem.type === "separator") {
        if (navItem.component) {
          return /* @__PURE__ */ React__default.createElement(navItem.component, null);
        }
        return /* @__PURE__ */ React__default.createElement("div", {
          key: `separator-${index}`,
          className: classNames(styles.separator)
        });
      }
      const { to, label, isVisible } = navItem;
      if (listHiddenMenu.has(to))
        return null;
      if (isVisible && !isVisible()) {
        return null;
      }
      return /* @__PURE__ */ React__default.createElement(NavLink, {
        key: `${index}-${to}`,
        to,
        onClick: () => this.setState({ menuOpen: false })
      }, /* @__PURE__ */ React__default.createElement("span", null, t(label)));
    })))));
  }
}
class AccountPageDesktopNavigation extends React__default.Component {
  render() {
    const { isLoading, listHiddenMenu, accountPageNav } = this.props;
    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("nav", {
      className: "navigationDesktop"
    }, accountPageNav.map((navItem, index) => {
      if (navItem.type === "separator") {
        if (navItem.component) {
          return /* @__PURE__ */ React__default.createElement(navItem.component, null);
        }
        return /* @__PURE__ */ React__default.createElement("div", {
          key: `separator-${index}`,
          className: classNames(styles.separator)
        });
      }
      if (isLoading)
        return /* @__PURE__ */ React__default.createElement(NavItemPlaceholder, {
          key: `${index}`
        });
      const { to, label } = navItem;
      if (listHiddenMenu.has(to))
        return null;
      if (navItem.isVisible && !navItem.isVisible()) {
        return null;
      }
      return /* @__PURE__ */ React__default.createElement(NavLink, {
        key: `${index}-${to}`,
        to
      }, /* @__PURE__ */ React__default.createElement("span", null, t(label)), /* @__PURE__ */ React__default.createElement(ArrowIcon, {
        className: classNames("activeArrow", ArrowIconStyles.right)
      }));
    })));
  }
}
const UserProfilePreview = React__default.lazy(() => import("./UserProfilePreview.js"));
class AccountPageLayout extends React__default.Component {
  constructor(props) {
    super(props);
    this.init = async () => {
      var _a;
      const userId = (_a = Ctx.getAppState().getUser()) == null ? void 0 : _a.userId;
      try {
        this.setState({ isLoading: true });
        if (!userId)
          return;
        const newHiddenMenus = /* @__PURE__ */ new Set();
        await Promise.all([
          await Ctx.getAppState().getSdk().Platform.Payment().getPaymentAccounts(userId).then((result) => {
            var _a2, _b, _c, _d, _e;
            if (ErrorHelper.isAxiosError(result == null ? void 0 : result.error) && ((_c = ErrorEntity.safeParse((_b = (_a2 = result == null ? void 0 : result.error) == null ? void 0 : _a2.response) == null ? void 0 : _b.data)) == null ? void 0 : _c.success) && ((_e = (_d = result == null ? void 0 : result.error) == null ? void 0 : _d.response) == null ? void 0 : _e.data.errorCode) === EcommerceErrorCode.PAYMENT_METHOD_SAVING_UNSUPPORTED) {
              newHiddenMenus.add(AccPath.PaymentMethods.link);
            }
          })
        ]);
        this.setState({ listHiddenMenu: newHiddenMenus });
      } catch (e) {
        console.error(e);
      } finally {
        this.setState({ isLoading: false });
      }
    };
    this.state = {
      isLoading: false,
      listHiddenMenu: /* @__PURE__ */ new Set()
    };
    this.appState = Ctx.getAppState();
    Ctx.getInputValidationManager().subscribe(() => this.setState({}));
  }
  async componentDidMount() {
    this.init();
    UIEvent.updateBackground(`url(${this.props.backgroundImageUrl})`);
    const {
      miscAppManager: {
        state: { countries },
        fetchCountries
      },
      userAppManager: {
        state: { user },
        fetchCurrentUserInformation
      }
    } = this.appState;
    await Promise.allSettled([!countries.length && fetchCountries(), !user && fetchCurrentUserInformation()]);
    if (Ctx.getInputValidationManager().state.validations.length === 0) {
      Ctx.getInputValidationManager().fetchValidations();
    }
  }
  componentWillUnmount() {
    UIEvent.updateBackground(null);
  }
  render() {
    const { backgroundImageUrl, children, accountPageNav } = this.props;
    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("div", {
      className: "accountPage",
      style: !DesktopChecker.isDesktopApp() && backgroundImageUrl ? { backgroundImage: `url(${backgroundImageUrl})` } : void 0
    }, /* @__PURE__ */ React__default.createElement("div", {
      className: "userProfilePreviewContainer"
    }, /* @__PURE__ */ React__default.createElement("div", {
      className: "sideEmptySpace"
    }), /* @__PURE__ */ React__default.createElement("section", {
      className: "accountPageSubpages"
    }, /* @__PURE__ */ React__default.createElement(UserProfilePreview, null))), /* @__PURE__ */ React__default.createElement("div", {
      className: "mainContainer"
    }, /* @__PURE__ */ React__default.createElement("div", {
      className: "sidebar"
    }, /* @__PURE__ */ React__default.createElement(AccountPageDesktopNavigation, {
      accountPageNav,
      isLoading: this.state.isLoading,
      listHiddenMenu: this.state.listHiddenMenu
    })), /* @__PURE__ */ React__default.createElement("div", {
      className: "sidebar mobile"
    }, /* @__PURE__ */ React__default.createElement(AccountPageMobileNavigation, {
      isLoading: this.state.isLoading,
      listHiddenMenu: this.state.listHiddenMenu,
      ...this.props
    })), /* @__PURE__ */ React__default.createElement("section", {
      className: "accountPageSubpages"
    }, /* @__PURE__ */ React__default.createElement(React__default.Suspense, {
      fallback: /* @__PURE__ */ React__default.createElement(Loading, null)
    }, children)))), /* @__PURE__ */ React__default.createElement(InputValidationOutdatedModal, null));
  }
}
export { AccountPageLayout as default };
