From d77033e3463ff98e7419d57870b4f8bafc093e2b Mon Sep 17 00:00:00 2001 From: mmilad75 <55688834+mmilad75@users.noreply.github.com> Date: Mon, 19 Feb 2024 14:31:07 +0000 Subject: [PATCH] Wallet - Add malli spec to Quo Wallet components (batch 3) (#18783) * draft * add account_card * add account-origin * add account_overview * add account_permission * add address_text * add confirmation_progress * wrapping up * resolve comments and fix ci issues * fix ci issues * fix transaction_progress tests * fix all tests * fix lint issues * add network-link * add token-input * add wallet-overview * add context-tag * add wallet-activity * add transaction-progress * add transaction-summary * add default value to render-with-theme-provider * draft * add default value to context-tag schema * fix lint issues * resolve comments * add :string type to image type * update ?image-source schema --- .../markdown/list/component_spec.cljs | 24 ++-- .../settings_item/component_spec.cljs | 38 +++---- .../group_messaging_card/component_spec.cljs | 40 +++---- .../components/tags/context_tag/schema.cljs | 103 ++++++++++++++++++ src/quo/components/tags/context_tag/view.cljs | 70 +----------- .../page_top/component_spec.cljs | 30 ++--- src/quo/components/utilities/token/view.cljs | 2 +- .../wallet/account_origin/schema.cljs | 2 +- .../wallet/network_link/schema.cljs | 14 +++ .../components/wallet/network_link/view.cljs | 8 +- .../wallet/token_input/component_spec.cljs | 16 +-- .../components/wallet/token_input/schema.cljs | 19 ++++ .../components/wallet/token_input/view.cljs | 8 +- .../wallet/transaction_progress/schema.cljs | 25 +++++ .../wallet/transaction_progress/view.cljs | 6 +- .../transaction_summary/component_spec.cljs | 20 ++-- .../wallet/transaction_summary/schema.cljs | 23 ++++ .../wallet/transaction_summary/view.cljs | 25 +---- .../wallet_activity/component_spec.cljs | 4 +- .../wallet/wallet_activity/schema.cljs | 24 ++++ .../wallet/wallet_activity/view.cljs | 36 +----- .../wallet_overview/component_spec.cljs | 10 +- .../wallet/wallet_overview/schema.cljs | 23 ++++ .../wallet/wallet_overview/view.cljs | 5 +- src/schema/common.cljs | 3 +- .../quo/wallet/transaction_progress.cljs | 2 - .../edit_derivation_path/component_spec.cljs | 10 +- .../send/input_amount/component_spec.cljs | 46 ++++---- 28 files changed, 382 insertions(+), 254 deletions(-) create mode 100644 src/quo/components/tags/context_tag/schema.cljs create mode 100644 src/quo/components/wallet/network_link/schema.cljs create mode 100644 src/quo/components/wallet/token_input/schema.cljs create mode 100644 src/quo/components/wallet/transaction_progress/schema.cljs create mode 100644 src/quo/components/wallet/transaction_summary/schema.cljs create mode 100644 src/quo/components/wallet/wallet_activity/schema.cljs create mode 100644 src/quo/components/wallet/wallet_overview/schema.cljs diff --git a/src/quo/components/markdown/list/component_spec.cljs b/src/quo/components/markdown/list/component_spec.cljs index 10838b3158..51295005b4 100644 --- a/src/quo/components/markdown/list/component_spec.cljs +++ b/src/quo/components/markdown/list/component_spec.cljs @@ -5,19 +5,19 @@ (h/describe "tests for markdown/list component" (h/test "renders component with title" - (h/render [list/view {:title "test title"}]) + (h/render-with-theme-provider [list/view {:title "test title"}]) (h/is-truthy (h/get-by-text "test title"))) (h/test "renders component with description" - (h/render [list/view - {:title "test title" - :description "test description"}]) + (h/render-with-theme-provider [list/view + {:title "test title" + :description "test description"}]) (h/is-truthy (h/get-by-text "test description"))) (h/test "renders component with title and description" - (h/render [list/view - {:title "test title" - :description "test description"}]) + (h/render-with-theme-provider [list/view + {:title "test title" + :description "test description"}]) (h/is-truthy (h/get-by-text "test title")) (h/is-truthy (h/get-by-text "test description"))) @@ -29,11 +29,11 @@ (h/is-truthy (h/get-by-label-text :step-counter))) (h/test "renders decription with a context tag component and description after the tag" - (h/render [list/view - {:step-number 1 - :description "Lorem ipsum " - :tag-name "dolor" - :description-after-tag "text after tag"}]) + (h/render-with-theme-provider [list/view + {:step-number 1 + :description "Lorem ipsum " + :tag-name "dolor" + :description-after-tag "text after tag"}]) (h/is-truthy (h/get-by-text "Lorem ipsum")) (h/is-truthy (h/get-by-label-text :user-avatar)) (h/is-truthy (h/get-by-text "dolor")) diff --git a/src/quo/components/settings/settings_item/component_spec.cljs b/src/quo/components/settings/settings_item/component_spec.cljs index af30d88962..3404d29ea0 100644 --- a/src/quo/components/settings/settings_item/component_spec.cljs +++ b/src/quo/components/settings/settings_item/component_spec.cljs @@ -12,47 +12,47 @@ (h/describe "Settings list tests" (h/test "Default render of Setting list component" - (h/render [settings-item/view props]) + (h/render-with-theme-provider [settings-item/view props]) (h/is-truthy (h/get-by-label-text :settings-item))) (h/test "It renders a title" - (h/render [settings-item/view props]) + (h/render-with-theme-provider [settings-item/view props]) (h/is-truthy (h/get-by-text "Account"))) (h/test "its gets passed an on press event" (let [event (h/mock-fn)] - (h/render [settings-item/view - (merge props {:on-press event})]) + (h/render-with-theme-provider [settings-item/view + (merge props {:on-press event})]) (h/fire-event :press (h/get-by-text "Account")) (h/was-called event))) (h/test "on change event gets fired for toggle" (let [on-change (h/mock-fn)] - (h/render [settings-item/view - (merge props - {:action :selector - :action-props {:on-change on-change}})]) + (h/render-with-theme-provider [settings-item/view + (merge props + {:action :selector + :action-props {:on-change on-change}})]) (h/fire-event :press (h/get-by-label-text :toggle-off)) (h/was-called on-change))) (h/test "It renders a label" - (h/render [settings-item/view (merge props {:label :color})]) + (h/render-with-theme-provider [settings-item/view (merge props {:label :color})]) (h/is-truthy (h/get-by-label-text :label-component))) (h/test "It renders a status tag component" - (h/render [settings-item/view - (merge props - {:tag :context - :tag-props {:context "Test Tag" - :icon :i/placeholder}})]) + (h/render-with-theme-provider [settings-item/view + (merge props + {:tag :context + :tag-props {:context "Test Tag" + :icon :i/placeholder}})]) (h/is-truthy (h/get-by-text "Test Tag"))) (h/test "on press event gets fired for button" (let [event (h/mock-fn)] - (h/render [settings-item/view - (merge props - {:action :button - :action-props {:button-text "test button" - :on-press event}})]) + (h/render-with-theme-provider [settings-item/view + (merge props + {:action :button + :action-props {:button-text "test button" + :on-press event}})]) (h/fire-event :press (h/get-by-text "test button")) (h/was-called event)))) diff --git a/src/quo/components/switchers/group_messaging_card/component_spec.cljs b/src/quo/components/switchers/group_messaging_card/component_spec.cljs index 64d6050abf..780b7a0f38 100644 --- a/src/quo/components/switchers/group_messaging_card/component_spec.cljs +++ b/src/quo/components/switchers/group_messaging_card/component_spec.cljs @@ -83,35 +83,35 @@ (h/is-truthy (h/get-by-label-text :gif))) (h/test "Status: Read, Type: Audio, Avatar: true" - (h/render [group-messaging-card/view - {:avatar true - :status :read - :type :audio - :title "Title" - :content {:duration "00:32"}}]) + (h/render-with-theme-provider [group-messaging-card/view + {:avatar true + :status :read + :type :audio + :title "Title" + :content {:duration "00:32"}}]) (h/is-truthy (h/get-by-text (utils/subtitle :audio nil))) (h/is-truthy (h/get-by-text "00:32"))) (h/test "Status: Read, Type: Community, Avatar: true" - (h/render [group-messaging-card/view - {:avatar true - :status :read - :type :community - :title "Title" - :content {:community-avatar coinbase-community - :community-name "Coinbase"}}]) + (h/render-with-theme-provider [group-messaging-card/view + {:avatar true + :status :read + :type :community + :title "Title" + :content {:community-avatar coinbase-community + :community-name "Coinbase"}}]) (h/is-truthy (h/get-by-text (utils/subtitle :community nil))) (h/is-truthy (h/get-by-label-text :group-avatar)) (h/is-truthy (h/get-by-text "Coinbase"))) (h/test "Status: Read, Type: Link, Avatar: true" - (h/render [group-messaging-card/view - {:avatar true - :status :read - :type :link - :title "Title" - :content {:icon :placeholder - :text "Rolling St..."}}]) + (h/render-with-theme-provider [group-messaging-card/view + {:avatar true + :status :read + :type :link + :title "Title" + :content {:icon :placeholder + :text "Rolling St..."}}]) (h/is-truthy (h/get-by-text (utils/subtitle :link nil))) (h/is-truthy (h/get-by-label-text :group-avatar)) (h/is-truthy (h/get-by-text "Rolling St...")))) diff --git a/src/quo/components/tags/context_tag/schema.cljs b/src/quo/components/tags/context_tag/schema.cljs new file mode 100644 index 0000000000..419cc16903 --- /dev/null +++ b/src/quo/components/tags/context_tag/schema.cljs @@ -0,0 +1,103 @@ +(ns quo.components.tags.context-tag.schema + (:require [malli.core :as malli])) + +(def ^:private ?context-base + [:map + [:type {:optional true} + [:maybe + [:enum :default :multiuser :group :channel :community :token :network :multinetwork :account + :collectible :address :icon :audio]]] + [:customization-color {:optional true} [:maybe :schema.common/customization-color]] + [:theme :schema.common/theme] + [:blur? {:optional true} [:maybe :boolean]] + [:state {:optional true} [:maybe [:enum :selected :default]]]]) + +(def ^:private ?size + [:map + [:size {:optional true} [:maybe [:enum 24 32]]]]) + +(def ^:private ?default + [:map + [:profile-picture {:optional true} [:maybe :schema.common/image-source]] + [:full-name {:optional true} [:maybe :string]]]) + +(def ^:private ?multiuser + [:map + [:users {:optional true} + [:maybe + [:sequential + [:map [:profile-picture {:optional true} [:maybe :schema.common/image-source]] + [:full-name {:optional true} [:maybe :string]] + [:customization-color {:optional true} [:maybe :schema.common/customization-color]]]]]]]) + +(def ^:private ?group + [:map + [:group-name {:optional true} [:maybe :string]]]) + +(def ^:private ?channel + [:map + [:community-name {:optional true} [:maybe :string]] + [:channel-name {:optional true} [:maybe :string]]]) + +(def ^:private ?community + [:map + [:community-name {:optional true} [:maybe :string]]]) + +(def ^:private ?token + [:map + [:amount {:optional true} [:maybe [:or :string :int]]] + [:token {:optional true} [:maybe :string]]]) + +(def ^:private ?network + [:map + [:network-logo {:optional true} [:maybe :schema.common/image-source]] + [:network-name {:optional true} [:maybe :string]]]) + +(def ^:private ?multinetwork + [:map + [:networks {:optional true} [:maybe [:sequential ?network]]]]) + +(def ^:private ?account + [:map + [:account-name {:optional true} [:maybe :string]] + [:emoji {:optional true} [:maybe :string]]]) + +(def ^:private ?collectible + [:map + [:collectible {:optional true} [:maybe :schema.common/image-source]] + [:collectible-name {:optional true} [:maybe :string]] + [:collectible-number {:optional true} [:maybe [:or :string :int]]]]) + +(def ^:private ?address + [:map + [:address {:optional true} [:maybe :string]]]) + +(def ^:private ?icon + [:map + [:icon {:optional true} [:maybe :keyword]] + [:context {:optional true} [:maybe :string]]]) + +(def ^:private ?audio + [:map + [:duration {:optional true} [:maybe :string]]]) + +(def ?schema + [:=> + [:catn + [:props + [:multi {:dispatch :type} + [::malli/default [:merge ?default ?size ?context-base]] + [:default [:merge ?default ?size ?context-base]] + [:multiuser [:merge ?multiuser ?context-base]] + [:group [:merge ?group ?size ?context-base]] + [:channel [:merge ?channel ?size ?context-base]] + [:community [:merge ?community ?size ?context-base]] + [:token [:merge ?token ?size ?context-base]] + [:network [:merge ?network ?context-base]] + [:multinetwork [:merge ?multinetwork ?context-base]] + [:account [:merge ?account ?size ?context-base]] + [:collectible [:merge ?collectible ?size ?context-base]] + [:address [:merge ?address ?size ?context-base]] + [:icon [:merge ?icon ?size ?context-base]] + [:audio [:merge ?audio ?context-base]]]]] + :any]) diff --git a/src/quo/components/tags/context_tag/view.cljs b/src/quo/components/tags/context_tag/view.cljs index fa7caa7b45..56aee95c55 100644 --- a/src/quo/components/tags/context_tag/view.cljs +++ b/src/quo/components/tags/context_tag/view.cljs @@ -6,11 +6,13 @@ [quo.components.icon :as icons] [quo.components.list-items.preview-list.view :as preview-list] [quo.components.markdown.text :as text] + [quo.components.tags.context-tag.schema :as component-schema] [quo.components.tags.context-tag.style :as style] [quo.components.utilities.token.view :as token] [quo.foundations.colors :as colors] [quo.theme :as quo.theme] - [react-native.core :as rn])) + [react-native.core :as rn] + [schema.core :as schema])) (defn- tag-skeleton [{:keys [theme size text] :or {size 24}} logo-component] @@ -157,67 +159,5 @@ nil)]) (def view - "Properties: - type, state, blur? & customization-color - - Depending on the `type` selected, different properties are accepted: - - `:default` or `nil`: - - size - - profile-picture - - full-name - - - `:multiuser`: - - users (vector of {:profile-picture pic, :full-name \"a name\"}) - - - `:group` - - size - - group-name - - - `:community` - - size - - community-logo (valid rn/image :source value) - - community-name - - - `:channel` - - size - - community-logo (valid rn/image :source value) - - community-name - - channel-name - - - `:token` - - size - - amount - - token - - - `:network` - - size - - network-logo (valid rn/image :source value) - - network-name - - - `:multinetworks` - - networks (vector of {:network-logo pic, :network-name \"a name\"}) - - - `:account` - - size - - account-name - - emoji (string containing an emoji) - - - `:collectible` - - size - - collectible (valid rn/image :source value) - - collectible-name - - collectible-number - - - `:address` - - size - - address (string) - - - `:icon` - - size - - icon - - context (string) - - - `:audio` - - duration (string) - " - (quo.theme/with-theme view-internal)) + (quo.theme/with-theme + (schema/instrument #'view-internal component-schema/?schema))) diff --git a/src/quo/components/text_combinations/page_top/component_spec.cljs b/src/quo/components/text_combinations/page_top/component_spec.cljs index 54cf422fa2..da6d7c3152 100644 --- a/src/quo/components/text_combinations/page_top/component_spec.cljs +++ b/src/quo/components/text_combinations/page_top/component_spec.cljs @@ -37,26 +37,26 @@ (h/is-truthy (h/get-by-text "This is a textual description"))) (h/test "Context tag" - (h/render [page-top/view - {:title "Title" - :description :context-tag - :context-tag context-tag-data}]) + (h/render-with-theme-provider [page-top/view + {:title "Title" + :description :context-tag + :context-tag context-tag-data}]) (h/is-truthy (h/get-by-text "Title")) (h/is-truthy (h/get-by-label-text :context-tag))) (h/test "Summary" - (h/render [page-top/view - {:title "Title" - :description :summary - :summary {:row-1 {:text-1 "Send" - :text-2 "from" - :context-tag-1 context-tag-data - :context-tag-2 context-tag-data} - :row-2 {:text-1 "to" - :text-2 "via" - :context-tag-1 context-tag-data - :context-tag-2 context-tag-data}}}]) + (h/render-with-theme-provider [page-top/view + {:title "Title" + :description :summary + :summary {:row-1 {:text-1 "Send" + :text-2 "from" + :context-tag-1 context-tag-data + :context-tag-2 context-tag-data} + :row-2 {:text-1 "to" + :text-2 "via" + :context-tag-1 context-tag-data + :context-tag-2 context-tag-data}}}]) (h/is-truthy (h/get-by-text "Title")) (h/is-truthy (h/get-by-text "Send")) diff --git a/src/quo/components/utilities/token/view.cljs b/src/quo/components/utilities/token/view.cljs index d460488225..141294a621 100644 --- a/src/quo/components/utilities/token/view.cljs +++ b/src/quo/components/utilities/token/view.cljs @@ -15,7 +15,7 @@ [:token {:optional true} [:maybe [:or keyword? string?]]] [:style {:optional true} map?] ;; Ignores `token` and uses this as parameter to `rn/image`'s source. - [:image-source {:optional true} [:maybe [:or :schema.common/image-source :string]]]]] + [:image-source {:optional true} [:maybe :schema.common/image-source]]]] :any]) (defn- size->number diff --git a/src/quo/components/wallet/account_origin/schema.cljs b/src/quo/components/wallet/account_origin/schema.cljs index 9fd3bfa171..da3d9765a2 100644 --- a/src/quo/components/wallet/account_origin/schema.cljs +++ b/src/quo/components/wallet/account_origin/schema.cljs @@ -9,7 +9,7 @@ (def ^:private ?default-keypair [:map [:user-name {:optional true} [:maybe :string]] - [:profile-picture {:optional true} [:maybe [:or :schema.common/image-source :string]]] + [:profile-picture {:optional true} [:maybe :schema.common/image-source]] [:derivation-path {:optional true} [:maybe :string]] [:on-press {:optional true} [:maybe fn?]] [:customization-color {:optional true} [:maybe :schema.common/customization-color]]]) diff --git a/src/quo/components/wallet/network_link/schema.cljs b/src/quo/components/wallet/network_link/schema.cljs new file mode 100644 index 0000000000..c0b89e2351 --- /dev/null +++ b/src/quo/components/wallet/network_link/schema.cljs @@ -0,0 +1,14 @@ +(ns quo.components.wallet.network-link.schema) + +(def ^:private ?networks [:enum :optimism :arbitrum :ethereum]) + +(def ?schema + [:=> + [:catn + [:props + [:map + [:shape {:optional true} [:maybe [:enum :linear :1x :2x]]] + [:source {:optional true} [:maybe ?networks]] + [:destination {:optional true} [:maybe ?networks]] + [:theme :schema.common/theme]]]] + :any]) diff --git a/src/quo/components/wallet/network_link/view.cljs b/src/quo/components/wallet/network_link/view.cljs index b25d0e5e3e..9fe4949267 100644 --- a/src/quo/components/wallet/network_link/view.cljs +++ b/src/quo/components/wallet/network_link/view.cljs @@ -1,9 +1,11 @@ (ns quo.components.wallet.network-link.view (:require + [quo.components.wallet.network-link.schema :as component-schema] [quo.foundations.colors :as colors] [quo.theme :as quo.theme] [react-native.core :as rn] - [react-native.svg :as svg])) + [react-native.svg :as svg] + [schema.core :as schema])) (defn link-linear [{:keys [source theme]}] @@ -84,4 +86,6 @@ :1x [link-1x props] :2x [link-2x props])]) -(def view (quo.theme/with-theme view-internal)) +(def view + (quo.theme/with-theme + (schema/instrument #'view-internal component-schema/?schema))) diff --git a/src/quo/components/wallet/token_input/component_spec.cljs b/src/quo/components/wallet/token_input/component_spec.cljs index 6e76ce46c2..8f702fe71a 100644 --- a/src/quo/components/wallet/token_input/component_spec.cljs +++ b/src/quo/components/wallet/token_input/component_spec.cljs @@ -5,15 +5,15 @@ (h/describe "Wallet: Token Input" (h/test "Token label renders" - (h/render [token-input/view - {:token :snt - :currency :eur - :conversion 1}]) + (h/render-with-theme-provider [token-input/view + {:token :snt + :currency :eur + :conversion 1}]) (h/is-truthy (h/get-by-text "SNT"))) (h/test "Amount renders" - (h/render [token-input/view - {:token :snt - :currency :eur - :conversion 1}]) + (h/render-with-theme-provider [token-input/view + {:token :snt + :currency :eur + :conversion 1}]) (h/is-truthy (h/get-by-text "€0.00")))) diff --git a/src/quo/components/wallet/token_input/schema.cljs b/src/quo/components/wallet/token_input/schema.cljs new file mode 100644 index 0000000000..e33762864a --- /dev/null +++ b/src/quo/components/wallet/token_input/schema.cljs @@ -0,0 +1,19 @@ +(ns quo.components.wallet.token-input.schema) + +(def ?schema + [:=> + [:catn + [:props + [:map + [:token {:optional true} [:maybe :keyword]] + [:currency {:optional true} [:maybe :keyword]] + [:error? {:optional true} [:maybe :boolean]] + [:title {:optional true} [:maybe :string]] + [:conversion {:optional true} [:maybe :double]] + [:show-keyboard? {:optional true} [:maybe :boolean]] + [:networks {:optional true} + [:maybe [:sequential [:map [:source [:maybe :schema.common/image-source]]]]]] + [:customization-color {:optional true} [:maybe :schema.common/customization-color]] + [:value {:optional true} [:maybe :string]] + [:theme :schema.common/theme]]]] + :any]) diff --git a/src/quo/components/wallet/token_input/view.cljs b/src/quo/components/wallet/token_input/view.cljs index 5a6bbedd66..c330ee537c 100644 --- a/src/quo/components/wallet/token_input/view.cljs +++ b/src/quo/components/wallet/token_input/view.cljs @@ -7,11 +7,13 @@ [quo.components.markdown.text :as text] [quo.components.tags.network-tags.view :as network-tag] [quo.components.utilities.token.view :as token] + [quo.components.wallet.token-input.schema :as component-schema] [quo.components.wallet.token-input.style :as style] [quo.foundations.common :as common] [quo.theme :as quo.theme] [react-native.core :as rn] - [reagent.core :as reagent])) + [reagent.core :as reagent] + [schema.core :as schema])) (defn fiat-format [currency num-value conversion] @@ -149,4 +151,6 @@ :crypto? @crypto? :amount (or value @value-atom))]])))) -(def view (quo.theme/with-theme view-internal)) +(def view + (quo.theme/with-theme + (schema/instrument #'view-internal component-schema/?schema))) diff --git a/src/quo/components/wallet/transaction_progress/schema.cljs b/src/quo/components/wallet/transaction_progress/schema.cljs new file mode 100644 index 0000000000..2c2cb4840b --- /dev/null +++ b/src/quo/components/wallet/transaction_progress/schema.cljs @@ -0,0 +1,25 @@ +(ns quo.components.wallet.transaction-progress.schema) + +(def ^:private ?network + [:map + [:network {:optional true} [:maybe [:enum :mainnet :optimism :arbitrum]]] + [:state {:optional true} [:maybe [:enum :pending :sending :confirmed :finalising :finalized :error]]] + [:counter {:optional true} [:maybe :int]] + [:total-box {:optional true} [:maybe :int]] + [:epoch-number {:optional true} [:maybe :string]] + [:progress {:optional true} [:maybe :int]]]) + +(def ?schema + [:=> + [:catn + [:props + [:map + [:theme :schema.common/theme] + [:customization-color {:optional true} [:maybe :schema.common/customization-color]] + [:title {:optional true} [:maybe :string]] + [:tag-name {:optional true} [:maybe :string]] + [:tag-number {:optional true} [:maybe [:or :string :int]]] + [:tag-photo {:optional true} [:maybe :schema.common/image-source]] + [:on-press {:optional true} [:maybe fn?]] + [:networks {:optional true} [:maybe [:sequential ?network]]]]]] + :any]) diff --git a/src/quo/components/wallet/transaction_progress/view.cljs b/src/quo/components/wallet/transaction_progress/view.cljs index 147495384d..7ddda95d6e 100644 --- a/src/quo/components/wallet/transaction_progress/view.cljs +++ b/src/quo/components/wallet/transaction_progress/view.cljs @@ -4,10 +4,12 @@ [quo.components.markdown.text :as text] [quo.components.tags.context-tag.view :as context-tag] [quo.components.wallet.confirmation-progress.view :as confirmation-progress] + [quo.components.wallet.transaction-progress.schema :as component-schema] [quo.components.wallet.transaction-progress.style :as style] [quo.foundations.colors :as colors] [quo.theme :as quo.theme] [react-native.core :as rn] + [schema.core :as schema] [utils.i18n :as i18n])) (def ^:private max-mainnet-verifications 4) @@ -184,4 +186,6 @@ ^{:key (:network network)} [view-network (assoc-props (:network network))]))]]) -(def view (quo.theme/with-theme view-internal)) +(def view + (quo.theme/with-theme + (schema/instrument #'view-internal component-schema/?schema))) diff --git a/src/quo/components/wallet/transaction_summary/component_spec.cljs b/src/quo/components/wallet/transaction_summary/component_spec.cljs index 30a6585e7f..2550743572 100644 --- a/src/quo/components/wallet/transaction_summary/component_spec.cljs +++ b/src/quo/components/wallet/transaction_summary/component_spec.cljs @@ -5,24 +5,20 @@ (h/describe "Transaction summary" (h/test "default render" - (h/render [transaction-summary/view {}]) - (h/is-truthy (h/query-by-label-text :transaction-summary))) - - (h/test "incorrect setting doesn't crash render" - (h/render [transaction-summary/view {:transaction :unknown}]) + (h/render-with-theme-provider [transaction-summary/view {}]) (h/is-truthy (h/query-by-label-text :transaction-summary))) (h/test "icon displayed" - (h/render [transaction-summary/view {:transaction :send}]) + (h/render-with-theme-provider [transaction-summary/view {:transaction :send}]) (h/is-truthy (h/query-by-label-text :header-icon))) (h/test "Context tag rendered" - (h/render [transaction-summary/view - {:transaction :send - :first-tag {:size 24 - :type :token - :token "SNT" - :amount 1500}}]) + (h/render-with-theme-provider [transaction-summary/view + {:transaction :send + :first-tag {:size 24 + :type :token + :token "SNT" + :amount 1500}}]) (h/is-truthy (h/query-by-label-text :context-tag)))) diff --git a/src/quo/components/wallet/transaction_summary/schema.cljs b/src/quo/components/wallet/transaction_summary/schema.cljs new file mode 100644 index 0000000000..908abb6477 --- /dev/null +++ b/src/quo/components/wallet/transaction_summary/schema.cljs @@ -0,0 +1,23 @@ +(ns quo.components.wallet.transaction-summary.schema + (:require [quo.components.tags.context-tag.schema :as context-tag-schema])) + +(def ?schema + [:=> + [:catn + [:props + [:map + [:theme :schema.common/theme] + [:transaction {:optional true} [:maybe [:enum :send :swap :bridge]]] + [:first-tag {:optional true} [:maybe context-tag-schema/?schema]] + [:second-tag {:optional true} [:maybe context-tag-schema/?schema]] + [:third-tag {:optional true} [:maybe context-tag-schema/?schema]] + [:fourth-tag {:optional true} [:maybe context-tag-schema/?schema]] + [:fifth-tag {:optional true} [:maybe context-tag-schema/?schema]] + [:second-tag-prefix {:optional true} [:maybe :keyword]] + [:third-tag-prefix {:optional true} [:maybe :keyword]] + [:fourth-tag-prefix {:optional true} [:maybe :keyword]] + [:max-fees {:optional true} [:maybe :string]] + [:nonce {:optional true} [:maybe :int]] + [:input-data {:optional true} [:maybe :string]] + [:on-press {:optional true} [:maybe fn?]]]]] + :any]) diff --git a/src/quo/components/wallet/transaction_summary/view.cljs b/src/quo/components/wallet/transaction_summary/view.cljs index 6f4387dbf8..eb253e692a 100644 --- a/src/quo/components/wallet/transaction_summary/view.cljs +++ b/src/quo/components/wallet/transaction_summary/view.cljs @@ -3,9 +3,11 @@ [quo.components.icon :as icon] [quo.components.markdown.text :as text] [quo.components.tags.context-tag.view :as context-tag] + [quo.components.wallet.transaction-summary.schema :as component-schema] [quo.components.wallet.transaction-summary.style :as style] [quo.theme :as quo.theme] [react-native.core :as rn] + [schema.core :as schema] [utils.i18n :as i18n])) (def transaction-translation @@ -101,24 +103,5 @@ :theme theme}]]]) (def view - "Properties: - - :transaction - type of transaction`. Possible values: - - :send - - :swap - - :bridge - - - :first-tag - props for context tag component that will be first on the first line - - :second-tag - props for context tag component that will be second on the first line - - :third-tag - props for context tag component that will be first on the second line - - :fourth-tag - props for context tag component that will be second on the second line - - :fifth-tag - props for context tag component that will be second on the second line - - - :second-tag-prefix - translation keyword to be used with label before second context tag - - :third-tag-prefix - translation keyword to be used with label before third context tag - - :fourth-tag-prefix - translation keyword to be used with label before fourth context tag - - - :max-fees - string - - :nonce - digit - - :input data - string - " - (quo.theme/with-theme view-internal)) + (quo.theme/with-theme + (schema/instrument #'view-internal component-schema/?schema))) diff --git a/src/quo/components/wallet/wallet_activity/component_spec.cljs b/src/quo/components/wallet/wallet_activity/component_spec.cljs index e5df26a8c9..eaf64c28c2 100644 --- a/src/quo/components/wallet/wallet_activity/component_spec.cljs +++ b/src/quo/components/wallet/wallet_activity/component_spec.cljs @@ -5,12 +5,12 @@ (h/describe "Wallet activity" (h/test "default render" - (h/render [wallet-activity/view {}]) + (h/render-with-theme-provider [wallet-activity/view {}]) (h/is-truthy (h/query-by-label-text :wallet-activity))) (h/test "Should call :on-press" (let [on-press (h/mock-fn)] - (h/render [wallet-activity/view {:on-press on-press}]) + (h/render-with-theme-provider [wallet-activity/view {:on-press on-press}]) (h/is-truthy (h/query-by-label-text :wallet-activity)) (h/fire-event :press (h/query-by-label-text :wallet-activity)) (h/was-called on-press)))) diff --git a/src/quo/components/wallet/wallet_activity/schema.cljs b/src/quo/components/wallet/wallet_activity/schema.cljs new file mode 100644 index 0000000000..a138635275 --- /dev/null +++ b/src/quo/components/wallet/wallet_activity/schema.cljs @@ -0,0 +1,24 @@ +(ns quo.components.wallet.wallet-activity.schema + (:require [quo.components.tags.context-tag.schema :as context-tag-schema])) + +(def ?schema + [:=> + [:catn + [:props + [:map + [:transaction {:optional true} [:maybe [:enum :receive :send :swap :bridge :buy :destroy :mint]]] + [:status {:optional true} [:maybe [:enum :pending :confirmed :finalised :failed]]] + [:counter {:optional true} [:maybe :int]] + [:timestamp {:optional true} [:maybe :string]] + [:blur? {:optional true} [:maybe :boolean]] + [:on-press {:optional true} [:maybe fn?]] + [:state {:optional true} [:maybe [:= :disabled]]] + [:theme :schema.common/theme] + [:second-tag-prefix {:optional true} [:maybe :keyword]] + [:third-tag-prefix {:optional true} [:maybe :keyword]] + [:fourth-tag-prefix {:optional true} [:maybe :keyword]] + [:first-tag {:optional true} [:maybe context-tag-schema/?schema]] + [:second-tag {:optional true} [:maybe context-tag-schema/?schema]] + [:third-tag {:optional true} [:maybe context-tag-schema/?schema]] + [:fourth-tag {:optional true} [:maybe context-tag-schema/?schema]]]]] + :any]) diff --git a/src/quo/components/wallet/wallet_activity/view.cljs b/src/quo/components/wallet/wallet_activity/view.cljs index a63fbc49c6..fd08a9efc5 100644 --- a/src/quo/components/wallet/wallet_activity/view.cljs +++ b/src/quo/components/wallet/wallet_activity/view.cljs @@ -3,11 +3,13 @@ [quo.components.icon :as icon] [quo.components.markdown.text :as text] [quo.components.tags.context-tag.view :as context-tag] + [quo.components.wallet.wallet-activity.schema :as component-schema] [quo.components.wallet.wallet-activity.style :as style] [quo.theme :as quo.theme] [react-native.core :as rn] [react-native.hole-view :as hole-view] [reagent.core :as reagent] + [schema.core :as schema] [utils.i18n :as i18n])) (def transaction-translation @@ -132,35 +134,5 @@ (when fourth-tag [prop-tag fourth-tag blur?])]]]]))) (def view - "Properties: - - :transaction - type of transaction`. Possible values: - - :receive - - :send - - :swap - - :bridge - - :buy - - :destroy - - :mint - - - :status - transaction status. Possible values: - - :pending - - :confirmed - - :finalised - - :failed - - - :counter - amount of transactions shown by instance of the component - - - :timestamp - when transaction occured (string) - - :blur? - - - :first-tag - props for context tag component that will be first on the first line - - :second-tag - props for context tag component that will be second on the first line - - :third-tag - props for context tag component that will be first on the second line - - :fourth-tag - props for context tag component that will be second on the second line - - - :second-tag-prefix - translation keyword to be used with label before second context tag - - :third-tag-prefix - translation keyword to be used with label before third context tag - - :fourth-tag-prefix - translation keyword to be used with label before fourth context tag - - " - (quo.theme/with-theme view-internal)) + (quo.theme/with-theme + (schema/instrument #'view-internal component-schema/?schema))) diff --git a/src/quo/components/wallet/wallet_overview/component_spec.cljs b/src/quo/components/wallet/wallet_overview/component_spec.cljs index 60f26b9b73..ff691cee52 100644 --- a/src/quo/components/wallet/wallet_overview/component_spec.cljs +++ b/src/quo/components/wallet/wallet_overview/component_spec.cljs @@ -6,9 +6,9 @@ (h/describe "Wallet overview test" (h/test "renders correct balance" - (h/render [wallet-overview/view - {:state :default - :time-frame :one-week - :metrics :positive - :balance "€0.01"}]) + (h/render-with-theme-provider [wallet-overview/view + {:state :default + :time-frame :one-week + :metrics :positive + :balance "€0.01"}]) (h/is-truthy (h/get-by-text "€0.01")))) diff --git a/src/quo/components/wallet/wallet_overview/schema.cljs b/src/quo/components/wallet/wallet_overview/schema.cljs new file mode 100644 index 0000000000..d65836c7bc --- /dev/null +++ b/src/quo/components/wallet/wallet_overview/schema.cljs @@ -0,0 +1,23 @@ +(ns quo.components.wallet.wallet-overview.schema) + +(def ?schema + [:=> + [:catn + [:props + [:map + [:state {:optional true} [:maybe [:enum :default :loading]]] + [:time-frame {:optional true} + [:maybe [:enum :none :selected :one-week :one-month :three-months :one-year :all-time :custom]]] + [:metrics {:optional true} [:maybe [:enum :none :negative :positive]]] + [:balance {:optional true} [:maybe :string]] + [:date {:optional true} [:maybe :string]] + [:begin-date {:optional true} [:maybe :string]] + [:end-date {:optional true} [:maybe :string]] + [:currency-change {:optional true} [:maybe :string]] + [:percentage-change {:optional true} [:maybe :string]] + [:theme :schema.common/theme] + [:dropdown-on-press {:optional true} [:maybe fn?]] + [:networks {:optional true} + [:maybe [:sequential [:map [:source [:maybe :schema.common/image-source]]]]]] + [:dropdown-state {:optional true} [:maybe [:enum :default :disabled]]]]]] + :any]) diff --git a/src/quo/components/wallet/wallet_overview/view.cljs b/src/quo/components/wallet/wallet_overview/view.cljs index ce62fcc98c..f3045225ba 100644 --- a/src/quo/components/wallet/wallet_overview/view.cljs +++ b/src/quo/components/wallet/wallet_overview/view.cljs @@ -3,9 +3,11 @@ [quo.components.dropdowns.network-dropdown.view :as network-dropdown] [quo.components.icon :as icon] [quo.components.markdown.text :as text] + [quo.components.wallet.wallet-overview.schema :as component-schema] [quo.components.wallet.wallet-overview.style :as style] [quo.theme :as quo.theme] [react-native.core :as rn] + [schema.core :as schema] [utils.i18n :as i18n])) (def ^:private time-frames @@ -117,4 +119,5 @@ [view-info-bottom props]]) (def view - (quo.theme/with-theme view-internal)) + (quo.theme/with-theme + (schema/instrument #'view-internal component-schema/?schema))) diff --git a/src/schema/common.cljs b/src/schema/common.cljs index 3353531162..bc9708735e 100644 --- a/src/schema/common.cljs +++ b/src/schema/common.cljs @@ -13,7 +13,8 @@ (def ^:private ?image-source [:or - [:int] + :int + :string [:map [:uri [:maybe [:string]]]]]) diff --git a/src/status_im/contexts/preview/quo/wallet/transaction_progress.cljs b/src/status_im/contexts/preview/quo/wallet/transaction_progress.cljs index 396fc23733..3d5dd5014e 100644 --- a/src/status_im/contexts/preview/quo/wallet/transaction_progress.cljs +++ b/src/status_im/contexts/preview/quo/wallet/transaction_progress.cljs @@ -135,8 +135,6 @@ [] (let [state (reagent/atom {:title "Title" - :counter 40 - :total-box total-box :tag-name "Doodle" :tag-number "120" :epoch-number-mainnet "181,329" diff --git a/src/status_im/contexts/wallet/create_account/edit_derivation_path/component_spec.cljs b/src/status_im/contexts/wallet/create_account/edit_derivation_path/component_spec.cljs index 4216ad3383..79b5387bd1 100644 --- a/src/status_im/contexts/wallet/create_account/edit_derivation_path/component_spec.cljs +++ b/src/status_im/contexts/wallet/create_account/edit_derivation_path/component_spec.cljs @@ -3,13 +3,9 @@ [status-im.contexts.wallet.create-account.edit-derivation-path.view :as edit-derivation-path] [test-helpers.component :as h])) -(defn- render - [component] - (h/render-with-theme-provider component :light)) - (h/describe "Edit derivation path page" (h/test "Default render" - (render [edit-derivation-path/view {}]) + (h/render-with-theme-provider [edit-derivation-path/view {}]) (h/is-truthy (h/get-by-translation-text :t/edit-derivation-path)) (h/is-truthy (h/get-by-translation-text :t/path-format)) (h/is-truthy (h/get-by-translation-text :t/derivation-path)) @@ -19,14 +15,14 @@ (h/test "Reveal address pressed" (let [on-reveal (h/mock-fn)] - (render [edit-derivation-path/view {:on-reveal on-reveal}]) + (h/render-with-theme-provider [edit-derivation-path/view {:on-reveal on-reveal}]) (h/fire-event :press (h/get-by-translation-text :t/reveal-address)) (h/was-called on-reveal) (h/wait-for #(h/is-truthy (h/get-by-translation-text :t/address-activity))))) (h/test "Reset button pressed" (let [on-reset (h/mock-fn)] - (render [edit-derivation-path/view {:on-reset on-reset}]) + (h/render-with-theme-provider [edit-derivation-path/view {:on-reset on-reset}]) (h/fire-event :press (h/get-by-translation-text :t/reset)) (h/was-called on-reset) (h/wait-for #(h/is-truthy (h/get-by-translation-text :t/derive-addresses)))))) diff --git a/src/status_im/contexts/wallet/send/input_amount/component_spec.cljs b/src/status_im/contexts/wallet/send/input_amount/component_spec.cljs index ebccde8117..bb03e6d492 100644 --- a/src/status_im/contexts/wallet/send/input_amount/component_spec.cljs +++ b/src/status_im/contexts/wallet/send/input_amount/component_spec.cljs @@ -60,19 +60,15 @@ :total-balance 100 :market-values-per-currency {:usd {:price 10}}}}) -(defn- render - [component] - (h/render-with-theme-provider component :light)) - (h/describe "Send > input amount screen" (h/setup-restorable-re-frame) (h/test "Default render" (h/setup-subs sub-mocks) - (render [input-amount/view - {:crypto-decimals 2 - :limit-crypto 250 - :initial-crypto-currency? false}]) + (h/render-with-theme-provider [input-amount/view + {:crypto-decimals 2 + :limit-crypto 250 + :initial-crypto-currency? false}]) (h/is-truthy (h/get-by-text "0")) (h/is-truthy (h/get-by-text "ETH")) (h/is-truthy (h/get-by-text "$0.00")) @@ -82,11 +78,11 @@ (h/test "Fill token input and confirm" (h/setup-subs sub-mocks) (let [on-confirm (h/mock-fn)] - (render [input-amount/view - {:on-confirm on-confirm - :crypto-decimals 10 - :limit-crypto 1000 - :initial-crypto-currency? false}]) + (h/render-with-theme-provider [input-amount/view + {:on-confirm on-confirm + :crypto-decimals 10 + :limit-crypto 1000 + :initial-crypto-currency? false}]) (h/fire-event :press (h/query-by-label-text :keyboard-key-1)) (h/fire-event :press (h/query-by-label-text :keyboard-key-2)) @@ -106,11 +102,11 @@ (h/setup-subs sub-mocks) (let [on-confirm (h/mock-fn)] - (render [input-amount/view - {:crypto-decimals 10 - :limit-crypto 1000 - :on-confirm on-confirm - :initial-crypto-currency? false}]) + (h/render-with-theme-provider [input-amount/view + {:crypto-decimals 10 + :limit-crypto 1000 + :on-confirm on-confirm + :initial-crypto-currency? false}]) (h/fire-event :press (h/query-by-label-text :keyboard-key-1)) (h/fire-event :press (h/query-by-label-text :keyboard-key-2)) @@ -128,9 +124,9 @@ (h/test "Try to fill more than limit" (h/setup-subs sub-mocks) - (render [input-amount/view - {:crypto-decimals 1 - :limit-crypto 1}]) + (h/render-with-theme-provider [input-amount/view + {:crypto-decimals 1 + :limit-crypto 1}]) (h/fire-event :press (h/query-by-label-text :keyboard-key-2)) (h/fire-event :press (h/query-by-label-text :keyboard-key-9)) @@ -140,10 +136,10 @@ (h/test "Switch from crypto to fiat and check limit" (h/setup-subs sub-mocks) - (render [input-amount/view - {:crypto-decimals 1 - :limit-crypto 1 - :on-confirm #()}]) + (h/render-with-theme-provider [input-amount/view + {:crypto-decimals 1 + :limit-crypto 1 + :on-confirm #()}]) (h/fire-event :press (h/query-by-label-text :keyboard-key-9)) (h/is-truthy (h/get-by-label-text :container-error))