qml: Introduce the Desktop Wallet Activity Page

Author: johnny9

src/Makefile.qt.include

@@ -37,16 +37,19 @@ 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_bitcoinamount.cpp \
+  qml/moc_clipboard.cpp \
   qml/moc_walletqmlcontroller.cpp \
   qt/moc_addressbookpage.cpp \
   qt/moc_addresstablemodel.cpp \
@@ -121,15 +124,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/bitcoinamount.h \
   qml/guiconstants.h \
@@ -315,12 +321,14 @@ BITCOIN_QML_BASE_CPP = \
   qml/bitcoinamount.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 \
@@ -344,6 +352,7 @@ QML_RES_ICONS = \
   qml/res/icons/caret-right.png \
   qml/res/icons/check.png \
   qml/res/icons/copy.png \
+  qml/res/icons/coinbase.png \
   qml/res/icons/cross.png \
   qml/res/icons/error.png \
   qml/res/icons/export.png \
@@ -361,6 +370,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 \
@@ -402,13 +413,13 @@ QML_RES_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 \
@@ -441,6 +452,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 \

src/qml/bitcoin.cpp

@@ -16,12 +16,14 @@
 #include <noui.h>
 #include <qml/appmode.h>
 #include <qml/bitcoinamount.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>
@@ -326,12 +328,15 @@ 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", "");
     qmlRegisterType<BitcoinAmount>("org.bitcoincore.qt", 1, 0, "BitcoinAmount");
+    qmlRegisterUncreatableType<Transaction>("org.bitcoincore.qt", 1, 0, "Transaction", "");
 
 #ifdef ENABLE_WALLET
     qmlRegisterUncreatableType<WalletQmlModel>("org.bitcoincore.qt", 1, 0, "WalletQmlModel",

src/qml/bitcoin_qml.qrc

@@ -32,14 +32,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>
@@ -72,6 +73,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>
@@ -97,6 +100,7 @@
         <file alias="caret-right">res/icons/caret-right.png</file>
         <file alias="check">res/icons/check.png</file>
         <file alias="copy">res/icons/copy.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>
@@ -116,6 +120,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>

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

src/qml/controls/LabeledTextInput.qml

@@ -18,21 +18,23 @@ Item {
     signal textEdited
 
     id: root
-    implicitHeight: label.height + input.height
+    implicitHeight: input.height
 
     CoreText {
         id: label
         anchors.left: parent.left
-        anchors.top: parent.top
-        color: Theme.color.neutral7
-        font.pixelSize: 15
+        anchors.verticalCenter: parent.verticalCenter
+        horizontalAlignment: Text.AlignLeft
+        width: 110
+        color: Theme.color.neutral9
+        font.pixelSize: 18
     }
 
     TextField {
         id: input
-        anchors.left: parent.left
+        anchors.left: label.right
         anchors.right: iconContainer.left
-        anchors.bottom: parent.bottom
+        anchors.verticalCenter: parent.verticalCenter
         leftPadding: 0
         font.family: "Inter"
         font.styleName: "Regular"

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);
@@ -167,6 +172,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);