@microcosmmoney/portal-react 3.13.8 → 3.13.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -82,6 +82,9 @@ function MiningModal({ isOpen, onClose, userDetails, onSuccess }) {
|
|
|
82
82
|
const [pollElapsedSec, setPollElapsedSec] = (0, react_1.useState)(0);
|
|
83
83
|
const pollIntervalRef = (0, react_1.useRef)(null);
|
|
84
84
|
const pollStartTsRef = (0, react_1.useRef)(0);
|
|
85
|
+
const referencePollAbortRef = (0, react_1.useRef)(false);
|
|
86
|
+
const referencePubkeyRef = (0, react_1.useRef)(null);
|
|
87
|
+
const successFiredRef = (0, react_1.useRef)(false);
|
|
85
88
|
const isMobile = typeof window !== "undefined" ? (0, solana_pay_1.isMobileDevice)() : false;
|
|
86
89
|
const loadStablecoinBalance = (0, react_1.useCallback)(async () => {
|
|
87
90
|
if (!publicKey || !connected) {
|
|
@@ -114,8 +117,29 @@ function MiningModal({ isOpen, onClose, userDetails, onSuccess }) {
|
|
|
114
117
|
clearInterval(pollIntervalRef.current);
|
|
115
118
|
pollIntervalRef.current = null;
|
|
116
119
|
}
|
|
120
|
+
referencePollAbortRef.current = true;
|
|
117
121
|
}, []);
|
|
118
122
|
(0, react_1.useEffect)(() => () => { stopStatusPolling(); }, [stopStatusPolling]);
|
|
123
|
+
const startReferenceWatch = (0, react_1.useCallback)(async (reference) => {
|
|
124
|
+
referencePollAbortRef.current = false;
|
|
125
|
+
try {
|
|
126
|
+
const connection = new web3_js_1.Connection(SOLANA_RPC, "confirmed");
|
|
127
|
+
while (!referencePollAbortRef.current) {
|
|
128
|
+
try {
|
|
129
|
+
const sigs = await connection.getSignaturesForAddress(reference, { limit: 1 }, "confirmed");
|
|
130
|
+
if (sigs.length > 0 && !sigs[0].err) {
|
|
131
|
+
const sig = sigs[0].signature;
|
|
132
|
+
setTxSignature(prev => prev || sig);
|
|
133
|
+
setBackendStatus(prev => (prev === "created" ? "submitted" : prev));
|
|
134
|
+
break;
|
|
135
|
+
}
|
|
136
|
+
}
|
|
137
|
+
catch { }
|
|
138
|
+
await new Promise(r => setTimeout(r, 1500));
|
|
139
|
+
}
|
|
140
|
+
}
|
|
141
|
+
catch { }
|
|
142
|
+
}, []);
|
|
119
143
|
const startStatusPolling = (0, react_1.useCallback)((requestId) => {
|
|
120
144
|
stopStatusPolling();
|
|
121
145
|
pollStartTsRef.current = Date.now();
|
|
@@ -143,6 +167,10 @@ function MiningModal({ isOpen, onClose, userDetails, onSuccess }) {
|
|
|
143
167
|
status: "completed",
|
|
144
168
|
});
|
|
145
169
|
setStep("success");
|
|
170
|
+
if (onSuccess && !successFiredRef.current) {
|
|
171
|
+
successFiredRef.current = true;
|
|
172
|
+
onSuccess();
|
|
173
|
+
}
|
|
146
174
|
}
|
|
147
175
|
else if (data.status === "failed") {
|
|
148
176
|
stopStatusPolling();
|
|
@@ -198,9 +226,11 @@ function MiningModal({ isOpen, onClose, userDetails, onSuccess }) {
|
|
|
198
226
|
});
|
|
199
227
|
setSolanaPayUrl(payUrl);
|
|
200
228
|
setBackendStatus("created");
|
|
229
|
+
referencePubkeyRef.current = reference;
|
|
201
230
|
if (isMobile) {
|
|
202
231
|
setStep("qrPayment");
|
|
203
232
|
startStatusPolling(response.data.request_id);
|
|
233
|
+
startReferenceWatch(reference);
|
|
204
234
|
}
|
|
205
235
|
else {
|
|
206
236
|
setStep("paymentMethod");
|
|
@@ -219,6 +249,8 @@ function MiningModal({ isOpen, onClose, userDetails, onSuccess }) {
|
|
|
219
249
|
return;
|
|
220
250
|
setStep("qrPayment");
|
|
221
251
|
startStatusPolling(miningRequest.request_id);
|
|
252
|
+
if (referencePubkeyRef.current)
|
|
253
|
+
startReferenceWatch(referencePubkeyRef.current);
|
|
222
254
|
};
|
|
223
255
|
const handleSelectBrowserPayment = async () => {
|
|
224
256
|
if (!connected || !publicKey) {
|
|
@@ -279,6 +311,10 @@ function MiningModal({ isOpen, onClose, userDetails, onSuccess }) {
|
|
|
279
311
|
throw new Error(confirmResponse.error || t("errorConfirmPayment"));
|
|
280
312
|
setConfirmationResult(confirmResponse.data);
|
|
281
313
|
setStep("success");
|
|
314
|
+
if (onSuccess && !successFiredRef.current) {
|
|
315
|
+
successFiredRef.current = true;
|
|
316
|
+
onSuccess();
|
|
317
|
+
}
|
|
282
318
|
}
|
|
283
319
|
catch (err) {
|
|
284
320
|
setError(err instanceof Error ? err.message : t("errorMiningFailed"));
|
|
@@ -301,8 +337,12 @@ function MiningModal({ isOpen, onClose, userDetails, onSuccess }) {
|
|
|
301
337
|
setConfirmationResult(null);
|
|
302
338
|
setSolanaPayUrl("");
|
|
303
339
|
setBackendStatus("created");
|
|
304
|
-
|
|
340
|
+
referencePubkeyRef.current = null;
|
|
341
|
+
if (onSuccess && !successFiredRef.current) {
|
|
342
|
+
successFiredRef.current = true;
|
|
305
343
|
onSuccess();
|
|
344
|
+
}
|
|
345
|
+
successFiredRef.current = false;
|
|
306
346
|
onClose();
|
|
307
347
|
}, [stopStatusPolling, onClose, onSuccess]);
|
|
308
348
|
const handleClose = () => {
|
|
@@ -340,5 +380,5 @@ function MiningModal({ isOpen, onClose, userDetails, onSuccess }) {
|
|
|
340
380
|
default: return 10;
|
|
341
381
|
}
|
|
342
382
|
};
|
|
343
|
-
return ((0, jsx_runtime_1.jsx)("div", { className: "fixed inset-0 z-50 flex items-end 2xs:items-center justify-center bg-black/50 backdrop-blur-sm font-mono", children: (0, jsx_runtime_1.jsx)("div", { className: "relative w-full max-w-2xl mx-0 2xs:mx-3 xs:mx-4 max-h-[95vh] 2xs:max-h-[90vh] overflow-y-auto rounded-t-2xl 2xs:rounded-xl", children: (0, jsx_runtime_1.jsxs)(terminal_1.TerminalCard, { filename: "mining_request.json", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-4 2xs:mb-5 xs:mb-6", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h2", { className: "text-base 2xs:text-lg xs:text-xl font-bold text-white mb-1", children: t("title") }), (0, jsx_runtime_1.jsx)("p", { className: "text-[10px] 2xs:text-xs text-neutral-400 tracking-wider", children: t("subtitle") })] }), (0, jsx_runtime_1.jsx)("button", { onClick: handleClose, disabled: loading, className: "text-neutral-400 hover:text-white transition-colors p-1 min-w-[44px] min-h-[44px] flex items-center justify-center", children: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "w-5 h-5" }) })] }), showCloseConfirm && ((0, jsx_runtime_1.jsx)("div", { className: "fixed inset-0 z-[60] flex items-center justify-center bg-black/70 backdrop-blur-sm p-4", children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border-2 border-red-500/60 rounded-xl p-5 max-w-md w-full space-y-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-start gap-3", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.AlertTriangle, { className: "w-6 h-6 text-red-400 flex-shrink-0 mt-0.5" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-white font-bold text-lg mb-2", children: t("closeWarningTitle") }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-300 text-sm leading-relaxed", children: t("closeWarningBody") })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-3", children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => setShowCloseConfirm(false), className: "flex-1 px-4 py-3 bg-cyan-700 hover:bg-cyan-600 text-white rounded transition-colors font-bold", children: t("closeWarningStay") }), (0, jsx_runtime_1.jsx)("button", { onClick: performClose, className: "flex-1 px-4 py-3 border border-red-500/60 text-red-400 hover:bg-red-500/10 rounded transition-colors", children: t("closeWarningLeave") })] })] }) })), step === "input" && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [ratioInfo && ((0, jsx_runtime_1.jsx)("div", { className: "p-3 rounded bg-neutral-800 border border-neutral-700", children: (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-3 gap-4 text-sm", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t("currentPhase") }), (0, jsx_runtime_1.jsxs)("div", { className: "text-white font-bold font-mono", children: ["Phase ", ratioInfo.current_stage] })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1 flex items-center gap-1", children: [t("techBonus"), (0, jsx_runtime_1.jsx)("span", { className: "cursor-help text-neutral-500 hover:text-cyan-400", title: t("techBonusTooltip"), children: "?" })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-cyan-400 font-bold font-mono", children: "0%" })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t("mintPrice") }), (0, jsx_runtime_1.jsxs)("div", { className: "text-cyan-400 font-bold font-mono", children: ["1 MCC \u2248 ", (ratioInfo.usdc_per_mcc * 4).toFixed(2), " USD"] })] })] }) })), (0, jsx_runtime_1.jsx)("div", { className: "p-4 rounded bg-cyan-400/20 border border-cyan-400/50", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-start gap-3", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.AlertCircle, { className: "w-5 h-5 text-cyan-400 flex-shrink-0 mt-0.5" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-cyan-400 font-bold text-sm mb-1", children: t("solanaOnly") }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-300 text-xs leading-relaxed", children: t("solanaOnlyDescMining") })] })] }) }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("label", { className: "block text-xs text-neutral-400 tracking-wider mb-2", children: [t("paymentMethod"), " ", (0, jsx_runtime_1.jsxs)("span", { className: "text-cyan-400", children: ["(", t("paymentMethodHint"), ")"] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "relative", children: [(0, jsx_runtime_1.jsxs)("button", { type: "button", onClick: () => setShowStablecoinDropdown(!showStablecoinDropdown), className: "w-full px-4 py-3 bg-neutral-800 border border-neutral-600 rounded text-white flex items-center justify-between hover:border-neutral-500 transition-colors", children: [(0, jsx_runtime_1.jsxs)("span", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("span", { children: ci.icon }), (0, jsx_runtime_1.jsx)("span", { children: ci.symbol }), (0, jsx_runtime_1.jsxs)("span", { className: "text-neutral-400 text-sm", children: ["(", ci.name, ")"] })] }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { className: `w-4 h-4 transition-transform ${showStablecoinDropdown ? 'rotate-180' : ''}` })] }), showStablecoinDropdown && ((0, jsx_runtime_1.jsx)("div", { className: "absolute z-10 w-full mt-1 bg-neutral-900 border border-neutral-700 rounded shadow-lg", children: Object.keys(COIN_INFO).map(type => ((0, jsx_runtime_1.jsxs)("button", { type: "button", onClick: () => { setStablecoin(type); setShowStablecoinDropdown(false); }, className: `w-full px-4 py-3 text-left flex items-center gap-2 hover:bg-neutral-800 transition-colors ${stablecoin === type ? 'bg-neutral-800 text-cyan-400' : 'text-white'}`, children: [(0, jsx_runtime_1.jsx)("span", { children: COIN_INFO[type].icon }), (0, jsx_runtime_1.jsx)("span", { children: COIN_INFO[type].symbol }), (0, jsx_runtime_1.jsxs)("span", { className: "text-neutral-400 text-sm", children: ["(", COIN_INFO[type].name, ")"] })] }, type))) }))] }), connected && ((0, jsx_runtime_1.jsxs)("div", { className: "mt-2 flex items-center justify-between text-xs", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-neutral-400", children: t("stablecoinEqual") }), (0, jsx_runtime_1.jsx)("span", { className: `font-medium ${stablecoinBalance === null ? 'text-neutral-400' : stablecoinBalance === 0 ? 'text-red-400' : 'text-white'}`, children: loadingBalance ? t("loading") : stablecoinBalance === null ? t("balanceUnknown") : t("balance", { amount: stablecoinBalance.toFixed(2), symbol: ci.symbol }) })] }))] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { className: "block text-xs text-neutral-400 tracking-wider mb-2", children: t("mintAmountLabel", { symbol: "MCC" }) }), (0, jsx_runtime_1.jsx)("input", { type: "number", inputMode: "decimal", value: mccAmount, onChange: e => setMccAmount(e.target.value), placeholder: t("inputPlaceholder", { symbol: "MCC" }), className: "w-full px-3 2xs:px-4 py-3 bg-neutral-800 border border-neutral-600 rounded text-white placeholder-neutral-400 focus:outline-none focus:border-cyan-400 text-base", min: "0", step: "0.01" })] }), mccAmount && parseFloat(mccAmount) > 0 && ratioInfo && ((0, jsx_runtime_1.jsxs)("div", { className: "p-4 rounded bg-cyan-400/20 border border-cyan-400/50 space-y-3", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-2", children: t("estimatedPayment") }), (0, jsx_runtime_1.jsxs)("div", { className: "text-2xl font-bold text-cyan-400 font-mono", children: [(parseFloat(mccAmount) * ratioInfo.usdc_per_mcc * 4).toFixed(2), " ", ci.symbol] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "pt-3 border-t border-cyan-400/30", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex justify-between items-center", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400 tracking-wider", children: t("youWillReceive") }), (0, jsx_runtime_1.jsxs)("span", { className: "text-lg font-bold text-white font-mono", children: [parseFloat(mccAmount).toFixed(4), " MCC"] })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 mt-1", children: t("mccToWallet") })] })] })), error && (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 p-3 rounded bg-red-500/20 border border-red-500/50 text-red-500 text-sm", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.AlertCircle, { className: "w-4 h-4" }), error] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-3", children: [(0, jsx_runtime_1.jsx)("button", { onClick: handleClose, className: "flex-1 px-4 py-3 border border-neutral-700 text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent rounded transition-colors", children: t("cancel") }), (0, jsx_runtime_1.jsxs)("button", { onClick: handleSubmit, disabled: loading || !mccAmount || parseFloat(mccAmount) <= 0, className: "flex-1 px-4 py-3 bg-cyan-700 hover:bg-cyan-600 text-white rounded transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2", children: [loading && (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "w-4 h-4 animate-spin" }), loading ? t("processing") : t("confirmMint")] })] })] })), step === "paymentMethod" && miningRequest && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsx)(OrderSummary, {}), (0, jsx_runtime_1.jsx)("div", { className: "p-3 rounded bg-cyan-500/10 border border-cyan-500/30 text-xs text-cyan-300", children: t("stablecoinReminder", { symbol: ci.symbol }) }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider uppercase mb-1", children: t("selectPaymentMethod") }), (0, jsx_runtime_1.jsx)("button", { onClick: handleSelectQrPayment, className: "w-full p-4 rounded border-2 border-cyan-400/50 bg-cyan-400/5 hover:bg-cyan-400/10 hover:border-cyan-400/70 transition-all text-left group", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-12 h-12 rounded-lg bg-cyan-400/20 flex items-center justify-center flex-shrink-0", children: (0, jsx_runtime_1.jsx)(lucide_react_1.QrCode, { className: "w-6 h-6 text-cyan-400" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-white font-bold text-sm", children: t("mobileQrScan") }), (0, jsx_runtime_1.jsx)("span", { className: "px-1.5 py-0.5 rounded text-[10px] font-bold bg-cyan-400/20 text-cyan-400 tracking-wider", children: t("recommended") })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-400 text-xs mt-1 leading-relaxed", children: t("mobileQrDesc") })] }), (0, jsx_runtime_1.jsx)(lucide_react_1.Smartphone, { className: "w-5 h-5 text-neutral-500 group-hover:text-cyan-400 transition-colors flex-shrink-0" })] }) }), (0, jsx_runtime_1.jsx)("button", { onClick: handleSelectBrowserPayment, disabled: !connected, className: "w-full p-4 rounded border border-neutral-700 bg-neutral-800/50 hover:bg-neutral-800 hover:border-neutral-600 transition-all text-left group disabled:opacity-40 disabled:cursor-not-allowed", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-12 h-12 rounded-lg bg-neutral-700/50 flex items-center justify-center flex-shrink-0", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Monitor, { className: "w-6 h-6 text-neutral-400" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-2", children: (0, jsx_runtime_1.jsx)("span", { className: "text-neutral-300 font-bold text-sm", children: t("browserExtension") }) }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-500 text-xs mt-1 leading-relaxed", children: connected ? t("browserExtConnected") : t("browserExtNotConnected") })] })] }) }), error && (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 p-3 rounded bg-red-500/20 border border-red-500/50 text-red-500 text-sm", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.AlertCircle, { className: "w-4 h-4" }), error] }), (0, jsx_runtime_1.jsxs)("button", { onClick: () => { setStep("input"); setError(""); }, className: "w-full px-4 py-2 text-neutral-400 hover:text-neutral-300 text-sm transition-colors", children: ["\u2190 ", t("goBack")] })] })), step === "qrPayment" && miningRequest && solanaPayUrl && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-3 2xs:space-y-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "p-3 rounded bg-amber-500/15 border-2 border-amber-500/50 flex items-start gap-2", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.AlertTriangle, { className: "w-5 h-5 text-amber-400 flex-shrink-0 mt-0.5" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-amber-400 font-bold text-sm mb-1", children: t("doNotClose") }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-300 text-xs leading-relaxed", children: t("doNotCloseDesc") })] })] }), (0, jsx_runtime_1.jsx)(OrderSummary, {}), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-2", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between text-xs", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-neutral-400 tracking-wider", children: statusLabel() }), (0, jsx_runtime_1.jsxs)("span", { className: "text-neutral-500 font-mono", children: [pollElapsedSec, "s"] })] }), (0, jsx_runtime_1.jsx)("div", { className: "h-2 w-full rounded-full bg-neutral-800 overflow-hidden", children: (0, jsx_runtime_1.jsx)("div", { className: "h-full bg-gradient-to-r from-cyan-500 to-cyan-300 transition-all duration-500 ease-out", style: { width: `${statusProgress()}%` } }) }), (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-4 gap-1 text-[10px] text-neutral-500", children: [(0, jsx_runtime_1.jsx)("div", { className: `text-center ${backendStatus !== "created" ? "text-cyan-400 font-bold" : ""}`, children: t("stepScan") }), (0, jsx_runtime_1.jsx)("div", { className: `text-center ${backendStatus === "submitted" || backendStatus === "distributing" || backendStatus === "completed" ? "text-cyan-400 font-bold" : ""}`, children: t("stepPaid") }), (0, jsx_runtime_1.jsx)("div", { className: `text-center ${backendStatus === "distributing" || backendStatus === "completed" ? "text-cyan-400 font-bold" : ""}`, children: t("stepDistributing") }), (0, jsx_runtime_1.jsx)("div", { className: `text-center ${backendStatus === "completed" ? "text-cyan-400 font-bold" : ""}`, children: t("stepDone") })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center space-y-3 2xs:space-y-4", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-neutral-400 text-xs 2xs:text-sm text-center", children: t("scanQrToPayDesktop") }), (0, jsx_runtime_1.jsx)("div", { className: "bg-white p-3 2xs:p-4 xs:p-5 rounded-xl", children: (0, jsx_runtime_1.jsx)(qrcode_react_1.QRCodeSVG, { value: solanaPayUrl, size: 200, level: "H", includeMargin: false, className: "w-[160px] h-[160px] 2xs:w-[180px] 2xs:h-[180px] xs:w-[220px] xs:h-[220px] sm:w-[280px] sm:h-[280px]", imageSettings: { src: "/mcc-logo-40.png", x: undefined, y: undefined, height: 40, width: 40, excavate: true } }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 text-neutral-400 text-[10px] 2xs:text-xs", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "w-3 h-3 animate-spin" }), backendStatus === "created" ? t("waitingQrScan") : t("monitoringOnchain")] })] }), (0, jsx_runtime_1.jsxs)("button", { onClick: () => { stopStatusPolling(); setStep(isMobile ? "input" : "paymentMethod"); setError(""); }, className: "w-full px-4 py-2 text-neutral-400 hover:text-neutral-300 text-xs 2xs:text-sm transition-colors min-h-[44px]", children: ["\u2190 ", t("goBack")] })] })), step === "payment" && miningRequest && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsx)(terminal_1.TerminalBadge, { variant: "info", children: t("waitingPayment") }), (0, jsx_runtime_1.jsx)(OrderSummary, {}), (0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center py-8", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "w-8 h-8 animate-spin text-cyan-400" }) }), (0, jsx_runtime_1.jsx)("p", { className: "text-center text-neutral-400 text-sm", children: t("processingTransfer", { symbol: ci.symbol }) })] })), step === "confirming" && txSignature && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsx)(terminal_1.TerminalBadge, { variant: "warning", children: t("verifying") }), (0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center py-8", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "w-8 h-8 animate-spin text-cyan-400" }) }), (0, jsx_runtime_1.jsx)("p", { className: "text-center text-neutral-400 text-sm mb-2", children: t("verifyingTransaction") }), (0, jsx_runtime_1.jsxs)("div", { className: "p-3 rounded bg-neutral-800 border border-neutral-700", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t("txSignature") }), (0, jsx_runtime_1.jsxs)("div", { className: "font-mono text-xs text-cyan-400 break-all", children: [txSignature.slice(0, 16), "...", txSignature.slice(-16)] }), (0, jsx_runtime_1.jsx)("div", { className: "mt-2", children: (0, jsx_runtime_1.jsx)(TxLink, { sig: txSignature, label: t("viewOnExplorer") }) })] })] })), step === "success" && confirmationResult && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center py-8", children: (0, jsx_runtime_1.jsx)("div", { className: "w-16 h-16 rounded-full bg-white/10 flex items-center justify-center", children: (0, jsx_runtime_1.jsx)(lucide_react_1.CheckCircle2, { className: "w-8 h-8 text-white" }) }) }), (0, jsx_runtime_1.jsx)("h3", { className: "text-xl font-bold text-center text-white", children: t("mintSuccess") }), (0, jsx_runtime_1.jsxs)("div", { className: "p-4 rounded bg-white/10 border border-neutral-700 space-y-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t("youReceived") }), (0, jsx_runtime_1.jsxs)("div", { className: "text-3xl font-bold text-white font-mono", children: ["+", (confirmationResult.mcc_distributed.user / 1000000000).toLocaleString(), " MCC"] }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 mt-1", children: t("sentToWallet") })] }), txSignature && ((0, jsx_runtime_1.jsxs)("div", { className: "pt-3 border-t border-neutral-700", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t("paymentTx", { symbol: ci.symbol }) }), (0, jsx_runtime_1.jsx)(TxLink, { sig: txSignature })] }))] }), confirmationResult.onchain_tx_signature && ((0, jsx_runtime_1.jsxs)("div", { className: "p-4 rounded bg-neutral-800 border border-neutral-700 space-y-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider", children: t("onchainDistribution") }), (0, jsx_runtime_1.jsx)(TxLink, { sig: confirmationResult.onchain_tx_signature })] })), (0, jsx_runtime_1.jsx)("div", { className: "flex gap-3", children: (0, jsx_runtime_1.jsx)("button", { onClick: performClose, className: "flex-1 px-4 py-3 bg-cyan-700 hover:bg-cyan-600 text-white rounded transition-colors", children: t("doneAndRefresh") }) })] })), step === "error" && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center py-8", children: (0, jsx_runtime_1.jsx)("div", { className: "w-16 h-16 rounded-full bg-red-500/20 flex items-center justify-center", children: (0, jsx_runtime_1.jsx)(lucide_react_1.AlertCircle, { className: "w-8 h-8 text-red-500" }) }) }), (0, jsx_runtime_1.jsx)("h3", { className: "text-xl font-bold text-center text-red-500", children: t("mintFailed") }), (0, jsx_runtime_1.jsx)("div", { className: "p-4 rounded bg-red-500/20 border border-red-500/50", children: (0, jsx_runtime_1.jsx)("p", { className: "text-red-500 text-sm whitespace-pre-line", children: error }) }), (0, jsx_runtime_1.jsx)("button", { onClick: () => { setStep("input"); setError(""); }, className: "w-full px-4 py-3 border border-neutral-700 text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent rounded transition-colors", children: t("back") })] }))] }) }) }));
|
|
383
|
+
return ((0, jsx_runtime_1.jsx)("div", { className: "fixed inset-0 z-50 flex items-end 2xs:items-center justify-center bg-black/50 backdrop-blur-sm font-mono", children: (0, jsx_runtime_1.jsx)("div", { className: "relative w-full max-w-2xl mx-0 2xs:mx-3 xs:mx-4 max-h-[95vh] 2xs:max-h-[90vh] overflow-y-auto rounded-t-2xl 2xs:rounded-xl", children: (0, jsx_runtime_1.jsxs)(terminal_1.TerminalCard, { filename: "mining_request.json", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-4 2xs:mb-5 xs:mb-6", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h2", { className: "text-base 2xs:text-lg xs:text-xl font-bold text-white mb-1", children: t("title") }), (0, jsx_runtime_1.jsx)("p", { className: "text-[10px] 2xs:text-xs text-neutral-400 tracking-wider", children: t("subtitle") })] }), (0, jsx_runtime_1.jsx)("button", { onClick: handleClose, disabled: loading, className: "text-neutral-400 hover:text-white transition-colors p-1 min-w-[44px] min-h-[44px] flex items-center justify-center", children: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "w-5 h-5" }) })] }), showCloseConfirm && ((0, jsx_runtime_1.jsx)("div", { className: "fixed inset-0 z-[60] flex items-center justify-center bg-black/70 backdrop-blur-sm p-4", children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border-2 border-red-500/60 rounded-xl p-5 max-w-md w-full space-y-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-start gap-3", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.AlertTriangle, { className: "w-6 h-6 text-red-400 flex-shrink-0 mt-0.5" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-white font-bold text-lg mb-2", children: t("closeWarningTitle") }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-300 text-sm leading-relaxed", children: t("closeWarningBody") })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-3", children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => setShowCloseConfirm(false), className: "flex-1 px-4 py-3 bg-cyan-700 hover:bg-cyan-600 text-white rounded transition-colors font-bold", children: t("closeWarningStay") }), (0, jsx_runtime_1.jsx)("button", { onClick: performClose, className: "flex-1 px-4 py-3 border border-red-500/60 text-red-400 hover:bg-red-500/10 rounded transition-colors", children: t("closeWarningLeave") })] })] }) })), step === "input" && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [ratioInfo && ((0, jsx_runtime_1.jsx)("div", { className: "p-3 rounded bg-neutral-800 border border-neutral-700", children: (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-3 gap-4 text-sm", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t("currentPhase") }), (0, jsx_runtime_1.jsxs)("div", { className: "text-white font-bold font-mono", children: ["Phase ", ratioInfo.current_stage] })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1 flex items-center gap-1", children: [t("techBonus"), (0, jsx_runtime_1.jsx)("span", { className: "cursor-help text-neutral-500 hover:text-cyan-400", title: t("techBonusTooltip"), children: "?" })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-cyan-400 font-bold font-mono", children: "0%" })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t("mintPrice") }), (0, jsx_runtime_1.jsxs)("div", { className: "text-cyan-400 font-bold font-mono", children: ["1 MCC \u2248 ", (ratioInfo.usdc_per_mcc * 4).toFixed(2), " USD"] })] })] }) })), (0, jsx_runtime_1.jsx)("div", { className: "p-4 rounded bg-cyan-400/20 border border-cyan-400/50", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-start gap-3", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.AlertCircle, { className: "w-5 h-5 text-cyan-400 flex-shrink-0 mt-0.5" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-cyan-400 font-bold text-sm mb-1", children: t("solanaOnly") }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-300 text-xs leading-relaxed", children: t("solanaOnlyDescMining") })] })] }) }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("label", { className: "block text-xs text-neutral-400 tracking-wider mb-2", children: [t("paymentMethod"), " ", (0, jsx_runtime_1.jsxs)("span", { className: "text-cyan-400", children: ["(", t("paymentMethodHint"), ")"] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "relative", children: [(0, jsx_runtime_1.jsxs)("button", { type: "button", onClick: () => setShowStablecoinDropdown(!showStablecoinDropdown), className: "w-full px-4 py-3 bg-neutral-800 border border-neutral-600 rounded text-white flex items-center justify-between hover:border-neutral-500 transition-colors", children: [(0, jsx_runtime_1.jsxs)("span", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("span", { children: ci.icon }), (0, jsx_runtime_1.jsx)("span", { children: ci.symbol }), (0, jsx_runtime_1.jsxs)("span", { className: "text-neutral-400 text-sm", children: ["(", ci.name, ")"] })] }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { className: `w-4 h-4 transition-transform ${showStablecoinDropdown ? 'rotate-180' : ''}` })] }), showStablecoinDropdown && ((0, jsx_runtime_1.jsx)("div", { className: "absolute z-10 w-full mt-1 bg-neutral-900 border border-neutral-700 rounded shadow-lg", children: Object.keys(COIN_INFO).map(type => ((0, jsx_runtime_1.jsxs)("button", { type: "button", onClick: () => { setStablecoin(type); setShowStablecoinDropdown(false); }, className: `w-full px-4 py-3 text-left flex items-center gap-2 hover:bg-neutral-800 transition-colors ${stablecoin === type ? 'bg-neutral-800 text-cyan-400' : 'text-white'}`, children: [(0, jsx_runtime_1.jsx)("span", { children: COIN_INFO[type].icon }), (0, jsx_runtime_1.jsx)("span", { children: COIN_INFO[type].symbol }), (0, jsx_runtime_1.jsxs)("span", { className: "text-neutral-400 text-sm", children: ["(", COIN_INFO[type].name, ")"] })] }, type))) }))] }), connected && ((0, jsx_runtime_1.jsxs)("div", { className: "mt-2 flex items-center justify-between text-xs", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-neutral-400", children: t("stablecoinEqual") }), (0, jsx_runtime_1.jsx)("span", { className: `font-medium ${stablecoinBalance === null ? 'text-neutral-400' : stablecoinBalance === 0 ? 'text-red-400' : 'text-white'}`, children: loadingBalance ? t("loading") : stablecoinBalance === null ? t("balanceUnknown") : t("balance", { amount: stablecoinBalance.toFixed(2), symbol: ci.symbol }) })] }))] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { className: "block text-xs text-neutral-400 tracking-wider mb-2", children: t("mintAmountLabel", { symbol: "MCC" }) }), (0, jsx_runtime_1.jsx)("input", { type: "number", inputMode: "decimal", value: mccAmount, onChange: e => setMccAmount(e.target.value), placeholder: t("inputPlaceholder", { symbol: "MCC" }), className: "w-full px-3 2xs:px-4 py-3 bg-neutral-800 border border-neutral-600 rounded text-white placeholder-neutral-400 focus:outline-none focus:border-cyan-400 text-base", min: "0", step: "0.01" })] }), mccAmount && parseFloat(mccAmount) > 0 && ratioInfo && ((0, jsx_runtime_1.jsxs)("div", { className: "p-4 rounded bg-cyan-400/20 border border-cyan-400/50 space-y-3", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-2", children: t("estimatedPayment") }), (0, jsx_runtime_1.jsxs)("div", { className: "text-2xl font-bold text-cyan-400 font-mono", children: [(parseFloat(mccAmount) * ratioInfo.usdc_per_mcc * 4).toFixed(2), " ", ci.symbol] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "pt-3 border-t border-cyan-400/30", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex justify-between items-center", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400 tracking-wider", children: t("youWillReceive") }), (0, jsx_runtime_1.jsxs)("span", { className: "text-lg font-bold text-white font-mono", children: [parseFloat(mccAmount).toFixed(4), " MCC"] })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 mt-1", children: t("mccToWallet") })] })] })), error && (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 p-3 rounded bg-red-500/20 border border-red-500/50 text-red-500 text-sm", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.AlertCircle, { className: "w-4 h-4" }), error] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-3", children: [(0, jsx_runtime_1.jsx)("button", { onClick: handleClose, className: "flex-1 px-4 py-3 border border-neutral-700 text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent rounded transition-colors", children: t("cancel") }), (0, jsx_runtime_1.jsxs)("button", { onClick: handleSubmit, disabled: loading || !mccAmount || parseFloat(mccAmount) <= 0, className: "flex-1 px-4 py-3 bg-cyan-700 hover:bg-cyan-600 text-white rounded transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2", children: [loading && (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "w-4 h-4 animate-spin" }), loading ? t("processing") : t("confirmMint")] })] })] })), step === "paymentMethod" && miningRequest && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsx)(OrderSummary, {}), (0, jsx_runtime_1.jsx)("div", { className: "p-3 rounded bg-cyan-500/10 border border-cyan-500/30 text-xs text-cyan-300", children: t("stablecoinReminder", { symbol: ci.symbol }) }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider uppercase mb-1", children: t("selectPaymentMethod") }), (0, jsx_runtime_1.jsx)("button", { onClick: handleSelectQrPayment, className: "w-full p-4 rounded border-2 border-cyan-400/50 bg-cyan-400/5 hover:bg-cyan-400/10 hover:border-cyan-400/70 transition-all text-left group", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-12 h-12 rounded-lg bg-cyan-400/20 flex items-center justify-center flex-shrink-0", children: (0, jsx_runtime_1.jsx)(lucide_react_1.QrCode, { className: "w-6 h-6 text-cyan-400" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-white font-bold text-sm", children: t("mobileQrScan") }), (0, jsx_runtime_1.jsx)("span", { className: "px-1.5 py-0.5 rounded text-[10px] font-bold bg-cyan-400/20 text-cyan-400 tracking-wider", children: t("recommended") })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-400 text-xs mt-1 leading-relaxed", children: t("mobileQrDesc") })] }), (0, jsx_runtime_1.jsx)(lucide_react_1.Smartphone, { className: "w-5 h-5 text-neutral-500 group-hover:text-cyan-400 transition-colors flex-shrink-0" })] }) }), (0, jsx_runtime_1.jsx)("button", { onClick: handleSelectBrowserPayment, disabled: !connected, className: "w-full p-4 rounded border border-neutral-700 bg-neutral-800/50 hover:bg-neutral-800 hover:border-neutral-600 transition-all text-left group disabled:opacity-40 disabled:cursor-not-allowed", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-12 h-12 rounded-lg bg-neutral-700/50 flex items-center justify-center flex-shrink-0", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Monitor, { className: "w-6 h-6 text-neutral-400" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-2", children: (0, jsx_runtime_1.jsx)("span", { className: "text-neutral-300 font-bold text-sm", children: t("browserExtension") }) }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-500 text-xs mt-1 leading-relaxed", children: connected ? t("browserExtConnected") : t("browserExtNotConnected") })] })] }) }), error && (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 p-3 rounded bg-red-500/20 border border-red-500/50 text-red-500 text-sm", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.AlertCircle, { className: "w-4 h-4" }), error] }), (0, jsx_runtime_1.jsxs)("button", { onClick: () => { setStep("input"); setError(""); }, className: "w-full px-4 py-2 text-neutral-400 hover:text-neutral-300 text-sm transition-colors", children: ["\u2190 ", t("goBack")] })] })), step === "qrPayment" && miningRequest && solanaPayUrl && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-3 2xs:space-y-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "p-3 rounded bg-amber-500/15 border-2 border-amber-500/50 flex items-start gap-2 animate-pulse-warning", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.AlertTriangle, { className: "w-5 h-5 text-amber-400 flex-shrink-0 mt-0.5 animate-pulse" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-amber-400 font-bold text-sm mb-1", children: t("doNotClose") }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-300 text-xs leading-relaxed", children: t("doNotCloseDesc") })] })] }), (0, jsx_runtime_1.jsx)(OrderSummary, {}), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-2", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between text-xs", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-neutral-400 tracking-wider", children: statusLabel() }), (0, jsx_runtime_1.jsxs)("span", { className: "text-neutral-500 font-mono", children: [pollElapsedSec, "s"] })] }), (0, jsx_runtime_1.jsx)("div", { className: "h-2 w-full rounded-full bg-neutral-800 overflow-hidden", children: (0, jsx_runtime_1.jsx)("div", { className: "h-full bg-gradient-to-r from-cyan-500 to-cyan-300 transition-all duration-500 ease-out", style: { width: `${statusProgress()}%` } }) }), (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-4 gap-1 text-[10px] text-neutral-500", children: [(0, jsx_runtime_1.jsx)("div", { className: `text-center ${backendStatus !== "created" ? "text-cyan-400 font-bold" : ""}`, children: t("stepScan") }), (0, jsx_runtime_1.jsx)("div", { className: `text-center ${backendStatus === "submitted" || backendStatus === "distributing" || backendStatus === "completed" ? "text-cyan-400 font-bold" : ""}`, children: t("stepPaid") }), (0, jsx_runtime_1.jsx)("div", { className: `text-center ${backendStatus === "distributing" || backendStatus === "completed" ? "text-cyan-400 font-bold" : ""}`, children: t("stepDistributing") }), (0, jsx_runtime_1.jsx)("div", { className: `text-center ${backendStatus === "completed" ? "text-cyan-400 font-bold" : ""}`, children: t("stepDone") })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center space-y-3 2xs:space-y-4", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-neutral-400 text-xs 2xs:text-sm text-center", children: t("scanQrToPayDesktop") }), (0, jsx_runtime_1.jsx)("div", { className: "bg-white p-3 2xs:p-4 xs:p-5 rounded-xl", children: (0, jsx_runtime_1.jsx)(qrcode_react_1.QRCodeSVG, { value: solanaPayUrl, size: 200, level: "H", includeMargin: false, className: "w-[160px] h-[160px] 2xs:w-[180px] 2xs:h-[180px] xs:w-[220px] xs:h-[220px] sm:w-[280px] sm:h-[280px]", imageSettings: { src: "/mcc-logo-40.png", x: undefined, y: undefined, height: 40, width: 40, excavate: true } }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 text-neutral-400 text-[10px] 2xs:text-xs", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "w-3 h-3 animate-spin" }), backendStatus === "created" ? t("waitingQrScan") : t("monitoringOnchain")] })] }), (0, jsx_runtime_1.jsxs)("button", { onClick: () => { stopStatusPolling(); setStep(isMobile ? "input" : "paymentMethod"); setError(""); }, className: "w-full px-4 py-2 text-neutral-400 hover:text-neutral-300 text-xs 2xs:text-sm transition-colors min-h-[44px]", children: ["\u2190 ", t("goBack")] })] })), step === "payment" && miningRequest && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsx)(terminal_1.TerminalBadge, { variant: "info", children: t("waitingPayment") }), (0, jsx_runtime_1.jsx)(OrderSummary, {}), (0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center py-8", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "w-8 h-8 animate-spin text-cyan-400" }) }), (0, jsx_runtime_1.jsx)("p", { className: "text-center text-neutral-400 text-sm", children: t("processingTransfer", { symbol: ci.symbol }) })] })), step === "confirming" && txSignature && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsx)(terminal_1.TerminalBadge, { variant: "warning", children: t("verifying") }), (0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center py-8", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "w-8 h-8 animate-spin text-cyan-400" }) }), (0, jsx_runtime_1.jsx)("p", { className: "text-center text-neutral-400 text-sm mb-2", children: t("verifyingTransaction") }), (0, jsx_runtime_1.jsxs)("div", { className: "p-3 rounded bg-neutral-800 border border-neutral-700", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t("txSignature") }), (0, jsx_runtime_1.jsxs)("div", { className: "font-mono text-xs text-cyan-400 break-all", children: [txSignature.slice(0, 16), "...", txSignature.slice(-16)] }), (0, jsx_runtime_1.jsx)("div", { className: "mt-2", children: (0, jsx_runtime_1.jsx)(TxLink, { sig: txSignature, label: t("viewOnExplorer") }) })] })] })), step === "success" && confirmationResult && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center py-8", children: (0, jsx_runtime_1.jsx)("div", { className: "w-16 h-16 rounded-full bg-white/10 flex items-center justify-center", children: (0, jsx_runtime_1.jsx)(lucide_react_1.CheckCircle2, { className: "w-8 h-8 text-white" }) }) }), (0, jsx_runtime_1.jsx)("h3", { className: "text-xl font-bold text-center text-white", children: t("mintSuccess") }), (0, jsx_runtime_1.jsxs)("div", { className: "p-4 rounded bg-white/10 border border-neutral-700 space-y-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t("youReceived") }), (0, jsx_runtime_1.jsxs)("div", { className: "text-3xl font-bold text-white font-mono", children: ["+", (confirmationResult.mcc_distributed.user / 1000000000).toLocaleString(), " MCC"] }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 mt-1", children: t("sentToWallet") })] }), txSignature && ((0, jsx_runtime_1.jsxs)("div", { className: "pt-3 border-t border-neutral-700", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t("paymentTx", { symbol: ci.symbol }) }), (0, jsx_runtime_1.jsx)(TxLink, { sig: txSignature })] }))] }), confirmationResult.onchain_tx_signature && ((0, jsx_runtime_1.jsxs)("div", { className: "p-4 rounded bg-neutral-800 border border-neutral-700 space-y-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider", children: t("onchainDistribution") }), (0, jsx_runtime_1.jsx)(TxLink, { sig: confirmationResult.onchain_tx_signature })] })), (0, jsx_runtime_1.jsx)("div", { className: "flex gap-3", children: (0, jsx_runtime_1.jsx)("button", { onClick: performClose, className: "flex-1 px-4 py-3 bg-cyan-700 hover:bg-cyan-600 text-white rounded transition-colors", children: t("doneAndRefresh") }) })] })), step === "error" && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center py-8", children: (0, jsx_runtime_1.jsx)("div", { className: "w-16 h-16 rounded-full bg-red-500/20 flex items-center justify-center", children: (0, jsx_runtime_1.jsx)(lucide_react_1.AlertCircle, { className: "w-8 h-8 text-red-500" }) }) }), (0, jsx_runtime_1.jsx)("h3", { className: "text-xl font-bold text-center text-red-500", children: t("mintFailed") }), (0, jsx_runtime_1.jsx)("div", { className: "p-4 rounded bg-red-500/20 border border-red-500/50", children: (0, jsx_runtime_1.jsx)("p", { className: "text-red-500 text-sm whitespace-pre-line", children: error }) }), (0, jsx_runtime_1.jsx)("button", { onClick: () => { setStep("input"); setError(""); }, className: "w-full px-4 py-3 border border-neutral-700 text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent rounded transition-colors", children: t("back") })] }))] }) }) }));
|
|
344
384
|
}
|