Skip to content

Commit

Permalink
Refactors
Browse files Browse the repository at this point in the history
  • Loading branch information
ibrkhalil committed May 12, 2024
1 parent 258b1ec commit c8805b5
Show file tree
Hide file tree
Showing 11 changed files with 134 additions and 54 deletions.
36 changes: 24 additions & 12 deletions src/quo/components/avatars/account_avatar/style.cljs
Original file line number Diff line number Diff line change
Expand Up @@ -56,23 +56,35 @@


(defn root-container
[{:keys [type size customization-color]
[{:keys [type size customization-color emoji?]
:or {size default-size
customization-color :blue}}
theme]
(let [watch-only? (= type :watch-only)
width (cond-> size
(keyword? size) (container-size size))]
(cond-> {:width width
:height width
:background-color (colors/resolve-color customization-color theme)
:border-radius (get-border-radius size)
:border-color (colors/theme-colors colors/neutral-80-opa-5 colors/white-opa-5 theme)
:padding (get-padding size)
:align-items :center
:justify-content :center}
(if emoji?
(cond-> {:width width
:height width
:background-color (colors/resolve-color customization-color theme)
:border-radius (get-border-radius size)
:border-color (colors/theme-colors colors/neutral-80-opa-5 colors/white-opa-5 theme)
:padding (get-padding size)
:align-items :center
:justify-content :center}

watch-only?
(assoc :border-width (get-border-width size)
:background-color (colors/resolve-color customization-color theme 10)))))
watch-only?
(assoc :border-width (get-border-width size)
:background-color (colors/resolve-color customization-color theme 10)))
{:width width
:height width
:border-radius width
:align-items :center
:justify-content :center
:color (colors/resolve-color customization-color theme 60)
:background-color (colors/resolve-color customization-color theme 20)})))

(defn account-name
[{:keys [customization-color theme]}]
{:color (colors/resolve-color customization-color theme 60)})

20 changes: 14 additions & 6 deletions src/quo/components/avatars/account_avatar/view.cljs
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
(:require
[clojure.string :as string]
[quo.components.avatars.account-avatar.style :as style]
[quo.components.markdown.text :as text]
[quo.theme :as quo.theme]
[react-native.core :as rn]))

Expand All @@ -17,7 +18,7 @@
:customization-color - keyword or hexstring -> :blue/:army/... or #ABCEDF
:theme - keyword -> :light/:dark"
[{:keys [size emoji]
[{:keys [size emoji account-name-initials emoji?]
:or {size style/default-size
emoji "🍑"}
:as opts}]
Expand All @@ -27,8 +28,15 @@
{:accessible true
:accessibility-label :account-avatar
:style (style/root-container opts theme)}
[rn/text
{:accessibility-label :account-emoji
:adjusts-font-size-to-fit true
:style {:font-size emoji-size}}
(when emoji (string/trim emoji))]]))
(if emoji?
[rn/text
{:accessibility-label :account-emoji
:adjusts-font-size-to-fit true
:style {:font-size emoji-size}}
(when emoji (string/trim emoji))]
[text/text
{:accessibility-label :account-name
:size :heading-1
:weight :medium
:style (style/account-name opts)}
account-name-initials])]))
Original file line number Diff line number Diff line change
Expand Up @@ -30,14 +30,15 @@
:confirm-screen :screen/wallet.confirm-address-to-save
:confirm-screen-props {:button-label :t/save-address
:address-type :t/address
:placeholder :t/saved-address}}])))
:placeholder :t/address-name}}])))

