import QtQuick 2.13 import QtQuick.Controls 2.13 import QtQuick.Layouts 1.13 import QtQuick.Dialogs 1.3 import utils 1.0 import shared.stores 1.0 import StatusQ.Controls 0.1 import StatusQ.Popups 0.1 import StatusQ.Components 0.1 import StatusQ.Core 0.1 import StatusQ.Core.Theme 0.1 import "../panels" import "../controls" import "../views" Item { id: root clip: true height: accountSelectionTabBar.height + stackLayout.height + Style.current.xlPadding property var store signal contactSelected(string address, int type) TabBar { id: accountSelectionTabBar anchors.top: parent.top anchors.topMargin: 20 width: parent.width height: assetBtn.height background: Rectangle { color: Style.current.transparent } StatusTabButton { id: assetBtn //% "Saved" btnText: qsTr("Saved") } StatusTabButton { id: collectiblesBtn anchors.left: assetBtn.right anchors.leftMargin: 32 //% "My Accounts" btnText: qsTr("My Accounts") } StatusTabButton { id: historyBtn anchors.left: collectiblesBtn.right anchors.leftMargin: 32 //% "Recent" btnText: qsTr("Recent") } } StackLayout { id: stackLayout anchors.top: accountSelectionTabBar.bottom height: currentIndex === 0 ? savedAddresses.height: currentIndex === 1 ? myAccounts.height : recents.height width: parent.width currentIndex: accountSelectionTabBar.currentIndex // To-do adapt to new design and make block white/balck once the list items etc support new color scheme Rectangle { Layout.maximumWidth: parent.width Layout.maximumHeight : savedAddresses.height color: "transparent" radius: 8 ListView { id: savedAddresses anchors.horizontalCenter: parent.horizontalCenter anchors.top: parent.top width: parent.width height: Math.min(288, savedAddresses.contentHeight) model: root.store.savedAddressesModel clip: true header: savedAddresses.count > 0 ? search : nothingInList headerPositioning: ListView.OverlayHeader boundsBehavior: Flickable.StopAtBounds delegate: StatusListItem { width: visible ? parent.width: 0 height: visible ? 64 : 0 title: name subTitle: address radius: 0 visible: !savedAddresses.headerItem.text || name.toLowerCase().includes(savedAddresses.headerItem.text) components: [ StatusIcon { icon: "star-icon" width: 12 height: 12 } ] onClicked: contactSelected(address, RecipientSelector.Type.Address ) } Component { id: search StatusBaseInput { width: parent.width height: 56 placeholderText: qsTr("Search for saved address") rightComponent: StatusIcon { icon: "search" height: 17 color: Theme.palette.baseColor1 } } } Component { id: nothingInList StatusBaseText { font.pixelSize: 15 color: Theme.palette.directColor1 //% "No Saved Address" text: qsTr("No Saved Address") } } } } Rectangle { id: myAccountsRect Layout.maximumWidth: parent.width Layout.maximumHeight : myAccounts.height color: "transparent" radius: 8 ListView { id: myAccounts anchors.horizontalCenter: parent.horizontalCenter anchors.top: parent.top width: parent.width height: Math.min(288, myAccounts.contentHeight) boundsBehavior: Flickable.StopAtBounds clip: true delegate: StatusListItem { width: visible ? parent.width: 0 height: visible ? 64 : 0 title: model.name subTitle: Utils.toLocaleString(model.currencyBalance.toFixed(2), popup.store.locale, {"model.currency": true}) + " " + popup.store.currentCurrency.toUpperCase() icon.emoji: !!model.emoji ? model.emoji: "" icon.color: model.color icon.name: !model.emoji ? "filled-account": "" icon.letterSize: 14 icon.isLetterIdenticon: !!model.emoji ? true : false icon.background.color: Theme.palette.indirectColor1 radius: 0 onClicked: contactSelected(model.address, RecipientSelector.Type.Account ) } model: root.store.accounts } } Rectangle { Layout.maximumWidth: parent.width Layout.maximumHeight : recents.height color: "transparent" radius: 8 ListView { id: recents anchors.horizontalCenter: parent.horizontalCenter anchors.top: parent.top width: parent.width height: Math.min(288, recents.contentHeight) boundsBehavior: Flickable.StopAtBounds clip: true header: StatusBaseText { font.pixelSize: 15 color: Theme.palette.directColor1 //% "No Recents" text: qsTr("No Recents") visible: recents.count <= 0 } delegate: StatusListItem { property bool isIncoming: to === popup.store.currentAccount.address width: visible ? parent.width: 0 height: visible ? 64 : 0 title: isIncoming ? from : to subTitle: Utils.getTimeDifference(new Date(parseInt(timestamp) * 1000), new Date()) statusListItemTitle.elide: Text.ElideMiddle statusListItemTitle.wrapMode: Text.NoWrap radius: 0 components: [ StatusIcon { id: transferIcon height: 15 width: 15 color: isIncoming ? Style.current.success : Style.current.danger icon: isIncoming ? "down" : "up" rotation: 45 }, StatusBaseText { id: contactsLabel font.pixelSize: 15 color: Theme.palette.directColor1 text: popup.store.hex2Eth(value) } ] onClicked: contactSelected(title, RecipientSelector.Type.Address) } model: root.store.walletSectionTransactionsInst.model } } } }