Skip to content

Commit eebdfe2

Browse files
Pau1fitzPau1fitz
authored
Merge branch 'develop' into share-community-qr-17993
2 parents 0759094 + 10f9fe1 commit eebdfe2

File tree

6 files changed

+129
-70
lines changed

6 files changed

+129
-70
lines changed

‎src/quo/components/tags/collectible_tag/component_spec.cljs

+52
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
(ns quo.components.tags.collectible-tag.component-spec
2+
(:require
3+
[quo.components.tags.collectible-tag.view :as collectible-tag]
4+
[test-helpers.component :as h]))
5+
6+
(def collectible-name "Collectible")
7+
(def collectible-id "#123")
8+
9+
(defn get-test-data
10+
[{:keys [options blur? size]}]
11+
{:collectible-name collectible-name
12+
:collectible-id collectible-id
13+
:collectible-img-src {:uri "https://example.com/image.jpg"}
14+
:options options
15+
:blur? (or blur? false)
16+
:size (or size :size-24)})
17+
18+
(h/describe "Collectible_tag tests"
19+
(h/test "Renders Default option"
20+
(let [data (get-test-data {})]
21+
(h/render-with-theme-provider [collectible-tag/view data])
22+
(h/is-truthy (h/get-by-text collectible-name))))
23+
24+
(h/test "Renders Add option"
25+
(let [data (get-test-data {:options :add})]
26+
(h/render-with-theme-provider [collectible-tag/view data])
27+
(h/is-truthy (h/get-by-text collectible-name))))
28+
29+
(h/test "Renders Hold option"
30+
(let [data (get-test-data {:options :hold})]
31+
(h/render-with-theme-provider [collectible-tag/view data])
32+
(h/is-truthy (h/get-by-text collectible-name))))
33+
34+
(h/test "Renders with Blur"
35+
(let [data (get-test-data {:blur? true})]
36+
(h/render-with-theme-provider [collectible-tag/view data])
37+
(h/is-truthy (h/get-by-text collectible-name))))
38+
39+
(h/test "Renders without Blur"
40+
(let [data (get-test-data {:blur? false})]
41+
(h/render-with-theme-provider [collectible-tag/view data])
42+
(h/is-truthy (h/get-by-text collectible-name))))
43+
44+
(h/test "Renders with Size 24"
45+
(let [data (get-test-data {:size :size-24})]
46+
(h/render-with-theme-provider [collectible-tag/view data])
47+
(h/is-truthy (h/get-by-text collectible-name))))
48+
49+
(h/test "Renders with Size 32"
50+
(let [data (get-test-data {:size :size-32})]
51+
(h/render-with-theme-provider [collectible-tag/view data])
52+
(h/is-truthy (h/get-by-text collectible-name)))))

‎src/quo/components/tags/collectible_tag/schema.cljs

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
(ns quo.components.tags.collectible-tag.schema)
2+
3+
(def ?schema
4+
[:=>
5+
[:catn
6+
[:props
7+
[:map
8+
[:options {:optional true} [:maybe [:enum :add :hold]]]
9+
[:size {:optional true} [:maybe [:enum :size-24 :size-32]]]
10+
[:blur? {:optional true} [:maybe :boolean]]
11+
[:theme :schema.common/theme]
12+
[:collectible-img-src :schema.common/image-source]
13+
[:collectible-name :string]
14+
[:collectible-id :string]]]]
15+
:any])

‎src/quo/components/tags/collectible_tag/view.cljs

+44-55
Original file line numberDiff line numberDiff line change
@@ -1,70 +1,59 @@
11
(ns quo.components.tags.collectible-tag.view
22
(:require
3+
[oops.core :as oops]
34
[quo.components.icon :as icons]
45
[quo.components.markdown.text :as text]
6+
[quo.components.tags.collectible-tag.schema :as component-schema]
57
[quo.components.tags.collectible-tag.style :as style]
68
[quo.theme]
79
[react-native.core :as rn]
810
[react-native.hole-view :as hole-view]
11+
[reagent.core :as reagent]
912
[schema.core :as schema]))
1013

