From 67939f36041d667ecebfaa2e216b362c043b3c40 Mon Sep 17 00:00:00 2001
From: Daniel <sanchez.quiros.daniel@gmail.com>
Date: Mon, 22 Jun 2026 19:04:33 +0200
Subject: [PATCH] Add help buttons

---
 src/qml/controls/InfoButton.qml      | 59 ++++++++++++++++++++++++++++
 src/qml/icons/info.svg               |  1 +
 src/qml/views/AccountsView.qml       |  4 ++
 src/qml/views/ChannelDepositView.qml |  4 ++
 src/qml/views/LeaderRewardsView.qml  |  4 ++
 src/qml/views/TransferView.qml       | 16 ++++++--
 6 files changed, 84 insertions(+), 4 deletions(-)
 create mode 100644 src/qml/controls/InfoButton.qml
 create mode 100644 src/qml/icons/info.svg

diff --git a/src/qml/controls/InfoButton.qml b/src/qml/controls/InfoButton.qml
new file mode 100644
index 0000000..2b5b211
--- /dev/null
+++ b/src/qml/controls/InfoButton.qml
@@ -0,0 +1,59 @@
+import QtQuick
+import QtQuick.Controls
+
+import Logos.Theme
+import Logos.Controls
+
+// Small circled-"i" help button. Click to toggle a popup with `text`, a short
+// description of the operation. Styled to match the other SVG icon buttons.
+Item {
+    id: root
+
+    property string text: ""
+
+    implicitWidth: 28
+    implicitHeight: 28
+
+    Button {
+        id: btn
+        anchors.fill: parent
+        display: AbstractButton.IconOnly
+        flat: true
+        padding: 4
+        icon.source: Qt.resolvedUrl("../icons/info.svg")
+        icon.width: 18
+        icon.height: 18
+        icon.color: (btn.hovered || popup.visible)
+            ? Theme.palette.primary
+            : Theme.palette.textTertiary
+        onClicked: popup.visible ? popup.close() : popup.open()
+
+        ToolTip.visible: btn.hovered && !popup.visible
+        ToolTip.text: qsTr("What is this?")
+    }
+
+    Popup {
+        id: popup
+        // Right-aligned to the button, opening downward.
+        x: root.width - width
+        y: root.height + Theme.spacing.tiny
+        width: 300
+        padding: Theme.spacing.medium
+        modal: false
+        focus: true
+        closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
+
+        background: Rectangle {
+            color: Theme.palette.backgroundSecondary
+            border.color: Theme.palette.border
+            border.width: 1
+            radius: Theme.spacing.radiusLarge
+        }
+        contentItem: LogosText {
+            text: root.text
+            wrapMode: Text.WordWrap
+            font.pixelSize: Theme.typography.secondaryText
+            color: Theme.palette.text
+        }
+    }
+}
diff --git a/src/qml/icons/info.svg b/src/qml/icons/info.svg
new file mode 100644
index 0000000..e969ce3
--- /dev/null
+++ b/src/qml/icons/info.svg
@@ -0,0 +1 @@
+<svg fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="m11 7h2v2h-2zm0 4h2v6h-2zm1-9c-5.52 0-10 4.48-10 10s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z" fill="#000"/></svg>
diff --git a/src/qml/views/AccountsView.qml b/src/qml/views/AccountsView.qml
index e0df025..167ee27 100644
--- a/src/qml/views/AccountsView.qml
+++ b/src/qml/views/AccountsView.qml
@@ -49,6 +49,10 @@ ColumnLayout {
                     padding: Theme.spacing.small
                     onClicked: root.refreshAccountsRequested()
                 }
+                InfoButton {
+                    Layout.alignment: Qt.AlignVCenter
+                    text: qsTr("Your wallet addresses and balances. Press Refresh to fetch the latest known addresses and their balances from the running node.")
+                }
             }
 
             LogosText {
diff --git a/src/qml/views/ChannelDepositView.qml b/src/qml/views/ChannelDepositView.qml
index f8de894..b9ab11d 100644
--- a/src/qml/views/ChannelDepositView.qml
+++ b/src/qml/views/ChannelDepositView.qml
@@ -209,6 +209,10 @@ ColumnLayout {
             font.pixelSize: Theme.typography.secondaryText
             color: Theme.palette.textSecondary
         }
+        InfoButton {
+            Layout.alignment: Qt.AlignVCenter
+            text: qsTr("Deposit wallet notes (UTXOs) into a channel. Pick an address to load its notes, select the notes to consume, fill in the channel id, change/funding keys and max fee, then confirm to submit.")
+        }
     }
 
     LogosText {
diff --git a/src/qml/views/LeaderRewardsView.qml b/src/qml/views/LeaderRewardsView.qml
index cbe5e4d..2caa29a 100644
--- a/src/qml/views/LeaderRewardsView.qml
+++ b/src/qml/views/LeaderRewardsView.qml
@@ -86,6 +86,10 @@ ColumnLayout {
                     font.pixelSize: Theme.typography.secondaryText
                     color: Theme.palette.textSecondary
                 }
+                InfoButton {
+                    Layout.alignment: Qt.AlignVCenter
+                    text: qsTr("Claim block-leader rewards. The list shows your pending claimable vouchers (refreshed each block). Claim submits a claim transaction; the protocol selects which voucher it consumes.")
+                }
             }
 
             // Horizontally-sliding list of voucher cards.
diff --git a/src/qml/views/TransferView.qml b/src/qml/views/TransferView.qml
index b36cb8f..ed37456 100644
--- a/src/qml/views/TransferView.qml
+++ b/src/qml/views/TransferView.qml
@@ -40,10 +40,18 @@ ColumnLayout {
             anchors.margins: Theme.spacing.large
             spacing: Theme.spacing.small
 
-            LogosText {
-                text: qsTr("Transfer funds")
-                font.pixelSize: Theme.typography.secondaryText
-                font.bold: true
+            RowLayout {
+                Layout.fillWidth: true
+                LogosText {
+                    text: qsTr("Transfer funds")
+                    font.pixelSize: Theme.typography.secondaryText
+                    font.bold: true
+                }
+                Item { Layout.fillWidth: true }
+                InfoButton {
+                    Layout.alignment: Qt.AlignVCenter
+                    text: qsTr("Send funds between addresses. Choose a source address (its balance is shown), enter the recipient key and amount, then press Send.")
+                }
             }
 
             StyledAddressComboBox {