import { _asyncToGenerator } from "../../../../_virtual/_@oxc-project_runtime@0.122.0/helpers/asyncToGenerator.js";
import { formatToken } from "../constants.js";
import { usePeripheralRuntime } from "../hooks/usePeripheralRuntime.js";
import { createPeripheralConnectionCardModel } from "../utils/peripheralCardModel.js";
import PeripheralConnectionCard from "./PeripheralConnectionCard.js";
import PhysicalDeviceSelectModal from "./PhysicalDeviceSelectModal.js";
import PrinterUsageModal from "./PrinterUsageModal.js";
import React, { useState } from "react";
import { PisellModal } from "@pisell/materials";
import classNames from "classnames";
//#region src/plus/saasDevice/appPeripheral/components/PeripheralConnectionCardContainer.tsx
const getPeripheralName = (connection, translation) => {
	const peripheral = connection === null || connection === void 0 ? void 0 : connection.target_device;
	return peripheral ? translation(peripheral.name) || String(peripheral.id) : "-";
};
const PeripheralConnectionCardContainer = ({ row, variant, getText, translation, getAppInstance, onPhysicalChange, onUsageChange, onTest, onEdit, onRemove }) => {
	const [disconnecting, setDisconnecting] = useState(false);
	const { runtimeState, physicalSelect, printUsageSelect, isRuntimeSubmitting, setPhysicalSelect, setPrintUsageSelect, handleConnectPeripheral, handleDisconnectPeripheral, handleOpenUsageSelect, handleSelectPeripheralUsage, connectSelectedPhysicalDevice } = usePeripheralRuntime({
		row,
		getAppInstance,
		getText,
		onPhysicalChange,
		onUsageChange
	});
	/** 视图模型只负责展示派生，稳定数据仍以 row 为准。 */
	const model = createPeripheralConnectionCardModel({
		row,
		runtimeOverlay: runtimeState,
		getText,
		translation
	});
	const isPhone = variant === "phone";
	return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(PeripheralConnectionCard, {
		model,
		getText,
		onEdit,
		onRemove,
		onRequestDisconnect: () => setDisconnecting(true),
		onOpenUsageSelect: () => handleOpenUsageSelect(row),
		onTest: () => {
			onTest === null || onTest === void 0 || onTest({
				connection: row.connection,
				targetDevice: row.peripheral,
				physicalDevice: model.physicalDevice || row.physical,
				peripheralUsage: row.usage
			});
		},
		onOpenPhysicalSelect: () => {
			const candidates = runtimeState === null || runtimeState === void 0 ? void 0 : runtimeState.candidates;
			if (!(candidates === null || candidates === void 0 ? void 0 : candidates.length)) return;
			setPhysicalSelect({
				row,
				devices: candidates
			});
		},
		onConnect: () => handleConnectPeripheral(row)
	}), disconnecting ? /* @__PURE__ */ React.createElement(PisellModal, {
		open: true,
		title: getText("pisell2.saas.app-peripheral.disconnect.title"),
		headerDivider: false,
		okText: getText("pisell2.saas.app-peripheral.confirm"),
		cancelText: getText("pisell2.saas.app-peripheral.cancel"),
		okButtonProps: {
			block: true,
			size: "large",
			danger: true,
			loading: isRuntimeSubmitting,
			onClick: function() {
				var _ref = _asyncToGenerator(function* () {
					yield handleDisconnectPeripheral(row);
					setDisconnecting(false);
				});
				return function onClick() {
					return _ref.apply(this, arguments);
				};
			}()
		},
		cancelButtonProps: {
			block: true,
			size: "large",
			type: "default",
			disabled: isRuntimeSubmitting,
			onClick: () => setDisconnecting(false)
		},
		width: 460,
		platform: isPhone ? "h5" : void 0,
		mobileModalHeight: isPhone ? "auto" : void 0,
		className: classNames("saas-app-peripheral-confirm-modal", { "saas-app-peripheral-confirm-modal--phone": isPhone }),
		destroyOnClose: true,
		maskClosable: !isRuntimeSubmitting,
		onCancel: () => {
			if (isRuntimeSubmitting) return;
			setDisconnecting(false);
		}
	}, formatToken(getText("pisell2.saas.app-peripheral.disconnect.confirm"), { name: getPeripheralName(row.connection, translation) })) : null, /* @__PURE__ */ React.createElement(PhysicalDeviceSelectModal, {
		state: physicalSelect,
		variant,
		submitting: isRuntimeSubmitting,
		getText,
		onClose: () => setPhysicalSelect(void 0),
		onSelect: (device) => {
			if (!physicalSelect) return;
			setPhysicalSelect(void 0);
			connectSelectedPhysicalDevice(physicalSelect.row, device);
		}
	}), /* @__PURE__ */ React.createElement(PrinterUsageModal, {
		state: printUsageSelect,
		variant,
		submitting: isRuntimeSubmitting,
		getText,
		onClose: () => setPrintUsageSelect(void 0),
		onSelect: (usage) => {
			handleSelectPeripheralUsage(usage);
		}
	}));
};
//#endregion
export { PeripheralConnectionCardContainer as default };
