From 3452fbadc60ee57256030dae17138c6dde8f74f8 Mon Sep 17 00:00:00 2001
From: belalshehab <belal@status.im>
Date: Wed, 3 Jul 2024 02:31:34 +0300
Subject: [PATCH] feat(wallet)_: add manual reload button to WalletHeader.qml

- Added a manual reload button to the WalletHeader to allow users to refresh wallet data on demand.
- Implemented a throttle timer to prevent excessive reloads.
- Show the last reload time.
- Updated UI elements to reflect the reloading state for user feedback.
- Connected the reload button to the backend to trigger the wallet reload functionality.

resolves: #13652
---
 src/app/modules/main/wallet_section/view.nim  |  4 ++
 .../AppLayouts/Wallet/panels/WalletHeader.qml | 45 +++++++++++++++++++
 ui/app/AppLayouts/Wallet/stores/RootStore.qml |  3 ++
 3 files changed, 52 insertions(+)

diff --git a/src/app/modules/main/wallet_section/view.nim b/src/app/modules/main/wallet_section/view.nim
index fa76eff183..19a2fcfb13 100644
--- a/src/app/modules/main/wallet_section/view.nim
+++ b/src/app/modules/main/wallet_section/view.nim
@@ -276,6 +276,8 @@ QtObject:
   proc lastReloadTimestampChanged*(self: View) {.signal.}
 
   proc setLastReloadTimestamp*(self: View, lastReloadTimestamp: int64) =
+    if lastReloadTimestamp == self.lastReloadTimestamp:
+      return
     self.lastReloadTimestamp = lastReloadTimestamp
     self.lastReloadTimestampChanged()
 
@@ -289,6 +291,8 @@ QtObject:
   proc isAccountTokensReloadingChanged*(self: View) {.signal.}
 
   proc setIsAccountTokensReloading*(self: View, isAccountTokensReloading: bool) =
+    if isAccountTokensReloading == self.isAccountTokensReloading:
+      return
     self.isAccountTokensReloading = isAccountTokensReloading
     self.isAccountTokensReloadingChanged()
 
diff --git a/ui/app/AppLayouts/Wallet/panels/WalletHeader.qml b/ui/app/AppLayouts/Wallet/panels/WalletHeader.qml
index 1e2effb29c..a9944edca8 100644
--- a/ui/app/AppLayouts/Wallet/panels/WalletHeader.qml
+++ b/ui/app/AppLayouts/Wallet/panels/WalletHeader.qml
@@ -1,5 +1,6 @@
 import QtQuick 2.13
 import QtQuick.Layouts 1.13
+import QtQml 2.15
 
 import StatusQ 0.1
 import StatusQ.Core 0.1
@@ -14,6 +15,7 @@ import SortFilterProxyModel 0.2
 import utils 1.0
 
 import "../controls"
+import "../stores"
 
 Item {
     id: root
@@ -73,6 +75,49 @@ Item {
             spacing: 16
             Layout.alignment: Qt.AlignTrailing
             Layout.topMargin: 5
+            Row {
+                Layout.alignment: Qt.AlignRight | Qt.AlignTop
+                Layout.preferredHeight: 38
+                spacing: 8
+
+                StatusButton {
+                    id: reloadButton
+                    size: StatusBaseButton.Size.Tiny
+                    loadingIndicatorSize: size
+                    height: parent.height
+                    width: height
+                    borderColor: Theme.palette.directColor7
+                    borderWidth: 1
+
+                    normalColor: Theme.palette.transparent
+                    hoverColor: Theme.palette.baseColor2
+
+                    icon.name: "refresh"
+                    icon.color: hovered ? Theme.palette.directColor1 : Theme.palette.baseColor1
+                    asset.mirror: true
+
+                    loading: RootStore.isAccountTokensReloading
+                    interactive: !loading && !throttleTimer.running
+                    readonly property string lastReloadTimeFormated: !!RootStore.lastReloadTimestamp ?
+                                                                 LocaleUtils.formatRelativeTimestamp(
+                                                                     RootStore.lastReloadTimestamp * 1000) : ""
+                    tooltip.text: qsTr("Last refreshed %1").arg(lastReloadTimeFormated)
+
+                    onClicked: RootStore.walletSectionInst.reloadAccountTokens()
+
+                    Timer {
+                        id: throttleTimer
+                        interval: 1000*60 //throttle for 1 min
+                        running: true // Start the timer immediately to disable manual reload initially, as automatic refresh is performed upon entering the wallet.
+                    }
+
+                    onLastReloadTimeFormatedChanged: {
+                        // Start the throttle timer whenever the tokens are reloaded,
+                        // which can be triggered by either automatic or manual reload.
+                        throttleTimer.restart()
+                    }
+                }
+            }
 
             DAppsWorkflow {
                 Layout.alignment: Qt.AlignTop
diff --git a/ui/app/AppLayouts/Wallet/stores/RootStore.qml b/ui/app/AppLayouts/Wallet/stores/RootStore.qml
index 908d75d0c0..5ec369d6f2 100644
--- a/ui/app/AppLayouts/Wallet/stores/RootStore.qml
+++ b/ui/app/AppLayouts/Wallet/stores/RootStore.qml
@@ -104,6 +104,9 @@ QtObject {
     readonly property var activityDetailsController: walletSectionInst.activityDetailsController
     readonly property var walletConnectController: walletSectionInst.walletConnectController
 
+    readonly property bool isAccountTokensReloading: walletSectionInst.isAccountTokensReloading
+    readonly property double lastReloadTimestamp: walletSectionInst.lastReloadTimestamp
+
     signal savedAddressAddedOrUpdated(added: bool, name: string, address: string, errorMsg: string)
     signal savedAddressDeleted(name: string, address: string, errorMsg: string)