import useEngineContext from "../../../../hooks/useEngineContext.js";
import locales_default from "../../locales.js";
import ScrollableList from "../ScrollableList/index.js";
import PaymentMethodItem from "./PaymentMethodItem.js";
import React from "react";
import { locales } from "@pisell/utils";
import classNames from "classnames";
import { useDebounceFn } from "ahooks";
import "./index.less";
//#region src/components/checkout/components/PaymentOptionsModule/index.tsx
const SHOW_METHODS_CODE = [
	"EFTPOS_LINKLY",
	"EFTPOS",
	"EFTPOS_TYRO",
	"EFTPOS_WINDCAVE",
	"EFTPOS_PAYO",
	"EFTPOS_HUIFU"
];
function PaymentOptionsModule({ amountSymbol, orderInfo, onClick, paymentMethods = [], customAmount, title, disabled = false, showCashPayment = false }) {
	var _context$appHelper, _context$appHelper$ge, _context$appHelper$ge2, _context$appHelper$ut;
	const context = useEngineContext();
	locales.init(locales_default, ((_context$appHelper = context.appHelper) === null || _context$appHelper === void 0 || (_context$appHelper = _context$appHelper.utils) === null || _context$appHelper === void 0 || (_context$appHelper$ge = _context$appHelper.getApp) === null || _context$appHelper$ge === void 0 || (_context$appHelper$ge = _context$appHelper$ge.call(_context$appHelper)) === null || _context$appHelper$ge === void 0 || (_context$appHelper$ge = _context$appHelper$ge.locales) === null || _context$appHelper$ge === void 0 || (_context$appHelper$ge2 = _context$appHelper$ge.getLocale) === null || _context$appHelper$ge2 === void 0 ? void 0 : _context$appHelper$ge2.call(_context$appHelper$ge)) || ((_context$appHelper$ut = context.appHelper.utils) === null || _context$appHelper$ut === void 0 || (_context$appHelper$ut = _context$appHelper$ut.storage) === null || _context$appHelper$ut === void 0 ? void 0 : _context$appHelper$ut.get("umi_locale")) || "en");
	const getText = (key, fallback) => {
		var _context$appHelper2, _context$appHelper2$g, _context$appHelper2$g2, _context$appHelper$ut2, _checkoutLocales;
		const checkoutText = (_checkoutLocales = locales_default[((_context$appHelper2 = context.appHelper) === null || _context$appHelper2 === void 0 || (_context$appHelper2 = _context$appHelper2.utils) === null || _context$appHelper2 === void 0 || (_context$appHelper2$g = _context$appHelper2.getApp) === null || _context$appHelper2$g === void 0 || (_context$appHelper2$g = _context$appHelper2$g.call(_context$appHelper2)) === null || _context$appHelper2$g === void 0 || (_context$appHelper2$g = _context$appHelper2$g.locales) === null || _context$appHelper2$g === void 0 || (_context$appHelper2$g2 = _context$appHelper2$g.getLocale) === null || _context$appHelper2$g2 === void 0 ? void 0 : _context$appHelper2$g2.call(_context$appHelper2$g)) || ((_context$appHelper$ut2 = context.appHelper.utils) === null || _context$appHelper$ut2 === void 0 || (_context$appHelper$ut2 = _context$appHelper$ut2.storage) === null || _context$appHelper$ut2 === void 0 ? void 0 : _context$appHelper$ut2.get("umi_locale")) || "en"]) === null || _checkoutLocales === void 0 ? void 0 : _checkoutLocales[key];
		if (checkoutText) return checkoutText;
		return locales.getText(key) || fallback;
	};
	const displayTitle = typeof title === "string" ? title : title ? String(title) : getText("cards.and.digitals", "Cards & Digitals");
	const filteredPaymentMethods = paymentMethods.filter((item) => !(item.type === "app" && item.code === "EFTPOS_LINKLY") && (["custom"].includes(item.type) || SHOW_METHODS_CODE.includes(item.code)));
	const { run: handlePaymentClick } = useDebounceFn((method) => {
		if (disabled) return;
		if (typeof onClick === "function") onClick(method);
	}, {
		wait: 1e3,
		leading: true,
		trailing: false
	});
	return /* @__PURE__ */ React.createElement("div", { className: classNames("payment-options-module", { "payment-options-module-disabled": disabled }) }, /* @__PURE__ */ React.createElement("div", { className: classNames("payment-options-module-title") }, /* @__PURE__ */ React.createElement("span", null, displayTitle)), /* @__PURE__ */ React.createElement("div", { className: classNames("payment-options-module-list-container") }, /* @__PURE__ */ React.createElement(ScrollableList, {
		height: "100%",
		maxHeight: 314,
		gradientColor: "rgba(139, 92, 246, 0.1)",
		gradientHeight: 50,
		columnCount: showCashPayment ? 1 : 2,
		rowGap: 7,
		columnGap: 8,
		containerStyle: {
			width: "100%",
			flex: 1,
			minHeight: 0,
			position: "relative",
			paddingBottom: 8
		}
	}, filteredPaymentMethods.map((method) => /* @__PURE__ */ React.createElement(PaymentMethodItem, {
		size: (filteredPaymentMethods === null || filteredPaymentMethods === void 0 ? void 0 : filteredPaymentMethods.length) === 2 ? "large" : "default",
		key: method.id,
		method,
		amountSymbol,
		customAmount,
		disabled,
		onClick: handlePaymentClick,
		getText
	})))));
}
//#endregion
export { SHOW_METHODS_CODE, PaymentOptionsModule as default };
