Merge #403: Introduce Create Single-Sig wallet flow

a3de255 qml: Introduce Create Wallet Single-Sig flow (johnny9) 0266742 qml: Introduce AddWallet page after onboarding (johnny9) 931d442 qml: Add DISABLED state to ContinueButton (johnny9) 4f11e01 qml: Add color properties to ContinueButton (johnny9) Pull request description: These changes add more pages after the initial onboarding. To test, run the application with the `-resetguisettings` option. Link to github actions build artifacts. [![Build Artifacts](https://img.shields.io/badge/Build%20Artifacts-green )](https://github.com/bitcoin-core/gui-qml/actions/runs/9263281845) ACKs for top commit: D33r-Gee: tACK [a3de255](a3de255) on WSL Ubuntu 22.04 Tree-SHA512: 9970996d1b26a9db7733b050e13d37494c7f0ebbcb0faa00b3a565a5aaeb634ac1d7ad38c11a0de34d15f28c52be953935d025b979e132990bc7dc70a84964a8
bitcoin-core · Aug 1, 2024 · a73577b · a73577b
2 parents c065a17 + a3de255
commit a73577b
Show file tree

Hide file tree

Showing 27 changed files with 767 additions and 9 deletions.
diff --git a/src/Makefile.qt.include b/src/Makefile.qt.include
@@ -43,6 +43,7 @@ QT_MOC_CPP = \
   qml/models/moc_options_model.cpp \
   qml/models/moc_peerlistsortproxy.cpp \
   qml/moc_appmode.cpp \
+  qml/moc_walletcontroller.cpp \
   qt/moc_addressbookpage.cpp \
   qt/moc_addresstablemodel.cpp \
   qt/moc_askpassphrasedialog.cpp \
@@ -126,6 +127,7 @@ BITCOIN_QT_H = \
   qml/guiconstants.h \
   qml/imageprovider.h \
   qml/util.h \
+  qml/walletcontroller.h \
   qt/addressbookpage.h \
   qt/addresstablemodel.h \
   qt/askpassphrasedialog.h \
@@ -310,13 +312,15 @@ BITCOIN_QML_BASE_CPP = \
   qml/models/options_model.cpp \
   qml/models/peerlistsortproxy.cpp \
   qml/imageprovider.cpp \
-  qml/util.cpp
+  qml/util.cpp \
+  qml/walletcontroller.cpp
 
 QML_RES_FONTS = \
   qml/res/fonts/Inter-Regular.otf \
   qml/res/fonts/Inter-SemiBold.otf
 
 QML_RES_ICONS = \
+  qml/res/icons/add-wallet-dark.png \
   qml/res/icons/arrow-down.png \
   qml/res/icons/arrow-up.png \
   qml/res/icons/bitcoin-circle.png \
@@ -331,6 +335,7 @@ QML_RES_ICONS = \
   qml/res/icons/export.png \
   qml/res/icons/gear.png \
   qml/res/icons/gear-outline.png \
+  qml/res/icons/hidden.png \
   qml/res/icons/info.png \
   qml/res/icons/network-dark.png \
   qml/res/icons/network-light.png \
@@ -339,7 +344,9 @@ QML_RES_ICONS = \
   qml/res/icons/storage-dark.png \
   qml/res/icons/storage-light.png \
   qml/res/icons/tooltip-arrow-dark.png \
-  qml/res/icons/tooltip-arrow-light.png
+  qml/res/icons/tooltip-arrow-light.png \
+  qml/res/icons/wallet.png \
+  qml/res/icons/visible.png
 
 QML_QRC_CPP = qml/qrc_bitcoin.cpp
 QML_QRC = qml/bitcoin_qml.qrc
@@ -348,7 +355,6 @@ QML_RES_QML = \
   qml/components/BlockClock.qml \
   qml/components/BlockClockDisplayMode.qml \
   qml/components/BlockCounter.qml \
-  qml/controls/CaretRightIcon.qml \
   qml/components/ConnectionOptions.qml \
   qml/components/ConnectionSettings.qml \
   qml/components/DeveloperOptions.qml \
@@ -364,8 +370,10 @@ QML_RES_QML = \
   qml/components/ThemeSettings.qml \
   qml/components/TotalBytesIndicator.qml \
   qml/components/Tooltip.qml \
+  qml/controls/CaretRightIcon.qml \
   qml/controls/ContinueButton.qml \
   qml/controls/CoreText.qml \
+  qml/controls/CoreTextField.qml \
   qml/controls/ExternalLink.qml \
   qml/controls/FocusBorder.qml \
   qml/controls/Header.qml \
@@ -409,6 +417,12 @@ QML_RES_QML = \
   qml/pages/settings/SettingsProxy.qml \
   qml/pages/settings/SettingsStorage.qml \
   qml/pages/settings/SettingsTheme.qml \
+  qml/pages/wallet/AddWallet.qml \
+  qml/pages/wallet/CreateBackup.qml \
+  qml/pages/wallet/CreateConfirm.qml \
+  qml/pages/wallet/CreateIntro.qml \
+  qml/pages/wallet/CreateName.qml \
+  qml/pages/wallet/CreatePassword.qml \
   qml/pages/wallet/DesktopWallets.qml
 
 if TARGET_ANDROID

diff --git a/src/qml/bitcoin.cpp b/src/qml/bitcoin.cpp
@@ -20,14 +20,15 @@
 #endif
 #include <qml/components/blockclockdial.h>
 #include <qml/controls/linegraph.h>
+#include <qml/guiconstants.h>
 #include <qml/models/chainmodel.h>
 #include <qml/models/networktraffictower.h>
 #include <qml/models/nodemodel.h>
 #include <qml/models/options_model.h>
 #include <qml/models/peerlistsortproxy.h>
 #include <qml/imageprovider.h>
 #include <qml/util.h>
-#include <qml/guiconstants.h>
+#include <qml/walletcontroller.h>
 #include <qt/guiutil.h>
 #include <qt/initexecutor.h>
 #include <qt/networkstyle.h>
@@ -286,6 +287,8 @@ int QmlGuiMain(int argc, char* argv[])
     GUIUtil::LoadFont(":/fonts/inter/regular");
     GUIUtil::LoadFont(":/fonts/inter/semibold");
 
+    WalletController wallet_controller(*node);
+
     QQmlApplicationEngine engine;
 
     QScopedPointer<const NetworkStyle> network_style{NetworkStyle::instantiate(Params().GetChainType())};
@@ -297,6 +300,7 @@ int QmlGuiMain(int argc, char* argv[])
     engine.rootContext()->setContextProperty("chainModel", &chain_model);
     engine.rootContext()->setContextProperty("peerTableModel", &peer_model);
     engine.rootContext()->setContextProperty("peerListModelProxy", &peer_model_sort_proxy);
+    engine.rootContext()->setContextProperty("walletController", &wallet_controller);
 
     OptionsQmlModel options_model(*node, !need_onboarding.toBool());
     engine.rootContext()->setContextProperty("optionsModel", &options_model);

diff --git a/src/qml/bitcoin_qml.qrc b/src/qml/bitcoin_qml.qrc
@@ -22,6 +22,7 @@
         <file>components/Tooltip.qml</file>
         <file>controls/ContinueButton.qml</file>
         <file>controls/CoreText.qml</file>
+        <file>controls/CoreTextField.qml</file>
         <file>controls/ExternalLink.qml</file>
         <file>controls/FocusBorder.qml</file>
         <file>controls/Header.qml</file>
@@ -65,9 +66,16 @@
         <file>pages/settings/SettingsProxy.qml</file>
         <file>pages/settings/SettingsStorage.qml</file>
         <file>pages/settings/SettingsTheme.qml</file>
+        <file>pages/wallet/AddWallet.qml</file>
+        <file>pages/wallet/CreateBackup.qml</file>
+        <file>pages/wallet/CreateConfirm.qml</file>
+        <file>pages/wallet/CreateIntro.qml</file>
+        <file>pages/wallet/CreateName.qml</file>
+        <file>pages/wallet/CreatePassword.qml</file>
         <file>pages/wallet/DesktopWallets.qml</file>
     </qresource>
     <qresource prefix="/icons">
+        <file alias="add-wallet-dark">res/icons/add-wallet-dark.png</file>
         <file alias="arrow-down">res/icons/arrow-down.png</file>
         <file alias="arrow-up">res/icons/arrow-up.png</file>
         <file alias="bitcoin-circle">res/icons/bitcoin-circle.png</file>
@@ -83,6 +91,7 @@
         <file alias="export">res/icons/export.png</file>
         <file alias="gear">res/icons/gear.png</file>
         <file alias="gear-outline">res/icons/gear-outline.png</file>
+        <file alias="hidden">res/icons/hidden.png</file>
         <file alias="info">res/icons/info.png</file>
         <file alias="network-dark">res/icons/network-dark.png</file>
         <file alias="network-light">res/icons/network-light.png</file>
@@ -92,6 +101,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="wallet">res/icons/wallet.png</file>
+        <file alias="visible">res/icons/visible.png</file>
     </qresource>
     <qresource prefix="/fonts">
         <file alias="inter/regular">res/fonts/Inter-Regular.otf</file>

diff --git a/src/qml/controls/ContinueButton.qml b/src/qml/controls/ContinueButton.qml
@@ -9,25 +9,44 @@ import org.bitcoincore.qt 1.0
 Button {
     id: root
     hoverEnabled: AppMode.isDesktop
+
+    property color textColor: Theme.color.white
+    property color backgroundColor: Theme.color.orange
+    property color backgroundHoverColor: Theme.color.orangeLight1
+    property color backgroundPressedColor: Theme.color.orangeLight2
+    property color borderColor: "transparent"
+    property color borderHoverColor: "transparent"
+    property color borderPressedColor: "transparent"
+
     contentItem: CoreText {
         text: parent.text
+        color: root.textColor
         bold: true
         font.pixelSize: 18
     }
     background: Rectangle {
         id: bg
         implicitHeight: 46
-        color: Theme.color.orange
+        color: backgroundColor
+        border.color: borderColor
         radius: 5
 
         states: [
+            State {
+                name: "DISABLED"; when: !root.enabled
+                PropertyChanges { target: bg; color: Theme.color.neutral2 }
+                PropertyChanges { target: bg; border.color: Theme.color.neutral2 }
+                PropertyChanges { target: root; textColor: Theme.color.neutral5 }
+            },
             State {
                 name: "PRESSED"; when: root.pressed
-                PropertyChanges { target: bg; color: Theme.color.orangeLight2 }
+                PropertyChanges { target: bg; color: backgroundPressedColor }
+                PropertyChanges { target: bg; border.color: borderPressedColor }
             },
             State {
                 name: "HOVER"; when: root.hovered
-                PropertyChanges { target: bg; color: Theme.color.orangeLight1 }
+                PropertyChanges { target: bg; color: backgroundHoverColor }
+                PropertyChanges { target: bg; border.color: borderHoverColor }
             }
         ]
 

diff --git a/src/qml/controls/CoreTextField.qml b/src/qml/controls/CoreTextField.qml
@@ -0,0 +1,50 @@
+// Copyright (c) 2022 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
+
+TextField {
+    id: root
+
+    property bool hideText: false
+
+    implicitHeight: 56
+    implicitWidth: 450
+    font.family: "Inter"
+    font.styleName: "Regular"
+    font.pixelSize: 18
+    color: Theme.color.neutral9
+    placeholderTextColor: Theme.color.neutral5
+    echoMode: hideText ? TextInput.Password : TextInput.Normal
+    rightPadding: hideText ? 46 : 20
+    leftPadding: 20
+    background: Rectangle {
+        border.color: Theme.color.neutral5
+        border.width: 1
+        color: "transparent"
+        radius: 5
+
+        Icon {
+            id: visibleIcon
+            enabled: hideText
+            visible: hideText
+            anchors.right: parent.right
+            anchors.rightMargin: 12
+            size: 24
+            anchors.verticalCenter: parent.verticalCenter
+            source: "qrc:/icons/visible"
+            color: Theme.color.neutral5
+            onClicked: {
+                if (root.echoMode == TextInput.Password) {
+                    root.echoMode = TextInput.Normal
+                    visibleIcon.source = "qrc:/icons/hidden"
+                } else {
+                    root.echoMode = TextInput.Password
+                    visibleIcon.source = "qrc:/icons/visible"
+                }
+            }
+        }
+    }
+}
diff --git a/src/qml/controls/Setting.qml b/src/qml/controls/Setting.qml
@@ -10,7 +10,7 @@ import org.bitcoincore.qt 1.0
 
 AbstractButton {
     id: root
-    required property string header
+    property string header
     property alias actionItem: action_loader.sourceComponent
     property alias loadedItem: action_loader.item
     property string description

diff --git a/src/qml/imageprovider.cpp b/src/qml/imageprovider.cpp
@@ -142,5 +142,25 @@ QPixmap ImageProvider::requestPixmap(const QString& id, QSize* size, const QSize
         return QIcon(":/icons/tooltip-arrow-light").pixmap(requested_size);
     }
 
+    if (id == "add-wallet-dark") {
+        *size = requested_size;
+        return QIcon(":/icons/add-wallet-dark").pixmap(requested_size);
+    }
+
+    if (id == "wallet") {
+        *size = requested_size;
+        return QIcon(":/icons/wallet").pixmap(requested_size);
+    }
+
+    if (id == "visible") {
+        *size = requested_size;
+        return QIcon(":/icons/visible").pixmap(requested_size);
+    }
+
+    if (id == "hidden") {
+        *size = requested_size;
+        return QIcon(":/icons/hidden").pixmap(requested_size);
+    }
+
     return {};
 }
diff --git a/src/qml/pages/main.qml b/src/qml/pages/main.qml
@@ -81,6 +81,7 @@ ApplicationWindow {
                 optionsModel.onboard()
                 if (AppMode.walletEnabled && AppMode.isDesktop) {
                     main.push(desktopWallets)
+                    main.push(addWallet)
                 } else {
                     main.push(node)
                 }
@@ -93,6 +94,15 @@ ApplicationWindow {
         DesktopWallets {}
     }
 
+    Component {
+        id: addWallet
+        AddWallet {
+            onFinished: {
+                main.pop()
+            }
+        }
+    }
+
     Component {
         id: shutdown
         Shutdown {}