feat(wallet): Lightning gets the arrival screen; copy buttons unified
Demo images / Build & push demo images (push) Successful in 3m27s
Demo images / Build & push demo images (push) Successful in 3m27s
- lnd.createinvoice now returns r_hash_hex; new lnd.invoicestatus RPC looks the invoice up (SETTLED + amt_paid_sat). E2E-verified on this box: real invoice minted, status polls settled:false until paid. - Receive modal: Lightning polls settlement every 3s and flips to the on-chain-style success view — straight to the green check + amount (no broadcast step; settlement is final). Raw bolt11 text removed: QR + CopyButton only. State fully reset per open/close. - CopyButton is now the wallet's only copy affordance: the ark-address and ecash-token holdouts swapped in, their ad-hoc handlers deleted. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Fable 5
parent
a0bd9e53f8
commit
ced95a60d1
@@ -133,6 +133,7 @@ impl RpcHandler {
|
||||
"lnd.sendcoins" => self.handle_lnd_sendcoins(params).await,
|
||||
"lnd.estimatefee" => self.handle_lnd_estimatefee(params).await,
|
||||
"lnd.createinvoice" => self.handle_lnd_createinvoice(params).await,
|
||||
"lnd.invoicestatus" => self.handle_lnd_invoicestatus(params).await,
|
||||
"lnd.payinvoice" => self.handle_lnd_payinvoice(params).await,
|
||||
"lnd.paymentstatus" => self.handle_lnd_paymentstatus(params).await,
|
||||
"lnd.create-psbt" => self.handle_lnd_create_psbt(params).await,
|
||||
|
||||
@@ -607,9 +607,77 @@ impl RpcHandler {
|
||||
.unwrap_or("")
|
||||
.to_string();
|
||||
|
||||
// LND returns r_hash base64-encoded; the lookup endpoint the Receive
|
||||
// flow polls (`lnd.invoicestatus`) wants it hex — hand the UI the
|
||||
// ready-to-use form.
|
||||
let r_hash_hex = {
|
||||
use base64::Engine as _;
|
||||
body.get("r_hash")
|
||||
.and_then(|v| v.as_str())
|
||||
.and_then(|b64| base64::engine::general_purpose::STANDARD.decode(b64).ok())
|
||||
.map(hex::encode)
|
||||
.unwrap_or_default()
|
||||
};
|
||||
|
||||
Ok(serde_json::json!({
|
||||
"payment_request": payment_request,
|
||||
"amount_sats": amount_sats,
|
||||
"r_hash_hex": r_hash_hex,
|
||||
}))
|
||||
}
|
||||
|
||||
/// lnd.invoicestatus — is this invoice settled yet? Polled by the wallet's
|
||||
/// Receive flow so a Lightning payment gets the same "money has arrived"
|
||||
/// success screen as on-chain (minus the broadcast step: settlement is
|
||||
/// final). Params: `{ "r_hash_hex": string }`.
|
||||
pub(in crate::api::rpc) async fn handle_lnd_invoicestatus(
|
||||
&self,
|
||||
params: Option<serde_json::Value>,
|
||||
) -> Result<serde_json::Value> {
|
||||
let params = params.ok_or_else(|| anyhow::anyhow!("Missing params"))?;
|
||||
let r_hash_hex = params
|
||||
.get("r_hash_hex")
|
||||
.and_then(|v| v.as_str())
|
||||
.ok_or_else(|| anyhow::anyhow!("Missing 'r_hash_hex' parameter"))?;
|
||||
if r_hash_hex.len() != 64 || !r_hash_hex.chars().all(|c| c.is_ascii_hexdigit()) {
|
||||
return Err(anyhow::anyhow!("r_hash_hex must be 64 hex characters"));
|
||||
}
|
||||
|
||||
let (client, macaroon_hex) = self.lnd_client().await?;
|
||||
let resp = client
|
||||
.get(format!("{LND_REST_BASE_URL}/v1/invoice/{r_hash_hex}"))
|
||||
.header("Grpc-Metadata-macaroon", &macaroon_hex)
|
||||
.send()
|
||||
.await
|
||||
.context("Failed to query invoice")?;
|
||||
let status = resp.status();
|
||||
let body: serde_json::Value = resp
|
||||
.json()
|
||||
.await
|
||||
.context("Failed to parse invoice lookup response")?;
|
||||
if !status.is_success() {
|
||||
let msg = body
|
||||
.get("message")
|
||||
.and_then(|v| v.as_str())
|
||||
.unwrap_or("Unknown error");
|
||||
return Err(anyhow::anyhow!("Invoice lookup failed: {}", msg));
|
||||
}
|
||||
|
||||
let settled = body
|
||||
.get("state")
|
||||
.and_then(|v| v.as_str())
|
||||
.map(|s| s == "SETTLED")
|
||||
.unwrap_or_else(|| body.get("settled").and_then(|v| v.as_bool()).unwrap_or(false));
|
||||
let amt_paid_sat = body
|
||||
.get("amt_paid_sat")
|
||||
.and_then(|v| v.as_str())
|
||||
.and_then(|s| s.parse::<i64>().ok())
|
||||
.or_else(|| body.get("amt_paid_sat").and_then(|v| v.as_i64()))
|
||||
.unwrap_or(0);
|
||||
|
||||
Ok(serde_json::json!({
|
||||
"settled": settled,
|
||||
"amt_paid_sat": amt_paid_sat,
|
||||
}))
|
||||
}
|
||||
|
||||
|
||||
@@ -21,11 +21,25 @@
|
||||
<label class="text-white/60 text-sm block mb-1">{{ t('receiveBitcoin.memoOptional') }}</label>
|
||||
<input v-model="invoiceMemo" type="text" :placeholder="t('receiveBitcoin.memoPlaceholder')" class="w-full input-glass" />
|
||||
</div>
|
||||
<div v-if="invoiceResult" class="mb-3 p-3 bg-white/5 rounded-lg text-center">
|
||||
<!-- Paid: the invoice did its job — straight to the green check
|
||||
(no broadcast step: Lightning settlement is final) -->
|
||||
<div v-if="invoicePaid" class="mb-3 p-6 bg-white/5 rounded-lg text-center">
|
||||
<div class="flex justify-center mb-4">
|
||||
<div class="w-16 h-16 rounded-full flex items-center justify-center bg-green-500/15">
|
||||
<svg class="w-8 h-8 text-green-400" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="2">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7" />
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-lg font-semibold text-white mb-1">{{ t('receiveBitcoin.paymentConfirmed') }}</p>
|
||||
<p v-if="invoicePaid.amountSats > 0" class="text-2xl font-semibold text-white/95 mb-2">
|
||||
{{ invoicePaid.amountSats.toLocaleString() }} sats
|
||||
</p>
|
||||
</div>
|
||||
<div v-else-if="invoiceResult" class="mb-3 p-3 bg-white/5 rounded-lg text-center">
|
||||
<canvas ref="lightningQrCanvas" class="mx-auto mb-3 rounded-lg" style="image-rendering: pixelated;"></canvas>
|
||||
<p class="text-white/50 text-xs mb-1">{{ t('receiveBitcoin.invoiceShareLabel') }}</p>
|
||||
<p class="text-xs font-mono text-white/80 break-all">{{ invoiceResult }}</p>
|
||||
<CopyButton :value="invoiceResult" :label="t('common.copy')" class="mt-2" />
|
||||
<p class="text-white/50 text-xs mb-2">{{ t('receiveBitcoin.invoiceShareLabel') }}</p>
|
||||
<CopyButton :value="invoiceResult" :label="t('common.copy')" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -147,6 +161,9 @@ watch(() => props.show, (open) => {
|
||||
return
|
||||
}
|
||||
paymentSeen.value = null
|
||||
invoicePaid.value = null
|
||||
invoiceRHash.value = ''
|
||||
stopWatchingInvoice()
|
||||
// Blank slate on every open: a leftover amount/memo/token or a previous
|
||||
// invoice quietly carrying into a new receive flow is exactly the stale-
|
||||
// state class the operator flagged on the send modal (2026-08-05).
|
||||
@@ -238,6 +255,46 @@ async function checkForPayment() {
|
||||
|
||||
onUnmounted(stopWatchingPayment)
|
||||
|
||||
// Lightning settlement watch — the on-chain pattern minus the broadcast
|
||||
// step: an invoice is either open or SETTLED (final), so the success view
|
||||
// goes straight to the green check.
|
||||
const invoicePaid = ref<null | { amountSats: number }>(null)
|
||||
const invoiceRHash = ref('')
|
||||
let invoiceTimer: ReturnType<typeof setInterval> | null = null
|
||||
|
||||
function stopWatchingInvoice() {
|
||||
if (invoiceTimer) {
|
||||
clearInterval(invoiceTimer)
|
||||
invoiceTimer = null
|
||||
}
|
||||
}
|
||||
|
||||
function startWatchingInvoice() {
|
||||
stopWatchingInvoice()
|
||||
invoiceTimer = setInterval(() => void checkInvoice(), 3000)
|
||||
}
|
||||
|
||||
async function checkInvoice() {
|
||||
if (!props.show || !invoiceRHash.value) {
|
||||
stopWatchingInvoice()
|
||||
return
|
||||
}
|
||||
try {
|
||||
const res = await rpcClient.call<{ settled: boolean; amt_paid_sat: number }>({
|
||||
method: 'lnd.invoicestatus',
|
||||
params: { r_hash_hex: invoiceRHash.value },
|
||||
})
|
||||
if (!res.settled) return
|
||||
invoicePaid.value = { amountSats: res.amt_paid_sat || invoiceAmount.value }
|
||||
stopWatchingInvoice()
|
||||
emit('received')
|
||||
} catch {
|
||||
// Transient poll failure — keep watching.
|
||||
}
|
||||
}
|
||||
|
||||
onUnmounted(stopWatchingInvoice)
|
||||
|
||||
async function renderQr(data: string, canvas: HTMLCanvasElement | null, prefix = '') {
|
||||
if (!canvas || !data) return
|
||||
try {
|
||||
@@ -272,11 +329,14 @@ async function receive() {
|
||||
// lnd.createinvoice fail with connection-refused (FED-08 follow-up).
|
||||
if (!(await lightning.requireLightningReady('receive'))) return
|
||||
if (!invoiceAmount.value) { error.value = t('receiveBitcoin.enterAnAmount'); return }
|
||||
const res = await rpcClient.call<{ payment_request: string }>({
|
||||
const res = await rpcClient.call<{ payment_request: string; r_hash_hex?: string }>({
|
||||
method: 'lnd.createinvoice',
|
||||
params: { amount_sats: invoiceAmount.value, memo: invoiceMemo.value || undefined },
|
||||
})
|
||||
invoiceResult.value = res.payment_request
|
||||
invoiceRHash.value = res.r_hash_hex || ''
|
||||
invoicePaid.value = null
|
||||
if (invoiceRHash.value) startWatchingInvoice()
|
||||
nextTick(() => renderQr(res.payment_request, lightningQrCanvas.value, 'lightning:'))
|
||||
} else if (receiveMethod.value === 'onchain') {
|
||||
const res = await rpcClient.call<{ address: string }>({ method: 'lnd.newaddress' })
|
||||
|
||||
@@ -227,7 +227,7 @@
|
||||
<canvas ref="tokenQrCanvas" class="rounded-lg bg-white p-2"></canvas>
|
||||
</div>
|
||||
<p class="text-xs font-mono text-white/80 break-all">{{ ecashToken }}</p>
|
||||
<button @click="copyText(ecashToken)" class="mt-2 text-xs text-orange-400 hover:text-orange-300">{{ t('common.copy') }}</button>
|
||||
<CopyButton :value="ecashToken" :label="t('common.copy')" size="sm" class="mt-2" />
|
||||
</div>
|
||||
|
||||
<div v-if="error" class="mb-3 alert-error">{{ error }}</div>
|
||||
@@ -604,10 +604,6 @@ function sendAnother() {
|
||||
error.value = ''
|
||||
}
|
||||
|
||||
function copyText(text: string) {
|
||||
navigator.clipboard.writeText(text).catch(() => {})
|
||||
}
|
||||
|
||||
const tokenQrCanvas = ref<HTMLCanvasElement | null>(null)
|
||||
watch(ecashToken, async (token) => {
|
||||
if (!token) return
|
||||
|
||||
@@ -202,11 +202,7 @@
|
||||
</div>
|
||||
<div v-if="arkAddress" class="mt-2 flex items-center gap-2 p-3 bg-white/5 rounded-lg">
|
||||
<span class="text-xs font-mono text-white/90 break-all flex-1">{{ arkAddress }}</span>
|
||||
<button @click="copyArkAddress" class="p-2 rounded-lg hover:bg-white/10 text-white/50 hover:text-white shrink-0" :title="arkCopied ? 'Copied' : 'Copy'">
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" />
|
||||
</svg>
|
||||
</button>
|
||||
<CopyButton :value="arkAddress" icon-only class="shrink-0" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -277,6 +273,7 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import CopyButton from '@/components/CopyButton.vue'
|
||||
import { computed, ref, watch } from 'vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { rpcClient } from '@/api/rpc-client'
|
||||
@@ -349,7 +346,6 @@ const arkStatus = ref<ArkStatus | null>(null)
|
||||
const arkBalance = ref<ArkBalance | null>(null)
|
||||
const arkConfig = ref({ network: 'signet', ark_server: '', esplora: '' })
|
||||
const arkAddress = ref('')
|
||||
const arkCopied = ref(false)
|
||||
const loadingArk = ref(false)
|
||||
const savingArk = ref(false)
|
||||
const arkBoarding = ref(false)
|
||||
@@ -505,22 +501,11 @@ async function fetchArkAddress(onchain: boolean) {
|
||||
params: { onchain },
|
||||
})
|
||||
arkAddress.value = res.address
|
||||
arkCopied.value = false
|
||||
} catch (err: unknown) {
|
||||
arkError.value = err instanceof Error ? err.message : 'Failed to get address'
|
||||
}
|
||||
}
|
||||
|
||||
async function copyArkAddress() {
|
||||
if (!arkAddress.value) return
|
||||
try {
|
||||
await navigator.clipboard.writeText(arkAddress.value)
|
||||
arkCopied.value = true
|
||||
} catch {
|
||||
/* clipboard unavailable (http) — the address is selectable */
|
||||
}
|
||||
}
|
||||
|
||||
async function boardArk() {
|
||||
arkBoarding.value = true
|
||||
arkError.value = ''
|
||||
|
||||
Reference in New Issue
Block a user