[#11849] Move pull to refresh to the account overview screen
This commit is contained in:
Roman Volosovskyi
parent
86e0da1da8
commit
86fcdd47e4
|
|
@ -44,7 +44,7 @@
|
|||
offset (reagent/atom 0)
|
||||
on-layout (fn [evt]
|
||||
(reset! offset (oget evt "nativeEvent" "layout" "height")))]
|
||||
(fn [{:keys [extended-header] :as props} children]
|
||||
(fn [{:keys [extended-header refresh-control refreshing-sub refreshing-counter] :as props} children]
|
||||
[animated/view {:flex 1
|
||||
:pointer-events :box-none}
|
||||
[animated/code {:key (str @offset)
|
||||
|
|
@ -67,6 +67,10 @@
|
|||
:title-align :left}
|
||||
(dissoc props :extended-header))]]
|
||||
(into [animated/scroll-view {:on-scroll on-scroll
|
||||
:refreshControl (when refresh-control
|
||||
(refresh-control
|
||||
(and @refreshing-sub
|
||||
@refreshing-counter)))
|
||||
:style {:z-index 1}
|
||||
:scrollEventThrottle 16}
|
||||
[animated/view {:pointer-events :box-none}
|
||||
|
|
|
|||
|
|
@ -18,9 +18,7 @@
|
|||
[status-im.utils.money :as money]
|
||||
[status-im.wallet.utils :as wallet.utils]
|
||||
[status-im.ui.components.tabs :as tabs]
|
||||
[quo.react-native :as rn]
|
||||
[quo.design-system.colors :as quo-colors]
|
||||
[status-im.utils.utils :as utils.utils])
|
||||
[quo.design-system.colors :as quo-colors])
|
||||
(:require-macros [status-im.utils.views :as views]))
|
||||
|
||||
(def state (reagent/atom {:tab :assets}))
|
||||
|
|
@ -58,8 +56,11 @@
|
|||
[react/touchable-highlight {:on-press #(re-frame/dispatch [:wallet/share-popover address])}
|
||||
[icons/icon :main-icons/share {:color colors/white-persist
|
||||
:accessibility-label :share-wallet-address-icon}]]]
|
||||
[react/view {:height button-group-height :background-color colors/black-transparent-20
|
||||
:border-bottom-right-radius 8 :border-bottom-left-radius 8 :flex-direction :row}
|
||||
[react/view {:height button-group-height
|
||||
:background-color colors/black-transparent-20
|
||||
:border-bottom-right-radius 8
|
||||
:border-bottom-left-radius 8
|
||||
:flex-direction :row}
|
||||
(if (= type :watch)
|
||||
[react/view {:flex 1 :align-items :center :justify-content :center}
|
||||
[react/text {:style {:margin-left 8 :color colors/white-persist}}
|
||||
|
|
@ -180,29 +181,6 @@
|
|||
(styles/bottom-send-recv-buttons-lower anim-y button-group-height)
|
||||
#(reset! to-show false))))))))
|
||||
|
||||
;; Note(rasom): sometimes `refreshing` might get stuck on iOS if action happened
|
||||
;; too fast. By updating this atom in 1s we ensure that `refreshing?` property
|
||||
;; is updated properly in this case.
|
||||
(def updates-counter (reagent/atom 0))
|
||||
|
||||
(defn schedule-counter-reset []
|
||||
(utils.utils/set-timeout
|
||||
(fn []
|
||||
(swap! updates-counter inc)
|
||||
(when @(re-frame/subscribe [:wallet/refreshing-history?])
|
||||
(schedule-counter-reset)))
|
||||
1000))
|
||||
|
||||
(defn refresh-action []
|
||||
(schedule-counter-reset)
|
||||
(re-frame/dispatch [:wallet.ui/pull-to-refresh-history]))
|
||||
|
||||
(defn refresh-control [refreshing?]
|
||||
(reagent/as-element
|
||||
[rn/refresh-control
|
||||
{:refreshing (boolean refreshing?)
|
||||
:onRefresh refresh-action}]))
|
||||
|
||||
(views/defview account []
|
||||
(views/letsubs [{:keys [name address] :as account} [:multiaccount/current-account]
|
||||
fetching-error [:wallet/fetching-error]]
|
||||
|
|
@ -223,9 +201,9 @@
|
|||
[{:nativeEvent {:contentOffset {:y scroll-y}}}]
|
||||
{:useNativeDriver true})
|
||||
:scrollEventThrottle 1
|
||||
:refreshControl (refresh-control
|
||||
:refreshControl (accounts/refresh-control
|
||||
(and
|
||||
@updates-counter
|
||||
@accounts/updates-counter
|
||||
@(re-frame/subscribe [:wallet/refreshing-history?])))}
|
||||
(when fetching-error
|
||||
[react/view {:style {:flex 1
|
||||
|
|
|
|||
|
|
@ -14,7 +14,9 @@
|
|||
[status-im.ui.screens.wallet.accounts.styles :as styles]
|
||||
[status-im.qr-scanner.core :as qr-scanner]
|
||||
[status-im.wallet.utils :as wallet.utils]
|
||||
[status-im.keycard.login :as keycard.login])
|
||||
[status-im.keycard.login :as keycard.login]
|
||||
[quo.react-native :as rn]
|
||||
[status-im.utils.utils :as utils.utils])
|
||||
(:require-macros [status-im.utils.views :as views]))
|
||||
|
||||
(views/defview account-card [{:keys [name color address type wallet] :as account} keycard? card-width]
|
||||
|
|
@ -190,21 +192,48 @@
|
|||
[quo/text {:color :secondary}
|
||||
(i18n/label :t/wallet-total-value)]])]))
|
||||
|
||||
;; Note(rasom): sometimes `refreshing` might get stuck on iOS if action happened
|
||||
;; too fast. By updating this atom in 1s we ensure that `refreshing?` property
|
||||
;; is updated properly in this case.
|
||||
(def updates-counter (reagent/atom 0))
|
||||
|
||||
(defn schedule-counter-reset []
|
||||
(utils.utils/set-timeout
|
||||
(fn []
|
||||
(swap! updates-counter inc)
|
||||
(when @(re-frame/subscribe [:wallet/refreshing-history?])
|
||||
(schedule-counter-reset)))
|
||||
1000))
|
||||
|
||||
(defn refresh-action []
|
||||
(schedule-counter-reset)
|
||||
(re-frame/dispatch [:wallet.ui/pull-to-refresh-history]))
|
||||
|
||||
(defn refresh-control [refreshing?]
|
||||
(reagent/as-element
|
||||
[rn/refresh-control
|
||||
{:refreshing (boolean refreshing?)
|
||||
:onRefresh refresh-action}]))
|
||||
|
||||
(defn accounts-overview []
|
||||
(let [mnemonic @(re-frame/subscribe [:mnemonic])]
|
||||
[react/view {:flex 1}
|
||||
[react/view
|
||||
{:style {:flex 1}}
|
||||
[quo/animated-header
|
||||
{:extended-header total-value
|
||||
:use-insets true
|
||||
:right-accessories [{:on-press #(re-frame/dispatch
|
||||
[::qr-scanner/scan-code
|
||||
{:handler :wallet.send/qr-scanner-result}])
|
||||
:icon :main-icons/qr
|
||||
:accessibility-label :accounts-qr-code}
|
||||
{:on-press #(re-frame/dispatch [:bottom-sheet/show-sheet
|
||||
{:content (sheets/accounts-options mnemonic)}])
|
||||
:icon :main-icons/more
|
||||
:accessibility-label :accounts-more-options}]}
|
||||
{:extended-header total-value
|
||||
:refresh-control refresh-control
|
||||
:refreshing-sub (re-frame/subscribe [:wallet/refreshing-history?])
|
||||
:refreshing-counter updates-counter
|
||||
:use-insets true
|
||||
:right-accessories [{:on-press #(re-frame/dispatch
|
||||
[::qr-scanner/scan-code
|
||||
{:handler :wallet.send/qr-scanner-result}])
|
||||
:icon :main-icons/qr
|
||||
:accessibility-label :accounts-qr-code}
|
||||
{:on-press #(re-frame/dispatch [:bottom-sheet/show-sheet
|
||||
{:content (sheets/accounts-options mnemonic)}])
|
||||
:icon :main-icons/more
|
||||
:accessibility-label :accounts-more-options}]}
|
||||
[accounts]
|
||||
[buy-crypto/banner]
|
||||
[assets]
|
||||
|
|
|
|||
Loading…
Reference in New Issue