qml: Introduce the Desktop Wallet Activity Page

Author: johnny9

Diff for: src/Makefile.qt.include

@@ -37,15 +37,18 @@ QT_FORMS_UI = \
 QT_MOC_CPP = \
   qml/components/moc_blockclockdial.cpp \
   qml/controls/moc_linegraph.cpp \
+  qml/models/moc_activitylistmodel.cpp \
   qml/models/moc_chainmodel.cpp \
   qml/models/moc_networktraffictower.cpp \
   qml/models/moc_nodemodel.cpp \
   qml/models/moc_options_model.cpp \
   qml/models/moc_peerdetailsmodel.cpp \
   qml/models/moc_peerlistsortproxy.cpp \
+  qml/models/moc_transaction.cpp \
   qml/models/moc_walletlistmodel.cpp \
   qml/models/moc_walletqmlmodel.cpp \
   qml/moc_appmode.cpp \
+  qml/moc_clipboard.cpp \
   qml/moc_walletqmlcontroller.cpp \
   qt/moc_addressbookpage.cpp \
   qt/moc_addresstablemodel.cpp \
@@ -120,15 +123,18 @@ QT_QRC_LOCALE = qt/bitcoin_locale.qrc
 BITCOIN_QT_H = \
   qml/components/blockclockdial.h \
   qml/controls/linegraph.h \
+  qml/models/activitylistmodel.h \
   qml/models/chainmodel.h \
   qml/models/networktraffictower.h \
   qml/models/nodemodel.h \
   qml/models/options_model.h \
   qml/models/peerdetailsmodel.h \
   qml/models/peerlistsortproxy.h \
+  qml/models/transaction.h \
   qml/models/walletlistmodel.h \
   qml/models/walletqmlmodel.h \
   qml/appmode.h \
+  qml/clipboard.h \
   qml/bitcoin.h \
   qml/guiconstants.h \
   qml/imageprovider.h \
@@ -312,12 +318,14 @@ BITCOIN_QML_BASE_CPP = \
   qml/bitcoin.cpp \
   qml/components/blockclockdial.cpp \
   qml/controls/linegraph.cpp \
+  qml/models/activitylistmodel.cpp \
   qml/models/chainmodel.cpp \
   qml/models/networktraffictower.cpp \
   qml/models/nodemodel.cpp \
   qml/models/options_model.cpp \
   qml/models/peerdetailsmodel.cpp \
   qml/models/peerlistsortproxy.cpp \
+  qml/models/transaction.cpp \
   qml/models/walletlistmodel.cpp \
   qml/models/walletqmlmodel.cpp \
   qml/imageprovider.cpp \
@@ -340,6 +348,7 @@ QML_RES_ICONS = \
   qml/res/icons/caret-left.png \
   qml/res/icons/caret-right.png \
   qml/res/icons/check.png \
+  qml/res/icons/coinbase.png \
   qml/res/icons/cross.png \
   qml/res/icons/error.png \
   qml/res/icons/export.png \
@@ -355,6 +364,8 @@ QML_RES_ICONS = \
   qml/res/icons/singlesig-wallet.png \
   qml/res/icons/storage-dark.png \
   qml/res/icons/storage-light.png \
+  qml/res/icons/triangle-up.png \
+  qml/res/icons/triangle-down.png \
   qml/res/icons/tooltip-arrow-dark.png \
   qml/res/icons/tooltip-arrow-light.png \
   qml/res/icons/wallet.png \
@@ -393,14 +404,15 @@ QML_RES_QML = \
   qml/controls/InformationPage.qml \
   qml/controls/IPAddressValueInput.qml \
   qml/controls/KeyValueRow.qml \
+  qml/controls/LabeledTextInput.qml \
   qml/controls/NavButton.qml \
-  qml/controls/PageIndicator.qml \
   qml/controls/NavigationBar.qml \
   qml/controls/NavigationBar2.qml \
   qml/controls/NavigationTab.qml \
   qml/controls/OptionButton.qml \
   qml/controls/OptionSwitch.qml \
   qml/controls/OutlineButton.qml \
+  qml/controls/PageIndicator.qml \
   qml/controls/PageStack.qml \
   qml/controls/ProgressIndicator.qml \
   qml/controls/qmldir \
