chore(wallet): add images to select address page (#18119)

This commit is contained in:
Jamie Caprani 2023-12-18 11:55:42 +00:00 committed by GitHub
parent 8d0bb7ba9e
commit 8a869be01c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
22 changed files with 54 additions and 83 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

View File

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 13 KiB

View File

Before

Width:  |  Height:  |  Size: 24 KiB

After

Width:  |  Height:  |  Size: 24 KiB

View File

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 15 KiB

View File

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

View File

@ -22,44 +22,27 @@
:onboarding-illustration (js/require "../resources/images/ui2/onboarding_illustration.png") :onboarding-illustration (js/require "../resources/images/ui2/onboarding_illustration.png")
:qr-code (js/require "../resources/images/ui2/qr-code.png") :qr-code (js/require "../resources/images/ui2/qr-code.png")
:keycard-logo (js/require "../resources/images/ui2/keycard-logo.png") :keycard-logo (js/require "../resources/images/ui2/keycard-logo.png")
:keycard-chip-light (js/require "../resources/images/ui2/keycard-chip-light.png")
:keycard-chip-dark (js/require "../resources/images/ui2/keycard-chip-dark.png")
:keycard-watermark (js/require "../resources/images/ui2/keycard-watermark.png") :keycard-watermark (js/require "../resources/images/ui2/keycard-watermark.png")
:discover (js/require "../resources/images/ui2/discover.png") :discover (js/require "../resources/images/ui2/discover.png")
:invite-friends (js/require "../resources/images/ui2/invite-friends.png") :invite-friends (js/require "../resources/images/ui2/invite-friends.png")
:no-messages-light (js/require "../resources/images/ui2/no-messages-light.png")
:no-messages-dark (js/require "../resources/images/ui2/no-messages-dark.png")
:no-group-chats-light (js/require "../resources/images/ui2/no-group-chats-light.png")
:no-group-chats-dark (js/require "../resources/images/ui2/no-group-chats-dark.png")
:no-contacts-light (js/require "../resources/images/ui2/no-contacts-light.png")
:no-contacts-dark (js/require "../resources/images/ui2/no-contacts-dark.png")
:no-sent-requests-light (js/require "../resources/images/ui2/no-sent-requests-light.png")
:no-sent-requests-dark (js/require "../resources/images/ui2/no-sent-requests-dark.png")
:no-received-requests-light (js/require "../resources/images/ui2/no-received-requests-light.png")
:no-received-requests-dark (js/require "../resources/images/ui2/no-received-requests-dark.png")
:no-communities-light (js/require "../resources/images/ui2/no-communities-light.png")
:no-communities-dark (js/require "../resources/images/ui2/no-communities-dark.png")
:no-pending-communities-light (js/require "../resources/images/ui2/no-pending-communities-light.png")
:no-pending-communities-dark (js/require "../resources/images/ui2/no-pending-communities-dark.png")
:no-opened-communities-light (js/require "../resources/images/ui2/no-opened-communities-light.png")
:no-opened-communities-dark (js/require "../resources/images/ui2/no-opened-communities-dark.png")
:no-contacts-to-invite-light (js/require "../resources/images/ui2/no-contacts-to-invite-light.png")
:no-contacts-to-invite-dark (js/require "../resources/images/ui2/no-contacts-to-invite-dark.png")
:no-notifications-light (js/require "../resources/images/ui2/no-notifications-light.png")
:no-notifications-dark (js/require "../resources/images/ui2/no-notifications-dark.png")
:notifications (js/require "../resources/images/ui2/notifications.png")
:welcome-illustration (js/require "../resources/images/ui2/welcome_illustration.png")}) :welcome-illustration (js/require "../resources/images/ui2/welcome_illustration.png")})
(def ui-themed (def ui-themed
{:no-messages {:angry-man
{:light (js/require "../resources/images/ui2/no-messages-light.png") {:light (js/require "../resources/images/ui2/angry-man-light.png")
:dark (js/require "../resources/images/ui2/no-messages-dark.png")} :dark (js/require "../resources/images/ui2/angry-man-dark.png")}
:no-group-chats :cat-in-box
{:light (js/require "../resources/images/ui2/no-group-chats-light.png") {:light (js/require "../resources/images/ui2/cat-in-box-light.png")
:dark (js/require "../resources/images/ui2/no-group-chats-dark.png")} :dark (js/require "../resources/images/ui2/cat-in-box-dark.png")}
:no-contacts :no-contacts
{:light (js/require "../resources/images/ui2/no-contacts-light.png") {:light (js/require "../resources/images/ui2/no-contacts-light.png")
:dark (js/require "../resources/images/ui2/no-contacts-dark.png")} :dark (js/require "../resources/images/ui2/no-contacts-dark.png")}
:keycard-chip
{:light (js/require "../resources/images/ui2/keycard-chip-light.png")
:dark (js/require "../resources/images/ui2/keycard-chip-dark.png")}
:no-group-chats
{:light (js/require "../resources/images/ui2/no-group-chats-light.png")
:dark (js/require "../resources/images/ui2/no-group-chats-dark.png")}
:no-sent-requests :no-sent-requests
{:light (js/require "../resources/images/ui2/no-sent-requests-light.png") {:light (js/require "../resources/images/ui2/no-sent-requests-light.png")
:dark (js/require "../resources/images/ui2/no-sent-requests-dark.png")} :dark (js/require "../resources/images/ui2/no-sent-requests-dark.png")}
@ -92,7 +75,10 @@
:dark (js/require "../resources/images/ui2/no-dapps-dark.png")} :dark (js/require "../resources/images/ui2/no-dapps-dark.png")}
:no-permissions :no-permissions
{:light (js/require "../resources/images/ui2/no-permissions-light.png") {:light (js/require "../resources/images/ui2/no-permissions-light.png")
:dark (js/require "../resources/images/ui2/no-permissions-dark.png")}}) :dark (js/require "../resources/images/ui2/no-permissions-dark.png")}
:sweating-man
{:light (js/require "../resources/images/ui2/sweating-man-light.png")
:dark (js/require "../resources/images/ui2/sweating-man-dark.png")}})
(def mock-images (def mock-images
{:bored-ape (js/require "../resources/images/mock2/bored-ape.png") {:bored-ape (js/require "../resources/images/mock2/bored-ape.png")

View File

@ -35,18 +35,15 @@
#:tab{:contacts #:tab{:contacts
{:title (i18n/label :t/no-contacts) {:title (i18n/label :t/no-contacts)
:description (i18n/label :t/no-contacts-description) :description (i18n/label :t/no-contacts-description)
:image (resources/get-image :image (resources/get-themed-image :no-contacts theme)}
(quo.theme/theme-value :no-contacts-light :no-contacts-dark theme))}
:groups :groups
{:title (i18n/label :t/no-group-chats) {:title (i18n/label :t/no-group-chats)
:description (i18n/label :t/no-group-chats-description) :description (i18n/label :t/no-group-chats-description)
:image (resources/get-image :image (resources/get-themed-image :no-group-chats theme)}
(quo.theme/theme-value :no-group-chats-light :no-group-chats-dark theme))}
:recent :recent
{:title (i18n/label :t/no-messages) {:title (i18n/label :t/no-messages)
:description (i18n/label :t/no-messages-description) :description (i18n/label :t/no-messages-description)
:image (resources/get-image :image (resources/get-themed-image :cat-in-box theme)}})
(quo.theme/theme-value :no-messages-light :no-messages-dark theme))}})
(defn chats (defn chats
[{:keys [theme selected-tab set-scroll-ref scroll-shared-value]}] [{:keys [theme selected-tab set-scroll-ref scroll-shared-value]}]

View File

@ -49,21 +49,15 @@
(i18n/label :t/no-communities-description-strikethrough)] (i18n/label :t/no-communities-description-strikethrough)]
" " " "
(i18n/label :t/no-communities-description)] (i18n/label :t/no-communities-description)]
:image (resources/get-image (quo.theme/theme-value :no-communities-light :image (resources/get-themed-image :no-communities theme)}
:no-communities-dark
theme))}
:pending :pending
{:title (i18n/label :t/no-pending-communities) {:title (i18n/label :t/no-pending-communities)
:description (i18n/label :t/no-pending-communities-description) :description (i18n/label :t/no-pending-communities-description)
:image (resources/get-image (quo.theme/theme-value :no-pending-communities-light :image (resources/get-themed-image :no-pending-communities theme)}
:no-pending-communities-dark
theme))}
:opened :opened
{:title (i18n/label :t/no-opened-communities) {:title (i18n/label :t/no-opened-communities)
:description (i18n/label :t/no-opened-communities-description) :description (i18n/label :t/no-opened-communities-description)
:image (resources/get-image (quo.theme/theme-value :no-opened-communities-light :image (resources/get-themed-image :no-opened-communities theme)}})
:no-opened-communities-dark
theme))}})
(def ^:private banner-data (def ^:private banner-data
{:title-props {:title-props

View File

@ -1,6 +1,7 @@
(ns status-im2.contexts.quo-preview.empty-state.empty-state (ns status-im2.contexts.quo-preview.empty-state.empty-state
(:require (:require
[quo.core :as quo] [quo.core :as quo]
[quo.theme]
[reagent.core :as reagent] [reagent.core :as reagent]
[status-im2.common.resources :as resources] [status-im2.common.resources :as resources]
[status-im2.contexts.quo-preview.preview :as preview])) [status-im2.contexts.quo-preview.preview :as preview]))
@ -12,10 +13,8 @@
:type :text} :type :text}
{:key :image {:key :image
:type :select :type :select
:options [{:key :no-contacts-light} :options [{:key :cat-in-box}
{:key :no-contacts-dark} {:key :no-contacts}]}
{:key :no-messages-light}
{:key :no-messages-dark}]}
{:key :upper-button-text {:key :upper-button-text
:type :text} :type :text}
{:key :lower-button-text {:key :lower-button-text
@ -23,9 +22,9 @@
{:key :blur? {:key :blur?
:type :boolean}]) :type :boolean}])
(defn view (defn view-internal
[] [{:keys [theme]}]
(let [state (reagent/atom {:image :no-messages-light (let [state (reagent/atom {:image :no-contacts
:title "A big friendly title" :title "A big friendly title"
:description "Some cool description will be here" :description "Some cool description will be here"
:blur? false :blur? false
@ -46,4 +45,6 @@
(assoc :lower-button (assoc :lower-button
{:text (:lower-button-text @state) {:text (:lower-button-text @state)
:on-press #(js/alert "Lower button")}) :on-press #(js/alert "Lower button")})
(update :image resources/get-image))]]))) (assoc :image (resources/get-themed-image (:image @state) theme)))]])))
(def view (quo.theme/with-theme view-internal))

View File

@ -1,6 +1,7 @@
(ns status-im2.contexts.shell.activity-center.tabs.empty-tab.view (ns status-im2.contexts.shell.activity-center.tabs.empty-tab.view
(:require (:require
[quo.core :as quo] [quo.core :as quo]
[quo.theme]
[react-native.core :as rn] [react-native.core :as rn]
[status-im2.common.resources :as resources] [status-im2.common.resources :as resources]
[status-im2.contexts.shell.activity-center.notification-types :as types] [status-im2.contexts.shell.activity-center.notification-types :as types]
@ -8,7 +9,7 @@
[utils.i18n :as i18n] [utils.i18n :as i18n]
[utils.re-frame :as rf])) [utils.re-frame :as rf]))
(def empty-tab-description (def ^:private empty-tab-description
{types/no-type (i18n/label :t/empty-notifications-all-tab) {types/no-type (i18n/label :t/empty-notifications-all-tab)
types/admin (i18n/label :t/empty-notifications-admin-tab) types/admin (i18n/label :t/empty-notifications-admin-tab)
types/mention (i18n/label :t/empty-notifications-mentions-tab) types/mention (i18n/label :t/empty-notifications-mentions-tab)
@ -19,13 +20,15 @@
types/membership (i18n/label :t/empty-notifications-membership-tab) types/membership (i18n/label :t/empty-notifications-membership-tab)
types/system (i18n/label :t/empty-notifications-system-tab)}) types/system (i18n/label :t/empty-notifications-system-tab)})
(defn empty-tab (defn empty-tab-internal
[] [{:keys [theme]}]
(let [filter-type (rf/sub [:activity-center/filter-type]) (let [filter-type (rf/sub [:activity-center/filter-type])
description (get empty-tab-description filter-type nil)] description (get empty-tab-description filter-type nil)]
[rn/view {:style style/empty-container} [rn/view {:style style/empty-container}
[quo/empty-state [quo/empty-state
{:blur? true {:blur? true
:image (resources/get-image :no-notifications-dark) :image (resources/get-themed-image :no-notifications theme)
:title (i18n/label :t/empty-notifications-title-unread) :title (i18n/label :t/empty-notifications-title-unread)
:description description}]])) :description description}]]))
(def empty-tab (quo.theme/with-theme empty-tab-internal))

View File

@ -7,9 +7,6 @@
:padding-top 8 :padding-top 8
:padding-bottom 12}) :padding-bottom 12})
(def accounts-container
{:height 112})
(def overview-container (def overview-container
{:height 86}) {:height 86})
@ -21,11 +18,6 @@
(def accounts-list-container (def accounts-list-container
{:padding-horizontal 20}) {:padding-horizontal 20})
(def empty-container-style
{:justify-content :center
:flex 1
:margin-bottom 44})
(def separator (def separator
{:width 12}) {:width 12})

