adds invoice description and address to swap page

[bordalix]

Summary by CodeRabbit

New Features

• Enhanced swap details display with additional information fields
• Added "Description" field showing invoice notes for greater transparency
• Added "Address" field displaying relevant transaction addresses based on swap type
• Improved organization of swap amount and total information for clearer data presentation

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

Walkthrough

This PR enhances the Boltz Swap component by introducing computed fields for refund status, address, total, and amount values. It refactors invoice handling and adds new UI data rows for Description and Address, without modifying control flow or error handling logic.

Changes

Cohort / File(s)	Summary
Boltz Swap UI Enhancements src/screens/Apps/Boltz/Swap.tsx	Added computed field refunded to track non-reverse refunded swaps; introduced derived fields address, total, and amount based on swap direction; refactored invoice initialization; added Description and Address data rows to display invoice notes and swap addresses.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

• Verify derived field logic correctly maps values based on swap direction (reverse vs. non-reverse)
• Confirm new data rows handle fallback values appropriately for missing invoice note or address data
• Check that reordering of declarations doesn't introduce unintended dependencies

Possibly related PRs

• UI tweaks on refunded failed submarine swaps #207 — Adds refunded state handling and UI elements in Boltz Swap component
• add buttons to swap page #186 — Modifies Boltz Swap component with refundable/claimable state logic and button handlers

Suggested reviewers

• michael1011

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run @coderabbitai generate docstrings to improve docstring coverage.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately summarizes the main changes: adding invoice description and address fields to the swap page display.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch more_info_on_swap_page

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[cloudflare-workers-and-pages]

Deploying wallet-bitcoin with    Cloudflare Pages

Latest commit:	40cc851
Status:	✅  Deploy successful!
Preview URL:	https://56553384.wallet-bitcoin.pages.dev
Branch Preview URL:	https://more-info-on-swap-page.wallet-bitcoin.pages.dev

View logs

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (1)

src/screens/Apps/Boltz/Swap.tsx (1)

43-46: Consider caching decodeInvoice result to avoid redundant parsing.

For submarine swaps, decodeInvoice(invoice) is called twice: once on line 46 to extract amountSats and again on line 54 to extract note. Consider decoding the invoice once and storing the result.

Apply this diff to optimize:

  const isReverse = swapInfo.type === 'reverse'
  
  const refunded = !isReverse && swapInfo.refunded
  const kind = isReverse ? 'Reverse Swap' : 'Submarine Swap'
  const direction = isReverse ? 'Lightning to Arkade' : 'Arkade to Lightning'
  const invoice = isReverse ? swapInfo.response.invoice : swapInfo.request.invoice
+ const decoded = decodeInvoice(invoice)
  const address = isReverse ? swapInfo.response.lockupAddress : swapInfo.response.address
  const total = isReverse ? swapInfo.request.invoiceAmount : swapInfo.response.expectedAmount
