diff --git a/src/status_im/components/button/styles.cljs b/src/status_im/components/button/styles.cljs new file mode 100644 index 0000000000..3f1ebc7264 --- /dev/null +++ b/src/status_im/components/button/styles.cljs @@ -0,0 +1,57 @@ +(ns status-im.components.button.styles + (:require [status-im.components.styles :as st])) + +(def border-color st/color-white-transparent-2) + +(def button-borders + {:background-color border-color + :margin 5 + :border-radius 8}) + +(def action-buttons-container + (merge + button-borders + {:flex-direction :row})) + +(def action-button + {:flex-basis 0 + :flex 1 + :align-items :center}) + +(def action-button-center + (merge action-button + {:border-color border-color + :border-left-width 1 + :border-right-width 1})) + +(def action-button-text + {:font-size 18 + :font-weight "normal" + :color st/color-white + :padding-horizontal 16 + :padding-vertical 9}) + +(def primary-button + (merge + action-button + button-borders + {:background-color st/color-blue4})) + +(def primary-button-text + (merge + action-button-text + {:color st/color-white})) + +(def secondary-button + (merge + action-button + button-borders + {:background-color st/color-blue4-transparent})) + +(def secondary-button-text + (merge + action-button-text + {:color st/color-blue4})) + +(def action-button-text-disabled + (merge action-button-text {:opacity 0.4})) \ No newline at end of file diff --git a/src/status_im/components/button/view.cljs b/src/status_im/components/button/view.cljs new file mode 100644 index 0000000000..da09ac8138 --- /dev/null +++ b/src/status_im/components/button/view.cljs @@ -0,0 +1,33 @@ +(ns status-im.components.button.view + (:require [cljs.spec.alpha :as s] + [status-im.components.button.styles :as cst] + [status-im.components.react :as rn])) + +(defn button [{:keys [on-press style text text-style disabled?] + :or {style cst/action-button}}] + [rn/touchable-highlight (when (and on-press (not disabled?)) {:on-press on-press}) + [rn/view {:style style} + [rn/text {:style (or text-style + (if disabled? cst/action-button-text-disabled cst/action-button-text)) + :font :medium + :uppercase? false} + text]]]) + +(defn primary-button [m] + (button (merge {:style cst/primary-button :text-style cst/primary-button-text} m))) + +(defn secondary-button [m] + (button (merge {:style cst/secondary-button :text-style cst/secondary-button-text} m))) + +(defn- first-or-last [i v] (or (zero? i) (= i (dec (count v))))) + +(defn- button-style [i v] (if (first-or-last i v) cst/action-button cst/action-button-center)) + +(defn buttons + ([v] (buttons {} v)) + ([m v] + [rn/view {:style (merge cst/action-buttons-container m)} + (doall + (map-indexed + (fn [i m] ^{:key i} [button (merge m {:style (button-style i v)})]) + v))])) \ No newline at end of file diff --git a/src/status_im/components/list/styles.cljs b/src/status_im/components/list/styles.cljs new file mode 100644 index 0000000000..e2b7a6763f --- /dev/null +++ b/src/status_im/components/list/styles.cljs @@ -0,0 +1,34 @@ +(ns status-im.components.list.styles + (:require [status-im.components.styles :as st] + [status-im.utils.platform :as p])) + +(def item + {:flex 1 + :flex-direction :row}) + +(def item-text-view + {:flex 1 + :flex-direction :column}) + +(def primary-text + {:font-size 20 + :color st/color-black + :margin-top 13}) + +(def secondary-text + {:font-size 16 + :color st/color-gray4 + :margin-top 6}) + +(def item-icon + {:width 40 + :height 40 + :margin 14}) + +(def primary-action item-icon) + +(def secondary-action item-icon) + +(def action-buttons + {:flex 1 + :flex-direction :row}) \ No newline at end of file diff --git a/src/status_im/components/list/views.cljs b/src/status_im/components/list/views.cljs new file mode 100644 index 0000000000..49df5d08ca --- /dev/null +++ b/src/status_im/components/list/views.cljs @@ -0,0 +1,23 @@ +(ns status-im.components.list.views + (:require [status-im.components.react :as rn] + [reagent.core :as r] + [status-im.components.common.common :as common] + [status-im.utils.platform :as p])) + +(def flat-list-class (rn/get-class "FlatList")) + +(defn- wrap-render-fn [f] + (fn [o] + (let [{:keys [item index separators]} (js->clj o :keywordize-keys true)] + (r/as-element (f item index separators))))) + +(defn flat-list + "A wrapper for FlatList. + See https://facebook.github.io/react-native/docs/flatlist.html" + ([data render-fn] (flat-list data render-fn {})) + ([data render-fn props] + [flat-list-class (merge {:data (clj->js data) + :renderItem (wrap-render-fn render-fn) + :keyExtractor (fn [_ i] i)} + (when p/ios? {:ItemSeparatorComponent (fn [] (r/as-element [common/list-separator]))}) + props)])) \ No newline at end of file diff --git a/src/status_im/components/main_tabs.cljs b/src/status_im/components/main_tabs.cljs index 8f33060c42..5d40727d5d 100644 --- a/src/status_im/components/main_tabs.cljs +++ b/src/status_im/components/main_tabs.cljs @@ -10,7 +10,7 @@ [status-im.ui.screens.chats-list.views :refer [chats-list]] [status-im.ui.screens.discover.views :refer [discover]] [status-im.ui.screens.contacts.views :refer [contact-groups-list]] - [status-im.ui.screens.wallet.main-screen.views :refer [wallet]] + [status-im.ui.screens.wallet.main.views :refer [wallet]] [status-im.utils.config :as config] [status-im.components.tabs.views :refer [tabs]] [status-im.components.tabs.styles :as st] diff --git a/src/status_im/components/react.cljs b/src/status_im/components/react.cljs index 50c4375848..d37b6bbccb 100644 --- a/src/status_im/components/react.cljs +++ b/src/status_im/components/react.cljs @@ -40,7 +40,6 @@ (def list-view-class (get-class "ListView")) (def scroll-view (get-class "ScrollView")) -(def flat-list-class (get-class "FlatList")) (def web-view (get-class "WebView")) (def keyboard-avoiding-view-class (get-class "KeyboardAvoidingView")) @@ -106,19 +105,7 @@ :resizeMode "contain" :style style}])) -(defn- wrap-render-fn [f] - (fn [o] - (let [{:keys [item index separators]} (js->clj o :keywordize-keys true)] - (r/as-element (f item index separators))))) - -(defn flat-list - "A function wrapping the creation of FlatList. - See https://facebook.github.io/react-native/docs/flatlist.html" - ([data render-fn] (flat-list data render-fn {})) - ([data render-fn props] - [flat-list-class (merge {:data (clj->js data) :renderItem (wrap-render-fn render-fn) :keyExtractor (fn [_ i] i)} props)])) - -;; TODO Migrate to new FlatList and SectionList when appropriate. ListView will eventually get deprecated +;; TODO Migrate to new FlatList and SectionList when appropriate (see components.list). ListView will eventually get deprecated ;; see https://facebook.github.io/react-native/docs/using-a-listview.html (defn list-view [props] [list-view-class (merge {:enableEmptySections true} props)]) diff --git a/src/status_im/components/styles.cljs b/src/status_im/components/styles.cljs index 2b2ea2e147..c536072896 100644 --- a/src/status_im/components/styles.cljs +++ b/src/status_im/components/styles.cljs @@ -5,6 +5,7 @@ (def color-blue2 "#5b6dee") (def color-blue3 "#424fae") (def color-blue4 "#4360df") +(def color-blue4-transparent "rgba(67, 96, 223, 0.10)") (def color-blue5 "#3c56c8") (def color-blue-transparent "#7099e632") (def color-black "#000000") diff --git a/src/status_im/translations/en.cljs b/src/status_im/translations/en.cljs index 4830ad468e..b5faaf438d 100644 --- a/src/status_im/translations/en.cljs +++ b/src/status_im/translations/en.cljs @@ -329,5 +329,8 @@ :testfairy-message "You are using app installed from a nightly build. For testing purposes this build includes session recording if wifi connection is used, so all your interaction with app is saved (as video and log) and might be used by development team to investigate possible issues. Saved video/log do not include your passwords. Recording is done only if app is installed from a nightly build. Nothing is recorded if app is installed from PlayStore or TestFlight." ;; wallet - :transactions "Transactions" - :transactions-sign-all "Sign all"}) + :transactions "Transactions" + :transactions-to "To" + :transactions-sign "Sign" + :transactions-sign-all "Sign all" + :transactions-delete "Delete"}) diff --git a/src/status_im/ui/screens/wallet/history/styles.cljs b/src/status_im/ui/screens/wallet/history/styles.cljs index da5f5c142c..d2a21de376 100644 --- a/src/status_im/ui/screens/wallet/history/styles.cljs +++ b/src/status_im/ui/screens/wallet/history/styles.cljs @@ -1,46 +1,14 @@ (ns status-im.ui.screens.wallet.history.styles - (:require-macros [status-im.utils.styles :refer [defnstyle]]) - (:require [status-im.components.styles :as common])) + (:require [status-im.components.styles :as st])) (def wallet-transactions-container {:flex 1 - :background-color common/color-white}) + :background-color st/color-white}) -(def toolbar-buttons-container - {:flex-direction :row - :flex-shrink 1 - :justify-content :space-between - :width 68 - :margin-right 12}) - -(def item - {:flex-direction :row - :flex 1}) - -(def item-text-view - {:flex 1 - :flex-direction :column}) - -(def primary-text - {:flex 1 - :font-size 16 - :color common/color-black}) - -(def secondary-text - {:font-size 16 - :color common/color-gray4}) - -(def item-icon - {:width 40 - :height 40}) - -(def secondary-action - (merge item-icon {:align-self "flex-end"})) - -;;;;;;;;;;;;;;;;;; -;; Main section ;; -;;;;;;;;;;;;;;;;;; +(def toolbar-right-action + {:color st/color-blue4 + :font-size 18 + :margin-right 12}) (def main-section - {:padding 16 - :background-color common/color-white}) \ No newline at end of file + {:background-color st/color-white}) \ No newline at end of file diff --git a/src/status_im/ui/screens/wallet/history/views.cljs b/src/status_im/ui/screens/wallet/history/views.cljs index d4b325d105..dda6d0922a 100644 --- a/src/status_im/ui/screens/wallet/history/views.cljs +++ b/src/status_im/ui/screens/wallet/history/views.cljs @@ -1,13 +1,16 @@ (ns status-im.ui.screens.wallet.history.views (:require-macros [status-im.utils.views :refer [defview]]) - (:require [status-im.components.react :as rn] + (:require [status-im.components.button.view :as btn] + [status-im.components.react :as rn] + [status-im.components.list.styles :as list-st] + [status-im.components.list.views :as list] [status-im.components.toolbar-new.view :as toolbar] [status-im.ui.screens.wallet.history.styles :as st] [status-im.i18n :as i18n])) (defn unsigned-action [] - [rn/view {:style st/toolbar-buttons-container} - [rn/text (i18n/label :t/transactions-sign-all)]]) + [rn/text {:style st/toolbar-right-action} + (i18n/label :t/transactions-sign-all)]) (defn toolbar-view [] [toolbar/toolbar @@ -22,24 +25,27 @@ (defn render-transaction [item] - [rn/view {:style st/item} - + [rn/view {:style list-st/item} [rn/image {:source {:uri :console} - :style st/item-icon}] -#_ - [rn/icon :dropdown-white #_(icon-status (:status item)) st/item-icon] - - [rn/view {:style st/item-text-view} + :style list-st/item-icon}] + [rn/view {:style list-st/item-text-view} (let [m (:content item)] - [rn/text {:style st/primary-text} (str (:value m) " " (:symbol m))]) - [rn/text {:style st/secondary-text} (:to item)]] - [rn/icon :forward_gray st/secondary-action]]) + [rn/text {:style list-st/primary-text} (str (:value m) " " (:symbol m))]) + [rn/text {:style list-st/secondary-text} (str (i18n/label :t/transactions-to) " " (:to item))] + [rn/view {:style list-st/action-buttons} + [btn/primary-button {:text (i18n/label :t/transactions-sign)}] + [btn/secondary-button {:text (i18n/label :t/transactions-delete)}]]] + [rn/icon :forward_gray list-st/secondary-action]]) + +(def dummy-transaction-data + [{:to "0xAAAAA" :content {:value "0,4909" :symbol "ETH"}} + {:to "0xAAAAA" :content {:value "10000" :symbol "SGT"}}]) (defn main-section [] [rn/view {:style st/main-section} - (rn/flat-list [{:to "0xAAAAA" :content {:value "5" :symbol "ETH"} :status :pending} - {:from "0xAAAAA" :content {:value "5" :symbol "ETH"} :status :sent} - {:to "0xAAAAA" :content {:value "5" :symbol "ETH"} :status :pending}] render-transaction)]) + [list/flat-list dummy-transaction-data render-transaction]]) + +;; TODO must reflect selected wallet (defview wallet-transactions [] [] diff --git a/src/status_im/ui/screens/wallet/main_screen/styles.cljs b/src/status_im/ui/screens/wallet/main/styles.cljs similarity index 76% rename from src/status_im/ui/screens/wallet/main_screen/styles.cljs rename to src/status_im/ui/screens/wallet/main/styles.cljs index 1d6676dc35..498e760b39 100644 --- a/src/status_im/ui/screens/wallet/main_screen/styles.cljs +++ b/src/status_im/ui/screens/wallet/main/styles.cljs @@ -1,4 +1,4 @@ -(ns status-im.ui.screens.wallet.main-screen.styles +(ns status-im.ui.screens.wallet.main.styles (:require-macros [status-im.utils.styles :refer [defstyle defnstyle]]) (:require [status-im.components.styles :as common] [status-im.utils.platform :as platform])) @@ -81,37 +81,8 @@ {:font-size 12 :color common/color-green-2}) -;;;;;;;;;;;;;;;;;;;; -;; Action buttons ;; -;;;;;;;;;;;;;;;;;;;; - -(def action-buttons-container - {:flex-direction :row - :background-color common/color-white-transparent-2 - :margin-top 34 - :margin-left 5 - :margin-right 5 - :border-radius 4}) - -(def action-button - {:padding-vertical 13 - :padding-horizontal 18 - :flex-basis 0 - :flex 1 - :align-items :center}) - -(def action-button-center - (merge action-button - {:border-color common/color-white-transparent-2 - :border-left-width 1 - :border-right-width 1})) - -(def action-button-text - {:font-size 13 - :color common/color-white}) - -(def action-button-text-disabled - (merge action-button-text {:opacity 0.4})) +(def buttons + {:margin-top 34}) ;;;;;;;;;;;;;;;;;;;; ;; Assets section ;; diff --git a/src/status_im/ui/screens/wallet/main_screen/views.cljs b/src/status_im/ui/screens/wallet/main/views.cljs similarity index 71% rename from src/status_im/ui/screens/wallet/main_screen/views.cljs rename to src/status_im/ui/screens/wallet/main/views.cljs index 90b9109769..0f2488ce17 100644 --- a/src/status_im/ui/screens/wallet/main_screen/views.cljs +++ b/src/status_im/ui/screens/wallet/main/views.cljs @@ -1,8 +1,9 @@ -(ns status-im.ui.screens.wallet.main-screen.views +(ns status-im.ui.screens.wallet.main.views (:require-macros [status-im.utils.views :refer [defview]]) (:require [clojure.string :as string] [re-frame.core :as rf] [status-im.components.common.common :as common] + [status-im.components.button.view :as btn] [status-im.components.drawer.view :as drawer] [status-im.components.react :as rn] [status-im.components.toolbar-new.view :as toolbar] @@ -10,7 +11,7 @@ [status-im.i18n :as i18n] [status-im.utils.listview :as lw] [status-im.utils.platform :as platform] - [status-im.ui.screens.wallet.main-screen.styles :as st])) + [status-im.ui.screens.wallet.main.styles :as st])) (defn toolbar-title [] [rn/view {:style st/toolbar-title-container} @@ -30,30 +31,6 @@ :custom-content [toolbar-title] :custom-action [toolbar-buttons]}]) -;; TODO: Use standard signature and move to action-button namespace -(defn action-button [{:keys [on-press view-style text-style text]}] - [rn/touchable-highlight {:on-press on-press} - [rn/view {:style view-style} - [rn/text {:style text-style - :font :medium - :uppercase? false} text]]]) - -;; TODO: button to go to send screen -(defn action-buttons [] - [rn/view {:style st/action-buttons-container} - [action-button {:on-press #(rf/dispatch [:navigate-to :wallet-send-transaction]) - :view-style st/action-button - :text-style st/action-button-text - :text "Send"}] - [action-button {:on-press #(rf/dispatch [:navigate-to :wallet-request-transaction]) - :view-style st/action-button-center - :text-style st/action-button-text - :text "Request"}] - [action-button {:on-press (fn [] ) - :view-style st/action-button - :text-style st/action-button-text-disabled - :text "Exchange"}]]) - (defn main-section [] [rn/view {:style st/main-section} [rn/view {:style st/total-balance-container} @@ -64,7 +41,13 @@ [rn/text {:style st/value-variation-title} "Total value"] [rn/view {:style st/today-variation-container} [rn/text {:style st/today-variation} "+5.43%"]]] - [action-buttons]]]) + [btn/buttons st/buttons + [{:text "Send" + :on-press #(rf/dispatch [:navigate-to :wallet-send-transaction])} + {:text "Request" + :on-press #(rf/dispatch [:navigate-to :wallet-request-transaction])} + {:text "Exchange" + :disabled? true}]]]]) (defn asset-list-item [[id {:keys [currency amount] :as row}]] [rn/view {:style st/asset-item-container} diff --git a/src/status_im/ui/screens/wallet/send/styles.cljs b/src/status_im/ui/screens/wallet/send/styles.cljs index b20e36ab38..1701702757 100644 --- a/src/status_im/ui/screens/wallet/send/styles.cljs +++ b/src/status_im/ui/screens/wallet/send/styles.cljs @@ -1,17 +1,12 @@ (ns status-im.ui.screens.wallet.send.styles - (:require-macros [status-im.utils.styles :refer [defstyle defnstyle]]) - (:require [status-im.components.styles :as common] - [status-im.utils.platform :as platform])) - -;; XXX: Copy paste from main wallet -;; TODO: Transfer to common space + (:require [status-im.components.styles :as st])) (def wallet-container {:flex 1 - :background-color common/color-white}) + :background-color st/color-white}) (def toolbar - {:background-color common/color-blue5 + {:background-color st/color-blue5 :elevation 0}) (def toolbar-title-container @@ -20,7 +15,7 @@ :margin-left 6}) (def toolbar-title-text - {:color common/color-white + {:color st/color-white :font-size 17 :margin-right 4}) @@ -36,128 +31,4 @@ :flex-shrink 1 :justify-content :space-between :width 68 - :margin-right 12}) - -;;;;;;;;;;;;;;;;;; -;; Main section ;; -;;;;;;;;;;;;;;;;;; - -(def main-section - {:padding 16 - :background-color common/color-blue4}) - -(def total-balance-container - {:margin-top 18 - :align-items :center - :justify-content :center}) - -(def total-balance - {:flex-direction :row}) - -(def total-balance-value - {:font-size 37 - :color common/color-white}) - -(def total-balance-currency - {:font-size 37 - :margin-left 9 - :color common/color-white - :opacity 0.4}) - -(def value-variation - {:flex-direction :row - :align-items :center}) - -(def value-variation-title - {:font-size 14 - :color common/color-white - :opacity 0.6}) - -(def today-variation-container - {:border-radius 4 - :margin-left 8 - :padding-horizontal 8 - :padding-vertical 4 - :background-color common/color-green-1}) - -(def today-variation - {:font-size 12 - :color common/color-green-2}) - -;;;;;;;;;;;;;;;;;;;; -;; Action buttons ;; -;;;;;;;;;;;;;;;;;;;; - -(def action-buttons-container - {:flex-direction :row - :background-color common/color-white-transparent-2 - :margin-top 34 - :margin-left 5 - :margin-right 5 - :border-radius 4}) - -(def action-button - {:padding-vertical 13 - :padding-horizontal 18 - :flex-basis 0 - :flex 1 - :align-items :center}) - -(def action-button-center - (merge action-button - {:border-color common/color-white-transparent-2 - :border-left-width 1 - :border-right-width 1})) - -(def action-button-text - {:font-size 13 - :color common/color-white}) - -(def action-button-text-disabled - (merge action-button-text {:opacity 0.4})) - -;;;;;;;;;;;;;;;;;;;; -;; Assets section ;; -;;;;;;;;;;;;;;;;;;;; - -(def asset-section - {:background-color common/color-white - :padding-vertical 16}) - -(def asset-section-title - {:font-size 14 - :margin-left 16 - :color common/color-gray4}) - -(def asset-item-container - {:flex-direction :row - :align-items :center - :padding 12}) - -(def asset-item-currency-icon - {:height 40 - :width 40 - :margin-right 14}) - -(def asset-item-value-container - {:flex 1 - :flex-direction :row}) - -(def asset-item-value - {:font-size 16 - :color common/color-black}) - -(def asset-item-currency - {:font-size 16 - :color common/color-gray4 - :margin-left 6}) - -(def asset-item-details-icon - {:flex-shrink 1 - :height 24 - :width 24}) - -(def asset-list-separator - {:margin-left 70 - :border-bottom-width 1 - :border-color common/color-separator}) + :margin-right 12}) \ No newline at end of file diff --git a/src/status_im/ui/screens/wallet/send/views.cljs b/src/status_im/ui/screens/wallet/send/views.cljs index 2c2b1e3fca..be0de42a7b 100644 --- a/src/status_im/ui/screens/wallet/send/views.cljs +++ b/src/status_im/ui/screens/wallet/send/views.cljs @@ -1,101 +1,28 @@ (ns status-im.ui.screens.wallet.send.views (:require-macros [status-im.utils.views :refer [defview]]) - (:require [clojure.string :as string] - [re-frame.core :as rf] - [status-im.components.common.common :as common] - [status-im.components.drawer.view :as drawer] + (:require [re-frame.core :as rf] [status-im.components.react :as rn] [status-im.components.toolbar-new.view :as toolbar] - [status-im.components.toolbar-new.actions :as act] - [status-im.i18n :as i18n] - [status-im.utils.listview :as lw] - [status-im.utils.platform :as platform] - [status-im.ui.screens.wallet.main-screen.styles :as st])) - -;; XXX Copy paste from main-screen ns + [status-im.ui.screens.wallet.send.styles :as cst])) (defn toolbar-title [] - [rn/view {:style st/toolbar-title-container} - [rn/text {:style st/toolbar-title-text + [rn/view {:style cst/toolbar-title-container} + [rn/text {:style cst/toolbar-title-text :font :toolbar-title} - "Send Transaction"] - [rn/icon :dropdown_white st/toolbar-title-icon]]) + "Send Transaction"]]) (defn toolbar-buttons [] - [rn/view {:style st/toolbar-buttons-container} - [rn/icon :dots_vertical_white st/toolbar-icon] - [rn/icon :qr_white st/toolbar-icon]]) + [rn/view {:style cst/toolbar-buttons-container} + [rn/icon :dots_vertical_white cst/toolbar-icon] + [rn/icon :qr_white cst/toolbar-icon]]) (defn toolbar-view [] - [toolbar/toolbar {:style st/toolbar - :nav-action (act/list-white #(rf/dispatch [:navigate-to-modal :unsigned-transactions])) + [toolbar/toolbar {:style cst/toolbar :custom-content [toolbar-title] :custom-action [toolbar-buttons]}]) -(defn action-buttons [] - [rn/view {:style st/action-buttons-container} - [rn/view {:style st/action-button} - [rn/text {:style st/action-button-text - :font :medium - :uppercase? true} "Send"]] - [rn/view {:style st/action-button-center} - [rn/text {:style st/action-button-text - :font :medium - :uppercase? true} "Request"]] - [rn/view {:style st/action-button} - [rn/text {:style st/action-button-text-disabled - :font :medium - :uppercase? true} "Exchange"]]]) - -(defn main-section [] - [rn/view {:style st/main-section} - [rn/view {:style st/total-balance-container} - [rn/view {:style st/total-balance} - [rn/text {:style st/total-balance-value} "12.43"] - [rn/text {:style st/total-balance-currency} "USD"]] - [rn/view {:style st/value-variation} - [rn/text {:style st/value-variation-title} "Total value"] - [rn/view {:style st/today-variation-container} - [rn/text {:style st/today-variation} "+5.43%"]]] - [action-buttons]]]) - -(defn asset-list-item [[id {:keys [currency amount] :as row}]] - [rn/view {:style st/asset-item-container} - [rn/image {:source {:uri :launch_logo} - :style st/asset-item-currency-icon}] - [rn/view {:style st/asset-item-value-container} - [rn/text {:style st/asset-item-value} (str amount)] - [rn/text {:style st/asset-item-currency - :uppercase? true} - id]] - [rn/icon :forward_gray st/asset-item-details-icon]]) - -(defn render-separator-fn [assets-count] - (fn [_ row-id _] - (rn/list-item - ^{:key row-id} - [common/separator {} st/asset-list-separator]))) - -(defn render-row-fn [row _ _] - (rn/list-item - [rn/touchable-highlight {:on-press #()} - [rn/view - [asset-list-item row]]])) - -(defn asset-section [] - (let [assets {"eth" {:currency :eth :amount 0.445} - "snt" {:currency :snt :amount 1} - "gno" {:currency :gno :amount 0.024794}}] - [rn/view {:style st/asset-section} - [rn/text {:style st/asset-section-title} "Assets"] - [rn/list-view {:dataSource (lw/to-datasource assets) - :renderSeparator (when platform/ios? (render-separator-fn (count assets))) - :renderRow render-row-fn}]])) - (defview send-transaction [] [] - [rn/view {:style st/wallet-container} + [rn/view {:style cst/wallet-container} [toolbar-view] - [rn/scroll-view - [main-section] - [asset-section]]]) + [rn/text "Nothing here yet!"]]) diff --git a/src/status_im/utils/styles.clj b/src/status_im/utils/styles.clj index eb4165ebd6..783116baab 100644 --- a/src/status_im/utils/styles.clj +++ b/src/status_im/utils/styles.clj @@ -11,13 +11,13 @@ (defmacro defstyle "Defines style symbol. - Style parameter may contain plaform specific style: + Style parameter may contain platform specific style: {:width 100 :height 125 :ios {:height 20} :android {:margin-top 3}} - Reuslting style for Android: + Resulting style for Android: {:width 100 :height 125 :margin-top 3} @@ -31,7 +31,7 @@ (defmacro defnstyle "Defines style function. - Style parameter may contain plaform specific style: + Style parameter may contain platform specific style: {:width 100 :height (* a 2) :ios {:height (/ a 2)}