Skip to content

Commit be965bf

Browse files
hebastohebasto
committed
Merge #343: Ask before opening external links
726bfa2 qml: introduce external link warning popup (jarolrod) 90d6a7e qml: remove implicitWidth from Continue & OutlineButton (jarolrod) Pull request description: Introduces an external link confirm popup window that prompts the user to acknowledge that they really want to visit the external link. This is based off the [design file](https://www.figma.com/file/ek8w3n3upbluw5UL2lGhRx/Bitcoin-Core-App-Design?type=design&node-id=6265-24513&t=PyRCN7AM9KdhuP8x-4) This contains a menu bar with a title, but is missing the close button. It is also missing the "Don't ask again" button. These require some more conversation and can be addressed in a follow-up. This deviates from the design file in providing a mobile layout that positions the buttons in a column layout instead of a rowlayout. cc @GBKS @mouxdesign | Desktop Layout | Mobile Layout | | -------------- | ------------- | | <img width="752" alt="Screen Shot 2023-06-03 at 2 11 30 AM" src="https://github.com/bitcoin-core/gui-qml/assets/23396902/ac1a7c81-d0c0-4564-9efb-27d2410348a0"> | <img width="752" alt="Screen Shot 2023-06-03 at 2 12 43 AM" src="https://github.com/bitcoin-core/gui-qml/assets/23396902/3bc3fe9d-2208-4587-b871-2313b1984d57"> | [![Windows](https://img.shields.io/badge/OS-Windows-green)](https://api.cirrus-ci.com/v1/artifact/github/bitcoin-core/gui-qml/win64/unsecure_win_gui.zip?branch=pull/343) [![Intel macOS](https://img.shields.io/badge/OS-Intel%20macOS-green)](https://api.cirrus-ci.com/v1/artifact/github/bitcoin-core/gui-qml/macos/unsecure_mac_gui.zip?branch=pull/343) [![Apple Silicon macOS](https://img.shields.io/badge/OS-Apple%20Silicon%20macOS-green)](https://api.cirrus-ci.com/v1/artifact/github/bitcoin-core/gui-qml/macos_arm64/unsecure_mac_arm64_gui.zip?branch=pull/343) [![ARM64 Android](https://img.shields.io/badge/OS-Android-green)](https://api.cirrus-ci.com/v1/artifact/github/bitcoin-core/gui-qml/android/unsecure_android_apk.zip?branch=pull/343) [![ARM32 Android](https://img.shields.io/badge/OS-Android%2032bit-green)](https://api.cirrus-ci.com/v1/artifact/github/bitcoin-core/gui-qml/android32/unsecure_android_32bit_apk.zip?branch=pull/343) ACKs for top commit: pablomartin4btc: re ACK 726bfa2 Tree-SHA512: 4424dbdf5d54f80af49258c270a9953d7465b0093bf01ef32b89df25d956f280521ea3ee8a69cdfe26ed5633eab68e0a068afd5c860d044947a61022d2a11f86
2 parents 58f8d44 + 726bfa2 commit be965bf

File tree

6 files changed

+130
-6
lines changed

6 files changed

+130
-6
lines changed

‎src/Makefile.qt.include

+1
Original file line numberDiff line numberDiff line change
@@ -347,6 +347,7 @@ QML_RES_QML = \
347347
qml/components/ConnectionOptions.qml \
348348
qml/components/ConnectionSettings.qml \
349349
qml/components/DeveloperOptions.qml \
350+
qml/components/ExternalPopup.qml \
350351
qml/components/PeersIndicator.qml \
351352
qml/components/NetworkTrafficGraph.qml \
352353
qml/components/NetworkIndicator.qml \

‎src/qml/bitcoin_qml.qrc

+1
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
<file>components/ConnectionSettings.qml</file>
1010
<file>components/PeersIndicator.qml</file>
1111
<file>components/DeveloperOptions.qml</file>
12+
<file>components/ExternalPopup.qml</file>
1213
<file>components/NetworkTrafficGraph.qml</file>
1314
<file>components/NetworkIndicator.qml</file>
1415
<file>components/ProxySettings.qml</file>

‎src/qml/components/AboutOptions.qml

+14-4
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ ColumnLayout {
1818
description: "bitcoincore.org"
1919
link: "https://bitcoincore.org"
2020
}
21-
onClicked: loadedItem.clicked()
21+
onClicked: openPopup(loadedItem.link)
2222
}
2323
Separator { Layout.fillWidth: true }
2424
Setting {
@@ -30,7 +30,7 @@ ColumnLayout {
3030
description: "github.com/bitcoin/bitcoin"
3131
link: "https://github.com/bitcoin/bitcoin"
3232
}
33-
onClicked: loadedItem.clicked()
33+
onClicked: openPopup(loadedItem.link)
3434
}
3535
Separator { Layout.fillWidth: true }
3636
Setting {
@@ -42,7 +42,7 @@ ColumnLayout {
4242
description: "MIT"
4343
link: "https://opensource.org/licenses/MIT"
4444
}
45-
onClicked: loadedItem.clicked()
45+
onClicked: openPopup(loadedItem.link)
4646
}
4747
Separator { Layout.fillWidth: true }
4848
Setting {
@@ -57,7 +57,7 @@ ColumnLayout {
5757
iconWidth: 18
5858
iconHeight: 18
5959
}
60-
onClicked: loadedItem.clicked()
60+
onClicked: openPopup(loadedItem.link)
6161
}
6262
Separator { Layout.fillWidth: true }
6363
Setting {
@@ -72,4 +72,14 @@ ColumnLayout {
7272
aboutSwipe.incrementCurrentIndex()
7373
}
7474
}
75+
ExternalPopup {
76+
id: confirmPopup
77+
anchors.centerIn: Overlay.overlay
78+
width: parent.width
79+
}
80+
81+
function openPopup(link) {
82+
confirmPopup.link = link
83+
confirmPopup.open()
84+
}
7585
}