11-
(def ?schema
12-
[:=>
13-
[:catn
14-
[:props
15-
[:map {:closed true}
16-
[:options {:optional true} [:maybe [:enum false :add :hold]]]
17-
[:size {:optional true} [:enum :size-24 :size-32]]
18-
[:blur? {:optional true} :boolean]
19-
[:theme :schema.common/theme]
20-
[:collectible-img-src [:or :int :string]]
21-
[:collectible-name :string]
22-
[:collectible-id :string]
23-
[:container-width :number]
24-
[:on-layout {:optional true} [:maybe fn?]]]]]
25-
:any])
26-
2714
(defn- view-internal
2815
[]
29-
(fn [{:keys [options size blur? theme collectible-img-src collectible-name collectible-id
30-
container-width on-layout]
31-
:or {size :size-24}}]
32-
[rn/view
33-
{:on-layout on-layout}
34-
[hole-view/hole-view
35-
{:holes (if options
36-
[{:x (- container-width
37-
(case size
38-
:size-24 10
39-
:size-32 12
40-
nil))
41-
:y (case size
42-
:size-24 -6
43-
:size-32 -4
44-
nil)
45-
:width 16
46-
:height 16
47-
:borderRadius 8}]
48-
[])}
49-
[rn/view {:style (style/container size options blur? theme)}
50-
[rn/image {:style (style/collectible-img size) :source collectible-img-src}]
51-
[text/text
52-
{:size :paragraph-2
53-
:weight :medium
54-
:style (style/label theme)}
55-
collectible-name]
56-
[text/text
57-
{:size :paragraph-2
58-
:weight :medium
59-
:margin-left 5
60-
:style (style/label theme)}
61-
collectible-id]]]
62-
(when options
63-
[rn/view {:style (style/options-icon size)}
64-
[icons/icon (if (= options :hold) :i/hold :i/add-token)
65-
{:size 20
66-
:no-color true}]])]))
16+
(let [container-width (reagent/atom 0)
17+
on-layout #(->> (oops/oget % :nativeEvent :layout :width)
18+
(reset! container-width))]
19+
(fn [{:keys [options blur? theme collectible-img-src collectible-name collectible-id] :as props}]
20+
(let [size (or (:size props) :size-24)]
21+
[rn/view
22+
{:on-layout on-layout}
23+
[hole-view/hole-view
24+
{:holes (if options
25+
[{:x (- @container-width
26+
(case size
27+
:size-24 10
28+
:size-32 12
29+
nil))
30+
:y (case size
31+
:size-24 -6
32+
:size-32 -4
33+
nil)
34+
:width 16
35+
:height 16
36+
:borderRadius 8}]
37+
[])}
38+
[rn/view {:style (style/container size options blur? theme)}
39+
[rn/image {:style (style/collectible-img size) :source collectible-img-src}]
40+
[text/text
41+
{:size :paragraph-2
42+
:weight :medium
43+
:style (style/label theme)}
44+
collectible-name]
45+
[text/text
46+
{:size :paragraph-2
47+
:weight :medium
48+
:margin-left 5
49+
:style (style/label theme)}
50+
collectible-id]]]
51+
(when options
52+
[rn/view {:style (style/options-icon size)}
53+
[icons/icon (if (= options :hold) :i/hold :i/add-token)
54+
{:size 20
55+
:no-color true}]])]))))
6756

6857
(def view
6958
(quo.theme/with-theme
70-
(schema/instrument #'view-internal ?schema)))
59+
(schema/instrument #'view-internal component-schema/?schema)))

‎src/quo/core_spec.cljs

+1
Original file line numberDiff line numberDiff line change
@@ -79,6 +79,7 @@
7979
quo.components.share.share-qr-code.component-spec
8080
quo.components.switchers.base-card.component-spec
8181
quo.components.switchers.group-messaging-card.component-spec
82+
quo.components.tags.collectible-tag.component-spec
8283
quo.components.tags.network-tags.component-spec
8384
quo.components.tags.status-tags-component-spec
8485
quo.components.tags.summary-tag.component-spec

‎src/status_im/contexts/preview/quo/tags/collectible_tag.cljs

+7-15
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
(ns status-im.contexts.preview.quo.tags.collectible-tag
22
(:require
3-
[oops.core :refer [oget]]
43
[quo.core :as quo]
54
[react-native.core :as rn]
65
[reagent.core :as reagent]
@@ -16,9 +15,7 @@
1615
:value "Size 32"}]}
1716
{:key :options
1817
:type :select
19-
:options [{:key false
20-
:value false}
21-
{:key :add
18+
:options [{:key :add
2219
:value :add}
2320
{:key :hold
2421
:value :hold}]}
@@ -31,21 +28,16 @@
3128

3229
(defn view
3330
[]
34-
(let [state (reagent/atom {:size :size-24
35-
:collectible-name "Collectible"
36-
:collectible-id "#123"
37-
:collectible-img-src (resources/mock-images :collectible)
38-
:options false
39-
:blur? false
40-
:container-width 0})
41-
on-layout #(swap! state assoc
42-
:container-width
43-
(oget % :nativeEvent :layout :width))]
31+
(let [state (reagent/atom {:size :size-24
32+
:collectible-name "Collectible"
33+
:collectible-id "#123"
34+
:collectible-img-src (resources/mock-images :collectible)
35+
:blur? false})]
4436
(fn []
4537
[preview/preview-container
4638
{:state state
4739
:blur? (:blur? @state)
4840
:show-blur-background? true
4941
:descriptor descriptor}
5042
[rn/view {:style {:align-items :center}}
51-
[quo/collectible-tag (assoc @state :on-layout on-layout)]]])))
43+
[quo/collectible-tag @state]]])))

‎src/status_im/contexts/wallet/data_store.cljs

+10
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,15 @@
2222
[account]
2323
(assoc account :watch-only? (= (:type account) :watch)))
2424

25+
(defn- sanitize-emoji
26+
"As Desktop uses Twemoji, the emoji received can be an img tag
27+
with raw emoji in alt attribute. This function help us to extract
28+
the emoji from it as mobile doesn't support HTML rendering and Twemoji"
29+
[emoji]
30+
(if (string/starts-with? emoji "<img")
31+
(-> (re-find #"alt=\"(.*?)\"" emoji) last)
32+
emoji))
33+
2534
(defn rpc->account
2635
[account]
2736
(-> account
@@ -33,6 +42,7 @@
3342
(update :test-preferred-chain-ids chain-ids-string->set)
3443
(update :type keyword)
3544
(update :color #(if (seq %) (keyword %) constants/account-default-customization-color))
45+
(update :emoji sanitize-emoji)
3646
(assoc :default-account? (:wallet account))
3747
add-keys-to-account))
3848

0 commit comments

Comments
 (0)