340 lines
12 KiB
QML
340 lines
12 KiB
QML
import QtQuick 2.13
|
|
import QtGraphicalEffects 1.13
|
|
import QtQuick.Layouts 1.13
|
|
import QtQuick.Controls 2.14
|
|
import SortFilterProxyModel 0.2
|
|
|
|
import StatusQ.Core 0.1
|
|
import StatusQ.Core.Theme 0.1
|
|
import StatusQ.Controls 0.1
|
|
import StatusQ.Popups 0.1
|
|
import StatusQ.Components 0.1
|
|
import StatusQ.Core.Utils 0.1
|
|
|
|
import utils 1.0
|
|
|
|
import shared.controls 1.0
|
|
import shared.popups 1.0
|
|
import shared.popups.send.controls 1.0
|
|
|
|
import AppLayouts.stores 1.0
|
|
import AppLayouts.Wallet.controls 1.0
|
|
|
|
import ".."
|
|
import "../stores"
|
|
|
|
StatusModal {
|
|
id: root
|
|
|
|
property var accounts
|
|
property var selectedAccount
|
|
|
|
property bool switchingAccounsEnabled: true
|
|
property bool changingPreferredChainsEnabled: true
|
|
|
|
property string qrImageSource: RootStore.getQrCode(d.visibleAddress)
|
|
property var getNetworkShortNames: function(chainIDsString) {
|
|
return RootStore.getNetworkShortNames(chainIDsString)
|
|
}
|
|
|
|
property var store: RootStore
|
|
|
|
signal selectedAccountIndexChanged(int selectedIndex)
|
|
signal updatePreferredChains(string address, string preferredChains)
|
|
|
|
onSelectedAccountChanged: {
|
|
d.preferredChainIdsArray = root.selectedAccount.preferredSharingChainIds.split(":").filter(Boolean)
|
|
}
|
|
|
|
width: 556
|
|
contentHeight: content.implicitHeight + d.advanceFooterHeight
|
|
|
|
hasFloatingButtons: true
|
|
|
|
showHeader: false
|
|
showAdvancedHeader: hasFloatingButtons
|
|
advancedHeaderComponent: AccountsModalHeader {
|
|
control.enabled: root.switchingAccounsEnabled && model.count > 1
|
|
model: SortFilterProxyModel {
|
|
sourceModel: root.accounts
|
|
|
|
sorters: RoleSorter { roleName: "position"; sortOrder: Qt.AscendingOrder }
|
|
}
|
|
|
|
selectedAccount: root.selectedAccount
|
|
getNetworkShortNames: root.getNetworkShortNames
|
|
onSelectedIndexChanged: {
|
|
root.selectedAccountIndexChanged(selectedIndex)
|
|
}
|
|
}
|
|
|
|
showFooter: false
|
|
showAdvancedFooter: true
|
|
advancedFooterComponent: Rectangle {
|
|
width: parent.width
|
|
height: rowLayout.height + 56 // Makes it totally 88 for one liner text as per design
|
|
color: Theme.palette.baseColor4
|
|
radius: 8
|
|
|
|
// Hide round corners of the upper part
|
|
Rectangle {
|
|
anchors.left: parent.left
|
|
anchors.top: parent.top
|
|
width: parent.width
|
|
height: parent.radius
|
|
color: parent.color
|
|
}
|
|
|
|
// Divider
|
|
Rectangle {
|
|
anchors.left: parent.left
|
|
anchors.top: parent.top
|
|
width: parent.width
|
|
height: 1
|
|
color: Theme.palette.baseColor2
|
|
}
|
|
|
|
Item { // Needed to avoid binding loop warnings
|
|
anchors.centerIn: parent
|
|
height: childrenRect.height
|
|
width: parent.width
|
|
|
|
RowLayout {
|
|
id: rowLayout
|
|
|
|
width: parent.width
|
|
|
|
StatusBaseText {
|
|
Layout.leftMargin: Style.current.bigPadding
|
|
Layout.preferredWidth: parent.width - copyButton.width
|
|
Layout.fillWidth: true
|
|
verticalAlignment: Text.AlignVCenter
|
|
textFormat: TextEdit.RichText
|
|
wrapMode: Text.WrapAnywhere
|
|
text: WalletUtils.colorizedChainPrefix(d.preferredChainShortNames) + root.selectedAccount.address
|
|
font.pixelSize: 15
|
|
color: Theme.palette.directColor1
|
|
}
|
|
|
|
CopyButtonWithCircle {
|
|
id: copyButton
|
|
|
|
Layout.rightMargin: Style.current.bigPadding
|
|
Layout.preferredWidth: 32
|
|
Layout.preferredHeight: 32
|
|
Layout.fillWidth: true
|
|
textToCopy: d.visibleAddress
|
|
successCircleVisible: true
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
onOpened: {
|
|
RootStore.addressWasShown(root.selectedAccount.address)
|
|
}
|
|
|
|
QtObject {
|
|
id: d
|
|
|
|
readonly property bool multiChainView: tabBar.currentIndex === 1
|
|
readonly property int advanceFooterHeight: 88
|
|
|
|
property var preferredChainIdsArray: root.selectedAccount.preferredSharingChainIds.split(":").filter(Boolean)
|
|
property var preferredChainIds: d.preferredChainIdsArray.join(":")
|
|
|
|
readonly property string preferredChainShortNames: d.multiChainView? root.getNetworkShortNames(d.preferredChainIds) : ""
|
|
readonly property string visibleAddress: "%1%2".arg(d.preferredChainShortNames).arg(root.selectedAccount.address)
|
|
|
|
readonly property var networkProxies: [layer1NetworksClone, layer2NetworksClone]
|
|
}
|
|
|
|
Column {
|
|
id: content
|
|
width: parent.width
|
|
height: childrenRect.height
|
|
|
|
topPadding: Style.current.xlPadding
|
|
bottomPadding: Style.current.xlPadding
|
|
spacing: Style.current.bigPadding
|
|
|
|
StatusSwitchTabBar {
|
|
id: tabBar
|
|
anchors.horizontalCenter: parent.horizontalCenter
|
|
currentIndex: 1
|
|
|
|
StatusSwitchTabButton {
|
|
text: qsTr("Legacy")
|
|
}
|
|
StatusSwitchTabButton {
|
|
text: qsTr("Multichain")
|
|
}
|
|
}
|
|
|
|
Item {
|
|
id: qrCode
|
|
height: 320
|
|
width: 320
|
|
anchors.horizontalCenter: parent.horizontalCenter
|
|
|
|
layer.enabled: true
|
|
layer.effect: OpacityMask {
|
|
maskSource: Item {
|
|
width: qrCode.width
|
|
height: qrCode.height
|
|
Rectangle {
|
|
anchors.top: parent.top
|
|
anchors.left: parent.left
|
|
width: qrCode.width
|
|
height: qrCode.height
|
|
radius: Style.current.bigPadding
|
|
border.width: 1
|
|
border.color: Style.current.border
|
|
}
|
|
Rectangle {
|
|
anchors.top: parent.top
|
|
anchors.right: parent.right
|
|
width: Style.current.bigPadding
|
|
height: Style.current.bigPadding
|
|
}
|
|
Rectangle {
|
|
anchors.bottom: parent.bottom
|
|
anchors.left: parent.left
|
|
width: Style.current.bigPadding
|
|
height: Style.current.bigPadding
|
|
}
|
|
}
|
|
}
|
|
|
|
Image {
|
|
id: qrCodeImage
|
|
anchors.centerIn: parent
|
|
height: parent.height
|
|
width: parent.width
|
|
asynchronous: true
|
|
fillMode: Image.PreserveAspectFit
|
|
mipmap: true
|
|
smooth: false
|
|
source: root.qrImageSource
|
|
}
|
|
|
|
Rectangle {
|
|
anchors.centerIn: qrCodeImage
|
|
width: 88
|
|
height: 88
|
|
color: "white"
|
|
radius: width / 2
|
|
StatusSmartIdenticon {
|
|
anchors.centerIn: parent
|
|
name: root.selectedAccount.name
|
|
asset {
|
|
width: 72
|
|
height: 72
|
|
name: !root.selectedAccount.name && !root.selectedAccount.emoji? "status-logo-icon" : ""
|
|
color: !root.selectedAccount.name && !root.selectedAccount.emoji? "transparent" : Utils.getColorForId(root.selectedAccount.colorId)
|
|
emoji: root.selectedAccount.emoji
|
|
charactersLen: {
|
|
let parts = root.selectedAccount.name.split(" ")
|
|
if (parts.length > 1) {
|
|
return 2
|
|
}
|
|
return 1
|
|
}
|
|
isLetterIdenticon: root.selectedAccount.name && !root.selectedAccount.emoji
|
|
useAcronymForLetterIdenticon: root.selectedAccount.name && !root.selectedAccount.emoji
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
Item {
|
|
width: parent.width
|
|
height: Math.max(flow.height, editButton.height)
|
|
anchors.horizontalCenter: parent.horizontalCenter
|
|
visible: d.multiChainView && (d.preferredChainIdsArray.length > 0 || root.changingPreferredChainsEnabled)
|
|
|
|
Flow {
|
|
id: flow
|
|
anchors.horizontalCenter: parent.horizontalCenter
|
|
spacing: 5
|
|
|
|
Repeater {
|
|
model: d.networkProxies.length
|
|
delegate: Repeater {
|
|
model: d.networkProxies[index]
|
|
delegate: StatusNetworkListItemTag {
|
|
enabled: false
|
|
button.visible: false
|
|
title: model.shortName
|
|
asset.name: Style.svg("tiny/" + model.iconUrl)
|
|
visible: d.preferredChainIdsArray.includes(model.chainId.toString())
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
StatusRoundButton {
|
|
id: editButton
|
|
width: 32
|
|
height: 32
|
|
anchors.right: parent.right
|
|
anchors.rightMargin: Style.current.bigPadding
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
icon.name: "edit_pencil"
|
|
type: StatusRoundButton.Type.Tertiary
|
|
visible: root.changingPreferredChainsEnabled
|
|
highlighted: selectPopup.visible
|
|
onClicked: selectPopup.open()
|
|
|
|
NetworkSelectPopup {
|
|
id: selectPopup
|
|
|
|
x: editButton.width - width
|
|
y: editButton.height + 2
|
|
|
|
margins: -1 // to allow positioning outside the bounds of the dialog
|
|
|
|
layer1Networks: layer1NetworksClone
|
|
layer2Networks: layer2NetworksClone
|
|
preferredNetworksMode: true
|
|
preferredSharingNetworks: d.preferredChainIdsArray
|
|
|
|
useEnabledRole: false
|
|
|
|
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
|
|
|
|
onToggleNetwork: (network, networkModel, index) => {
|
|
d.preferredChainIdsArray = RootStore.processPreferredSharingNetworkToggle(d.preferredChainIdsArray, network)
|
|
}
|
|
|
|
onClosed: {
|
|
root.updatePreferredChains(root.selectedAccount.address, d.preferredChainIds)
|
|
}
|
|
|
|
CloneModel {
|
|
id: layer1NetworksClone
|
|
|
|
sourceModel: root.store.layer1Networks
|
|
roles: ["layer", "chainId", "chainColor", "chainName","shortName", "iconUrl", "isEnabled"]
|
|
// rowData used to clone returns string. Convert it to bool for bool arithmetics
|
|
rolesOverride: [{
|
|
role: "isEnabled",
|
|
transform: (modelData) => root.readOnly ? root.chainShortNames.includes(modelData.shortName) : Boolean(modelData.isEnabled)
|
|
}]
|
|
}
|
|
|
|
CloneModel {
|
|
id: layer2NetworksClone
|
|
|
|
sourceModel: root.store.layer2Networks
|
|
roles: layer1NetworksClone.roles
|
|
rolesOverride: layer1NetworksClone.rolesOverride
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|