(defn view
[]
(let [inset-top (safe-area/get-top)
customization-color (rf/sub [:profile/customization-color])
saved-addresses? (rf/sub [:wallet/saved-addresses?])
navigate-back (rn/use-callback #(rf/dispatch [:navigate-back]))]
(rn/use-mount #(rf/dispatch [:wallet/get-saved-addresses]))
[quo/overlay
{:type :shell
:container-style (style/page-wrapper inset-top)}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@

(defn view
[]
(let [addresses (rf/sub [:wallet/lowercased-addresses])
(let [addresses (rf/sub [:wallet/lowercased-saved-addresses])
{:keys [title description input-title accessibility-label]}
(rf/sub [:wallet/currently-added-address])
validate #(wallet.utils/validate-fn % addresses)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,12 @@
[quo.foundations.colors :as colors]
[quo.theme]
[react-native.core :as rn]
[status-im.common.emoji-picker.utils :as emoji-picker.utils]
[status-im.common.not-implemented :as not-implemented]
[status-im.constants :as constants]
[status-im.contexts.wallet.add-account.confirm-address-to-save.style :as style]
[status-im.contexts.wallet.common.screen-base.create-or-edit-account.view :as
create-or-edit-account]
[status-im.contexts.wallet.common.utils.networks :as network-utils]
[status-im.contexts.wallet.sheets.network-preferences.view :as network-preferences]
[utils.debounce :as debounce]
[utils.i18n :as i18n]
[utils.re-frame :as rf]))
Expand All @@ -31,13 +32,12 @@
sheet-closing-delay))

(defn- on-press-confirm-address-to-save
[{:keys [account-name account-emoji account-color address ens? theme]}]
[{:keys [account-name account-color address ens? theme]}]
(rf/dispatch
[:wallet/save-address
{:address address
:name account-name
:customization-color account-color
:account-emoji account-emoji
:ens (when ens? address)
:on-success #(on-success-confirm-address-to-save theme)}]))

Expand All @@ -51,19 +51,17 @@
button-label]} :confirm-screen-props} (rf/sub [:wallet/currently-added-address])
[account-name on-change-name] (rn/use-state "")
[account-color on-change-color] (rn/use-state (rand-nth colors/account-colors))
[account-emoji on-change-emoji] (rn/use-state (emoji-picker.utils/random-emoji))]
[selected-networks set-selected-networks] (rn/use-state (set constants/default-network-names))]
[:<>
[rn/view {:style style/save-address-drawer-bar-container}
[quo/drawer-bar]]
[rn/view {:style style/container}
[create-or-edit-account/view
{:placeholder (i18n/label placeholder)
:account-name account-name
:account-emoji account-emoji
:account-color account-color
:on-change-name on-change-name
:on-change-color on-change-color
:on-change-emoji on-change-emoji
:watch-only? true
:top-left-icon :i/arrow-left
:bottom-action-label button-label
Expand All @@ -74,15 +72,13 @@
{:ens? ens?
:adding-address-purpose adding-address-purpose
:account-name account-name
:account-emoji account-emoji
:account-color account-color
:address address
:theme theme})}}
[quo/data-item
{:card? true
:right-icon :i/advanced
:icon-right? true
:emoji account-emoji
:title (i18n/label address-type)
:subtitle address
:status :default
Expand All @@ -94,4 +90,26 @@
:weight :monospace}
address])
:container-style style/data-item
:on-press not-implemented/alert}]]]]))
:on-press (rn/use-callback
(fn []
(let [on-save
(fn [chain-ids]
(rf/dispatch [:hide-bottom-sheet])
(set-selected-networks (set (map #(get network-utils/id->network %)
chain-ids)))
(rf/dispatch [:wallet/update-current-address-to-save chain-ids]))]
(rf/dispatch [:show-bottom-sheet
{:content
(fn []
[network-preferences/view
{:button-label (i18n/label :t/add-preferences)
:sheet-title (i18n/label :t/add-network-preferences)
:sheet-description
(i18n/label
:t/add-saved-address-network-preferences-description)
:selected-networks selected-networks
:account {:address address
:color account-color}
:on-save on-save
:watch-only? true}])}])))
[selected-networks])}]]]]))
Original file line number Diff line number Diff line change
@@ -1,13 +1,15 @@
(ns status-im.contexts.wallet.common.screen-base.create-or-edit-account.view
(:require [quo.core :as quo]
(:require [clojure.string :as string]
[quo.core :as quo]
[quo.theme]
[react-native.core :as rn]
[react-native.safe-area :as safe-area]
[status-im.common.floating-button-page.view :as floating-button-page]
[status-im.constants :as constants]
[status-im.contexts.wallet.common.screen-base.create-or-edit-account.style :as style]
[utils.i18n :as i18n]
[utils.re-frame :as rf]))
[utils.re-frame :as rf]
[utils.string]))

