chore: Remove StatusAssetSelector from StatusQ (#792)
* chore: Remove StatusAssetSelector from StatusQ as its base component StatusSelect is enough to build this further on desktop side. This component also has dependecy on BE and hence should be moved out. BREAKING CHANGE: * fix(StatusSelect): Expose a property to make arrow in the select item visible/invisible
This commit is contained in:
Khushboo-dev-cpp
GitHub
parent
7f99acf32d
commit
3954d49266
|
|
@ -207,11 +207,6 @@ StatusWindow {
|
|||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusAssetSelector"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
onClicked: mainPageView.page(title);
|
||||
}
|
||||
StatusNavigationListItem {
|
||||
title: "StatusColorSelector"
|
||||
selected: viewLoader.source.toString().includes(title)
|
||||
|
|
|
|||
|
|
@ -1,50 +0,0 @@
|
|||
import QtQuick 2.14
|
||||
import QtQuick.Controls 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Popups 0.1
|
||||
|
||||
import Sandbox 0.1
|
||||
|
||||
Column {
|
||||
spacing: 8
|
||||
|
||||
StatusAssetSelector {
|
||||
getCurrencyBalanceString: function (currencyBalance) {
|
||||
return currencyBalance.toFixed(2) + " USD"
|
||||
}
|
||||
tokenAssetSourceFn: function (symbol) {
|
||||
return "../../assets/img/icons/snt.svg"
|
||||
}
|
||||
assets: ListModel {
|
||||
ListElement {
|
||||
address: "0x1234"
|
||||
name: "Status Network Token"
|
||||
balance: "20"
|
||||
symbol: "SNT"
|
||||
totalCurrencyBalance: 9992.01
|
||||
totalBalance: 9992.01
|
||||
}
|
||||
ListElement {
|
||||
address: "0x1234"
|
||||
name: "DAI Token"
|
||||
balance: "15"
|
||||
symbol: "DAI"
|
||||
totalCurrencyBalance: 20.00001
|
||||
totalBalance: 20.00001
|
||||
}
|
||||
ListElement {
|
||||
address: "0x1234"
|
||||
name: "ABYSS Token"
|
||||
balance: "25"
|
||||
symbol: "ABYSS"
|
||||
totalCurrencyBalance: 24.1
|
||||
totalBalance: 24.1
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -1,158 +0,0 @@
|
|||
import QtQuick 2.13
|
||||
import QtQuick.Controls 2.13
|
||||
import QtQuick.Layouts 1.13
|
||||
|
||||
import StatusQ.Core 0.1
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Core.Utils 0.1
|
||||
import StatusQ.Controls 0.1
|
||||
import StatusQ.Components 0.1
|
||||
|
||||
Item {
|
||||
id: root
|
||||
property var assets
|
||||
property var selectedAsset
|
||||
property string defaultToken: ""
|
||||
property string userSelectedToken: ""
|
||||
property var tokenAssetSourceFn: function (symbol) {
|
||||
return ""
|
||||
}
|
||||
// Define this in the usage to get balance in currency selected by user
|
||||
property var getCurrencyBalanceString: function (currencyBalance) { return "" }
|
||||
implicitWidth: 106
|
||||
implicitHeight: 32
|
||||
|
||||
function resetInternal() {
|
||||
assets = null
|
||||
selectedAsset = null
|
||||
}
|
||||
|
||||
onSelectedAssetChanged: {
|
||||
if (selectedAsset && selectedAsset.symbol) {
|
||||
iconImg.image.source = tokenAssetSourceFn(selectedAsset.symbol.toUpperCase())
|
||||
selectedTextField.text = selectedAsset.symbol.toUpperCase()
|
||||
}
|
||||
}
|
||||
|
||||
StatusSelect {
|
||||
id: select
|
||||
width: parent.width
|
||||
bgColor: "transparent"
|
||||
bgColorHover: Theme.palette.directColor8
|
||||
model: root.assets
|
||||
caretRightMargin: 0
|
||||
select.radius: 6
|
||||
select.height: root.height
|
||||
selectMenu.width: 342
|
||||
selectedItemComponent: Item {
|
||||
anchors.fill: parent
|
||||
StatusRoundedImage {
|
||||
id: iconImg
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 4
|
||||
width: 24
|
||||
height: 24
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
image.onStatusChanged: {
|
||||
if (iconImg.image.status === Image.Error) {
|
||||
iconImg.image.source = defaultToken
|
||||
}
|
||||
}
|
||||
}
|
||||
StatusBaseText {
|
||||
id: selectedTextField
|
||||
anchors.left: iconImg.right
|
||||
anchors.leftMargin: 4
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
font.pixelSize: 15
|
||||
height: 22
|
||||
width: 50
|
||||
elide: Text.ElideRight
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
}
|
||||
selectMenu.delegate: menuItem
|
||||
}
|
||||
|
||||
Component {
|
||||
id: menuItem
|
||||
MenuItem {
|
||||
id: itemContainer
|
||||
property bool isFirstItem: index === 0
|
||||
property bool isLastItem: index === assets.rowCount() - 1
|
||||
|
||||
width: parent.width
|
||||
height: 72
|
||||
StatusRoundedImage {
|
||||
id: iconImg
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 16
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
image.source: root.tokenAssetSourceFn(symbol.toUpperCase())
|
||||
image.onStatusChanged: {
|
||||
if (iconImg.image.status === Image.Error) {
|
||||
iconImg.image.source = defaultToken
|
||||
}
|
||||
}
|
||||
}
|
||||
Column {
|
||||
anchors.left: iconImg.right
|
||||
anchors.leftMargin: 12
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
|
||||
StatusBaseText {
|
||||
text: symbol.toUpperCase()
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
text: name
|
||||
color: Theme.palette.baseColor1
|
||||
font.pixelSize: 15
|
||||
}
|
||||
}
|
||||
Column {
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 16
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
StatusBaseText {
|
||||
font.pixelSize: 15
|
||||
text: parseFloat(totalBalance).toFixed(4) + " " + symbol
|
||||
}
|
||||
StatusBaseText {
|
||||
font.pixelSize: 15
|
||||
anchors.right: parent.right
|
||||
text: getCurrencyBalanceString(totalCurrencyBalance)
|
||||
color: Theme.palette.baseColor1
|
||||
}
|
||||
}
|
||||
background: Rectangle {
|
||||
color: itemContainer.highlighted ? Theme.palette.statusSelect.menuItemHoverBackgroundColor : Theme.palette.statusSelect.menuItemBackgroundColor
|
||||
}
|
||||
// To-do move this out of StatusQ, this involves dependency on BE code
|
||||
Component.onCompleted: {
|
||||
if(userSelectedToken === "") {
|
||||
if(index === 0) {
|
||||
selectedAsset = { name: name, symbol: symbol, totalBalance: totalBalance, totalCurrencyBalance: totalCurrencyBalance, balances: balances}
|
||||
}
|
||||
} else {
|
||||
if(symbol === userSelectedToken) {
|
||||
selectedAsset = { name: name, symbol: symbol, totalBalance: totalBalance, totalCurrencyBalance: totalCurrencyBalance, balances: balances}
|
||||
}
|
||||
}
|
||||
}
|
||||
MouseArea {
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
anchors.fill: itemContainer
|
||||
onClicked: {
|
||||
userSelectedToken = symbol
|
||||
// To-do move this out of StatusQ, this involves dependency on BE code
|
||||
selectedAsset = {name: name, symbol: symbol, totalBalance: totalBalance, totalCurrencyBalance: totalCurrencyBalance, balances: balances}
|
||||
select.selectMenu.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -21,6 +21,7 @@ Item {
|
|||
property alias selectMenu: selectMenu
|
||||
property color bgColorHover: bgColor
|
||||
property alias selectedItemComponent: selectedItemContainer.children
|
||||
property bool caretVisible: true
|
||||
property int caretRightMargin: 16
|
||||
property alias select: inputRectangle
|
||||
property int menuAlignment: StatusSelect.MenuAlignment.Right
|
||||
|
|
@ -72,6 +73,7 @@ Item {
|
|||
height: 24
|
||||
icon: "chevron-down"
|
||||
color: Theme.palette.baseColor1
|
||||
visible: caretVisible
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
module StatusQ.Controls
|
||||
|
||||
StatusAccountSelector 0.1 StatusAccountSelector.qml
|
||||
StatusAssetSelector 0.1 StatusAssetSelector.qml
|
||||
StatusBanner 0.1 StatusBanner.qml
|
||||
StatusChatCommandButton 0.1 StatusChatCommandButton.qml
|
||||
StatusChatInfoButton 0.1 StatusChatInfoButton.qml
|
||||
|
|
|
|||
Loading…
Reference in New Issue