Add collectible menu (#18185)
This commit is contained in:
Volodymyr Kozieiev
GitHub
parent
9e27a36f5e
commit
2a5c102b1c
|
|
@ -3,6 +3,7 @@
|
|||
[clojure.string :as string]
|
||||
[quo.core :as quo]
|
||||
[quo.foundations.resources :as quo.resources]
|
||||
[quo.theme :as quo.theme]
|
||||
[react-native.core :as rn]
|
||||
[status-im2.common.scroll-page.view :as scroll-page]
|
||||
[status-im2.contexts.wallet.collectible.style :as style]
|
||||
|
|
@ -10,11 +11,11 @@
|
|||
[utils.re-frame :as rf]))
|
||||
|
||||
(defn header
|
||||
[{:keys [name description] :as _collectible-details} collection-image-url]
|
||||
[collectible-name description collection-image-url]
|
||||
[rn/view {:style style/header}
|
||||
[quo/text
|
||||
{:weight :semi-bold
|
||||
:size :heading-1} name]
|
||||
:size :heading-1} collectible-name]
|
||||
[rn/view {:style style/collection-container}
|
||||
[rn/view {:style style/collection-avatar-container}
|
||||
[quo/collection-avatar {:image collection-image-url}]]
|
||||
|
|
@ -86,7 +87,8 @@
|
|||
(let [network (rf/sub [:wallet/network-details-by-chain-id
|
||||
chain-id])
|
||||
network-keyword (get network :network-name)
|
||||
network-name (string/capitalize (name network-keyword))]
|
||||
network-name (when network-keyword
|
||||
(string/capitalize (name network-keyword)))]
|
||||
[rn/view
|
||||
{:style style/info-container}
|
||||
[rn/view {:style style/account}
|
||||
|
|
@ -110,29 +112,55 @@
|
|||
:subtitle network-name
|
||||
:subtitle-type :network}]]]))
|
||||
|
||||
(defn view
|
||||
(defn collectible-actions-sheet
|
||||
[]
|
||||
(let [collectible (rf/sub [:wallet/last-collectible-details])
|
||||
[quo/action-drawer
|
||||
[[{:icon :i/messages
|
||||
:accessibility-label :share-opensea-link
|
||||
:label (i18n/label :t/share-opensea-link)}
|
||||
{:icon :i/link
|
||||
:accessibility-label :view-on-eth
|
||||
:label (i18n/label :t/view-on-eth)}
|
||||
{:icon :i/download
|
||||
:accessibility-label :save-image-to-photos
|
||||
:label (i18n/label :t/save-image-to-photos)}
|
||||
{:icon :i/copy
|
||||
:accessibility-label :copy-all-details
|
||||
:label (i18n/label :t/copy-all-details)}
|
||||
{:icon :i/share
|
||||
:accessibility-label :share-details
|
||||
:label (i18n/label :t/share-details)}]]])
|
||||
|
||||
(defn view-internal
|
||||
[{:keys [theme] :as _props}]
|
||||
(let [collectible (rf/sub [:wallet/last-collectible-details])
|
||||
{:keys [collectible-data preview-url
|
||||
collection-data]} collectible
|
||||
{:keys [traits description]} collectible-data
|
||||
chain-id (rf/sub [:wallet/last-collectible-chain-id])]
|
||||
collection-data]} collectible
|
||||
{traits :traits
|
||||
collectible-name :name
|
||||
description :description} collectible-data
|
||||
chain-id (rf/sub [:wallet/last-collectible-chain-id])]
|
||||
[scroll-page/scroll-page
|
||||
{:navigate-back? true
|
||||
:height 148
|
||||
:page-nav-props {:type :title-description
|
||||
:title name
|
||||
:title collectible-name
|
||||
:description description
|
||||
:right-side [{:icon-name :i/options
|
||||
:on-press #(js/alert "pressed")}]
|
||||
:on-press #(rf/dispatch
|
||||
[:show-bottom-sheet
|
||||
{:content collectible-actions-sheet
|
||||
:theme theme}])}]
|
||||
:picture preview-url}}
|
||||
[rn/view {:style style/container}
|
||||
[rn/view {:style style/preview-container}
|
||||
[rn/image
|
||||
{:source preview-url
|
||||
:style style/preview}]]
|
||||
[header collectible-data (:image-url collection-data)]
|
||||
[header collectible-name description (:image-url collection-data)]
|
||||
[cta-buttons]
|
||||
[tabs]
|
||||
[info chain-id]
|
||||
[traits-section traits]]]))
|
||||
|
||||
(def view (quo.theme/with-theme view-internal))
|
||||
|
|
|
|||
|
|
@ -67,6 +67,10 @@
|
|||
db
|
||||
(data-store/rpc->accounts wallet-accounts))
|
||||
:fx [[:dispatch [:wallet/get-wallet-token]]
|
||||
[:dispatch
|
||||
[:wallet/request-collectibles
|
||||
{:start-at-index 0
|
||||
:new-request? true}]]
|
||||
(when new-account?
|
||||
[:dispatch [:wallet/navigate-to-new-account navigate-to-account]])]})))
|
||||
|
||||
|
|
@ -276,7 +280,7 @@
|
|||
:max-cache-age-seconds max-cache-age-seconds}
|
||||
request-params [request-id
|
||||
[(chain/chain-id db)]
|
||||
(map :address (:profile/wallet-accounts db))
|
||||
(keys (get-in db [:wallet :accounts]))
|
||||
collectibles-filter
|
||||
start-at-index
|
||||
collectibles-request-batch-size
|
||||
|
|
|
|||
|
|
@ -1,4 +1,6 @@
|
|||
(ns status-im2.contexts.wallet.home.style)
|
||||
(ns status-im2.contexts.wallet.home.style
|
||||
(:require
|
||||
[react-native.safe-area :as safe-area]))
|
||||
|
||||
(def tabs
|
||||
{:padding-horizontal 20
|
||||
|
|
@ -23,3 +25,13 @@
|
|||
{:justify-content :center
|
||||
:flex 1
|
||||
:margin-bottom 44})
|
||||
|
||||
(def separator
|
||||
{:width 12})
|
||||
|
||||
(def selected-tab-container
|
||||
{:padding-horizontal 8})
|
||||
|
||||
(def home-container
|
||||
{:margin-top (safe-area/get-top)
|
||||
:flex 1})
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@
|
|||
(:require
|
||||
[quo.core :as quo]
|
||||
[react-native.core :as rn]
|
||||
[react-native.safe-area :as safe-area]
|
||||
[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.contexts.wallet.common.activity-tab.view :as activity]
|
||||
[status-im2.contexts.wallet.common.collectibles-tab.view :as collectibles]
|
||||
|
|
@ -40,16 +40,12 @@
|
|||
|
||||
(defn view
|
||||
[]
|
||||
(rf/dispatch [:wallet/request-collectibles
|
||||
{:start-at-index 0
|
||||
:new-request? true}])
|
||||
(let [top (safe-area/get-top)
|
||||
selected-tab (reagent/atom (:id (first tabs-data)))]
|
||||
(let [selected-tab (reagent/atom (:id (first tabs-data)))]
|
||||
(fn []
|
||||
(let [networks (rf/sub [:wallet/network-details])
|
||||
account-cards-data (rf/sub [:wallet/account-cards-data])
|
||||
cards (conj account-cards-data (new-account-card-data))]
|
||||
[rn/view {:style {:margin-top top :flex 1}}
|
||||
[rn/view {:style style/home-container}
|
||||
[common.top-nav/view]
|
||||
[rn/view {:style style/overview-container}
|
||||
[quo/wallet-overview (temp/wallet-overview-state networks)]]
|
||||
|
|
@ -59,7 +55,7 @@
|
|||
:content-container-style style/accounts-list-container
|
||||
:data cards
|
||||
:horizontal true
|
||||
:separator [rn/view {:style {:width 12}}]
|
||||
:separator [rn/view {:style styles/separator}]
|
||||
:render-fn quo/account-card
|
||||
:shows-horizontal-scroll-indicator false}]
|
||||
[quo/tabs
|
||||
|
|
@ -73,6 +69,6 @@
|
|||
{:render-fn quo/token-value
|
||||
:data temp/tokens
|
||||
:key :assets-list
|
||||
:content-container-style {:padding-horizontal 8}}]
|
||||
:content-container-style style/selected-tab-container}]
|
||||
:collectibles [collectibles/view]
|
||||
[activity/view])]))))
|
||||
|
|
|
|||
|
|
@ -2429,5 +2429,9 @@
|
|||
"backup-step-4": "I know I can only see it once",
|
||||
"reveal-phrase": "Reveal phrase",
|
||||
"i-have-written": "I have written it down on paper",
|
||||
"next-you-will": "Next, you will be asked to confirm the position of certain words in your recovery phrase"
|
||||
"next-you-will": "Next, you will be asked to confirm the position of certain words in your recovery phrase",
|
||||
"share-opensea-link": "Share OpenSea link",
|
||||
"save-image-to-photos": "Save image to Photos",
|
||||
"copy-all-details": "Copy all details",
|
||||
"share-details": "Share details"
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue