Skip to content

Commit d3aab2b

Browse files
vkjryevh-berdnyk
vkjr
authored and
yevh-berdnyk
committed
Connect collectible overview page to backend (#17884)
1 parent a1b2721 commit d3aab2b

File tree

9 files changed

+109
-92
lines changed

9 files changed

+109
-92
lines changed

‎src/status_im/ethereum/subscriptions.cljs

+3
Original file line numberDiff line numberDiff line change
@@ -82,4 +82,7 @@
8282
"wallet-owned-collectibles-filtering-done" {:fx [[:dispatch
8383
[:wallet/owned-collectibles-filtering-done
8484
event]]]}
85+
"wallet-get-collectibles-details-done" {:fx [[:dispatch
86+
[:wallet/get-collectible-details-done
87+
event]]]}
8588
(log/warn ::unknown-wallet-event :type type :event event)))

‎src/status_im2/contexts/profile/config.cljs

+1-2
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,7 @@
88

99
(defn login
1010
[]
11-
{;; Temporary fix until https://github.com/status-im/status-go/issues/3024 is
12-
;; resolved
11+
{;; Temporary fix until https://github.com/status-im/status-go/issues/3024 is resolved
1312
:wakuV2Nameserver "8.8.8.8"
1413
:openseaAPIKey config/opensea-api-key
1514
:poktToken config/POKT_TOKEN

‎src/status_im2/contexts/wallet/collectible/style.cljs

+14-6
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,15 @@
44
{:margin-top 100
55
:margin-bottom 34})
66

7-
(def preview
7+
(def preview-container
88
{:margin-horizontal 8
99
:margin-top 12})
1010

11+
(def preview
12+
{:width "100%"
13+
:aspect-ratio 1
14+
:border-radius 16})
15+
1116
(def header
1217
{:margin-horizontal 20
1318
:margin-top 16
@@ -17,6 +22,9 @@
1722
{:flex-direction :row
1823
:margin-top 6})
1924

25+
(def collection-avatar-container
26+
{:margin-right 8})
27+
2028
(def buttons-container
2129
{:flex-direction :row
2230
:align-items :stretch
@@ -50,13 +58,13 @@
5058
{:margin-left 6
5159
:flex 1})
5260

53-
(def traits-section
54-
{:margin-horizontal 20
55-
:margin-top 8})
61+
(def traits-title-container
62+
{:margin-left 20
63+
:margin-top 8})
5664

5765
(def traits-item
58-
{:margin-horizontal 6
59-
:flex 1})
66+
{:margin 6
67+
:flex 1})
6068

6169
(def traits-container
6270
{:margin-horizontal 14

‎src/status_im2/contexts/wallet/collectible/view.cljs

+34-30
Original file line numberDiff line numberDiff line change
@@ -4,17 +4,18 @@
44
[react-native.core :as rn]
55
[status-im2.common.scroll-page.view :as scroll-page]
66
[status-im2.contexts.wallet.collectible.style :as style]
7-
[status-im2.contexts.wallet.common.temp :as temp]
8-
[utils.i18n :as i18n]))
7+
[utils.i18n :as i18n]
8+
[utils.re-frame :as rf]))
99

1010
(defn header
11-
[{:keys [name description collection-image]}]
11+
[{:keys [name description collection-image-url]}]
1212
[rn/view {:style style/header}
1313
[quo/text
1414
{:weight :semi-bold
1515
:size :heading-1} name]
16-
[rn/view style/collection-container
17-
[quo/collection-avatar {:image collection-image}]
16+
[rn/view {:style style/collection-container}
17+
[rn/view {:style style/collection-avatar-container}
18+
[quo/collection-avatar {:image collection-image-url}]]
1819
[quo/text
1920
{:weight :semi-bold
2021
:size :paragraph-1}
@@ -57,25 +58,26 @@
5758

5859
(defn traits-section
5960
[traits]
60-
[rn/view {:style style/traits-section}
61-
[quo/section-label
62-
{:section (i18n/label :t/traits)}]]
63-
64-
[rn/flat-list
65-
{:render-fn (fn [{:keys [title subtitle]}]
66-
[rn/view {:style style/traits-item}
67-
[quo/data-item
68-
{:description :default
69-
:card? true
70-
:status :default
71-
:size :default
72-
:title title
73-
:subtitle subtitle}]])
74-
:data traits
75-
:key :collectibles-list
76-
:key-fn :id
77-
:num-columns 2
78-
:content-container-style style/traits-container}])
61+
(when (pos? (count traits))
62+
[rn/view
63+
[quo/section-label
64+
{:section (i18n/label :t/traits)
65+
:container-style style/traits-title-container}]
66+
[rn/flat-list
67+
{:render-fn (fn [{:keys [trait-type value]}]
68+
[quo/data-item
69+
{:description :default
70+
:card? true
71+
:status :default
72+
:size :default
73+
:title trait-type
74+
:subtitle value
75+
:container-style style/traits-item}])
76+
:data traits
77+
:key :collectibles-list
78+
:key-fn :id
79+
:num-columns 2
80+
:content-container-style style/traits-container}]]))
7981

8082
(defn info
8183
[]
@@ -103,7 +105,8 @@
103105

104106
(defn view
105107
[]
106-
(let [{:keys [name description image traits] :as props} temp/collectible-details]
108+
(let [collectible-details (rf/sub [:wallet/last-collectible-details])
109+
{:keys [name description preview-url traits]} collectible-details]
107110
[scroll-page/scroll-page
108111
{:navigate-back? true
109112
:height 148
@@ -112,12 +115,13 @@
112115
:description description
113116
:right-side [{:icon-name :i/options
114117
:on-press #(js/alert "pressed")}]
115-
:picture image}}
118+
:picture preview-url}}
116119
[rn/view {:style style/container}
117-
[rn/image
118-
{:source image
119-
:style style/preview}]
120-
[header props]
120+
[rn/view {:style style/preview-container}
121+
[rn/image
122+
{:source preview-url
123+
:style style/preview}]]
124+
[header collectible-details]
121125
[cta-buttons]
122126
[tabs]
123127
[info]

‎src/status_im2/contexts/wallet/common/collectibles_tab/view.cljs

+6-4
Original file line numberDiff line numberDiff line change
@@ -21,11 +21,13 @@
2121
:style {:flex 1}
2222
:content-container-style {:align-items :center}
2323
:num-columns 2
24-
:render-fn (fn [{:keys [preview-url]}]
24+
:render-fn (fn [{:keys [preview-url id]}]
2525
[quo/collectible
2626
{:images [preview-url]
27-
:on-press #(rf/dispatch
28-
[:navigate-to
29-
:wallet-collectible])}])}])))
27+
:on-press (fn []
28+
(rf/dispatch [:wallet/get-collectible-details id])
29+
(rf/dispatch
30+
[:navigate-to
31+
:wallet-collectible]))}])}])))
3032

3133
(def view (quo.theme/with-theme view-internal))

‎src/status_im2/contexts/wallet/common/temp.cljs

-50
Original file line numberDiff line numberDiff line change
@@ -63,56 +63,6 @@
6363
:percentage-change "0.00"
6464
:fiat-change "€0.00"}}])
6565

66-
(def collectibles
67-
[{:image (status.resources/get-mock-image :collectible1)
68-
:id 1}
69-
{:image (status.resources/get-mock-image :collectible2)
70-
:id 2}
71-
{:image (status.resources/get-mock-image :collectible3)
72-
:id 3}
73-
{:image (status.resources/get-mock-image :collectible4)
74-
:id 4}
75-
{:image (status.resources/get-mock-image :collectible5)
76-
:id 5}
77-
{:image (status.resources/get-mock-image :collectible6)
78-
:id 6}])
79-
80-
(def collectible-details
81-
nil
82-
#_{:name "#5946"
83-
:description "Bored Ape Yacht Club"
84-
:image (status.resources/get-mock-image :collectible-monkey)
85-
:collection-image (status.resources/get-mock-image :bored-ape)
86-
:traits [{:title "Background"
87-
:subtitle "Blue"
88-
:id 1}
89-
{:title "Clothes"
90-
:subtitle "Bayc T Black"
91-
:id 2}
92-
{:title "Eyes"
93-
:subtitle "Sleepy"
94-
:id 3}
95-
{:title "Fur"
96-
:subtitle "Black"
97-
:id 4}
98-
{:title "Hat"
99-
:subtitle "Beanie"
100-
:id 5}
101-
{:title "Mouth"
102-
:subtitle "Bored Pipe"
103-
:id 6}]})
104-
105-
(def account-overview-state
106-
{:current-value "€0.00"
107-
:account-name "Account 1"
108-
:account :default
109-
:customization-color :blue})
110-
111-
(def network-names
112-
[{:network-name :ethereum :short-name "eth"}
113-
{:network-name :optimism :short-name "opt"}
114-
{:network-name :arbitrum :short-name "arb1"}])
115-
11666
(def address "0x39cf6E0Ba4C4530735616e1Ee7ff5FbCB726fBd4")
11767

