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 "../stores" StatusModal { id: root property string address: RootStore.selectedReceiveAccount.address property string chainShortNames: RootStore.getNetworkShortNames(d.preferredSharingNetworksString) property var preferredSharingNetworksArray: d.preferredSharingNetworksString.split(":").filter(Boolean) property string description: qsTr("Your Address") property bool readOnly: false QtObject { id: d property string completeAddressWithNetworkPrefix: root.chainShortNames + root.address property string preferredSharingNetworksString: !!RootStore.selectedReceiveAccount ? RootStore.selectedReceiveAccount.preferredSharingChainIds : "" onPreferredSharingNetworksStringChanged: { root.preferredSharingNetworksArray = d.preferredSharingNetworksString.split(":").filter(Boolean) root.chainShortNames = RootStore.getNetworkShortNames(d.preferredSharingNetworksString) } } headerSettings.title: qsTr("Receive") contentHeight: layout.implicitHeight width: 556 showHeader: false showAdvancedHeader: true hasFloatingButtons: true advancedHeaderComponent: AccountsModalHeader { model: SortFilterProxyModel { sourceModel: RootStore.receiveAccounts sorters: RoleSorter { roleName: "position"; sortOrder: Qt.AscendingOrder } } selectedAccount: RootStore.selectedReceiveAccount getNetworkShortNames: RootStore.getNetworkShortNames onSelectedIndexChanged: RootStore.switchReceiveAccount(selectedIndex) } contentItem: Column { id: layout width: root.width topPadding: 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 { width: parent.width height: qrCodeBox.height id: centralLayout Grid { id: multiChainList property bool need2Columns: RootStore.enabledNetworks.count >= 9 anchors.left: need2Columns ? undefined: qrCodeBox.right anchors.leftMargin: need2Columns ?undefined : Style.current.halfPadding anchors.centerIn: need2Columns ? parent : undefined height: qrCodeBox.height columnSpacing: need2Columns ? qrCodeBox.width + Style.current.bigPadding : 0 flow: Grid.TopToBottom columns: need2Columns ? 2 : 1 spacing: 5 property var networkProxies: [layer1NetworksClone, layer2NetworksClone] Repeater { model: multiChainList.networkProxies.length delegate: Repeater { model: multiChainList.networkProxies[index] delegate: InformationTag { tagPrimaryLabel.text: model.shortName tagPrimaryLabel.color: model.chainColor image.source: Style.svg("tiny/" + model.iconUrl) visible: root.preferredSharingNetworksArray.includes(model.chainId.toString()) MouseArea { anchors.fill: parent cursorShape: root.readOnly ? Qt.ArrowCursor : Qt.PointingHandCursor enabled: !root.readOnly onClicked: selectPopup.open() } } } } StatusRoundButton { id: editButton width: 32 height: 32 icon.name: "edit_pencil" color: Theme.palette.primaryColor3 visible: !root.readOnly onClicked: selectPopup.open() } } Rectangle { id: qrCodeBox height: 339 width: 339 anchors.centerIn: parent anchors.horizontalCenter: parent.horizontalCenter layer.enabled: true layer.effect: OpacityMask { maskSource: Item { width: qrCodeBox.width height: qrCodeBox.height Rectangle { anchors.top: parent.top anchors.left: parent.left width: qrCodeBox.width height: qrCodeBox.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: RootStore.getQrCode(d.completeAddressWithNetworkPrefix) } Rectangle { anchors.centerIn: qrCodeImage width: 78 height: 78 color: "white" StatusIcon { anchors.centerIn: parent anchors.margins: 2 width: 78 height: 78 icon: "status-logo-icon" } } } } Item { anchors.horizontalCenter: parent.horizontalCenter width: parent.width height: addressLabel.height + copyButton.height Column { id: addressLabel anchors.verticalCenter: parent.verticalCenter anchors.left: parent.left anchors.leftMargin: Style.current.bigPadding StatusBaseText { id: contactsLabel font.pixelSize: 15 color: Theme.palette.baseColor1 text: root.description } RowLayout { id: networksLabel spacing: -1 Repeater { model: multiChainList.networkProxies.length delegate: Repeater { model: multiChainList.networkProxies[index] delegate: StatusBaseText { font.pixelSize: 15 color: chainColor text: shortName + ":" visible: root.preferredSharingNetworksArray.includes(model.chainId.toString()) onVisibleChanged: { if (root.readOnly) return if (visible) { root.chainShortNames += text } else { root.chainShortNames = root.chainShortNames.replace(text, "") } } } } } } StatusAddress { id: txtWalletAddress color: Theme.palette.directColor1 font.pixelSize: 15 text: root.address } } Column { id: copyButton anchors.verticalCenter: parent.verticalCenter anchors.right: parent.right anchors.rightMargin: Style.current.bigPadding spacing: 5 CopyToClipBoardButton { id: copyToClipBoard textToCopy: txtWalletAddress.text onCopyClicked: RootStore.copyToClipboard(textToCopy) } StatusBaseText { anchors.horizontalCenter: parent.horizontalCenter font.pixelSize: 13 color: Theme.palette.primaryColor1 text: qsTr("Copy") } } } NetworkSelectPopup { id: selectPopup x: multiChainList.x + editButton.width + 9 y: tabBar.y + tabBar.height layer1Networks: layer1NetworksClone layer2Networks: layer2NetworksClone preferredNetworksMode: true preferredSharingNetworks: root.preferredSharingNetworksArray useEnabledRole: false closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside onToggleNetwork: (network, networkModel, index) => { root.preferredSharingNetworksArray = RootStore.processPreferredSharingNetworkToggle(root.preferredSharingNetworksArray, network) } onClosed: RootStore.updateWalletAccountPreferredChains(root.address, root.preferredSharingNetworksArray.join(":")) CloneModel { id: layer1NetworksClone sourceModel: RootStore.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: RootStore.layer2Networks roles: layer1NetworksClone.roles rolesOverride: layer1NetworksClone.rolesOverride } } states: [ State { name: "legacy" when: tabBar.currentIndex === 0 PropertyChanges { target: multiChainList visible: false } PropertyChanges { target: contactsLabel visible: true } PropertyChanges { target: networksLabel visible: false } PropertyChanges { target: copyToClipBoard textToCopy: txtWalletAddress.text } PropertyChanges { target: d completeAddressWithNetworkPrefix: root.address } }, State { name: "multichain" when: tabBar.currentIndex === 1 PropertyChanges { target: multiChainList visible: true } PropertyChanges { target: contactsLabel visible: false } PropertyChanges { target: networksLabel visible: true } PropertyChanges { target: copyToClipBoard textToCopy: root.chainShortNames + txtWalletAddress.text } PropertyChanges { target: d completeAddressWithNetworkPrefix: root.chainShortNames + root.address } } ] } }