status-desktop/storybook/pages/TokenListPopupPage.qml

146 lines
4.0 KiB
QML

import QtQuick 2.15
import QtQuick.Controls 2.15
import Storybook 1.0
import Models 1.0
import SortFilterProxyModel 0.2
import StatusQ 0.1
import AppLayouts.Profile.popups 1.0
SplitView {
id: root
Logs { id: logs }
readonly property var sourcesOfTokensModel: SourceOfTokensModel {}
readonly property var flatTokensModel: FlatTokensModel {}
readonly property var joinModel: LeftJoinModel {
leftModel: root.flatTokensModel
rightModel: NetworksModel.allNetworks
joinRole: "chainId"
}
readonly property var tokensProxyModel: SortFilterProxyModel {
sourceModel: joinModel
proxyRoles: [
ExpressionRole {
name: "explorerUrl"
expression: { return "https://status.im/" }
}
]
}
SplitView {
orientation: Qt.Vertical
SplitView.fillWidth: true
Item {
SplitView.fillWidth: true
SplitView.fillHeight: true
PopupBackground {
anchors.fill: parent
}
Instantiator {
model: SortFilterProxyModel {
sourceModel: sourcesOfTokensModel
filters: ValueFilter {
id: keyFilter
roleName: "key"
value : uniswapBtn.checked ? "uniswap" : "status"
}
}
delegate: QtObject {
id: delegate
required property string name
required property string image
required property string source
required property int updatedAt
required property string version
required property int tokensCount
readonly property TokenListPopup popup: TokenListPopup {
parent: root
visible: true
modal: false
closePolicy: Popup.NoAutoClose
sourceName: delegate.name
sourceImage: delegate.image
sourceUrl: delegate.source
sourceUpdatedAt: delegate.updatedAt
sourceVersion: delegate.version
tokensCount: delegate.tokensCount
tokensListModel: SortFilterProxyModel {
sourceModel: root.tokensProxyModel
// Filter by source
filters: RegExpFilter {
roleName: "sources"
pattern: "\;" + keyFilter.value + "\;"
}
}
onLinkClicked: logs.logEvent("TokenListPopup::onLinkClicked --> " + link)
onClosed: keyFilter.value = ""
Component.onCompleted: open()
}
}
}
}
LogsAndControlsPanel {
id: logsAndControlsPanel
SplitView.minimumHeight: 100
SplitView.preferredHeight: 150
logsView.logText: logs.logText
}
}
Pane {
SplitView.minimumWidth: 300
SplitView.preferredWidth: 300
Column {
spacing: 12
Label {
text: "Token List:"
font.bold: true
}
RadioButton {
id: uniswapBtn
text: "Uniswap"
checked: true
onCheckedChanged: keyFilter.value = "uniswap"
}
RadioButton {
id: statusBtn
text: "Status"
onCheckedChanged: keyFilter.value = "status"
}
}
}
}
// category: Popups
// https://www.figma.com/file/FkFClTCYKf83RJWoifWgoX/Wallet-v2?type=design&node-id=18057%3A239798&mode=design&t=Vnm5GS8EZFLpeRAY-1