From 0be66e28c1731b448457215d0c9e667bb34c0ee6 Mon Sep 17 00:00:00 2001 From: Ibrahem Khalil Date: Mon, 4 Mar 2024 18:34:10 +0200 Subject: [PATCH] Fix collectible/token icon and name on addresses for permissions screen (#18897) --- .../wallet/account_permissions/view.cljs | 32 ++++++++++++------- .../wallet/required_tokens/view.cljs | 2 +- .../addresses_for_permissions/view.cljs | 17 +++++----- src/status_im/subs/communities.cljs | 10 ++++++ src/status_im/subs/communities_test.cljs | 21 ++++++++++++ 5 files changed, 61 insertions(+), 21 deletions(-) diff --git a/src/quo/components/wallet/account_permissions/view.cljs b/src/quo/components/wallet/account_permissions/view.cljs index 95c4b9deb4..b26f1c0598 100644 --- a/src/quo/components/wallet/account_permissions/view.cljs +++ b/src/quo/components/wallet/account_permissions/view.cljs @@ -1,5 +1,6 @@ (ns quo.components.wallet.account-permissions.view - (:require [quo.components.avatars.account-avatar.view :as account-avatar] + (:require [clojure.string :as string] + [quo.components.avatars.account-avatar.view :as account-avatar] [quo.components.dividers.divider-line.view :as divider-line] [quo.components.icon :as icons] [quo.components.markdown.text :as text] @@ -28,17 +29,24 @@ (i18n/label :t/no-relevant-tokens)] (let [token-length (dec (count tokens))] - (map-indexed (fn [idx {:keys [type token amount collectible-name collectible-img-src]}] - ^{:key idx} - [required-tokens/view - {:container-style style/token-and-text - :type type - :amount amount - :token token - :collectible-img-src collectible-img-src - :collectible-name collectible-name - :divider? (not= token-length idx)}]) - tokens)))]])) + (map-indexed + (fn [idx + {:keys [type token amount collectible-name collectible-img-src + token-img-src] + collectible-symbol :symbol}] + ^{:key idx} + [required-tokens/view + {:container-style style/token-and-text + :type type + :amount amount + :token token + :token-img-src token-img-src + :collectible-img-src collectible-img-src + :collectible-name (if (string/blank? collectible-name) + collectible-symbol + collectible-name) + :divider? (not= token-length idx)}]) + tokens)))]])) (defn- view-internal [{:keys diff --git a/src/quo/components/wallet/required_tokens/view.cljs b/src/quo/components/wallet/required_tokens/view.cljs index e8bfb2c181..6a70955570 100644 --- a/src/quo/components/wallet/required_tokens/view.cljs +++ b/src/quo/components/wallet/required_tokens/view.cljs @@ -30,7 +30,7 @@ :style {:margin-left 4}} (case type :token (str amount " " token) - :collectible collectible-name + :collectible (str amount " " collectible-name) nil)] (when divider? [rn/view diff --git a/src/status_im/contexts/communities/actions/addresses_for_permissions/view.cljs b/src/status_im/contexts/communities/actions/addresses_for_permissions/view.cljs index 16100f54c6..cdf44540ed 100644 --- a/src/status_im/contexts/communities/actions/addresses_for_permissions/view.cljs +++ b/src/status_im/contexts/communities/actions/addresses_for_permissions/view.cljs @@ -2,7 +2,6 @@ (:require [quo.core :as quo] [react-native.gesture :as gesture] [status-im.common.not-implemented :as not-implemented] - [status-im.common.resources :as resources] [status-im.constants :as constants] [utils.i18n :as i18n] [utils.money :as money] @@ -18,8 +17,8 @@ nil)) (defn- balances->components-props - [balances] - (for [{:keys [amount decimals type name] :as balance} balances] + [balances images-by-symbol] + (for [{:keys [amount decimals type name] sym :symbol :as balance} balances] (cond-> balance true (assoc :type @@ -30,22 +29,24 @@ (= type constants/community-token-type-erc721) (assoc :collectible-name name - :collectible-img-src (resources/get-mock-image :collectible)) + :collectible-img-src (images-by-symbol sym)) (= type constants/community-token-type-erc20) - (assoc :amount (str (money/token->unit amount decimals)) - :token (:symbol balance))))) + (assoc :amount (str (money/token->unit amount decimals)) + :token (:symbol balance) + :token-img-src (images-by-symbol sym))))) (defn- account-item [{:keys [color address name emoji]} _ _ {:keys [selected-addresses community-id share-all-addresses? community-color]}] - (let [balances (rf/sub [:communities/permissioned-balances-by-address community-id address])] + (let [balances (rf/sub [:communities/permissioned-balances-by-address community-id address]) + images-by-symbol (rf/sub [:communities/token-images-by-symbol community-id])] [quo/account-permissions {:account {:name name :address address :emoji emoji :customization-color color} - :token-details (balances->components-props balances) + :token-details (balances->components-props balances images-by-symbol) :checked? (contains? selected-addresses address) :disabled? share-all-addresses? :on-change #(rf/dispatch [:communities/toggle-selected-permission-address diff --git a/src/status_im/subs/communities.cljs b/src/status_im/subs/communities.cljs index d306cec4d5..8e75587c11 100644 --- a/src/status_im/subs/communities.cljs +++ b/src/status_im/subs/communities.cljs @@ -412,3 +412,13 @@ (re-frame/subscribe [:communities/airdrop-address community-id])]) (fn [[accounts airdrop-address]] (first (filter #(= (:address %) airdrop-address) accounts)))) + +(re-frame/reg-sub + :communities/token-images-by-symbol + (fn [[_ community-id]] + [(re-frame/subscribe [:communities/community community-id])]) + (fn [[{:keys [tokens-metadata]}] _] + (->> tokens-metadata + (map (fn [{sym :symbol image :image}] + {sym image})) + (into {})))) diff --git a/src/status_im/subs/communities_test.cljs b/src/status_im/subs/communities_test.cljs index adbf3f0c4f..c1bf477b51 100644 --- a/src/status_im/subs/communities_test.cljs +++ b/src/status_im/subs/communities_test.cljs @@ -505,3 +505,24 @@ :communities {community-id {:color community-color}}) (is (match? community-color (rf/sub [sub-name community-id])))))) + +(h/deftest-sub :communities/token-images-by-symbol + [sub-name] + (testing + "returns a map keyed by the images of tokens/collectibles + And has data-uri as it's values" + (swap! rf-db/app-db assoc-in + [:communities community-id :tokens-metadata] + [{:contract-addresses {:420 "0x1"} + :image "data:image/jpeg;base64,/9j/2wCEAAYEBQYFBAYGBQYH" + :tokenType 2 + :symbol "DOGE" + :name "Doge Coin coll"} + {:contract-addresses {:420 "0x1"} + :image "data:image/jpeg;base64,/9j/2wCEAAYEBQYFBAYGBQYH" + :tokenType 2 + :symbol "BTC" + :name "Bitcoin coll"}]) + (is (match? {"DOGE" "data:image/jpeg;base64,/9j/2wCEAAYEBQYFBAYGBQYH" + "BTC" "data:image/jpeg;base64,/9j/2wCEAAYEBQYFBAYGBQYH"} + (rf/sub [sub-name community-id])))))