fix(@desktop/wallet): Activity list polish changes (#11486)
fixes #11447
This commit is contained in:
parent
4c8c7d95d7
commit
461bbbc06f
|
@ -389,8 +389,9 @@ QtObject:
|
||||||
QtProperty[QVariant] status:
|
QtProperty[QVariant] status:
|
||||||
read = getStatus
|
read = getStatus
|
||||||
|
|
||||||
|
|
||||||
proc globalFilterChanged*(self: Controller, addresses: seq[string], chainIds: seq[int]) =
|
proc globalFilterChanged*(self: Controller, addresses: seq[string], chainIds: seq[int]) =
|
||||||
|
if (self.addresses == addresses and self.chainIds == chainIds):
|
||||||
|
return
|
||||||
self.setFilterAddresses(addresses)
|
self.setFilterAddresses(addresses)
|
||||||
self.setFilterChains(chainIds)
|
self.setFilterChains(chainIds)
|
||||||
self.status.setIsFilterDirty(true)
|
self.status.setIsFilterDirty(true)
|
|
@ -31,8 +31,9 @@ ColumnLayout {
|
||||||
signal launchTransactionDetail(var transaction)
|
signal launchTransactionDetail(var transaction)
|
||||||
|
|
||||||
onVisibleChanged: {
|
onVisibleChanged: {
|
||||||
if (visible) {
|
if (visible && RootStore.isTransactionFilterDirty) {
|
||||||
RootStore.updateTransactionFilter()
|
// TODO(#11412) restore filter for selected wallet account
|
||||||
|
d.activityFiltersStore.resetAllFilters()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -51,13 +52,12 @@ ColumnLayout {
|
||||||
readonly property int loadingSectionWidth: 56
|
readonly property int loadingSectionWidth: 56
|
||||||
readonly property int topSectionMargin: 20
|
readonly property int topSectionMargin: 20
|
||||||
|
|
||||||
property bool showRefreshButton: false
|
|
||||||
property double lastRefreshTime
|
property double lastRefreshTime
|
||||||
readonly property int maxSecondsBetweenRefresh: 3
|
readonly property int maxSecondsBetweenRefresh: 3
|
||||||
function refreshData() {
|
function refreshData() {
|
||||||
RootStore.resetFilter()
|
RootStore.resetFilter()
|
||||||
d.lastRefreshTime = Date.now()
|
d.lastRefreshTime = Date.now()
|
||||||
d.showRefreshButton = false
|
newTransactions.visible = false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -82,7 +82,7 @@ ColumnLayout {
|
||||||
|
|
||||||
ActivityFilterPanel {
|
ActivityFilterPanel {
|
||||||
id: filterComponent
|
id: filterComponent
|
||||||
visible: !noTxs.visible && (!d.isInitialLoading || d.activityFiltersStore.filtersSet)
|
visible: d.isInitialLoading || transactionListRoot.count > 0 || d.activityFiltersStore.filtersSet
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
activityFilterStore: d.activityFiltersStore
|
activityFilterStore: d.activityFiltersStore
|
||||||
store: WalletStores.RootStore
|
store: WalletStores.RootStore
|
||||||
|
@ -149,15 +149,12 @@ ColumnLayout {
|
||||||
delegate: transactionDelegate
|
delegate: transactionDelegate
|
||||||
|
|
||||||
headerPositioning: ListView.OverlayHeader
|
headerPositioning: ListView.OverlayHeader
|
||||||
header: headerComp
|
|
||||||
footer: footerComp
|
footer: footerComp
|
||||||
|
|
||||||
ScrollBar.vertical: StatusScrollBar {}
|
ScrollBar.vertical: StatusScrollBar {}
|
||||||
|
|
||||||
section.property: "date"
|
section.property: "date"
|
||||||
// Adding some magic number to align the top headerComp with the top of the list.
|
topMargin: d.isInitialLoading ? 0 : -d.topSectionMargin // Top margin for first section. Section cannot have different sizes
|
||||||
// TODO: have to be fixed properly and match the design
|
|
||||||
topMargin: d.isInitialLoading ? 0 : -(2 * d.topSectionMargin + 9) // Top margin for first section. Section cannot have different sizes
|
|
||||||
section.delegate: ColumnLayout {
|
section.delegate: ColumnLayout {
|
||||||
id: sectionDelegate
|
id: sectionDelegate
|
||||||
|
|
||||||
|
@ -196,7 +193,7 @@ ColumnLayout {
|
||||||
}
|
}
|
||||||
|
|
||||||
function tryFetchMoreTransactions() {
|
function tryFetchMoreTransactions() {
|
||||||
if (!footerItem || !RootStore.historyTransactions.hasMore)
|
if (d.isInitialLoading || !footerItem || !RootStore.historyTransactions.hasMore)
|
||||||
return
|
return
|
||||||
const footerYPosition = footerItem.height / contentHeight
|
const footerYPosition = footerItem.height / contentHeight
|
||||||
if (footerYPosition >= 1.0) {
|
if (footerYPosition >= 1.0) {
|
||||||
|
@ -216,11 +213,59 @@ ColumnLayout {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
StatusButton {
|
||||||
|
id: newTransactions
|
||||||
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
|
anchors.top: parent.top
|
||||||
|
anchors.topMargin: Style.current.halfPadding
|
||||||
|
|
||||||
|
text: qsTr("New transactions")
|
||||||
|
|
||||||
|
visible: false
|
||||||
|
onClicked: d.refreshData()
|
||||||
|
|
||||||
|
icon.name: "arrow-up"
|
||||||
|
|
||||||
|
radius: 36
|
||||||
|
type: StatusButton.Primary
|
||||||
|
size: StatusBaseButton.Size.Tiny
|
||||||
|
}
|
||||||
|
|
||||||
Separator {
|
Separator {
|
||||||
id: topListSeparator
|
id: topListSeparator
|
||||||
width: parent.width
|
width: parent.width
|
||||||
visible: !transactionListRoot.atYBeginning
|
visible: !transactionListRoot.atYBeginning
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
Connections {
|
||||||
|
target: RootStore
|
||||||
|
|
||||||
|
function onNewDataAvailableChanged() {
|
||||||
|
if (!d.lastRefreshTime || ((Date.now() - d.lastRefreshTime) > (1000 * d.maxSecondsBetweenRefresh))) {
|
||||||
|
newTransactions.visible = RootStore.newDataAvailable
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
if (showRefreshButtonTimer.running) {
|
||||||
|
if (!RootStore.newDataAvailable) {
|
||||||
|
showRefreshButtonTimer.stop()
|
||||||
|
newTransactions.visible = false
|
||||||
|
}
|
||||||
|
} else if(RootStore.newDataAvailable) {
|
||||||
|
showRefreshButtonTimer.start()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Timer {
|
||||||
|
id: showRefreshButtonTimer
|
||||||
|
|
||||||
|
interval: 2000
|
||||||
|
running: false
|
||||||
|
repeat: false
|
||||||
|
onTriggered: newTransactions.visible = RootStore.newDataAvailable
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
StatusMenu {
|
StatusMenu {
|
||||||
|
@ -307,7 +352,7 @@ ColumnLayout {
|
||||||
id: footerColumn
|
id: footerColumn
|
||||||
readonly property bool allActivityLoaded: !RootStore.historyTransactions.hasMore && transactionListRoot.count !== 0
|
readonly property bool allActivityLoaded: !RootStore.historyTransactions.hasMore && transactionListRoot.count !== 0
|
||||||
width: root.width
|
width: root.width
|
||||||
spacing: 12
|
spacing: d.isInitialLoading ? 6 : 12
|
||||||
|
|
||||||
Separator {
|
Separator {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
|
@ -326,7 +371,17 @@ ColumnLayout {
|
||||||
}
|
}
|
||||||
|
|
||||||
Repeater {
|
Repeater {
|
||||||
model: !noTxs.visible && (RootStore.historyTransactions.hasMore || d.isInitialLoading) ? 10 : 0
|
model: {
|
||||||
|
if (!noTxs.visible) {
|
||||||
|
const delegateHeight = 64 + footerColumn.spacing
|
||||||
|
if (d.isInitialLoading) {
|
||||||
|
return Math.floor(transactionListRoot.height / delegateHeight)
|
||||||
|
} else if (RootStore.historyTransactions.hasMore) {
|
||||||
|
return Math.max(3, Math.floor(transactionListRoot.height / delegateHeight) - 3)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return 0
|
||||||
|
}
|
||||||
TransactionDelegate {
|
TransactionDelegate {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
rootStore: RootStore
|
rootStore: RootStore
|
||||||
|
@ -357,63 +412,4 @@ ColumnLayout {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Component {
|
|
||||||
id: headerComp
|
|
||||||
|
|
||||||
Item {
|
|
||||||
width: root.width
|
|
||||||
height: dataUpdatedButton.implicitHeight
|
|
||||||
|
|
||||||
StatusButton {
|
|
||||||
id: dataUpdatedButton
|
|
||||||
|
|
||||||
anchors.centerIn: parent
|
|
||||||
|
|
||||||
text: qsTr("New transactions")
|
|
||||||
|
|
||||||
visible: d.showRefreshButton
|
|
||||||
onClicked: d.refreshData()
|
|
||||||
|
|
||||||
icon.name: "arrow-up"
|
|
||||||
|
|
||||||
radius: 36
|
|
||||||
textColor: Theme.palette.indirectColor1
|
|
||||||
normalColor: Theme.palette.primaryColor1
|
|
||||||
hoverColor: Theme.palette.miscColor1
|
|
||||||
|
|
||||||
size: StatusBaseButton.Size.Tiny
|
|
||||||
}
|
|
||||||
z: 3
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
Connections {
|
|
||||||
target: RootStore
|
|
||||||
|
|
||||||
function onNewDataAvailableChanged() {
|
|
||||||
if (!d.lastRefreshTime || ((Date.now() - d.lastRefreshTime) > (1000 * d.maxSecondsBetweenRefresh))) {
|
|
||||||
d.showRefreshButton = RootStore.newDataAvailable
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
if (showRefreshButtonTimer.running) {
|
|
||||||
if (!RootStore.newDataAvailable) {
|
|
||||||
showRefreshButtonTimer.stop()
|
|
||||||
d.showRefreshButton = false
|
|
||||||
}
|
|
||||||
} else if(RootStore.newDataAvailable) {
|
|
||||||
showRefreshButtonTimer.start()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
Timer {
|
|
||||||
id: showRefreshButtonTimer
|
|
||||||
|
|
||||||
interval: 2000
|
|
||||||
running: false
|
|
||||||
repeat: false
|
|
||||||
onTriggered: d.showRefreshButton = RootStore.newDataAvailable
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue