[8957] fix - Wallet address can't be copied by tapping on it
Signed-off-by: Andrey Shovkoplyas <motor4ik@gmail.com>
This commit is contained in:
parent
e6c5dd6c81
commit
edf896f2e5
|
@ -1,6 +1,5 @@
|
||||||
(ns status-im.ui.components.qr-code-viewer.styles
|
(ns status-im.ui.components.qr-code-viewer.styles
|
||||||
(:require [status-im.ui.components.colors :as colors])
|
(:require [status-im.ui.components.colors :as colors]))
|
||||||
(:require-macros [status-im.utils.styles :refer [defstyle]]))
|
|
||||||
|
|
||||||
(def qr-code-hint
|
(def qr-code-hint
|
||||||
{:color colors/gray
|
{:color colors/gray
|
||||||
|
@ -12,7 +11,9 @@
|
||||||
|
|
||||||
(defn qr-code-container [width]
|
(defn qr-code-container [width]
|
||||||
{:align-self :center
|
{:align-self :center
|
||||||
:width (+ width qr-code-padding qr-code-padding)
|
:width width
|
||||||
|
:height width
|
||||||
|
:padding-horizontal 16
|
||||||
:background-color colors/white
|
:background-color colors/white
|
||||||
:border-color colors/black-transparent
|
:border-color colors/black-transparent
|
||||||
:align-items :center
|
:align-items :center
|
||||||
|
@ -20,12 +21,6 @@
|
||||||
:border-width 1
|
:border-width 1
|
||||||
:border-radius 8})
|
:border-radius 8})
|
||||||
|
|
||||||
(defstyle name-container
|
|
||||||
{:flex 0.6
|
|
||||||
:flex-direction :column
|
|
||||||
:ios {:align-items :center}
|
|
||||||
:android {:margin-left 15}})
|
|
||||||
|
|
||||||
(def name-text
|
(def name-text
|
||||||
{:font-size 17})
|
{:font-size 17})
|
||||||
|
|
||||||
|
|
|
@ -1,21 +1,28 @@
|
||||||
(ns status-im.ui.components.qr-code-viewer.views
|
(ns status-im.ui.components.qr-code-viewer.views
|
||||||
(:require [reagent.core :as reagent]
|
(:require [cljs-bean.core :as bean]
|
||||||
|
[reagent.core :as reagent]
|
||||||
[status-im.react-native.js-dependencies :as rn-dependencies]
|
[status-im.react-native.js-dependencies :as rn-dependencies]
|
||||||
[status-im.ui.components.qr-code-viewer.styles :as styles]
|
[status-im.ui.components.qr-code-viewer.styles :as styles]
|
||||||
[status-im.ui.components.react :as react]
|
[status-im.ui.components.react :as react]
|
||||||
[status-im.ui.components.svg :as svg])
|
[status-im.ui.components.svg :as svg]))
|
||||||
(:require-macros [status-im.utils.views :refer [defview letsubs]]))
|
|
||||||
|
|
||||||
(defn qr-code [{:keys [size value]}]
|
(defn qr-code [{:keys [size value]}]
|
||||||
(let [uri (reagent/atom nil)]
|
(let [uri (reagent/atom nil)]
|
||||||
(.toString rn-dependencies/qr-code value #(reset! uri %2))
|
(.toString
|
||||||
|
rn-dependencies/qr-code
|
||||||
|
value
|
||||||
|
(bean/->js {:margin 0 :width size})
|
||||||
|
#(reset! uri %2))
|
||||||
(fn []
|
(fn []
|
||||||
(when @uri
|
(when @uri
|
||||||
[svg/svgxml {:xml @uri :width size :height size}]))))
|
[svg/svgxml {:xml @uri :width size :height size}]))))
|
||||||
|
|
||||||
(defn qr-code-view [size value]
|
(defn qr-code-view
|
||||||
|
"Qr Code view including the frame.
|
||||||
|
Note: `size` includes frame with `styles/qr-code-padding.`"
|
||||||
|
[size value]
|
||||||
(when (and size value)
|
(when (and size value)
|
||||||
[react/view {:style (styles/qr-code-container size)
|
[react/view {:style (styles/qr-code-container size)
|
||||||
:accessibility-label :qr-code-image}
|
:accessibility-label :qr-code-image}
|
||||||
[qr-code {:value value
|
[qr-code {:value value
|
||||||
:size size}]]))
|
:size (- size (* styles/qr-code-padding 2))}]]))
|
||||||
|
|
|
@ -1,8 +1,5 @@
|
||||||
(ns status-im.ui.screens.profile.user.styles
|
(ns status-im.ui.screens.profile.user.styles
|
||||||
(:require-macros [status-im.utils.styles :refer [defstyle]])
|
(:require [status-im.ui.components.colors :as colors]))
|
||||||
(:require [status-im.ui.components.colors :as colors]
|
|
||||||
[status-im.ui.screens.profile.components.styles :as profile.components.styles]
|
|
||||||
[status-im.ui.components.styles :as components.styles]))
|
|
||||||
|
|
||||||
(def share-contact-code-container
|
(def share-contact-code-container
|
||||||
{:flex-direction :row
|
{:flex-direction :row
|
||||||
|
@ -20,25 +17,8 @@
|
||||||
:flex-direction :column})
|
:flex-direction :column})
|
||||||
|
|
||||||
(def share-link-button
|
(def share-link-button
|
||||||
{:margin-vertical 20})
|
{:margin-top 12
|
||||||
|
:margin-bottom 8})
|
||||||
(defstyle my-profile-info-container {})
|
|
||||||
|
|
||||||
(defstyle my-profile-settings-logout-wrapper
|
|
||||||
{:flex-direction :row
|
|
||||||
:justify-content :space-between
|
|
||||||
:align-items :center})
|
|
||||||
|
|
||||||
(defstyle my-profile-settings-logout
|
|
||||||
{:min-width "50%"})
|
|
||||||
|
|
||||||
(defstyle my-profile-settings-send-logs-wrapper
|
|
||||||
{:flex-direction :row
|
|
||||||
:justify-content :space-between
|
|
||||||
:align-items :center})
|
|
||||||
|
|
||||||
(defstyle my-profile-settings-send-logs
|
|
||||||
{:min-width "50%"})
|
|
||||||
|
|
||||||
(def advanced-button
|
(def advanced-button
|
||||||
{:margin-top 16
|
{:margin-top 16
|
||||||
|
|
|
@ -1,12 +1,10 @@
|
||||||
(ns status-im.ui.screens.profile.user.views
|
(ns status-im.ui.screens.profile.user.views
|
||||||
(:require-macros [status-im.utils.views :as views])
|
|
||||||
(:require [clojure.string :as string]
|
(:require [clojure.string :as string]
|
||||||
[re-frame.core :as re-frame]
|
[re-frame.core :as re-frame]
|
||||||
[reagent.core :as reagent]
|
[reagent.core :as reagent]
|
||||||
[status-im.i18n :as i18n]
|
|
||||||
[status-im.ethereum.stateofus :as stateofus]
|
[status-im.ethereum.stateofus :as stateofus]
|
||||||
|
[status-im.i18n :as i18n]
|
||||||
[status-im.multiaccounts.core :as multiaccounts]
|
[status-im.multiaccounts.core :as multiaccounts]
|
||||||
[status-im.ui.components.tabbar.styles :as tabs.styles]
|
|
||||||
[status-im.ui.components.button :as button]
|
[status-im.ui.components.button :as button]
|
||||||
[status-im.ui.components.colors :as colors]
|
[status-im.ui.components.colors :as colors]
|
||||||
[status-im.ui.components.common.common :as components.common]
|
[status-im.ui.components.common.common :as components.common]
|
||||||
|
@ -17,25 +15,27 @@
|
||||||
[status-im.ui.components.qr-code-viewer.views :as qr-code-viewer]
|
[status-im.ui.components.qr-code-viewer.views :as qr-code-viewer]
|
||||||
[status-im.ui.components.react :as react]
|
[status-im.ui.components.react :as react]
|
||||||
[status-im.ui.components.status-bar.view :as status-bar]
|
[status-im.ui.components.status-bar.view :as status-bar]
|
||||||
|
[status-im.ui.components.tabbar.styles :as tabs.styles]
|
||||||
[status-im.ui.components.toolbar.view :as toolbar]
|
[status-im.ui.components.toolbar.view :as toolbar]
|
||||||
[status-im.ui.screens.chat.photos :as photos]
|
[status-im.ui.screens.chat.photos :as photos]
|
||||||
[status-im.ui.screens.profile.components.views :as profile.components]
|
[status-im.ui.screens.profile.components.views :as profile.components]
|
||||||
[status-im.ui.screens.profile.user.styles :as styles]
|
[status-im.ui.screens.profile.user.styles :as styles]
|
||||||
[status-im.utils.identicon :as identicon]
|
[status-im.utils.identicon :as identicon]
|
||||||
[status-im.utils.platform :as platform]
|
[status-im.utils.platform :as platform]
|
||||||
[status-im.utils.universal-links.core :as universal-links]))
|
[status-im.utils.universal-links.core :as universal-links])
|
||||||
|
(:require-macros [status-im.utils.views :as views]))
|
||||||
|
|
||||||
(views/defview share-chat-key []
|
(views/defview share-chat-key []
|
||||||
(views/letsubs [{:keys [address]} [:popover/popover]
|
(views/letsubs [{:keys [address]} [:popover/popover]
|
||||||
window-width [:dimensions/window-width]
|
width (reagent/atom nil)
|
||||||
{:keys [names preferred-name]} [:ens.main/screen]]
|
{:keys [names preferred-name]} [:ens.main/screen]]
|
||||||
(let [username (stateofus/username preferred-name)
|
(let [username (stateofus/username preferred-name)
|
||||||
qr-width (- window-width 128)
|
|
||||||
name (or username preferred-name)
|
name (or username preferred-name)
|
||||||
link (universal-links/generate-link :user :external address)]
|
link (universal-links/generate-link :user :external address)]
|
||||||
[react/view
|
[react/view {:on-layout #(reset! width (-> % .-nativeEvent .-layout .-width))}
|
||||||
[react/view {:style {:padding-top 16 :padding-left 16 :padding-right 16}}
|
[react/view {:style {:padding-top 16 :padding-horizontal 16}}
|
||||||
[qr-code-viewer/qr-code-view qr-width address]
|
(when @width
|
||||||
|
[qr-code-viewer/qr-code-view (- @width 32) address])
|
||||||
(when (seq names)
|
(when (seq names)
|
||||||
[react/view
|
[react/view
|
||||||
[copyable-text/copyable-text-view
|
[copyable-text/copyable-text-view
|
||||||
|
@ -59,14 +59,14 @@
|
||||||
:accessibility-label :chat-key
|
:accessibility-label :chat-key
|
||||||
:style {:line-height 22 :font-size 15
|
:style {:line-height 22 :font-size 15
|
||||||
:font-family "monospace"}}
|
:font-family "monospace"}}
|
||||||
address]]
|
address]]]
|
||||||
[react/view styles/share-link-button
|
[react/view styles/share-link-button
|
||||||
;;TODO implement icon support
|
;;TODO implement icon support
|
||||||
[button/button
|
[button/button
|
||||||
{:on-press #(list-selection/open-share {:message link})
|
{:on-press #(list-selection/open-share {:message link})
|
||||||
:label :t/share-link
|
:label :t/share-link
|
||||||
;:icon :main-icons/link
|
;:icon :main-icons/link
|
||||||
:accessibility-label :share-my-contact-code-button}]]]])))
|
:accessibility-label :share-my-contact-code-button}]]])))
|
||||||
|
|
||||||
(defn- header [{:keys [public-key photo-path] :as account}]
|
(defn- header [{:keys [public-key photo-path] :as account}]
|
||||||
[profile.components/profile-header
|
[profile.components/profile-header
|
||||||
|
|
|
@ -1,20 +1,20 @@
|
||||||
(ns status-im.ui.screens.wallet.request.views
|
(ns status-im.ui.screens.wallet.request.views
|
||||||
(:require [re-frame.core :as re-frame]
|
(:require [re-frame.core :as re-frame]
|
||||||
|
[reagent.core :as reagent]
|
||||||
[status-im.ethereum.eip55 :as eip55]
|
[status-im.ethereum.eip55 :as eip55]
|
||||||
[status-im.ethereum.eip681 :as eip681]
|
[status-im.ethereum.eip681 :as eip681]
|
||||||
[status-im.ethereum.tokens :as tokens]
|
[status-im.ethereum.tokens :as tokens]
|
||||||
[status-im.i18n :as i18n]
|
[status-im.i18n :as i18n]
|
||||||
|
[status-im.ui.components.button :as button]
|
||||||
|
[status-im.ui.components.copyable-text :as copyable-text]
|
||||||
[status-im.ui.components.qr-code-viewer.views :as qr-code-viewer]
|
[status-im.ui.components.qr-code-viewer.views :as qr-code-viewer]
|
||||||
[status-im.ui.components.react :as react]
|
[status-im.ui.components.react :as react]
|
||||||
[status-im.ui.components.styles :as components.styles]
|
[status-im.ui.components.styles :as components.styles]
|
||||||
|
[status-im.ui.components.toolbar :as toolbar]
|
||||||
[status-im.ui.screens.wallet.components.views :as wallet.components]
|
[status-im.ui.screens.wallet.components.views :as wallet.components]
|
||||||
[status-im.ui.screens.wallet.request.styles :as styles]
|
[status-im.ui.screens.wallet.request.styles :as styles]
|
||||||
[status-im.wallet.utils :as wallet.utils]
|
|
||||||
[status-im.utils.utils :as utils]
|
[status-im.utils.utils :as utils]
|
||||||
[status-im.ui.components.colors :as colors]
|
[status-im.wallet.utils :as wallet.utils])
|
||||||
[reagent.core :as reagent]
|
|
||||||
[status-im.ui.components.common.common :as components.common]
|
|
||||||
[status-im.ui.components.toolbar :as toolbar])
|
|
||||||
(:require-macros [status-im.utils.views :as views]))
|
(:require-macros [status-im.utils.views :as views]))
|
||||||
|
|
||||||
;;TODO DEPRECATED
|
;;TODO DEPRECATED
|
||||||
|
@ -62,28 +62,33 @@
|
||||||
(views/letsubs [{:keys [address]} [:popover/popover]
|
(views/letsubs [{:keys [address]} [:popover/popover]
|
||||||
chain-id [:chain-id]
|
chain-id [:chain-id]
|
||||||
width (reagent/atom nil)]
|
width (reagent/atom nil)]
|
||||||
[react/view
|
[react/view {:on-layout #(reset! width (-> % .-nativeEvent .-layout .-width))}
|
||||||
[react/view {:style {:padding-top 16 :padding-left 16 :padding-right 16}}
|
[react/view {:style {:padding-top 16 :padding-horizontal 16}}
|
||||||
(when @width
|
(when @width
|
||||||
[qr-code-viewer/qr-code-view (- @width 32) (eip681/generate-uri address {:chain-id chain-id})])
|
[qr-code-viewer/qr-code-view
|
||||||
[react/text {:style {:font-size 13 :color colors/gray :margin-top 12 :margin-bottom 4}}
|
(- @width 32)
|
||||||
(i18n/label :t/ens-wallet-address)]
|
(eip681/generate-uri address {:chain-id chain-id})])
|
||||||
[react/view {:on-layout #(reset! width (-> % .-nativeEvent .-layout .-width))}
|
[copyable-text/copyable-text-view
|
||||||
[react/text {:number-of-lines 1 :ellipsize-mode :middle
|
{:label :t/ens-wallet-address
|
||||||
|
:container-style {:margin-top 12 :margin-bottom 4}
|
||||||
|
:copied-text (eip55/address->checksum address)}
|
||||||
|
[react/text {:number-of-lines 1
|
||||||
|
:ellipsize-mode :middle
|
||||||
:accessibility-label :address-text
|
:accessibility-label :address-text
|
||||||
:style {:line-height 22 :font-size 15
|
:style {:line-height 22 :font-size 15
|
||||||
:font-family "monospace"}}
|
:font-family "monospace"}}
|
||||||
(eip55/address->checksum address)]]]
|
(eip55/address->checksum address)]]]
|
||||||
[react/view {:height 1 :background-color colors/gray-lighter :margin-top 8}]
|
[react/view {:margin-top 12 :margin-bottom 8}
|
||||||
[react/view {:padding-bottom 16}
|
[button/button
|
||||||
[components.common/button {:on-press #(re-frame/dispatch [:wallet.accounts/share address])
|
{:on-press #(re-frame/dispatch [:wallet.accounts/share address])
|
||||||
:button-style {:margin-vertical 20 :margin-horizontal 16}
|
:label :t/share-address
|
||||||
:accessibility-label :share-address-button
|
:accessibility-label :share-address-button}]]
|
||||||
:label (i18n/label :t/share-address)}]
|
;;TODO temporary hide for v1
|
||||||
;;TODO temporary hide for v1
|
#_[button/button
|
||||||
#_[components.common/button {:on-press #(do
|
{:on-press
|
||||||
(re-frame/dispatch [:hide-popover])
|
#(do
|
||||||
(re-frame/dispatch [:navigate-to :wallet-send-transaction-request address]))
|
(re-frame/dispatch [:hide-popover])
|
||||||
:accessibility-label :sent-transaction-request-button
|
(re-frame/dispatch [:navigate-to :wallet-send-transaction-request address]))
|
||||||
:label (i18n/label :t/send-transaction-request)
|
:accessibility-label :sent-transaction-request-button
|
||||||
:background? false}]]]))
|
:label :t/send-transaction-request
|
||||||
|
:type :secondary}]]))
|
||||||
|
|
Loading…
Reference in New Issue