View File

@ -3,7 +3,6 @@
[quo.core :as quo] [quo.core :as quo]
[react-native.core :as rn] [react-native.core :as rn]
[reagent.core :as reagent] [reagent.core :as reagent]
[status-im.ui.screens.wallet.components.styles :as styles]
[status-im2.common.home.top-nav.view :as common.top-nav] [status-im2.common.home.top-nav.view :as common.top-nav]
[status-im2.contexts.wallet.common.activity-tab.view :as activity] [status-im2.contexts.wallet.common.activity-tab.view :as activity]
[status-im2.contexts.wallet.common.collectibles-tab.view :as collectibles] [status-im2.contexts.wallet.common.collectibles-tab.view :as collectibles]
@ -55,7 +54,7 @@
:content-container-style style/accounts-list-container :content-container-style style/accounts-list-container
:data cards :data cards
:horizontal true :horizontal true
:separator [rn/view {:style styles/separator}] :separator [rn/view {:style style/separator}]
:render-fn quo/account-card :render-fn quo/account-card
:shows-horizontal-scroll-indicator false}] :shows-horizontal-scroll-indicator false}]
[quo/tabs [quo/tabs

View File

@ -1,7 +1,9 @@
(ns status-im2.contexts.wallet.send.select-address.tabs.view (ns status-im2.contexts.wallet.send.select-address.tabs.view
(:require (:require
[quo.core :as quo] [quo.core :as quo]
[quo.theme :as quo.theme]
[react-native.gesture :as gesture] [react-native.gesture :as gesture]
[status-im2.common.resources :as resources]
[status-im2.contexts.wallet.send.select-address.tabs.style :as style] [status-im2.contexts.wallet.send.select-address.tabs.style :as style]
[utils.i18n :as i18n] [utils.i18n :as i18n]
[utils.re-frame :as rf])) [utils.re-frame :as rf]))
@ -15,20 +17,14 @@
(rf/dispatch [:navigate-to-within-stack (rf/dispatch [:navigate-to-within-stack
[:wallet-select-asset :wallet-select-address]]))}]) [:wallet-select-asset :wallet-select-address]]))}])
(def data
[{:id :tab/recent :label (i18n/label :t/recent) :accessibility-label :recent-tab}
{:id :tab/saved :label (i18n/label :t/saved) :accessibility-label :saved-tab}
{:id :tab/contacts :label (i18n/label :t/contacts) :accessibility-label :contacts-tab}
{:id :tab/my-accounts :label (i18n/label :t/my-accounts) :accessibility-label :my-accounts-tab}])
(defn my-accounts (defn my-accounts
[] [theme]
(let [other-accounts (rf/sub [:wallet/accounts-without-current-viewing-account])] (let [other-accounts (rf/sub [:wallet/accounts-without-current-viewing-account])]
(if (zero? (count other-accounts)) (if (zero? (count other-accounts))
[quo/empty-state [quo/empty-state
{:title (i18n/label :t/no-other-accounts) {:title (i18n/label :t/no-other-accounts)
:description (i18n/label :t/here-is-a-cat-in-a-box-instead) :description (i18n/label :t/here-is-a-cat-in-a-box-instead)
:placeholder? true :image (resources/get-themed-image :cat-in-box theme)
:container-style style/empty-container-style}] :container-style style/empty-container-style}]
[gesture/flat-list [gesture/flat-list
{:data other-accounts {:data other-accounts
@ -36,22 +32,24 @@
:content-container-style style/my-accounts-container :content-container-style style/my-accounts-container
:shows-vertical-scroll-indicator false}]))) :shows-vertical-scroll-indicator false}])))
(defn view (defn view-internal
[selected-tab] [{:keys [selected-tab theme]}]
(case selected-tab (case selected-tab
:tab/recent [quo/empty-state :tab/recent [quo/empty-state
{:title (i18n/label :t/no-recent-transactions) {:title (i18n/label :t/no-recent-transactions)
:description (i18n/label :t/make-one-it-is-easy-we-promise) :description (i18n/label :t/make-one-it-is-easy-we-promise)
:placeholder? true :image (resources/get-themed-image :angry-man theme)
:container-style style/empty-container-style}] :container-style style/empty-container-style}]
:tab/saved [quo/empty-state :tab/saved [quo/empty-state
{:title (i18n/label :t/no-saved-addresses) {:title (i18n/label :t/no-saved-addresses)
:description (i18n/label :t/you-like-to-type-43-characters) :description (i18n/label :t/you-like-to-type-43-characters)
:placeholder? true :image (resources/get-themed-image :sweating-man theme)
:container-style style/empty-container-style}] :container-style style/empty-container-style}]
:tab/contacts [quo/empty-state :tab/contacts [quo/empty-state
{:title (i18n/label :t/no-contacts) {:title (i18n/label :t/no-contacts)
:description (i18n/label :t/no-contacts-description) :description (i18n/label :t/no-contacts-description)
:placeholder? true :image (resources/get-themed-image :no-contacts theme)
:container-style style/empty-container-style}] :container-style style/empty-container-style}]
:tab/my-accounts [my-accounts])) :tab/my-accounts [my-accounts theme]))
(def view (quo.theme/with-theme view-internal))

View File

@ -163,7 +163,7 @@
:scrollable? true :scrollable? true
:scroll-on-press? true :scroll-on-press? true
:on-change on-change-tab}] :on-change on-change-tab}]
[tabs/view selected-tab]])])))) [tabs/view {:selected-tab selected-tab}]])]))))
(defn view (defn view
[] []

View File

@ -2435,5 +2435,6 @@
"share-opensea-link": "Share OpenSea link", "share-opensea-link": "Share OpenSea link",
"save-image-to-photos": "Save image to Photos", "save-image-to-photos": "Save image to Photos",
"copy-all-details": "Copy all details", "copy-all-details": "Copy all details",
"share-details": "Share details" "share-details": "Share details",
"what-are-you-waiting-for": "What are you waiting for?"
} }