From 341bff4b4492ce22df11b50f2765bf10f51ea066 Mon Sep 17 00:00:00 2001 From: archipelago Date: Sun, 2 Aug 2026 18:19:34 -0400 Subject: [PATCH] feat(lnd-ui): rebuild the LND app UI with UmbrelOS feature parity MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The LND UI was a single scrolling page with a flat gradient instead of a background, a permanently-disabled "Wallet" card, and four tabs buried inside a Settings modal. Everything a node runner actually wants to see — routing revenue, peers, liquidity, activity — was absent. Rebuilt against the feature set of umbrelOS's Lightning Node and Bitcoin Node apps (getumbrel/umbrel-lightning, getumbrel/umbrel-bitcoin), rendered in Archipelago's own idiom rather than copying their visual design: - Real background. bg-web5.jpg was already being COPYd into the image by the Dockerfile and simply never referenced; it now drives the same perspective-layer + 0.8 overlay treatment bitcoin-ui uses. Paths stay relative because the app is served at / on :18083 but under /app/lnd/ when proxied by the host nginx, where absolute /assets 404s. - Glass cards with the masked gradient border, matching bitcoin-ui exactly. - Six top-level tabs (Overview / Channels / Activity / Insights / Connect / Settings) replacing the one-page scroll — umbrelOS's Home/Insights/ Settings dock, widened for Lightning. On mobile the bar becomes a fixed bottom dock with safe-area padding; on desktop it is a segmented control. - Overview: total/lightning/on-chain balances, a Max Send vs Max Receive liquidity bar (Umbrel's framing), and peers/channels/capacity/routing stat tiles. - Insights: routing revenue over 24h/7d/30d from /v1/fees, channel totals, network graph stats, and a sortable+filterable peers table with Umbrel's Tor/I2P/Local/Clearnet classification. - Activity: merged Lightning payments, settled invoices and on-chain transactions on one timeline, filterable by rail. - Connect: the existing lndconnect QR flow, plus a Node ID panel with the pubkey and advertised URI (umbrel's NodeIdModal). - sats/BTC unit switch persisted to localStorage (Umbrel's SatsBtcSwitch). Channel management deliberately links out to the existing Archipelago channels view at /apps/lnd/channels rather than being reimplemented here; this app only shows a read-only channel overview. Sync progress tracks the synced_to_chain/synced_to_graph booleans rather than inventing a block-based percentage, because LND exposes no IBD ratio. All data comes through the existing authenticated GET proxy at /proxy/lnd, so no backend, manifest or nginx change is required. Co-Authored-By: Claude Opus 5 (1M context) --- docker/lnd-ui/index.html | 1929 ++++++++++++++++++++++++++++---------- 1 file changed, 1412 insertions(+), 517 deletions(-) diff --git a/docker/lnd-ui/index.html b/docker/lnd-ui/index.html index 1ef7df93..9d534588 100644 --- a/docker/lnd-ui/index.html +++ b/docker/lnd-ui/index.html @@ -2,596 +2,1485 @@ - + + + LND - Archipelago -
+
- +
-
- LND +
+
+ LND +
+
+
+
+

LND

+ + + Connecting… + + +
+

Lightning Network Daemon for instant Bitcoin payments

+

—

+
+
+
+ + +
+ +
+
+
+ + + + + +
+
+ + + + + +
- -
-
-
-
-
- -
-
-

Node Status

-

—

+ +
+ +
+
+
+
+ +
+
+

Balance

+

Funds held by this node

+
-
- ⚡ -
+ +
+
+
Total
+
—
+
on-chain + lightning
+
+
+
⚡ Lightning
+
—
+
—
+
+
+
₿ On-chain
+
—
+
—
+
+
+ + +
+
+
+
Max Send
+
—
+
+
+
Max Receive
+
—
+
+
+
+
+
+
+

Outbound liquidity lets you send; inbound liquidity lets you receive.

+
+
+ + +
+
+

Connections

+

—

+

peers

+
+
+

Active Channels

+

—

+

—

+
+
+

Total Capacity

+

—

+

across all channels

+
+
+

Routing Earned

+

—

+

last 30 days

+
+
+ + +
+ +
+
+ +
+
+

Payment Channels

+

Open, manage and close channels

+
+ +
+ + +
+

Node Health

+
+
+ Synced to chain + — +
+
+ Synced to graph + — +
+
+ Block height + — +
+
+ Pending channels + — +
+
+
+
+
+ + +
+
+
+
+
+ +
+
+

Payment Channels

+

Full channel management — opening, balancing and closing — lives in the Archipelago channels view.

+
+
+ + Manage Channels + + +
+ +
+
+

Active

+

—

+
+
+

Inactive

+

—

+
+
+

Pending

+

—

+
+
+

Capacity

+

—

+
+
+
+ + +
+
+

Channel Overview

+ +
+
Loading channels…
+
+
+ + +
+
+
+
+

Activity

+

Recent Lightning payments, invoices and on-chain transactions.

+
+
+ + + +
+
+
Loading activity…
+
+
+ + +
+ +
+
+
+ +
+
+

Routing Revenue

+

Fees earned forwarding payments for the network.

+
+
+
+
+

Last 24 hours

+

—

+
+
+

Last 7 days

+

—

+
+
+

Last 30 days

+

—

+
+
+
+ + +
+
+

Sent

+

—

+

over channels

+
+
+

Received

+

—

+

over channels

+
+
+

Channel Updates

+

—

+

state transitions

+
+
+

Avg. Channel Age

+

—

+

since open

+
+
+ + +
+

Lightning Network

+

What this node sees of the public network graph.

+
+
+

Nodes

+

—

+
+

Channels

-

0

+

—

+
+
+

Network Capacity

+

—

+
+
+

Avg. Channel Size

+

—

- + + +
+
-

On-chain

-

—

+

Peers

+

Nodes this node holds a live connection to.

+
- -
-
-
-
-

REST API

-

—

-
-
- -
-
-
-
-
-

gRPC

-

—

-
-
- +
+ + + + + + + + + + + + + + +
Peer▼Network▼In/Out▼Ping▼Sent▼Received▼
Loading peers…
- -
-
-
- - - -
-
-

Wallet

-

Balance, Receive, and Send will appear here when connected to your node.

-
-
-
-
-

Spendable

-

—

-
-
-

Lightning

-

—

-
-
-

Total

-

—

-
-
-
- - -
-

Recent activity will be listed here.

-
+ +
+
+

Connect Your Wallet

+

Use a wallet like Zeus, Zap, or BlueWallet to connect remotely.

- -
-

Connect Your Wallet

-

Use a wallet like Zeus, Zap, or BlueWallet to connect remotely.

- - -
- -
- - -
-
-
Loading...
+
+
-
-
-
Host
-
- — - -
+ +
+
+
Loading…
-
+
-
Port
+
Host
- — -
-
-
Protocol
-
- — +
+
+
Port
+
+ — + +
+
+
+
Protocol
+
+ — +
+
- +
+ +
+ Scan the QR code with Zeus, Zap, or BlueWallet to connect. Tor mode is recommended for remote access — Local Network mode sends the macaroon unencrypted over your LAN.
-
- Scan the QR code with Zeus, Zap, or BlueWallet to connect. Tor mode recommended for remote access. + +
+

Node ID

+

Share this so other nodes can open a channel with you.

+
+
+
—
+
+
+
+
Public Key
+
+ — + +
+
+
+
Node URI
+
+ — + +
+

+
+
+
-
- -