@@ -433,6 +445,8 @@ QML_RES_QML = \
   qml/pages/settings/SettingsProxy.qml \
   qml/pages/settings/SettingsStorage.qml \
   qml/pages/settings/SettingsTheme.qml \
+  qml/pages/wallet/Activity.qml \
+  qml/pages/wallet/ActivityDetails.qml \
   qml/pages/wallet/CreateBackup.qml \
   qml/pages/wallet/CreateConfirm.qml \
   qml/pages/wallet/CreateIntro.qml \

Diff for: src/qml/bitcoin.cpp

@@ -15,12 +15,14 @@
 #include <node/interface_ui.h>
 #include <noui.h>
 #include <qml/appmode.h>
+#include <qml/clipboard.h>
 #ifdef __ANDROID__
 #include <qml/androidnotifier.h>
 #endif
 #include <qml/components/blockclockdial.h>
 #include <qml/controls/linegraph.h>
 #include <qml/guiconstants.h>
+#include <qml/models/activitylistmodel.h>
 #include <qml/models/chainmodel.h>
 #include <qml/models/networktraffictower.h>
 #include <qml/models/nodemodel.h>
@@ -325,11 +327,14 @@ int QmlGuiMain(int argc, char* argv[])
     engine.rootContext()->setContextProperty("needOnboarding", need_onboarding);
 
     AppMode app_mode = SetupAppMode();
+    Clipboard clipboard;
 
     qmlRegisterSingletonInstance<AppMode>("org.bitcoincore.qt", 1, 0, "AppMode", &app_mode);
+    qmlRegisterSingletonInstance<Clipboard>("org.bitcoincore.qt", 1, 0, "Clipboard", &clipboard);
     qmlRegisterType<BlockClockDial>("org.bitcoincore.qt", 1, 0, "BlockClockDial");
     qmlRegisterType<LineGraph>("org.bitcoincore.qt", 1, 0, "LineGraph");
     qmlRegisterUncreatableType<PeerDetailsModel>("org.bitcoincore.qt", 1, 0, "PeerDetailsModel", "");