(defn view
[{:keys [page-nav-right-side placeholder account-name account-color account-emoji
Expand All @@ -23,7 +25,16 @@
(merge {:size 40
:type :primary}
bottom-action-props)
(i18n/label bottom-action-label)])]
(i18n/label bottom-action-label)])
emoji? (and account-emoji (fn? on-change-emoji))
account-name-initials (when-not emoji?
(->> (string/split (if (string/blank? account-name)
placeholder
account-name)
#" ")
(map (fn [segment]
(utils.string/get-initials segment 1)))
(apply str)))]
[floating-button-page/view
{:header [quo/page-nav
{:type :no-title
Expand All @@ -40,18 +51,21 @@
[:<>
[rn/view {:style style/account-avatar-container}
[quo/account-avatar
{:customization-color account-color
:size 80
:emoji account-emoji
:type (if watch-only? :watch-only :default)}]
[quo/button
{:size 32
:type :grey
:background :photo
:icon-only? true
:on-press #(rf/dispatch [:emoji-picker/open {:on-select on-change-emoji}])
:container-style style/reaction-button-container}
:i/reaction]]
{:customization-color account-color
:size 80
:emoji account-emoji
:type (if watch-only? :watch-only :default)
:account-name-initials account-name-initials
:emoji? emoji?}]
(when emoji?
[quo/button
{:size 32
:type :grey
:background :photo
:icon-only? true
:on-press #(rf/dispatch [:emoji-picker/open {:on-select on-change-emoji}])
:container-style style/reaction-button-container}
:i/reaction])]
[quo/title-input
{:placeholder placeholder
:max-length constants/wallet-account-name-max-length
Expand Down
17 changes: 16 additions & 1 deletion src/status_im/contexts/wallet/save_address/events.cljs
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,10 @@
(:require
[clojure.set :as set]
[clojure.string :as string]
[status-im.common.qr-codes.view :refer [get-network-short-name-url]]
[status-im.constants :as constants]
[status-im.contexts.wallet.common.utils :as wallet.utils]
[status-im.contexts.wallet.common.utils.networks :as network.utils]
[utils.re-frame :as rf]))

(def ^:private <-rpc-spec
Expand Down Expand Up @@ -45,7 +47,20 @@
(rf/reg-event-fx
:wallet/get-saved-addresses-success
(fn [{:keys [db]} [saved-addresses]]
{:db (assoc-in db [:wallet :saved-addresses] (<-rpc saved-addresses))}))
{:db (assoc-in db [:wallet :saved-addresses] (group-by :address (<-rpc saved-addresses)))}))

(rf/reg-event-fx
:wallet/update-current-address-to-save
(fn [{:keys [db]} [chain-ids]]
(let [chain-strings (apply str
(map (comp get-network-short-name-url
network.utils/id->network)
chain-ids))
current-address-to-save-path [:wallet :ui :currently-added-address]
old-saved-address (get-in db current-address-to-save-path)]
{:db (assoc-in db
current-address-to-save-path
(assoc old-saved-address :chainShortNames chain-strings))})))

(rf/reg-event-fx
:wallet/get-saved-addresses-error
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
[utils.re-frame :as rf]))

(defn view
[{:keys [selected-networks account watch-only?]}]
[{:keys [selected-networks account watch-only? sheet-title sheet-description]}]
(let [state (reagent/atom :default)
{:keys [color address
network-preferences-names]} (or account (rf/sub [:wallet/current-viewing-account]))
Expand Down Expand Up @@ -51,10 +51,11 @@
:blur-amount 20
:blur-radius 25}])
[quo/drawer-top
{:title (i18n/label :t/network-preferences)
:description (if watch-only?
(i18n/label :t/network-preferences-desc-1)
(i18n/label :t/network-preferences-desc-2))
{:title (or sheet-title (i18n/label :t/network-preferences))
:description (or sheet-description
(if watch-only?
(i18n/label :t/network-preferences-desc-1)
(i18n/label :t/network-preferences-desc-2)))
:blur? blur?}]
[quo/data-item
{:status :default
Expand Down
4 changes: 2 additions & 2 deletions src/status_im/subs/wallet/saved_addresses.cljs
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@

(rf/reg-sub
:wallet/saved-addresses?
:<- [:wallet]
(fn [{:keys [saved-addresses]}]
:<- [:wallet/saved-addresses]
(fn [saved-addresses]
(-> saved-addresses seq boolean)))

(rf/reg-sub
Expand Down
8 changes: 8 additions & 0 deletions src/status_im/subs/wallet/wallet.cljs
Original file line number Diff line number Diff line change
Expand Up @@ -224,6 +224,14 @@
(fn [addresses]
(map string/lower-case addresses)))

(rf/reg-sub
:wallet/lowercased-saved-addresses
:<- [:wallet/saved-addresses]
(fn [saved-addresses]
(->> saved-addresses
keys
(map string/lower-case))))

(rf/reg-sub
:wallet/balances-in-selected-networks
:<- [:wallet/accounts]
Expand Down
5 changes: 4 additions & 1 deletion translations/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -2617,5 +2617,8 @@
"at-least-one-network-must-be-activated": "At least 1 network must be activated",
"status-is-a-secure-messaging-app": "Status is a secure messaging app, crypto wallet and web3 browser built with the state of the art technology",
"save-address-description": "Paste, scan or type ETH address or ENS name",
"address-saved": "Address saved"
"address-saved": "Address saved",
"add-preferences": "Add preferences",
"add-network-preferences": "Add network preferences",
"add-saved-address-network-preferences-description": "Only change if you know which networks the address owner is happy to to receive funds on."
}

0 comments on commit c8805b5

Please sign in to comment.