status-im
/
status-react
mirror of https://github.com/status-im/status-react.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Loading indicator shown when prices loading is in progress 

Signed-off-by: Volodymyr Kozieiev <vkjr.sp@gmail.com>
This commit is contained in:
Volodymyr Kozieiev 2020-03-31 14:37:29 +03:00
parent 49fd306f25
commit 9e5cc74ea9
No known key found for this signature in database
GPG Key ID: 82B04968DF4C0535
7 changed files with 69 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
components/src/status_im/ui/components/react.cljs
View File

@ -70,6 +70,11 @@
(defn activity-indicator [props]
[activity-indicator-class props])
(defn small-loading-indicator [color]
[activity-indicator {:color (if color color :colors/gray)
:ios {:size :small}
:android {:size :16}}])
(def modal (get-class "Modal"))
(def pan-responder (.-PanResponder js-dependencies/react-native))

60
src/status_im/ui/screens/signing/views.cljs
View File

@ -174,32 +174,24 @@
[react/text (or formatted-data "")]]]
[password-view sign]]]))
(defn amount-item [prices wallet-currency amount amount-error display-symbol fee-display-symbol]
(defn amount-item [prices wallet-currency amount amount-error display-symbol fee-display-symbol prices-loading?]
(let [converted-value (* amount (get-in prices [(keyword display-symbol) (keyword (:code wallet-currency)) :price]))]
[list-item/list-item
{:type :small
:title :t/send-request-amount
:error amount-error
:accessories [[react/nested-text {:style {:color colors/gray}}
[{:style {:color colors/black}} (utils/format-decimals amount 6)]
" "
(or display-symbol fee-display-symbol)
" • "
[{:style {:color colors/black}}
(if converted-value
(i18n/format-currency converted-value (:code wallet-currency))
[react/activity-indicator {:color :colors/gray
:ios {:size :small}
:android {:size :16}}])]
" "
(str (:code wallet-currency))]]}]))
:accessories [[react/view {:style {:flex-direction :row}}
[react/nested-text {:style {:color colors/gray}}
[{:style {:color colors/black}} (utils/format-decimals amount 6)]
" "
(or display-symbol fee-display-symbol)
" • "]
(if prices-loading?
[react/small-loading-indicator]
[react/text {:style {:color colors/black}} (i18n/format-currency converted-value (:code wallet-currency))])
[react/text {:style {:color colors/gray}} (str " " (:code wallet-currency))]]]}]))
(defn loading-indicator []
[react/activity-indicator {:color :colors/gray
:ios {:size :small}
:android {:size :16}}])
(views/defview fee-item [prices wallet-currency fee-display-symbol fee gas-error]
(views/defview fee-item [prices wallet-currency fee-display-symbol fee gas-error prices-loading?]
(views/letsubs [{:keys [gas-price-loading? gas-loading?]} [:signing/edit-fee]]
(let [converted-fee-value (* fee (get-in prices [(keyword fee-display-symbol) (keyword (:code wallet-currency)) :price]))]
[list-item/list-item
@ -208,16 +200,17 @@
:error (when-not (or gas-price-loading? gas-loading?) gas-error)
:disabled? (or gas-price-loading? gas-loading?)
:accessories (if (or gas-price-loading? gas-loading?)
[[loading-indicator]]
[[react/nested-text {:style {:color colors/gray}}
[{:style {:color colors/black}} (utils/format-decimals fee 6)]
" "
fee-display-symbol
" • "
[{:style {:color colors/black}}
(i18n/format-currency converted-fee-value (:code wallet-currency))]
" "
(str (:code wallet-currency))]
[[react/small-loading-indicator]]
[[react/view {:style {:flex-direction :row}}
[react/nested-text {:style {:color colors/gray}}
[{:style {:color colors/black}} (utils/format-decimals fee 6)]
" "
fee-display-symbol
" • "]
(if prices-loading?
[react/small-loading-indicator]
[react/text {:style {:color colors/black}} (i18n/format-currency converted-fee-value (:code wallet-currency))])
[react/text {:style {:color colors/gray}} (str " " (:code wallet-currency))]]
:chevron])
:on-press #(re-frame/dispatch
[:signing.ui/open-fee-sheet
@ -239,7 +232,8 @@
keycard-multiaccount? [:keycard-multiaccount?]
prices [:prices]
wallet-currency [:wallet/currency]
mainnet? [:mainnet?]]
mainnet? [:mainnet?]
prices-loading? [:prices-loading?]]
(let [display-symbol (wallet.utils/display-symbol token)
fee-display-symbol (wallet.utils/display-symbol (tokens/native-currency chain))]
[react/view (styles/sheet)
@ -258,9 +252,9 @@
[contact-item (i18n/label :t/to) contact]
[separator]
[token-item token display-symbol]
[amount-item prices wallet-currency amount amount-error display-symbol fee-display-symbol]
[amount-item prices wallet-currency amount amount-error display-symbol fee-display-symbol prices-loading?]
[separator]
[fee-item prices wallet-currency fee-display-symbol fee gas-error]
[fee-item prices wallet-currency fee-display-symbol fee gas-error prices-loading?]
[react/view {:align-items :center :margin-top 16 :margin-bottom 40}
(if keycard-multiaccount?
[sign-with-keycard-button amount-error gas-error]

18
src/status_im/ui/screens/wallet/account/views.cljs
View File

@ -38,14 +38,15 @@
(views/defview account-card [{:keys [address color type] :as account}]
(views/letsubs [currency [:wallet/currency]
portfolio-value [:account-portfolio-value address]
window-width [:dimensions/window-width]]
window-width [:dimensions/window-width]
prices-loading? [:prices-loading?]]
[react/view {:style (styles/card window-width color)}
[react/view {:padding 16 :padding-bottom 12 :flex 1 :justify-content :space-between}
[react/nested-text {:style {:color colors/white-transparent-persist :line-height 38
:font-weight "600" :font-size 32}}
[{:style {:color colors/white-persist}} portfolio-value]
" "
(:code currency)]
[react/view {:style {:flex-direction :row}}
(if prices-loading?
[react/small-loading-indicator :colors/white-persist]
[react/text {:style {:font-size 32 :color colors/white-persist :font-weight "600"}} portfolio-value])
[react/text {:style {:font-size 32 :color colors/white-transparent-persist :font-weight "600"}} (str " " (:code currency))]]
[react/text {:number-of-lines 1 :ellipsize-mode :middle
:style {:width (/ window-width 3)
:line-height 22 :font-size 13
@ -92,7 +93,8 @@
(views/defview assets-and-collections [address]
(views/letsubs [{:keys [tokens nfts]} [:wallet/visible-assets-with-values address]
currency [:wallet/currency]]
currency [:wallet/currency]
prices-loading? [:prices-loading?]]
(let [{:keys [tab]} @state]
[react/view {:flex 1}
[react/view {:flex-direction :row :margin-bottom 8 :padding-horizontal 4}
@ -104,7 +106,7 @@
[list/flat-list {:data tokens
:default-separator? false
:key-fn :name
:render-fn (accounts/render-asset (:code currency))}]
:render-fn (accounts/render-asset (:code currency) prices-loading?)}]
(= tab :nft)
(if (seq nfts)
[list/flat-list {:data nfts

38
src/status_im/ui/screens/wallet/accounts/views.cljs
View File

@ -19,7 +19,8 @@
(views/defview account-card [{:keys [name color address type] :as account}]
(views/letsubs [currency [:wallet/currency]
portfolio-value [:account-portfolio-value address]]
portfolio-value [:account-portfolio-value address]
prices-loading? [:prices-loading?]]
[react/touchable-highlight
{:on-press #(re-frame/dispatch [:navigate-to :wallet-account account])
:on-long-press #(re-frame/dispatch [:bottom-sheet/show-sheet
@ -27,11 +28,11 @@
:content-height 130}])}
[react/view {:style (styles/card color)}
[react/view {:flex-direction :row :align-items :center :justify-content :space-between}
[react/nested-text {:style {:color colors/white-transparent-persist
:font-weight "500" :flex-shrink 1}}
[{:style {:color colors/white-persist}} portfolio-value]
" "
(:code currency)]
[react/view {:style {:flex-direction :row}}
(if prices-loading?
[react/small-loading-indicator :colors/white-persist]
[react/text {:style {:color colors/white-persist :font-weight "500"}} portfolio-value])
[react/text {:style {:color colors/white-transparent-persist :font-weight "500"}} (str " " (:code currency))]]
[react/touchable-highlight
{:on-press #(re-frame/dispatch [:show-popover
{:view :share-account :address address}])}
@ -65,14 +66,18 @@
(when active?
[react/view {:width 24 :height 3 :border-radius 4 :background-color colors/blue}])])
(defn render-asset [currency & [on-press]]
(defn render-asset [currency prices-loading? & [on-press]]
(fn [{:keys [icon decimals amount color value] :as token}]
[list-item/list-item
(cond-> {:title-prefix (wallet.utils/format-amount amount decimals)
:title (wallet.utils/display-symbol token)
:title-color-override colors/gray
:accessibility-label (str (:symbol token) "-asset-value")
:subtitle (str (if value value 0) " " currency)
:subtitle [react/view {:style {:flex-direction :row :line-height 22}}
(if prices-loading?
[react/small-loading-indicator]
[react/text {:style {:color colors/gray}} (if value value 0)])
[react/text {:style {:color colors/gray}} (str " " currency)]]
:icon (if icon
[list/item-image icon]
[chat-icon/custom-icon-view-list (:name token) color])}
@ -81,20 +86,23 @@
(views/defview assets []
(views/letsubs [{:keys [tokens nfts]} [:wallet/all-visible-assets-with-values]
currency [:wallet/currency]]
currency [:wallet/currency]
prices-loading? [:prices-loading?]]
[list/flat-list {:data tokens
:default-separator? false
:key-fn :name
:render-fn (render-asset (:code currency))}]))
:render-fn (render-asset (:code currency) prices-loading?)}]))
(views/defview total-value []
(views/letsubs [currency [:wallet/currency]
portfolio-value [:portfolio-value]]
portfolio-value [:portfolio-value]
prices-loading? [:prices-loading?]]
[react/view {:style {:padding-horizontal 16}}
[react/nested-text {:style {:font-size 32 :color colors/gray :font-weight "600"}}
[{:style {:color colors/black}} portfolio-value]
" "
(:code currency)]
[react/view {:style {:flex-direction :row}}
(if prices-loading?
[react/small-loading-indicator]
[react/text {:style {:font-size 32 :color colors/black :font-weight "600"}} portfolio-value])
[react/text {:style {:font-size 32 :color colors/gray :font-weight "600"}} (str " " (:code currency))]]
[react/text {:style {:color colors/gray}} (i18n/label :t/wallet-total-value)]]))
(defn- request-camera-permissions []

4
src/status_im/ui/screens/wallet/send/sheets.cljs
View File

@ -11,12 +11,14 @@
(views/defview assets [address]
(views/letsubs [{:keys [tokens]} [:wallet/visible-assets-with-values address]
currency [:wallet/currency]]
currency [:wallet/currency]
prices-loading? [:prices-loading?]]
[list/flat-list
{:data tokens
:key-fn (comp str :symbol)
:render-fn (wallet.accounts/render-asset
(:code currency)
prices-loading?
#(re-frame/dispatch [:wallet.send/set-symbol (:symbol %)]))}]))
(defn render-account [field event]

BIN
test/appium/views/elements_templates/multi_account_color.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.1 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

2
test/appium/views/wallet_view.py
View File

@ -221,7 +221,7 @@ class AccountElementButton(BaseButton):
def color_matches(self, expected_color_image_name: str):
amount_text = BaseText(self.driver)
amount_text.locator = amount_text.Locator.xpath_selector(self.locator.value + "//*[@text='0 USD']")
amount_text.locator = amount_text.Locator.xpath_selector(self.locator.value + "//*[@text=' USD']")
return amount_text.is_element_image_equals_template(expected_color_image_name)