+    qmlRegisterUncreatableType<Transaction>("org.bitcoincore.qt", 1, 0, "Transaction", "");
 
 #ifdef ENABLE_WALLET
     qmlRegisterUncreatableType<WalletQmlModel>("org.bitcoincore.qt", 1, 0, "WalletQmlModel",

Diff for: src/qml/bitcoin_qml.qrc

@@ -30,14 +30,15 @@
         <file>controls/InformationPage.qml</file>
         <file>controls/IPAddressValueInput.qml</file>
         <file>controls/KeyValueRow.qml</file>
+        <file>controls/LabeledTextInput.qml</file>
         <file>controls/NavButton.qml</file>
-        <file>controls/PageIndicator.qml</file>
         <file>controls/NavigationBar.qml</file>
         <file>controls/NavigationBar2.qml</file>
         <file>controls/NavigationTab.qml</file>
         <file>controls/OptionButton.qml</file>
         <file>controls/OptionSwitch.qml</file>
         <file>controls/OutlineButton.qml</file>
+        <file>controls/PageIndicator.qml</file>
         <file>controls/PageStack.qml</file>
         <file>controls/ProgressIndicator.qml</file>
         <file>controls/qmldir</file>
@@ -70,6 +71,8 @@
         <file>pages/settings/SettingsProxy.qml</file>
         <file>pages/settings/SettingsStorage.qml</file>
         <file>pages/settings/SettingsTheme.qml</file>
+        <file>pages/wallet/Activity.qml</file>
+        <file>pages/wallet/ActivityDetails.qml</file>
         <file>pages/wallet/CreateBackup.qml</file>
         <file>pages/wallet/CreateConfirm.qml</file>
         <file>pages/wallet/CreateIntro.qml</file>
@@ -93,6 +96,7 @@
         <file alias="caret-left">res/icons/caret-left.png</file>
         <file alias="caret-right">res/icons/caret-right.png</file>
         <file alias="check">res/icons/check.png</file>
+        <file alias="coinbase">res/icons/coinbase.png</file>
         <file alias="cross">res/icons/cross.png</file>
         <file alias="error">res/icons/error.png</file>
         <file alias="export">res/icons/export.png</file>
@@ -110,6 +114,8 @@
         <file alias="storage-light">res/icons/storage-light.png</file>
         <file alias="tooltip-arrow-dark">res/icons/tooltip-arrow-dark.png</file>
         <file alias="tooltip-arrow-light">res/icons/tooltip-arrow-light.png</file>
+        <file alias="triangle-down">res/icons/triangle-down.png</file>
+        <file alias="triangle-up">res/icons/triangle-up.png</file>
         <file alias="wallet">res/icons/wallet.png</file>
         <file alias="visible">res/icons/visible.png</file>
     </qresource>

Diff for: src/qml/clipboard.h

@@ -0,0 +1,27 @@
+// Copyright (c) 2024 The Bitcoin Core developers
+// Distributed under the MIT software license, see the accompanying
+// file COPYING or http://www.opensource.org/licenses/mit-license.php.
+
+#ifndef BITCOIN_QML_CLIPBOARD_H
+#define BITCOIN_QML_CLIPBOARD_H
+
+#include <QObject>
+#include <QClipboard>
+#include <QGuiApplication>
+
+class Clipboard : public QObject
+{
+    Q_OBJECT
+public:
+    explicit Clipboard(QObject *parent = nullptr) : QObject(parent) {}
+
+    Q_INVOKABLE void setText(const QString &text) {
+        QGuiApplication::clipboard()->setText(text);
+    }
+
+    Q_INVOKABLE QString text() const {
+        return QGuiApplication::clipboard()->text();
+    }
+};
+
+#endif // BITCOIN_QML_CLIPBOARD_H

Diff for: src/qml/controls/LabeledTextInput.qml

@@ -0,0 +1,63 @@
+// Copyright (c) 2024 The Bitcoin Core developers
+// Distributed under the MIT software license, see the accompanying
+// file COPYING or http://www.opensource.org/licenses/mit-license.php.
+
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Layouts 1.15
+
+Item {
+    property alias labelText: label.text
+    property alias text: input.text
+    property alias placeholderText: input.placeholderText
+    property alias iconSource: icon.source
+    property alias customIcon: iconContainer.data
+    property alias enabled: input.enabled
+
+    signal iconClicked
+    signal textEdited
+
+    id: root
+    implicitHeight: input.height
+
+    CoreText {
+        id: label
+        anchors.left: parent.left
+        anchors.verticalCenter: parent.verticalCenter
+        horizontalAlignment: Text.AlignLeft
+        width: 110
+        color: Theme.color.neutral9
+        font.pixelSize: 18
+    }
+
+    TextField {
+        id: input
+        anchors.left: label.right
+        anchors.right: iconContainer.left
+        anchors.verticalCenter: parent.verticalCenter
+        leftPadding: 0
+        font.family: "Inter"
+        font.styleName: "Regular"
+        font.pixelSize: 18
+        color: Theme.color.neutral9
+        placeholderTextColor: Theme.color.neutral7
+        background: Item {}
+        selectByMouse: true
+        onTextEdited: root.textEdited()
+    }
+
+    Item {
+        id: iconContainer
+        anchors.right: parent.right
+        anchors.verticalCenter: input.verticalCenter
+
+        Icon {
+            id: icon
+            source: ""
+            color: Theme.color.neutral8
+            size: 30
+            enabled: source != ""
+            onClicked: root.iconClicked()
+        }
+    }
+}

Diff for: src/qml/imageprovider.cpp

@@ -72,6 +72,11 @@ QPixmap ImageProvider::requestPixmap(const QString& id, QSize* size, const QSize
         return QIcon(":/icons/caret-right").pixmap(requested_size);
     }
 
+    if (id == "coinbase") {
+        *size = requested_size;
+        return QIcon(":/icons/coinbase").pixmap(requested_size);
+    }
+
     if (id == "check") {
         *size = requested_size;
         return QIcon(":/icons/check").pixmap(requested_size);
@@ -152,6 +157,16 @@ QPixmap ImageProvider::requestPixmap(const QString& id, QSize* size, const QSize
         return QIcon(":/icons/tooltip-arrow-light").pixmap(requested_size);
     }
 
+    if (id == "triangle-up") {
+        *size = requested_size;
+        return QIcon(":/icons/triangle-up").pixmap(requested_size);
+    }
+
+    if (id == "triangle-down") {
+        *size = requested_size;
+        return QIcon(":/icons/triangle-down").pixmap(requested_size);
+    }
+
     if (id == "add-wallet-dark") {
         *size = requested_size;
         return QIcon(":/icons/add-wallet-dark").pixmap(requested_size);