11868
(def data-item-state

‎src/status_im2/contexts/wallet/events.cljs

+34
Original file line numberDiff line numberDiff line change
@@ -223,6 +223,14 @@
223223

224224
(rf/reg-event-fx :wallet/clear-stored-collectibles clear-stored-collectibles)
225225

226+
(defn store-last-collectible-details
227+
[{:keys [db]} [collectible]]
228+
{:db (assoc-in db
229+
[:wallet :last-collectible-details]
230+
collectible)})
231+
232+
(rf/reg-event-fx :wallet/store-last-collectible-details store-last-collectible-details)
233+
226234
(rf/reg-event-fx
227235
:wallet/request-collectibles
228236
(fn [{:keys [db]} [{:keys [start-at-index new-request?]}]]
@@ -259,6 +267,32 @@
259267
[:wallet/request-collectibles
260268
{:start-at-index start-at-index}]])]})))
261269

270+
(rf/reg-event-fx :wallet/get-collectible-details
271+
(fn [_ [collectible-id]]
272+
(let [request-id 0
273+
collectible-id-converted (cske/transform-keys csk/->PascalCaseKeyword collectible-id)
274+
request-params [request-id [collectible-id-converted]]]
275+
{:json-rpc/call [{:method "wallet_getCollectiblesDetailsAsync"
276+
:params request-params
277+
:on-error (fn [error]
278+
(log/error "failed to request collectible"
279+
{:event :wallet/get-collectible-details
280+
:error error
281+
:params request-params}))}]})))
282+
283+
(rf/reg-event-fx :wallet/get-collectible-details-done
284+
(fn [_ [{:keys [message]}]]
285+
(let [response (cske/transform-keys csk/->kebab-case-keyword
286+
(types/json->clj message))
287+
{:keys [collectibles]} response
288+
collectible (first collectibles)]
289+
(if collectible
290+
{:fx
291+
[[:dispatch [:wallet/store-last-collectible-details collectible]]]}
292+
(log/error "failed to get collectible details"
293+
{:event :wallet/get-collectible-details-done
294+
:response response})))))
295+
262296
(rf/reg-event-fx :wallet/fetch-address-suggestions
263297
(fn [{:keys [db]} [address]]
264298
{:db (assoc db

‎src/status_im2/contexts/wallet/events_test.cljs

+11
Original file line numberDiff line numberDiff line change
@@ -52,3 +52,14 @@
5252
effects (events/clear-stored-collectibles {:db db})
5353
result-db (:db effects)]
5454
(is (= result-db expected-db))))))
55+
56+
(deftest store-last-collectible-details
57+
(testing "store-last-collectible-details"
58+
(let [db {:wallet {}}
59+
last-collectible {:description "Pandaria"
60+
:image-url "https://..."}
61+
expected-db {:wallet {:last-collectible-details {:description "Pandaria"
62+
:image-url "https://..."}}}
63+
effects (events/store-last-collectible-details {:db db} [last-collectible])
64+
result-db (:db effects)]
65+
(is (= result-db expected-db)))))

‎src/status_im2/subs/wallet/collectibles.cljs

+6
Original file line numberDiff line numberDiff line change
@@ -18,3 +18,9 @@
1818
(assoc collectible :preview-url (preview-url collectible)))
1919
(:collectibles wallet))))
2020

21+
(re-frame/reg-sub
22+
:wallet/last-collectible-details
23+
:<- [:wallet]
24+
(fn [wallet]
25+
(let [last-collectible (:last-collectible-details wallet)]
26+
(assoc last-collectible :preview-url (preview-url last-collectible)))))

0 commit comments

Comments
 (0)