- const amount = isReverse ? swapInfo.response.onchainAmount : decodeInvoice(invoice).amountSats
+ const amount = isReverse ? swapInfo.response.onchainAmount : decoded.amountSats
  
  const formatAmount = (amt: number) => (config.showBalance ? prettyAmount(amt) : prettyHide(amt))
  
  const data = [
    ['When', prettyAgo(swapInfo.createdAt)],
    ['Kind', kind],
    ['Swap ID', swapInfo.response.id],
-   ['Description', decodeInvoice(invoice).note || 'N/A'],
+   ['Description', decoded.note || 'N/A'],
    ['Direction', direction],

Also applies to: 54-54

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between b0c1743 and 40cc851.

📒 Files selected for processing (1)

• src/screens/Apps/Boltz/Swap.tsx (1 hunks)

🧰 Additional context used

🧠 Learnings (1)

📚 Learning: 2025-07-07T14:41:35.991Z

Learnt from: bordalix
Repo: arkade-os/wallet PR: 106
File: src/lib/bolt11.ts:153-155
Timestamp: 2025-07-07T14:41:35.991Z
Learning: In src/lib/bolt11.ts, the code is copied from the original bitcoinjs/bolt11 library (https://github.com/bitcoinjs/bolt11/blob/master/payreq.js) and should be kept unchanged to maintain compatibility with the upstream source, even if there are potential improvements or syntax issues.

Applied to files:

• src/screens/Apps/Boltz/Swap.tsx

🧬 Code graph analysis (1)

src/screens/Apps/Boltz/Swap.tsx (2)

src/lib/bolt11.ts (1)

• decodeInvoice (19-29)

src/lib/format.ts (4)

• prettyAmount (27-34)
• prettyHide (69-74)
• prettyAgo (12-25)
• prettyDate (57-67)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)

• GitHub Check: test
• GitHub Check: Cloudflare Pages: wallet-bitcoin

🔇 Additional comments (3)

src/screens/Apps/Boltz/Swap.tsx (3)

44-44: LGTM! Address field correctly differentiates swap types.

The conditional logic properly handles both reverse swaps (using lockupAddress) and submarine swaps (using address), with an appropriate fallback to 'N/A'.

Also applies to: 59-59

---

40-40: LGTM! Refunded status computation is correct.

The logic correctly restricts refunded status to submarine swaps only.

---

46-46: I'll verify whether invoice validation happens upstream before decodeInvoice is called. Let me start by exploring the relevant code.
<function_calls>


#!/bin/bash

First, find the Swap.tsx file and examine the context around lines 46 and 54

fd -t f "Swap.tsx" | head -5


</function_calls>

Now let me examine the Swap.tsx file:
<function_calls>


#!/bin/bash

Get the file path for Swap.tsx

SWAP_FILE=$(fd -t f "Swap.tsx")

Check file size

wc -l "$SWAP_FILE"

Read lines around 46 and 54 to understand context

echo "=== Lines 30-70 of Swap.tsx ==="
sed -n '30,70p' "$SWAP_FILE"


</function_calls>

Now let me search for invoice validation and error handling patterns:
<function_calls>


#!/bin/bash

Search for bolt11.decode usage and error handling

echo "=== Looking for bolt11.decode and decodeInvoice usage ==="
rg -nP --type=ts -C5 'bolt11.decode|decodeInvoice' -g '!/node_modules/'

echo ""
echo "=== Looking for try-catch blocks around invoice handling ==="
rg -nP --type=ts -C3 'try\s*{' -g '!/node_modules/' | head -50


</function_calls>

Let me check the decodeInvoice function implementation and FlowContext:
<function_calls>


#!/bin/bash

Find where decodeInvoice is defined

echo "=== Searching for decodeInvoice definition ==="
rg -nP --type=ts 'export.*decodeInvoice|function decodeInvoice|const decodeInvoice' -g '!/node_modules/' -C5

echo ""
echo "=== Searching for FlowContext ==="
rg -nP --type=ts 'FlowContext|swapInfo' -g '!/node_modules/' -C3 | head -80


</function_calls>

Let me also search for invoice validation patterns:
<function_calls>


#!/bin/bash

Search for invoice validation or validation patterns

echo "=== Searching for invoice validation patterns ==="
rg -nP --type=ts 'invoice.*validat|validat.*invoice|invoice.*parse|isValidInvoice' -g '!/node_modules/' -C3 | head -100

echo ""
echo "=== Searching for error handling in swap-related code ==="
rg -nP --type=ts 'catch|Error' src/lib/bolt11.ts -C2 | head -50


</function_calls>

Let me examine the bolt11.ts file:
<function_calls>


#!/bin/bash

Check bolt11.ts size and content

wc -l src/lib/bolt11.ts

echo ""
echo "=== Checking for error handling in bolt11.ts ==="
rg -nP 'throw|Error|catch' src/lib/bolt11.ts -C2


</function_calls>

Now let me get a better understanding of the decodeInvoice function and where it's imported:
<function_calls>


#!/bin/bash

Find decodeInvoice import and usage in Swap.tsx

SWAP_FILE=$(fd -t f "Swap.tsx")
echo "=== Top 80 lines of Swap.tsx (includes imports) ==="
head -80 "$SWAP_FILE"


</function_calls>

Let me check the bolt11 file more carefully to understand error scenarios:
<function_calls>


#!/bin/bash

Read the complete bolt11.ts to understand error handling

head -200 src/lib/bolt11.ts


</function_calls>

Let me now search for how swapInfo is created and validated:
<function_calls>


#!/bin/bash

Search for swapInfo creation and validation in the context setup

echo "=== Searching for FlowContext usage and swapInfo initialization ==="
rg -nP 'swapInfo|createSwap|swap.*response' --type=ts -C3 -g '!/node_modules/' | head -150

echo ""
echo "=== Searching for error handling on swap creation ==="
rg -nP 'try|catch|Error' --type=ts src/context -C2 2>/dev/null | head -80


</function_calls>

Let me check if there's a try-catch around the swap info usage in Swap.tsx:
<function_calls>


#!/bin/bash

Get full context of Swap.tsx component

SWAP_FILE=$(fd -t f "Swap.tsx")
wc -l "$SWAP_FILE"

Read the entire file to understand error handling

cat -n "$SWAP_FILE" | head -200


</function_calls>

Now let me check for error boundaries and how swap operations are handled:
<function_calls>


#!/bin/bash

Search for error handling in Boltz swap flow

echo "=== Searching for try-catch in Boltz directory ==="
find . -path ./node_modules -prune -o -type d -name Boltz -print | xargs -I {} find {} -name ".tsx" -o -name ".ts" 2>/dev/null | head -10

echo ""
echo "=== Check for error boundaries and handlers ==="
rg -nP 'ErrorBoundary|try\s*{' --type=ts src/screens/Apps/Boltz -C2 2>/dev/null


</function_calls>

Let me verify if decodeInvoice is expected to handle malformed invoices or if validation happens before:
<function_calls>


#!/bin/bash

Search more specifically in Swap.tsx for the lines in question

SWAP_FILE=$(fd -t f "Swap.tsx")
echo "=== Lines 40-60 of Swap.tsx with context ==="
sed -n '40,60p' "$SWAP_FILE"

echo ""
echo "=== Check if there's error handling around the decodeInvoice calls ==="
sed -n '1,100p' "$SWAP_FILE" | grep -n "try|catch|Error|decodeInvoice"


</function_calls>

Let me check what happens when an invalid invoice reaches the component:
<function_calls>


#!/bin/bash

Search for where invoice parameter comes from in Swap.tsx

SWAP_FILE=$(fd -t f "Swap.tsx")

echo "=== Full context of Swap.tsx (up to line 100) ==="
head -100 "$SWAP_FILE"


</function_calls>

Let me execute these shell scripts to gather the necessary information:
<function_calls>


#!/bin/bash
set -e

Find and examine Swap.tsx

echo "=== Finding Swap.tsx ==="
SWAP_FILE=$(fd -t f "Swap.tsx" 2>/dev/null | head -1)
echo "File: $SWAP_FILE"

if [ -z "$SWAP_FILE" ]; then
echo "Swap.tsx not found, searching more broadly..."
fd -t f "Swap" --type file
exit 1
fi

echo ""
echo "=== File size ==="
wc -l "$SWAP_FILE"

echo ""
echo "=== Lines 1-60 (imports and initial code) ==="
head -60 "$SWAP_FILE"


</function_calls>