status-desktop/ui/app/AppLayouts/Wallet/controls/DappsComboBox.qml

164 lines
4.6 KiB
QML

import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
import QtQml.Models 2.15
import utils 1.0
import shared.controls 1.0
import shared.popups.walletconnect 1.0
import shared.popups.walletconnect.controls 1.0
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Controls 0.1
import StatusQ.Components 0.1
import StatusQ.Popups.Dialog 0.1
import StatusQ.Components.private 0.1 as SQP
ComboBox {
id: root
property bool walletConnectEnabled: true
property bool connectorEnabled: true
signal dappsListReady
signal pairDapp
signal disconnectDapp(string dappUrl)
implicitHeight: 38
implicitWidth: 38
background: SQP.StatusComboboxBackground {
objectName: "dappsBackground"
active: root.down || root.hovered
}
indicator: null
contentItem: Item {
objectName: "dappsContentItem"
StatusBadge {
objectName: "dappBadge"
anchors.top: parent.top
anchors.right: parent.right
anchors.margins: 5
width: 6
height: 6
visible: root.delegateModel.count > 0
}
StatusIcon {
objectName: "dappIcon"
anchors.centerIn: parent
width: 16
height: 16
icon: "dapp"
color: Theme.palette.baseColor1
}
}
delegate: DAppDelegate {
width: ListView.view.width
onDisconnectDapp: (dappUrl) => {
root.disconnectDapp(dappUrl)
}
}
popup: DAppsListPopup {
objectName: "dappsListPopup"
x: root.width - width
y: root.height + 4
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent
delegateModel: root.delegateModel
onConnectDapp: {
dappConnectSelectComponent.createObject(root).open()
this.close()
}
onOpened: {
root.dappsListReady()
}
}
Component {
id: dappConnectSelectComponent
StatusDialog {
id: dappConnectSelect
objectName: "dappConnectSelect"
width: 480
topPadding: Theme.bigPadding
leftPadding: Theme.padding
rightPadding: Theme.padding
bottomPadding: 4
destroyOnClose: true
title: qsTr("Connect a dApp")
footer: StatusDialogFooter {
rightButtons: ObjectModel {
StatusButton {
text: qsTr("Cancel")
onClicked: dappConnectSelect.close()
}
}
}
contentItem: ColumnLayout {
StatusBaseText {
Layout.fillWidth: true
Layout.leftMargin: Theme.padding
color: Theme.palette.baseColor1
text: qsTr("How would you like to connect?")
}
StatusListItem {
objectName: "btnStatusConnector"
title: "Status Connector"
asset.name: Theme.png("status-logo")
asset.isImage: true
enabled: root.connectorEnabled
components: [
StatusIcon {
icon: "external-link"
color: Theme.palette.baseColor1
}
]
onClicked: {
dappConnectSelect.close()
Global.openLink("https://chromewebstore.google.com/detail/a-wallet-connector-by-sta/kahehnbpamjplefhpkhafinaodkkenpg")
}
}
StatusListItem {
objectName: "btnWalletConnect"
title: "Wallet Connect"
asset.name: Theme.svg("walletconnect")
asset.isImage: true
enabled: root.walletConnectEnabled
components: [
StatusIcon {
icon: "next"
color: Theme.palette.baseColor1
}
]
onClicked: {
dappConnectSelect.close()
root.pairDapp()
}
}
}
}
}
StatusToolTip {
id: tooltip
objectName: "dappTooltip"
visible: root.hovered && !root.down
text: qsTr("dApp connections")
orientation: StatusToolTip.Orientation.Bottom
y: root.height + 14
}
}