‎src/qml/components/ExternalPopup.qml

+114
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
// Copyright (c) 2023 The Bitcoin Core developers
2+
// Distributed under the MIT software license, see the accompanying
3+
// file COPYING or http://www.opensource.org/licenses/mit-license.php.
4+
5+
import QtQuick 2.15
6+
import QtQuick.Controls 2.15
7+
import QtQuick.Layouts 1.15
8+
import Qt.labs.settings 1.0
9+
import org.bitcoincore.qt 1.0
10+
import "../controls"
11+
12+
Popup {
13+
id: externalConfirmPopup
14+
property string link: ""
15+
modal: true
16+
padding: 0
17+
18+
background: Rectangle {
19+
color: Theme.color.background
20+
radius: 10
21+
}
22+
23+
ColumnLayout {
24+
anchors.fill: parent
25+
spacing: 0
26+
27+
NavigationBar {
28+
Layout.preferredHeight: 55
29+
middleDetail: Header {
30+
Layout.fillWidth: true
31+
header: qsTr("External Link")
32+
headerBold: true
33+
headerSize: 24
34+
}
35+
}
36+
37+
Separator {
38+
Layout.fillWidth: true
39+
}
40+
41+
ColumnLayout {
42+
id: popupContent
43+
Layout.fillWidth: true
44+
Layout.rightMargin: 20
45+
Layout.leftMargin: 20
46+
Layout.topMargin: 20
47+
Layout.bottomMargin: 20
48+
spacing: 30
49+
Header {
50+
Layout.fillWidth: true
51+
header: qsTr("Do you want to open the following website in your browser?")
52+
headerBold: false
53+
headerSize: 18
54+
description: ("\"" + externalConfirmPopup.link + "\"")
55+
descriptionMargin: 3
56+
}
57+
Loader {
58+
id: layoutLoader
59+
Layout.fillWidth: true
60+
sourceComponent: AppMode.isDesktop ? desktopLayout : mobileLayout
61+
}
62+
}
63+
}
64+
65+
Component {
66+
id: desktopLayout
67+
RowLayout {
68+
Layout.fillWidth: true
69+
spacing: 15
70+
OutlineButton {
71+
text: qsTr("Cancel")
72+
Layout.fillWidth: true
73+
Layout.minimumWidth: 150
74+
onClicked: {
75+
externalConfirmPopup.close()
76+
}
77+
}
78+
ContinueButton {
79+
text: qsTr("Ok")
80+
Layout.fillWidth: true
81+
Layout.minimumWidth: 150
82+
onClicked: {
83+
Qt.openUrlExternally(externalConfirmPopup.link)
84+
externalConfirmPopup.close()
85+
}
86+
}
87+
}
88+
}
89+
90+
Component {
91+
id: mobileLayout
92+
ColumnLayout {
93+
Layout.fillWidth: true
94+
spacing: 15
95+
OutlineButton {
96+
text: qsTr("Cancel")
97+
Layout.fillWidth: true
98+
Layout.minimumWidth: 150
99+
onClicked: {
100+
externalConfirmPopup.close()
101+
}
102+
}
103+
ContinueButton {
104+
text: qsTr("Ok")
105+
Layout.fillWidth: true
106+
Layout.minimumWidth: 150
107+
onClicked: {
108+
Qt.openUrlExternally(externalConfirmPopup.link)
109+
externalConfirmPopup.close()
110+
}
111+
}
112+
}
113+
}
114+
}

‎src/qml/controls/ContinueButton.qml

-1
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,6 @@ Button {
1717
background: Rectangle {
1818
id: bg
1919
implicitHeight: 46
20-
implicitWidth: 300
2120
color: Theme.color.orange
2221
radius: 5
2322

‎src/qml/controls/OutlineButton.qml

-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,6 @@ Button {
1818
background: Rectangle {
1919
id: bg
2020
implicitHeight: 46
21-
implicitWidth: 340
2221
color: Theme.color.background
2322
radius: 5
2423
border {

0 commit comments

Comments
 (0)