diff --git a/src/quo/components/drawers/drawer_top/component_spec.cljs b/src/quo/components/drawers/drawer_top/component_spec.cljs index 5fcb1896df..45637cb6ca 100644 --- a/src/quo/components/drawers/drawer_top/component_spec.cljs +++ b/src/quo/components/drawers/drawer_top/component_spec.cljs @@ -3,97 +3,110 @@ [quo.core :as quo] [test-helpers.component :as h])) +(def ^:private theme :light) + (h/describe "drawer top tests" (h/test "component renders in default type" - (h/render [quo/drawer-top - {:title "Title" - :type :default}]) + (h/render-with-theme-provider [quo/drawer-top + {:title "Title" + :type :default}] + theme) (h/is-truthy (h/get-by-text "Title"))) (h/test "component renders in default + description type" - (h/render [quo/drawer-top - {:title "Title" - :type :default - :description "Description"}]) + (h/render-with-theme-provider [quo/drawer-top + {:title "Title" + :type :default + :description "Description"}] + theme) (h/is-truthy (h/get-by-text "Title")) (h/is-truthy (h/get-by-text "Description"))) (h/test "component renders in info type" - (h/render [quo/drawer-top - {:title "Title" - :type :info}]) + (h/render-with-theme-provider [quo/drawer-top + {:title "Title" + :type :info}] + theme) (h/is-truthy (h/get-by-text "Title")) (h/is-truthy (h/get-by-label-text :info-icon))) (h/test "component renders in info + description type" - (h/render [quo/drawer-top - {:title "Title" - :description "Description" - :type :info}]) + (h/render-with-theme-provider [quo/drawer-top + {:title "Title" + :description "Description" + :type :info}] + theme) (h/is-truthy (h/get-by-text "Title")) (h/is-truthy (h/get-by-text "Description")) (h/is-truthy (h/get-by-label-text :info-icon))) (h/test "component renders in context-tag type" - (h/render [quo/drawer-top - {:title "Title" - :type :context-tag - :community-name "Coinbase"}]) + (h/render-with-theme-provider [quo/drawer-top + {:title "Title" + :type :context-tag + :community-name "Coinbase"}] + theme) (h/is-truthy (h/get-by-text "Title")) (h/is-truthy (h/get-by-label-text :context-tag-wrapper))) (h/test "component renders in context-tag + button type" - (h/render [quo/drawer-top - {:title "Title" - :type :context-tag - :button-icon :i/placeholder - :community-name "Coinbase"}]) + (h/render-with-theme-provider [quo/drawer-top + {:title "Title" + :type :context-tag + :button-icon :i/placeholder + :community-name "Coinbase"}] + theme) (h/is-truthy (h/get-by-text "Title")) (h/is-truthy (h/get-by-label-text :button-icon)) (h/is-truthy (h/get-by-label-text :context-tag-wrapper))) (h/test "component renders in account type" - (h/render [quo/drawer-top - {:title "Title" - :type :account - :account-avatar-emoji "🍿" - :networks [{:name :ethereum :short-name "eth"}] - :description "0x62b...0a5" - :customization-color :purple}]) + (h/render-with-theme-provider [quo/drawer-top + {:title "Title" + :type :account + :account-avatar-emoji "🍿" + :networks [{:name :ethereum :short-name "eth"}] + :description "0x62b...0a5" + :customization-color :purple}] + theme) (h/is-truthy (h/get-by-text "Title")) (h/is-truthy (h/get-by-text "0x62b...0a5")) (h/is-truthy (h/get-by-label-text :account-avatar))) (h/test "component renders in keypair type when keycard? is false" - (h/render [quo/drawer-top - {:title "Title" - :keycard? false - :icon-avatar :i/placeholder - :type :keypair}]) + (h/render-with-theme-provider [quo/drawer-top + {:title "Title" + :keycard? false + :icon-avatar :i/placeholder + :type :keypair}] + theme) (h/is-truthy (h/get-by-text "Title")) (-> (h/expect (h/get-by-translation-text :t/on-device)) (.toBeTruthy))) (h/test "component renders in keypair type when keycard? is true" - (h/render [quo/drawer-top - {:title "Title" - :keycard? true - :icon-avatar :i/placeholder - :type :keypair}]) + (h/render-with-theme-provider [quo/drawer-top + {:title "Title" + :keycard? true + :icon-avatar :i/placeholder + :type :keypair}] + theme) (h/is-truthy (h/get-by-text "Title")) (-> (h/expect (h/get-by-translation-text :t/on-keycard)) (.toBeTruthy))) (h/test "component renders in default-keypair type" - (h/render [quo/drawer-top - {:title "Title" - :description "0x62b...0a5" - :type :default-keypair}]) + (h/render-with-theme-provider [quo/drawer-top + {:title "Title" + :description "0x62b...0a5" + :type :default-keypair}] + theme) (h/is-truthy (h/get-by-text "Title")) (h/is-truthy (h/get-by-label-text :default-keypair-text))) (h/test "component renders in label type" - (h/render [quo/drawer-top - {:label "label" - :type :label}]) + (h/render-with-theme-provider [quo/drawer-top + {:label "label" + :type :label}] + theme) (h/is-truthy (h/get-by-text "label")))) diff --git a/src/quo/components/list_items/account/component_spec.cljs b/src/quo/components/list_items/account/component_spec.cljs index 88f6eed9b0..9623d6ecd6 100644 --- a/src/quo/components/list_items/account/component_spec.cljs +++ b/src/quo/components/list_items/account/component_spec.cljs @@ -4,79 +4,83 @@ [quo.foundations.colors :as colors] [test-helpers.component :as h])) +(def ^:private theme :light) + (h/describe "List items: account" (h/test "default render'" - (h/render [account/view]) + (h/render-with-theme-provider [account/view] theme) (h/is-truthy (h/query-by-label-text :container))) (h/test "on-press-in changes state to :pressed" - (h/render [account/view]) + (h/render-with-theme-provider [account/view] theme) (h/fire-event :on-press-in (h/get-by-label-text :container)) (h/wait-for #(h/has-style (h/query-by-label-text :container) {:backgroundColor (colors/resolve-color :blue :light 5)}))) (h/test "on-press-in changes state to :pressed with blur? enabled" - (h/render [account/view {:blur? true}]) + (h/render-with-theme-provider [account/view {:blur? true}] theme) (h/fire-event :on-press-in (h/get-by-label-text :container)) (h/wait-for #(h/has-style (h/query-by-label-text :container) {:backgroundColor colors/white-opa-5}))) (h/test "render with state :active" - (h/render [account/view {:state :active}]) + (h/render-with-theme-provider [account/view {:state :active}] theme) (h/has-style (h/query-by-label-text :container) {:backgroundColor (colors/resolve-color :blue :light 10)})) (h/test "render with state :active and blur? enabled" - (h/render [account/view - {:blur? true - :state :active}]) + (h/render-with-theme-provider [account/view + {:blur? true + :state :active}] + theme) (h/has-style (h/query-by-label-text :container) {:backgroundColor colors/white-opa-10})) (h/test "render with state :selected" - (h/render [account/view {:state :selected}]) + (h/render-with-theme-provider [account/view {:state :selected}] theme) (h/is-truthy (h/query-by-label-text :check-icon))) (h/test "calls on-press" (let [on-press (h/mock-fn)] - (h/render [account/view {:on-press on-press}]) + (h/render-with-theme-provider [account/view {:on-press on-press}] theme) (h/fire-event :on-press (h/get-by-label-text :container)) (h/was-called on-press))) (h/test "renders token props if type :tag" - (h/render [account/view {:type :tag}]) + (h/render-with-theme-provider [account/view {:type :tag}] theme) (h/is-truthy (h/query-by-label-text :tag-container))) (h/test "renders keycard icon if title-icon is present" - (h/render [account/view {:title-icon :i/placeholder}]) + (h/render-with-theme-provider [account/view {:title-icon :i/placeholder}] theme) (h/is-truthy (h/query-by-label-text :title-icon))) (h/test "doesn't render keycard icon if title-icon is missing" - (h/render [account/view]) + (h/render-with-theme-provider [account/view] theme) (h/is-falsy (h/query-by-label-text :title-icon))) (h/test "renders balance container but not arrow icon if type :balance-neutral" - (h/render [account/view {:type :balance-neutral}]) + (h/render-with-theme-provider [account/view {:type :balance-neutral}] theme) (h/is-truthy (h/query-by-label-text :balance-container)) (h/is-falsy (h/query-by-label-text :arrow-icon))) (h/test "renders balance container and negative arrow icon if type :balance-negative" - (h/render [account/view {:type :balance-negative}]) + (h/render-with-theme-provider [account/view {:type :balance-negative}] theme) (h/is-truthy (h/query-by-label-text :balance-container)) (h/is-truthy (h/query-by-label-text :icon-negative)) (h/is-falsy (h/query-by-label-text :icon-positive))) (h/test "renders balance container and positive arrow icon if type :balance-positive" - (h/render [account/view {:type :balance-positive}]) + (h/render-with-theme-provider [account/view {:type :balance-positive}] theme) (h/is-truthy (h/query-by-label-text :balance-container)) (h/is-falsy (h/query-by-label-text :icon-negative)) (h/is-truthy (h/query-by-label-text :icon-positive))) (h/test "renders options button if type :action" (let [on-options-press (h/mock-fn)] - (h/render [account/view - {:type :action - :on-options-press on-options-press}]) + (h/render-with-theme-provider [account/view + {:type :action + :on-options-press on-options-press}] + theme) (h/is-truthy (h/query-by-label-text :options-button)) (h/fire-event :on-press (h/get-by-label-text :options-button)) (h/was-called on-options-press)))) diff --git a/src/quo/components/wallet/account_card/component_spec.cljs b/src/quo/components/wallet/account_card/component_spec.cljs index 1e28f6c113..06a2dd5c90 100644 --- a/src/quo/components/wallet/account_card/component_spec.cljs +++ b/src/quo/components/wallet/account_card/component_spec.cljs @@ -5,6 +5,7 @@ (def username "Alisher account") (def empty-username "Account 1") +(def ^:private theme :light) (defn get-test-data [{:keys [type watch-only? empty-type? loading? no-metrics?]}] @@ -21,54 +22,54 @@ (h/describe "Account_card tests" (h/test "Renders Default" (let [data (get-test-data {:type :default})] - (h/render [account-card/view data]) + (h/render-with-theme-provider [account-card/view data] theme) (h/is-truthy (h/get-by-text username)))) (h/test "Renders Watch-Only" (let [data (get-test-data {:type :watch-only :watch-only? true})] - (h/render [account-card/view data]) + (h/render-with-theme-provider [account-card/view data] theme) (h/is-truthy (h/get-by-text username)))) (h/test "Renders Add-Account" (let [data {:type :add-account}] - (h/render [account-card/view data]) + (h/render-with-theme-provider [account-card/view data] theme) (h/is-truthy (h/get-by-label-text :add-account)))) (h/test "Renders Empty" (let [data (get-test-data {:type :empty :empty-type? true})] - (h/render [account-card/view data]) + (h/render-with-theme-provider [account-card/view data] theme) (h/is-truthy (h/get-by-text empty-username)))) (h/test "Renders Missing Keypair" (let [data (get-test-data {:type :missing-keypair})] - (h/render [account-card/view data]) + (h/render-with-theme-provider [account-card/view data] theme) (h/is-truthy (h/get-by-text username)))) (h/test "Add account on press fires correctly" (let [on-press (h/mock-fn) data {:type :add-account :on-press on-press}] - (h/render [account-card/view data]) + (h/render-with-theme-provider [account-card/view data] theme) (h/fire-event :on-press (h/get-by-label-text :add-account)) (h/was-called on-press))) (h/test "Renders component without metrics" (let [data (get-test-data {:type :default :no-metrics? true})] - (h/render [account-card/view data]) + (h/render-with-theme-provider [account-card/view data] theme) (h/is-falsy (h/query-by-label-text :metrics)))) (h/test "Renders loading state" (let [data (get-test-data {:type :default :loading? true})] - (h/render [account-card/view data]) + (h/render-with-theme-provider [account-card/view data] theme) (h/is-truthy (h/get-by-label-text :loading)))) (h/test "Renders loading state without metrics" (let [data (get-test-data {:type :default :no-metrics? true :loading? true})] - (h/render [account-card/view data]) + (h/render-with-theme-provider [account-card/view data] theme) (h/is-falsy (h/query-by-label-text :metrics))))) diff --git a/src/quo/components/wallet/account_card/schema.cljs b/src/quo/components/wallet/account_card/schema.cljs new file mode 100644 index 0000000000..78b3db97c4 --- /dev/null +++ b/src/quo/components/wallet/account_card/schema.cljs @@ -0,0 +1,33 @@ +(ns quo.components.wallet.account-card.schema) + +(def ^:private ?base + [:map + [:type {:optional true} [:enum :default :watch-only :add-account :empty :missing-keypair]] + [:customization-color {:optional true} [:maybe :schema.common/customization-color]] + [:theme :schema.common/theme] + [:metrics? {:optional true} [:maybe :boolean]] + [:on-press {:optional true} [:maybe fn?]]]) + +(def ^:private ?amount + [:map + [:amount {:optional true} [:maybe :string]]]) + +(def ^:private ?card + [:map + [:balance {:optional true} [:maybe :string]] + [:loading? {:optional true} [:maybe :boolean]] + [:name {:optional true} [:maybe :string]] + [:percentage-value {:optional true} [:maybe :string]] + [:emoji {:optional true} [:maybe :string]]]) + +(def ?schema + [:=> + [:catn + [:props + [:multi {:dispatch :type} + [:default [:merge ?base ?amount ?card]] + [:watch-only [:merge ?base ?amount ?card]] + [:missing-keypair [:merge ?base ?amount ?card]] + [:empty [:merge ?base ?card]] + [:add-account ?base]]]] + :any]) diff --git a/src/quo/components/wallet/account_card/view.cljs b/src/quo/components/wallet/account_card/view.cljs index 652438b978..d6283590cf 100644 --- a/src/quo/components/wallet/account_card/view.cljs +++ b/src/quo/components/wallet/account_card/view.cljs @@ -4,13 +4,15 @@ [quo.components.icon :as icon] [quo.components.markdown.text :as text] [quo.components.wallet.account-card.properties :as properties] + [quo.components.wallet.account-card.schema :as component-schema] [quo.components.wallet.account-card.style :as style] [quo.foundations.colors :as colors] [quo.foundations.customization-colors :as customization-colors] [quo.theme :as quo.theme] [react-native.core :as rn] [react-native.linear-gradient :as linear-gradient] - [reagent.core :as reagent])) + [reagent.core :as reagent] + [schema.core :as schema])) (defn- loading-view [{:keys [customization-color type theme metrics?]}] @@ -183,4 +185,6 @@ :add-account [add-account-view props] nil)) -(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/account_origin/component_spec.cljs b/src/quo/components/wallet/account_origin/component_spec.cljs index 89c9baef66..bffa1117f6 100644 --- a/src/quo/components/wallet/account_origin/component_spec.cljs +++ b/src/quo/components/wallet/account_origin/component_spec.cljs @@ -3,92 +3,104 @@ [quo.core :as quo] [test-helpers.component :as h])) +(def ^:private theme :light) + (h/describe "account origin tests" (h/test "component renders" - (h/render [quo/account-origin - {:type :recovery-phrase - :stored :on-keycard - :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" - :user-name "Test Name"}]) + (h/render-with-theme-provider [quo/account-origin + {:type :recovery-phrase + :stored :on-keycard + :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" + :user-name "Test Name"}] + theme) (-> (h/expect (h/get-by-translation-text :t/origin)) (.toBeTruthy))) (h/test "recovery phrase icon is visible when :type is :recovery-phrase" - (h/render [quo/account-origin - {:type :recovery-phrase - :stored :on-keycard - :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" - :user-name "Test Name"}]) + (h/render-with-theme-provider [quo/account-origin + {:type :recovery-phrase + :stored :on-keycard + :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" + :user-name "Test Name"}] + theme) (h/is-truthy (h/get-by-label-text :recovery-phrase-icon))) (h/test "recovery phrase icon is visible when :type is :recovery-phrase" - (h/render [quo/account-origin - {:type :recovery-phrase - :stored :on-keycard - :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" - :user-name "Test Name"}]) + (h/render-with-theme-provider [quo/account-origin + {:type :recovery-phrase + :stored :on-keycard + :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" + :user-name "Test Name"}] + theme) (h/is-truthy (h/get-by-label-text :recovery-phrase-icon))) (h/test "private-key-icon is visible when :type is :private-key" - (h/render [quo/account-origin - {:type :private-key - :stored :on-keycard - :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" - :user-name "Test Name"}]) + (h/render-with-theme-provider [quo/account-origin + {:type :private-key + :stored :on-keycard + :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" + :user-name "Test Name"}] + theme) (h/is-truthy (h/get-by-label-text :private-key-icon))) (h/test "derivation-path-icon is visible when :type is :default-keypair" - (h/render [quo/account-origin - {:type :default-keypair - :stored :on-keycard - :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" - :user-name "Test Name"}]) + (h/render-with-theme-provider [quo/account-origin + {:type :default-keypair + :stored :on-keycard + :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" + :user-name "Test Name"}] + theme) (h/is-truthy (h/get-by-label-text :derivation-path-icon))) (h/test "derivation-path-icon is visible when :type is :recovery-phrase" - (h/render [quo/account-origin - {:type :recovery-phrase - :stored :on-keycard - :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" - :user-name "Test Name"}]) + (h/render-with-theme-provider [quo/account-origin + {:type :recovery-phrase + :stored :on-keycard + :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" + :user-name "Test Name"}] + theme) (h/is-truthy (h/get-by-label-text :derivation-path-icon))) (h/test "on-device text is visible when :stored is :on-device" - (h/render [quo/account-origin - {:type :recovery-phrase - :stored :on-device - :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" - :user-name "Test Name"}]) + (h/render-with-theme-provider [quo/account-origin + {:type :recovery-phrase + :stored :on-device + :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" + :user-name "Test Name"}] + theme) (-> (h/expect (h/get-by-translation-text :t/on-device)) (.toBeTruthy))) (h/test "on-keycard text is visible when :stored is :on-keycard" - (h/render [quo/account-origin - {:type :recovery-phrase - :stored :on-keycard - :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" - :user-name "Test Name"}]) + (h/render-with-theme-provider [quo/account-origin + {:type :recovery-phrase + :stored :on-keycard + :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" + :user-name "Test Name"}] + theme) (-> (h/expect (h/get-by-translation-text :t/on-keycard)) (.toBeTruthy))) (h/test "on-press is called when :type is :recovery-phrase" (let [on-press (h/mock-fn)] - (h/render [quo/account-origin - {:type :recovery-phrase - :stored :on-keycard - :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" - :user-name "Test Name" - :on-press on-press}]) + (h/render-with-theme-provider [quo/account-origin + {:type :recovery-phrase + :stored :on-keycard + :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" + :user-name "Test Name" + :on-press on-press}] + theme) (h/fire-event :press (h/query-by-label-text :derivation-path-button)) (h/was-called on-press))) (h/test "on-press is called when :type is :default-keypair" (let [on-press (h/mock-fn)] - (h/render [quo/account-origin - {:type :default-keypair - :stored :on-keycard - :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" - :user-name "Test Name" - :on-press on-press}]) + (h/render-with-theme-provider [quo/account-origin + {:type :default-keypair + :stored :on-keycard + :derivation-path "m / 44’ / 60’ / 0’ / 0’ / 2" + :user-name "Test Name" + :on-press on-press}] + theme) (h/fire-event :press (h/query-by-label-text :derivation-path-button)) (h/was-called on-press)))) diff --git a/src/quo/components/wallet/account_origin/schema.cljs b/src/quo/components/wallet/account_origin/schema.cljs new file mode 100644 index 0000000000..9fd3bfa171 --- /dev/null +++ b/src/quo/components/wallet/account_origin/schema.cljs @@ -0,0 +1,30 @@ +(ns quo.components.wallet.account-origin.schema) + +(def ^:private ?base + [:map + [:type {:optional true} [:enum :default-keypair :recovery-phrase :private-key]] + [:stored {:optional true} [:enum :on-device :on-keycard]] + [:theme :schema.common/theme]]) + +(def ^:private ?default-keypair + [:map + [:user-name {:optional true} [:maybe :string]] + [:profile-picture {:optional true} [:maybe [:or :schema.common/image-source :string]]] + [:derivation-path {:optional true} [:maybe :string]] + [:on-press {:optional true} [:maybe fn?]] + [:customization-color {:optional true} [:maybe :schema.common/customization-color]]]) + +(def ^:private ?recovery-phrase + [:map + [:derivation-path {:optional true} [:maybe :string]] + [:on-press {:optional true} [:maybe fn?]]]) + +(def ?schema + [:=> + [:catn + [:props + [:multi {:dispatch :type} + [:default-keypair [:merge ?base ?default-keypair]] + [:recovery-phrase [:merge ?base ?recovery-phrase]] + [:private-key ?base]]]] + :any]) diff --git a/src/quo/components/wallet/account_origin/view.cljs b/src/quo/components/wallet/account_origin/view.cljs index 6a596b4147..b35d3c7e22 100644 --- a/src/quo/components/wallet/account_origin/view.cljs +++ b/src/quo/components/wallet/account_origin/view.cljs @@ -3,10 +3,12 @@ [quo.components.avatars.user-avatar.view :as user-avatar] [quo.components.icon :as icons] [quo.components.markdown.text :as text] + [quo.components.wallet.account-origin.schema :as component-schema] [quo.components.wallet.account-origin.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])) (defn- row-title @@ -107,14 +109,5 @@ [card-view theme derivation-path secondary-color on-press])])) (def view - "Create an account-origin UI component. - | key | values | - | ----------------------|------------------------------------------------| - | :type | :default-keypair :recovery-phrase :private-key - | :stored | :on-device :on-keycard - | :profile-picture | image source - | :customization-color | profile color - | :derivation-path | string - | :user-name | string - | :on-press | function" - (quo.theme/with-theme view-internal)) + (quo.theme/with-theme + (schema/instrument #'view-internal component-schema/?schema))) diff --git a/src/quo/components/wallet/account_overview/schema.cljs b/src/quo/components/wallet/account_overview/schema.cljs new file mode 100644 index 0000000000..6914757cc2 --- /dev/null +++ b/src/quo/components/wallet/account_overview/schema.cljs @@ -0,0 +1,20 @@ +(ns quo.components.wallet.account-overview.schema) + +(def ?schema + [:=> + [:catn + [:props + [:map + [:account-name {:optional true} [:maybe :string]] + [:currency-change {:optional true} [:maybe :string]] + [:current-value {:optional true} [:maybe :string]] + [:percentage-change {:optional true} [:maybe :string]] + [:time-frame-string {:optional true} [:maybe :string]] + [:time-frame-to-string {:optional true} [:maybe :string]] + [:state {:optional true} [:enum :default :loading]] + [:metrics {:optional true} [:enum :negative :positive]] + [:customization-color {:optional true} [:maybe :schema.common/customization-color]] + [:account {:optional true} [:enum :default :watched-address]] + [:time-frame {:optional true} + [:enum :one-week :one-month :three-months :one-year :all-time :custom]]]]] + :any]) diff --git a/src/quo/components/wallet/account_overview/view.cljs b/src/quo/components/wallet/account_overview/view.cljs index c5744afe3c..466bb06244 100644 --- a/src/quo/components/wallet/account_overview/view.cljs +++ b/src/quo/components/wallet/account_overview/view.cljs @@ -2,10 +2,12 @@ (:require [quo.components.icon :as icons] [quo.components.markdown.text :as text] + [quo.components.wallet.account-overview.schema :as component-schema] [quo.components.wallet.account-overview.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])) (defn- loading-state @@ -129,16 +131,5 @@ [numeric-changes percentage-change currency-change customization-color theme up?])]])])) (def view - "Create a account-overview UI component. - | key | description | - | -------------|-------------| - | `:account-name` | A value representing the account name (default `nil`) - | `:account` | A value that represents if the account is a `:watched-address` or a `:default` account. (default `nil`) - | `:time-frame` | A value that represents the type of the timeframe, Can be from a preset of time frames. `[:1-week :1-month :3-months :1-year :custom]` (default `nil`) if custom is set, We expect a start time and if there's a space between two times that are in `time-frame-string` we'll split them with an arrow to the right icon - | `:loading?` | A value that indicates that component is loading data. (default `nil`) - | `:metrics` | A value that indicates if the account value have increased can be `:positive` or `:negative` (default `nil`) - | `:time-frame-string` | A value representing time frame string. (default `nil`) - | `:current-value` | A value representing the current value of the selected account. (default `nil`) - | `:currency-change` | A value representing the change of the value of the selected account in the selected currency. (default `nil`) - | `:percentage-change` | A value representing the change of the value of the selected account in percentage relative to it's previous value. (default `nil`)" - (quo.theme/with-theme view-internal)) + (quo.theme/with-theme + (schema/instrument #'view-internal component-schema/?schema))) diff --git a/src/quo/components/wallet/account_permissions/schema.cljs b/src/quo/components/wallet/account_permissions/schema.cljs new file mode 100644 index 0000000000..fb1519e584 --- /dev/null +++ b/src/quo/components/wallet/account_permissions/schema.cljs @@ -0,0 +1,22 @@ +(ns quo.components.wallet.account-permissions.schema + (:require [quo.components.wallet.required-tokens.view :as required-tokens])) + +(def ?schema + [:=> + [:catn + [:props + [:map + [:account + [:map + [:name [:maybe :string]] + [:address [:maybe :string]] + [:emoji [:maybe :string]] + [:customization-color {:optional true} [:maybe :schema.common/customization-color]]]] + [:token-details {:optional true} [:maybe [:vector required-tokens/?schema]]] + [:keycard? {:optional true} [:maybe :boolean]] + [:checked? {:optional true} [:maybe :boolean]] + [:disabled? {:optional true} [:maybe :boolean]] + [:on-change {:optional true} [:maybe fn?]] + [:container-style {:optional true} [:maybe :map]] + [:theme :schema.common/theme]]]] + :any]) diff --git a/src/quo/components/wallet/account_permissions/view.cljs b/src/quo/components/wallet/account_permissions/view.cljs index 8e94e23242..bf77f21338 100644 --- a/src/quo/components/wallet/account_permissions/view.cljs +++ b/src/quo/components/wallet/account_permissions/view.cljs @@ -4,6 +4,7 @@ [quo.components.icon :as icons] [quo.components.markdown.text :as text] [quo.components.selectors.selectors.view :as selectors] + [quo.components.wallet.account-permissions.schema :as component-schema] [quo.components.wallet.account-permissions.style :as style] [quo.components.wallet.address-text.view :as address-text] [quo.components.wallet.required-tokens.view :as required-tokens] @@ -13,26 +14,6 @@ [schema.core :as schema] [utils.i18n :as i18n])) -(def ?schema - [:=> - [:catn - [:props - [:map {:closed true} - [:account - [:map {:closed true} - [:name [:maybe :string]] - [:address [:maybe :string]] - [:emoji [:maybe :string]] - [:customization-color [:maybe [:or :string :keyword]]]]] - [:token-details {:optional true} [:maybe [:sequential required-tokens/?schema]]] - [:keycard? {:optional true} [:maybe :boolean]] - [:checked? {:optional true} [:maybe :boolean]] - [:disabled? {:optional true} [:maybe :boolean]] - [:on-change {:optional true} [:maybe fn?]] - [:container-style {:optional true} [:maybe :map]] - [:theme :schema.common/theme]]]] - :any]) - (defn- token-details-section [tokens] (when tokens @@ -95,4 +76,4 @@ (def view (quo.theme/with-theme - (schema/instrument #'view-internal ?schema))) + (schema/instrument #'view-internal component-schema/?schema))) diff --git a/src/quo/components/wallet/address_text/schema.cljs b/src/quo/components/wallet/address_text/schema.cljs new file mode 100644 index 0000000000..862b52b7ad --- /dev/null +++ b/src/quo/components/wallet/address_text/schema.cljs @@ -0,0 +1,14 @@ +(ns quo.components.wallet.address-text.schema) + +(def ?schema + [:=> + [:catn + [:props + [:map + [:address {:optional true} [:maybe :string]] + [:blur? {:optional true} [:maybe :boolean]] + [:format {:optional true} [:enum :short :long]] + [:theme :schema.common/theme] + [:networks {:optional true} + [:maybe [:sequential [:map [:name :keyword] [:short-name :string]]]]]]]] + :any]) diff --git a/src/quo/components/wallet/address_text/view.cljs b/src/quo/components/wallet/address_text/view.cljs index fb8b8cd89a..52c9f2e935 100644 --- a/src/quo/components/wallet/address_text/view.cljs +++ b/src/quo/components/wallet/address_text/view.cljs @@ -1,8 +1,10 @@ (ns quo.components.wallet.address-text.view (:require [quo.components.markdown.text :as text] + [quo.components.wallet.address-text.schema :as component-schema] [quo.components.wallet.address-text.style :as style] [quo.foundations.colors :as colors] [quo.theme] + [schema.core :as schema] [utils.address :as utils])) (defn- colored-network-text @@ -28,4 +30,6 @@ (into [text/text] network-text-xf $) (conj $ address-text)))) -(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/confirmation_progress/component_spec.cljs b/src/quo/components/wallet/confirmation_progress/component_spec.cljs index 60010c4874..1f1a98ecb5 100644 --- a/src/quo/components/wallet/confirmation_progress/component_spec.cljs +++ b/src/quo/components/wallet/confirmation_progress/component_spec.cljs @@ -1,99 +1,111 @@ (ns quo.components.wallet.confirmation-progress.component-spec (:require [quo.core :as quo] - [reagent.core :as reagent] [test-helpers.component :as h])) +(def ^:private theme :light) + (defn- get-test-data [{:keys [state network] :or {state :pending network :mainnet}}] - {:counter (reagent/atom 0) + {:counter 0 :total-box 85 - :progress-value "10" + :progress-value 10 :network network :state state :customization-color :blue}) (h/describe "Confirmation Progress" (h/test "component renders when state is sending and network is optimism" - (h/render [quo/confirmation-propgress - (get-test-data {:state :sending - :network :optimism})]) + (h/render-with-theme-provider [quo/confirmation-propgress + (get-test-data {:state :sending + :network :optimism})] + theme) (h/is-truthy (h/get-by-label-text :progress-box))) (h/test "component renders when state is confirmed and network is optimism" - (h/render [quo/confirmation-propgress - (get-test-data {:state :confirmed - :network :optimism})]) + (h/render-with-theme-provider [quo/confirmation-propgress + (get-test-data {:state :confirmed + :network :optimism})] + theme) (h/is-truthy (h/get-by-label-text :progress-box))) (h/test "component renders when state is finalising and network is optimism" - (h/render [quo/confirmation-propgress - (get-test-data {:state :finalising - :network :optimism})]) + (h/render-with-theme-provider [quo/confirmation-propgress + (get-test-data {:state :finalising + :network :optimism})] + theme) (h/is-truthy (h/get-by-label-text :progress-box))) (h/test "component renders when state is finalized and network is optimism" - (h/render [quo/confirmation-propgress - (get-test-data {:state :finalized - :network :optimism})]) + (h/render-with-theme-provider [quo/confirmation-propgress + (get-test-data {:state :finalized + :network :optimism})] + theme) (h/is-truthy (h/get-by-label-text :progress-box))) (h/test "component renders when state is error and network is optimism" - (h/render [quo/confirmation-propgress - (get-test-data {:state :error - :network :optimism})]) + (h/render-with-theme-provider [quo/confirmation-propgress + (get-test-data {:state :error + :network :optimism})] + theme) (h/is-truthy (h/get-by-label-text :progress-box))) (h/test "component renders when state is sending and network is arbitrum" - (h/render [quo/confirmation-propgress - (get-test-data {:state :sending - :network :arbitrum})]) + (h/render-with-theme-provider [quo/confirmation-propgress + (get-test-data {:state :sending + :network :arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :progress-box))) (h/test "component renders when state is confirmed and network is arbitrum" - (h/render [quo/confirmation-propgress - (get-test-data {:state :confirmed - :network :arbitrum})]) + (h/render-with-theme-provider [quo/confirmation-propgress + (get-test-data {:state :confirmed + :network :arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :progress-box))) (h/test "component renders when state is finalising and network is arbitrum" - (h/render [quo/confirmation-propgress - (get-test-data {:state :finalising - :network :arbitrum})]) + (h/render-with-theme-provider [quo/confirmation-propgress + (get-test-data {:state :finalising + :network :arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :progress-box))) (h/test "component renders when state is finalized and network is arbitrum" - (h/render [quo/confirmation-propgress - (get-test-data {:state :finalized - :network :arbitrum})]) + (h/render-with-theme-provider [quo/confirmation-propgress + (get-test-data {:state :finalized + :network :arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :progress-box))) (h/test "component renders when state is error and network is arbitrum" - (h/render [quo/confirmation-propgress - (get-test-data {:state :error - :network :arbitrum})]) + (h/render-with-theme-provider [quo/confirmation-propgress + (get-test-data {:state :error + :network :arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :progress-box))) (h/test "component renders when state is pending and network is mainnet" - (h/render [quo/confirmation-propgress (get-test-data {})]) + (h/render-with-theme-provider [quo/confirmation-propgress (get-test-data {})] theme) (h/is-truthy (h/get-by-label-text :mainnet-progress-box))) (h/test "component renders when state is sending and network is mainnet" - (h/render [quo/confirmation-propgress (get-test-data {:state :sending})]) + (h/render-with-theme-provider [quo/confirmation-propgress (get-test-data {:state :sending})] theme) (h/is-truthy (h/get-by-label-text :mainnet-progress-box))) (h/test "component renders when state is confirmed and network is mainnet" - (h/render [quo/confirmation-propgress (get-test-data {:state :confirmed})]) + (h/render-with-theme-provider [quo/confirmation-propgress (get-test-data {:state :confirmed})] theme) (h/is-truthy (h/get-by-label-text :mainnet-progress-box))) (h/test "component renders when state is finalising and network is mainnet" - (h/render [quo/confirmation-propgress (get-test-data {:state :finalising})]) + (h/render-with-theme-provider [quo/confirmation-propgress (get-test-data {:state :finalising})] + theme) (h/is-truthy (h/get-by-label-text :mainnet-progress-box))) (h/test "component renders when state is finalized and network is mainnet" - (h/render [quo/confirmation-propgress (get-test-data {:state :finalized})]) + (h/render-with-theme-provider [quo/confirmation-propgress (get-test-data {:state :finalized})] theme) (h/is-truthy (h/get-by-label-text :mainnet-progress-box))) (h/test "component renders when state is error and network is mainnet" - (h/render [quo/confirmation-propgress (get-test-data {:state :error})]) + (h/render-with-theme-provider [quo/confirmation-propgress (get-test-data {:state :error})] theme) (h/is-truthy (h/get-by-label-text :mainnet-progress-box)))) diff --git a/src/quo/components/wallet/confirmation_progress/schema.cljs b/src/quo/components/wallet/confirmation_progress/schema.cljs new file mode 100644 index 0000000000..c3c8ef2ebc --- /dev/null +++ b/src/quo/components/wallet/confirmation_progress/schema.cljs @@ -0,0 +1,15 @@ +(ns quo.components.wallet.confirmation-progress.schema) + +(def ?schema + [:=> + [:catn + [:props + [:map + [:total-box {:optional true} [:maybe :int]] + [:counter {:optional true} [:maybe :int]] + [:progress-value {:optional true} [:maybe :int]] + [:network {:optional true} [:enum :mainnet :optimism :arbitrum]] + [:state {:optional true} [:enum :pending :sending :confirmed :finalising :finalized :error]] + [:customization-color {:optional true} [:maybe :schema.common/customization-color]] + [:theme :schema.common/theme]]]] + :any]) diff --git a/src/quo/components/wallet/confirmation_progress/view.cljs b/src/quo/components/wallet/confirmation_progress/view.cljs index 0a43841587..02deb81086 100644 --- a/src/quo/components/wallet/confirmation_progress/view.cljs +++ b/src/quo/components/wallet/confirmation_progress/view.cljs @@ -1,8 +1,10 @@ (ns quo.components.wallet.confirmation-progress.view - (:require [quo.components.wallet.confirmation-progress.style :as style] + (:require [quo.components.wallet.confirmation-progress.schema :as component-schema] + [quo.components.wallet.confirmation-progress.style :as style] [quo.components.wallet.progress-bar.view :as progress-box] [quo.theme :as quo.theme] - [react-native.core :as rn])) + [react-native.core :as rn] + [schema.core :as schema])) (def ^:private max-progress 100) (def ^:private min-progress 0) @@ -66,4 +68,6 @@ (:arbitrum :optimism) [progress-boxes-sidenet props] nil)) -(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/keypair/component_spec.cljs b/src/quo/components/wallet/keypair/component_spec.cljs index f31fcd4b95..95e41e71cb 100644 --- a/src/quo/components/wallet/keypair/component_spec.cljs +++ b/src/quo/components/wallet/keypair/component_spec.cljs @@ -3,6 +3,8 @@ [quo.components.wallet.keypair.view :as keypair] [test-helpers.component :as h])) +(def ^:private theme :light) + (def accounts [{:account-props {:customization-color :turquoise :size 32 @@ -23,41 +25,45 @@ (h/describe "Wallet: Keypair" (h/test "Default keypair title renders" - (h/render [keypair/view - {:accounts accounts - :customization-color :blue - :type :default-keypair - :stored :on-device - :action :selector - :details default-details}]) + (h/render-with-theme-provider [keypair/view + {:accounts accounts + :customization-color :blue + :type :default-keypair + :stored :on-device + :action :selector + :details default-details}] + theme) (h/is-truthy (h/get-by-label-text :title))) (h/test "On device renders" - (h/render [keypair/view - {:accounts accounts - :customization-color :blue - :type :other - :stored :on-device - :action :selector - :details other-details}]) + (h/render-with-theme-provider [keypair/view + {:accounts accounts + :customization-color :blue + :type :other + :stored :on-device + :action :selector + :details other-details}] + theme) (h/is-truthy (h/get-by-label-text :details))) (h/test "Selector action renders" - (h/render [keypair/view - {:accounts accounts - :customization-color :blue - :type :other - :stored :on-keycard - :action :selector - :details other-details}]) + (h/render-with-theme-provider [keypair/view + {:accounts accounts + :customization-color :blue + :type :other + :stored :on-keycard + :action :selector + :details other-details}] + theme) (h/is-truthy (h/get-by-label-text :radio-on))) (h/test "Options action renders" - (h/render [keypair/view - {:accounts accounts - :customization-color :blue - :type :other - :stored :on-keycard - :action :options - :details other-details}]) + (h/render-with-theme-provider [keypair/view + {:accounts accounts + :customization-color :blue + :type :other + :stored :on-keycard + :action :options + :details other-details}] + theme) (h/is-truthy (h/get-by-label-text :options-button)))) diff --git a/src/quo/components/wallet/transaction_progress/component_spec.cljs b/src/quo/components/wallet/transaction_progress/component_spec.cljs index eb82518e10..a4b6139b64 100644 --- a/src/quo/components/wallet/transaction_progress/component_spec.cljs +++ b/src/quo/components/wallet/transaction_progress/component_spec.cljs @@ -1,200 +1,225 @@ (ns quo.components.wallet.transaction-progress.component-spec (:require [quo.core :as quo] - [reagent.core :as reagent] [test-helpers.component :as h])) +(def ^:private theme :light) + (defn- get-test-data [{:keys [state network] :or {state :pending network :mainnet}}] {:title "Title" :tag-name "Doodle" - :tag-number "120" + :tag-number 120 :network network :customization-color :blue :networks [{:network :mainnet :state state - :counter (reagent/atom 0) + :counter 0 :total-box 85 :progress 30 :epoch-number "123"} {:network :optimism :state state - :progress "50" + :progress 50 :epoch-number "123"} {:network :arbitrum :state state - :progress "30" + :progress 30 :epoch-number "123"}] :on-press (fn [] (js/alert "Transaction progress item pressed"))}) (h/describe "Transaction Progress" (h/test "component renders without props" - (h/render [quo/transaction-progress]) + (h/render-with-theme-provider [quo/transaction-progress] theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is pending and network is mainnet" - (h/render [quo/transaction-progress (get-test-data {:network :optimism-arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:network :optimism-arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is sending and network is optimism-arbitrum" - (h/render [quo/transaction-progress - (get-test-data {:state :sending - :network :optimism-arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:state :sending + :network :optimism-arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is confirmed and network is optimism-arbitrum" - (h/render [quo/transaction-progress - (get-test-data {:state :confirmed - :network :optimism-arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:state :confirmed + :network :optimism-arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is finalising and network is optimism-arbitrum" - (h/render [quo/transaction-progress - (get-test-data {:state :finalising - :network :optimism-arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:state :finalising + :network :optimism-arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is finalized and network is optimism-arbitrum" - (h/render [quo/transaction-progress - (get-test-data {:state :finalized - :network :optimism-arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:state :finalized + :network :optimism-arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is error and network is optimism-arbitrum" - (h/render [quo/transaction-progress - (get-test-data {:state :error - :network :optimism-arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:state :error + :network :optimism-arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is sending and network is optimism" - (h/render [quo/transaction-progress - (get-test-data {:state :sending - :network :optimism})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:state :sending + :network :optimism})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is confirmed and network is optimism" - (h/render [quo/transaction-progress - (get-test-data {:state :confirmed - :network :optimism})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:state :confirmed + :network :optimism})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is finalising and network is optimism" - (h/render [quo/transaction-progress - (get-test-data {:state :finalising - :network :optimism})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:state :finalising + :network :optimism})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is finalized and network is optimism" - (h/render [quo/transaction-progress - (get-test-data {:state :finalized - :network :optimism})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:state :finalized + :network :optimism})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is error and network is optimism" - (h/render [quo/transaction-progress - (get-test-data {:state :error - :network :optimism})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:state :error + :network :optimism})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is sending and network is arbitrum" - (h/render [quo/transaction-progress - (get-test-data {:state :sending - :network :arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:state :sending + :network :arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is confirmed and network is arbitrum" - (h/render [quo/transaction-progress - (get-test-data {:state :confirmed - :network :arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:state :confirmed + :network :arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is finalising and network is arbitrum" - (h/render [quo/transaction-progress - (get-test-data {:state :finalising - :network :arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:state :finalising + :network :arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is finalized and network is arbitrum" - (h/render [quo/transaction-progress - (get-test-data {:state :finalized - :network :arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:state :finalized + :network :arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is error and network is arbitrum" - (h/render [quo/transaction-progress - (get-test-data {:state :error - :network :arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:state :error + :network :arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is pending and network is mainnet" - (h/render [quo/transaction-progress (get-test-data {})]) + (h/render-with-theme-provider [quo/transaction-progress (get-test-data {})] theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is sending and network is mainnet" - (h/render [quo/transaction-progress (get-test-data {:state :sending})]) + (h/render-with-theme-provider [quo/transaction-progress (get-test-data {:state :sending})] theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is confirmed and network is mainnet" - (h/render [quo/transaction-progress (get-test-data {:state :confirmed})]) + (h/render-with-theme-provider [quo/transaction-progress (get-test-data {:state :confirmed})] theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is finalising and network is mainnet" - (h/render [quo/transaction-progress (get-test-data {:state :finalising})]) + (h/render-with-theme-provider [quo/transaction-progress (get-test-data {:state :finalising})] theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is finalized and network is mainnet" - (h/render [quo/transaction-progress (get-test-data {:state :finalized})]) + (h/render-with-theme-provider [quo/transaction-progress (get-test-data {:state :finalized})] theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "component renders when state is error and network is mainnet" - (h/render [quo/transaction-progress (get-test-data {:state :error})]) + (h/render-with-theme-provider [quo/transaction-progress (get-test-data {:state :error})] theme) (h/is-truthy (h/get-by-label-text :transaction-progress))) (h/test "mainnet progress box is visible network is mainnet" - (h/render [quo/transaction-progress (get-test-data {})]) + (h/render-with-theme-provider [quo/transaction-progress (get-test-data {})] theme) (h/is-truthy (h/get-by-label-text :mainnet-progress-box))) (h/test "arbitrum-optimism progress box is visible network is optimism-arbitrum" - (h/render [quo/transaction-progress (get-test-data {:network :optimism-arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:network :optimism-arbitrum})] + theme) (h/is-truthy (h/get-all-by-label-text :progress-box))) (h/test "arbitrum progress box is visible network is arbitrum" - (h/render [quo/transaction-progress (get-test-data {:network :arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress (get-test-data {:network :arbitrum})] theme) (h/is-truthy (h/get-all-by-label-text :progress-box))) (h/test "optimism progress box is visible network is optimism" - (h/render [quo/transaction-progress (get-test-data {:network :optimism})]) + (h/render-with-theme-provider [quo/transaction-progress (get-test-data {:network :optimism})] theme) (h/is-truthy (h/get-all-by-label-text :progress-box))) (h/test "title is visible network is optimism-arbitrum" - (h/render [quo/transaction-progress (get-test-data {:network :optimism-arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:network :optimism-arbitrum})] + theme) (h/is-truthy (h/get-by-text "Title"))) (h/test "title is visible network is mainnet" - (h/render [quo/transaction-progress (get-test-data {})]) + (h/render-with-theme-provider [quo/transaction-progress (get-test-data {})] theme) (h/is-truthy (h/get-by-text "Title"))) (h/test "title is visible network is optimism" - (h/render [quo/transaction-progress (get-test-data {:network :optimism})]) + (h/render-with-theme-provider [quo/transaction-progress (get-test-data {:network :optimism})] theme) (h/is-truthy (h/get-by-text "Title"))) (h/test "title is visible network is arbitrum" - (h/render [quo/transaction-progress (get-test-data {:network :arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress (get-test-data {:network :arbitrum})] theme) (h/is-truthy (h/get-by-text "Title"))) (h/test "context tag is visible network is optimism-arbitrum" - (h/render [quo/transaction-progress (get-test-data {:network :optimism-arbitrum})]) + (h/render-with-theme-provider [quo/transaction-progress + (get-test-data {:network :optimism-arbitrum})] + theme) (h/is-truthy (h/get-by-label-text :context-tag))) (h/test "context tag is visible network is mainnet" - (h/render [quo/transaction-progress (get-test-data {})]) + (h/render-with-theme-provider [quo/transaction-progress (get-test-data {})] theme) (h/is-truthy (h/get-by-label-text :context-tag))) (h/test "context tag is visible network is optimism" - (h/render [quo/transaction-progress (get-test-data {:network :optimism})]) + (h/render-with-theme-provider [quo/transaction-progress (get-test-data {:network :optimism})] theme) (h/is-truthy (h/get-by-label-text :context-tag))) (h/test "context tag is visible network is optimism" - (h/render [quo/transaction-progress (get-test-data {:network :arbitrum})]) - (h/is-truthy (h/get-by-label-text :context-tag)))) + (h/render-with-theme-provider [quo/transaction-progress (get-test-data {:network :arbitrum})] theme) + (h/is-truthy (h/get-by-label-text :context-tag))) +) diff --git a/src/status_im/contexts/preview/quo/wallet/confirmation_progress.cljs b/src/status_im/contexts/preview/quo/wallet/confirmation_progress.cljs index 2e40e191af..01c1779613 100644 --- a/src/status_im/contexts/preview/quo/wallet/confirmation_progress.cljs +++ b/src/status_im/contexts/preview/quo/wallet/confirmation_progress.cljs @@ -6,7 +6,7 @@ [status-im.contexts.preview.quo.preview :as preview])) (def descriptor - [{:type :text + [{:type :number :key :progress-value} {:type :select :key :network @@ -78,7 +78,7 @@ [] (let [state (reagent/atom {:total-box total-box - :progress-value "10" + :progress-value 10 :network :mainnet :state :pending :customization-color :blue})] 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 08256b5bd7..396fc23733 100644 --- a/src/status_im/contexts/preview/quo/wallet/transaction_progress.cljs +++ b/src/status_im/contexts/preview/quo/wallet/transaction_progress.cljs @@ -19,9 +19,9 @@ :key :epoch-number-arbitrum} {:type :text :key :tag-number} - {:type :text + {:type :number :key :optimism-progress-percentage} - {:type :text + {:type :number :key :arbitrum-progress-percentage} {:type :select :key :network @@ -142,8 +142,8 @@ :epoch-number-mainnet "181,329" :epoch-number-optimism "181,329" :epoch-number-arbitrum "181,329" - :optimism-progress-percentage "10" - :arbitrum-progress-percentage "10" + :optimism-progress-percentage 10 + :arbitrum-progress-percentage 10 :network :mainnet :state-mainnet :pending :state-arbitrum :pending diff --git a/src/status_im/contexts/wallet/home/view.cljs b/src/status_im/contexts/wallet/home/view.cljs index 17da7b6e4c..e8bd82df9d 100644 --- a/src/status_im/contexts/wallet/home/view.cljs +++ b/src/status_im/contexts/wallet/home/view.cljs @@ -60,7 +60,7 @@ :data cards :horizontal true :separator [rn/view {:style style/separator}] - :render-fn quo/account-card + :render-fn (fn [item] [quo/account-card item]) :shows-horizontal-scroll-indicator false}] [quo/tabs {:style style/tabs