[fix] class calls
This concerns: - touchable-opacity - animated-view - scroll-view Tip for rebasing: search in project for `scroll-view)` `animated-view)` and `touchable-opacity)` Signed-off-by: yenda <eric@status.im>
This commit is contained in:
parent
1cb7f3b83f
commit
b3df9d4952
|
@ -53,7 +53,7 @@
|
|||
|
||||
(def status-bar-class (when-not platform/desktop? (get-react-property "StatusBar")))
|
||||
|
||||
(def scroll-view (get-class "ScrollView"))
|
||||
(def scroll-view-class (get-class "ScrollView"))
|
||||
(def web-view (get-class "WebView"))
|
||||
(def keyboard-avoiding-view-class (get-class "KeyboardAvoidingView"))
|
||||
|
||||
|
@ -84,7 +84,7 @@
|
|||
|
||||
(def touchable-highlight-class (get-class "TouchableHighlight"))
|
||||
(def touchable-without-feedback-class (get-class "TouchableWithoutFeedback"))
|
||||
(def touchable-opacity (get-class "TouchableOpacity"))
|
||||
(def touchable-opacity-class (get-class "TouchableOpacity"))
|
||||
(def activity-indicator-class (get-class "ActivityIndicator"))
|
||||
|
||||
(defn activity-indicator [props]
|
||||
|
@ -94,9 +94,13 @@
|
|||
|
||||
(def pan-responder (lazy-get-react-property "PanResponder"))
|
||||
(def animated (lazy-get-react-property "Animated"))
|
||||
(defn animated-view []
|
||||
|
||||
(defn animated-view-class []
|
||||
(reagent/adapt-react-class (.-View (animated))))
|
||||
|
||||
(defn animated-view [props & content]
|
||||
(vec (conj content props (animated-view-class))))
|
||||
|
||||
(def dimensions (lazy-get-react-property "Dimensions"))
|
||||
(def keyboard (lazy-get-react-property "Keyboard"))
|
||||
(def linking (lazy-get-react-property "Linking"))
|
||||
|
@ -162,6 +166,9 @@
|
|||
:resizeMode "contain"
|
||||
:style style}]))
|
||||
|
||||
(defn touchable-opacity [props content]
|
||||
[(touchable-opacity-class) props content])
|
||||
|
||||
(defn touchable-highlight [props content]
|
||||
[(touchable-highlight-class)
|
||||
(merge {:underlay-color :transparent} props)
|
||||
|
@ -232,10 +239,13 @@
|
|||
[view props])]
|
||||
(vec (concat view-element children))))
|
||||
|
||||
(defn scroll-view [props & children]
|
||||
(vec (conj children props (scroll-view-class))))
|
||||
|
||||
(views/defview with-activity-indicator
|
||||
[{:keys [timeout style enabled? preview]} comp]
|
||||
(views/letsubs
|
||||
[loading (reagent/atom true)]
|
||||
[loading (reagent/atom true)]
|
||||
{:component-did-mount (fn []
|
||||
(if (or (nil? timeout)
|
||||
(> 100 timeout))
|
||||
|
|
|
@ -401,7 +401,7 @@
|
|||
{:on-press on-press-handler
|
||||
:style transactions-styles/command-request-image-touchable
|
||||
:accessibility-label (request-button-label (:name command))}
|
||||
[(react/animated-view) {:style (transactions-styles/command-request-image-view command scale-anim-val)}
|
||||
[react/animated-view {:style (transactions-styles/command-request-image-view command scale-anim-val)}
|
||||
(when command-icon
|
||||
[react/icon command-icon transactions-styles/command-request-image])]]))})))
|
||||
|
||||
|
|
|
@ -47,8 +47,8 @@
|
|||
[tooltip/tooltip error (styles/error error)])])
|
||||
|
||||
(defn touchable-opacity [{:keys [style on-press]} & children]
|
||||
(into [(react/touchable-opacity) (merge (when on-press {:on-press #(on-press {})})
|
||||
(when style {:style style}))] children))
|
||||
(into [react/touchable-opacity (merge (when on-press {:on-press #(on-press {})})
|
||||
(when style {:style style}))] children))
|
||||
|
||||
(defn image [{:keys [source uri style]}]
|
||||
[react/image (merge {:style (merge {:width 100 :height 100} style)} {:source (if source source {:uri uri})})])
|
||||
|
@ -119,7 +119,7 @@
|
|||
(apply abstract-view react/view o children))
|
||||
|
||||
(defn scroll-view [o & children]
|
||||
(apply abstract-view (react/scroll-view) o children))
|
||||
(apply abstract-view react/scroll-view o children))
|
||||
|
||||
(defn keyboard-avoiding-view [o & children]
|
||||
(apply abstract-view react/keyboard-avoiding-view o children))
|
||||
|
|
|
@ -134,13 +134,13 @@
|
|||
:enter-pin-settings} view-id)
|
||||
(if platform/ios?
|
||||
[tabs-animation-wrapper-ios
|
||||
[(react/animated-view)
|
||||
[react/animated-view
|
||||
{:style (tabs.styles/animated-container visible? keyboard-shown?)}
|
||||
[tabs tab]]]
|
||||
[tabs-animation-wrapper-android
|
||||
keyboard-shown?
|
||||
view-id
|
||||
[(react/animated-view)
|
||||
[react/animated-view
|
||||
{:style (tabs.styles/animated-container visible? keyboard-shown?)}
|
||||
[tabs tab]]])))}))
|
||||
|
||||
|
|
|
@ -110,8 +110,8 @@
|
|||
{:on-press #(cancel opts on-cancel)
|
||||
:style styles/container}
|
||||
|
||||
[(react/animated-view) (styles/shadow opacity-value)]]
|
||||
[(react/animated-view)
|
||||
[react/animated-view (styles/shadow opacity-value)]]
|
||||
[react/animated-view
|
||||
{:style (styles/content-container height bottom-value)}
|
||||
[react/view styles/content-header
|
||||
[react/view styles/handle]]
|
||||
|
|
|
@ -53,13 +53,13 @@
|
|||
:top -3
|
||||
:height 3
|
||||
:background-color colors/white}}
|
||||
[(react/animated-view) {:style (animated-bar-style blue-bar-left-margin
|
||||
parent-width
|
||||
colors/blue)}]
|
||||
[(react/animated-view) {:style (assoc (animated-bar-style white-bar-left-margin
|
||||
parent-width
|
||||
colors/white)
|
||||
:left (* 0.15 parent-width))}]]))
|
||||
[react/animated-view {:style (animated-bar-style blue-bar-left-margin
|
||||
parent-width
|
||||
colors/blue)}]
|
||||
[react/animated-view {:style (assoc (animated-bar-style white-bar-left-margin
|
||||
parent-width
|
||||
colors/white)
|
||||
:left (* 0.15 parent-width))}]]))
|
||||
|
||||
(defonce show-connected? (reagent/atom true))
|
||||
|
||||
|
@ -108,15 +108,15 @@
|
|||
connected? connecting? loading-indicator?] :as opts}]
|
||||
(when (or (not connected?)
|
||||
@show-connected?)
|
||||
[(react/animated-view) {:style (styles/text-wrapper
|
||||
(assoc opts
|
||||
:height anim-height
|
||||
:background-color (if connected?
|
||||
colors/green
|
||||
colors/gray)
|
||||
:opacity anim-opacity
|
||||
:modal? (= view-id :chat-modal)))
|
||||
:accessibility-label :connection-status-text}
|
||||
[react/animated-view {:style (styles/text-wrapper
|
||||
(assoc opts
|
||||
:height anim-height
|
||||
:background-color (if connected?
|
||||
colors/green
|
||||
colors/gray)
|
||||
:opacity anim-opacity
|
||||
:modal? (= view-id :chat-modal)))
|
||||
:accessibility-label :connection-status-text}
|
||||
(when connecting?
|
||||
[react/activity-indicator {:animated true
|
||||
:color colors/white
|
||||
|
|
|
@ -258,8 +258,8 @@
|
|||
[name {:keys [color container-style accessibility-label width height]
|
||||
:or {accessibility-label :icon}}]
|
||||
^{:key name}
|
||||
[(react/animated-view) {:style container-style
|
||||
:accessibility-label accessibility-label}
|
||||
[react/animated-view {:style container-style
|
||||
:accessibility-label accessibility-label}
|
||||
(if-let [icon-fn (get icons name)]
|
||||
(let [icon-vec (icon-fn (match-color color))]
|
||||
(if width
|
||||
|
@ -272,4 +272,3 @@
|
|||
([name options]
|
||||
(let [icon-fn (if platform/desktop? desktop-icon mobile-icon)]
|
||||
[icon-fn name options])))
|
||||
|
||||
|
|
|
@ -310,7 +310,7 @@
|
|||
swipe-pan-responder (responder/swipe-pan-responder offset-x styles/delete-button-width id swiped?)
|
||||
swipe-pan-handler (responder/pan-handlers swipe-pan-responder)]
|
||||
[react/view swipe-pan-handler
|
||||
[(react/animated-view) {:style {:flex 1 :right offset-x}}
|
||||
[react/animated-view {:style {:flex 1 :right offset-x}}
|
||||
body
|
||||
[react/touchable-highlight {:style styles/delete-icon-highlight
|
||||
:on-press on-delete}
|
||||
|
|
|
@ -15,10 +15,10 @@
|
|||
[{:keys [style hint-style footer-style footer-button value hint legend
|
||||
show-tribute-to-talk-warning?]}]
|
||||
(letsubs [{:keys [width]} [:dimensions/window]]
|
||||
[(react/scroll-view) {:content-container-style {:align-items :center
|
||||
:margin-top 16
|
||||
:justify-content :center}
|
||||
:style (merge {:flex 1} style)}
|
||||
[react/scroll-view {:content-container-style {:align-items :center
|
||||
:margin-top 16
|
||||
:justify-content :center}
|
||||
:style (merge {:flex 1} style)}
|
||||
(when show-tribute-to-talk-warning?
|
||||
[react/view {:style {:margin-horizontal 16}}
|
||||
[tribute-to-talk/enabled-note]])
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
opacity-value (animation/create-value 0)]
|
||||
{:component-did-mount (animations/animate-tooltip bottom-value bottom-anim-value opacity-value 10)}
|
||||
[react/view (merge styles/tooltip-container container-style)
|
||||
[(react/animated-view) {:style (styles/tooltip-animated bottom-anim-value opacity-value)}
|
||||
[react/animated-view {:style (styles/tooltip-animated bottom-anim-value opacity-value)}
|
||||
[react/view (styles/tooltip-text-container color)
|
||||
[react/text {:style (styles/tooltip-text font-size)} label]]
|
||||
[vector-icons/icon :icons/tooltip-triangle {:color color :style styles/tooltip-triangle}]]]))
|
||||
|
@ -24,7 +24,7 @@
|
|||
opacity-value (animation/create-value 0)]
|
||||
{:component-did-mount (animations/animate-tooltip -150 bottom-anim-value opacity-value -10)}
|
||||
[react/view styles/bottom-tooltip-container
|
||||
[(react/animated-view) {:style (styles/tooltip-animated bottom-anim-value opacity-value)}
|
||||
[react/animated-view {:style (styles/tooltip-animated bottom-anim-value opacity-value)}
|
||||
[vector-icons/icon :icons/tooltip-triangle {:color colors/gray
|
||||
:style styles/tooltip-triangle
|
||||
:container-style {:transform [{:rotate "180deg"}]}}]
|
||||
|
|
|
@ -45,7 +45,7 @@
|
|||
[react/view {:flex 1}
|
||||
[status-bar/status-bar]
|
||||
[toolbar/simple-toolbar (i18n/label :t/about-app)]
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[react/view
|
||||
[profile.components/settings-item-separator]
|
||||
|
||||
|
|
|
@ -54,7 +54,7 @@
|
|||
[react/text {:style styles/account-creating-text}
|
||||
(i18n/label :t/creating-your-account)]]])
|
||||
(when (#{:enter-password :confirm-password :enter-name} step)
|
||||
[(react/scroll-view) {:flex 1}
|
||||
[react/scroll-view {:flex 1}
|
||||
[react/view {:style styles/logo-container}
|
||||
[components.common/logo styles/logo]]
|
||||
^{:key (str "step" step)}
|
||||
|
|
|
@ -64,7 +64,7 @@
|
|||
[react/keyboard-avoiding-view {:style ast/accounts-view}
|
||||
[status-bar/status-bar]
|
||||
[login-toolbar can-navigate-back?]
|
||||
[(react/scroll-view) styles/login-view
|
||||
[react/scroll-view styles/login-view
|
||||
[react/view styles/login-badge-container
|
||||
[account-login-badge photo-path name]
|
||||
[react/view {:style styles/password-container
|
||||
|
|
|
@ -45,7 +45,7 @@
|
|||
[status-bar/status-bar]
|
||||
[react/keyboard-avoiding-view components.styles/flex
|
||||
[toolbar/simple-toolbar (i18n/label (if id :t/bootnode-details :t/add-bootnode))]
|
||||
[(react/scroll-view) {:keyboard-should-persist-taps :handled}
|
||||
[react/scroll-view {:keyboard-should-persist-taps :handled}
|
||||
[react/view styles/edit-bootnode-view
|
||||
[text-input/text-input-with-label
|
||||
{:label (i18n/label :t/name)
|
||||
|
|
|
@ -95,7 +95,7 @@
|
|||
[components/separator]
|
||||
(if (empty? browsers)
|
||||
[list-header true]
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[list-header false]
|
||||
[list/flat-list {:data browsers
|
||||
:footer [react/view
|
||||
|
|
|
@ -74,8 +74,8 @@
|
|||
(when @current-permission
|
||||
(let [{:keys [title description icon]} @current-permission]
|
||||
[react/view styles/permissions-panel-container
|
||||
[(react/animated-view) {:style (styles/permissions-panel-background alpha-value)}]
|
||||
[(react/animated-view) {:style (styles/permissions-panel bottom-anim-value)}
|
||||
[react/animated-view {:style (styles/permissions-panel-background alpha-value)}]
|
||||
[react/animated-view {:style (styles/permissions-panel bottom-anim-value)}
|
||||
[react/view styles/permissions-panel-icons-container
|
||||
(if dapp?
|
||||
[chat-icon.screen/dapp-icon-permission dapp 48]
|
||||
|
|
|
@ -9,9 +9,9 @@
|
|||
(:require-macros [status-im.utils.views :as views]))
|
||||
|
||||
(views/defview view [{:keys [can-go-back?]}]
|
||||
[(react/scroll-view) {:keyboard-should-persist-taps :always
|
||||
:bounces false
|
||||
:content-container-style styles/container}
|
||||
[react/scroll-view {:keyboard-should-persist-taps :always
|
||||
:bounces false
|
||||
:content-container-style styles/container}
|
||||
[react/view styles/container-root-view
|
||||
[vector-icons/icon :main-icons/info {:color colors/red}]
|
||||
[react/text {:style styles/title-text}
|
||||
|
|
|
@ -37,7 +37,7 @@
|
|||
:display-name "container"
|
||||
:reagent-render
|
||||
(fn [height & children]
|
||||
[(react/animated-view) {:style (styles/bottom-info-container height)}
|
||||
[react/animated-view {:style (styles/bottom-info-container height)}
|
||||
(into [react/view] children)])})))
|
||||
|
||||
(defn- message-status-row [{:keys [photo-path name]} {:keys [public-key status]}]
|
||||
|
|
|
@ -31,9 +31,9 @@
|
|||
bottom (+ input-height chat-input-margin)
|
||||
max-height (- chat-layout-height (when platform/ios? keyboard-height) input-height top-offset)]
|
||||
[react/view style/overlap-container
|
||||
[(react/animated-view) {:style (style/expandable-container anim-value bottom max-height)}
|
||||
(into [(react/scroll-view) {:keyboard-should-persist-taps :always
|
||||
:on-content-size-change #(expandable-view-on-update anim-value %2)
|
||||
:bounces false}]
|
||||
[react/animated-view {:style (style/expandable-container anim-value bottom max-height)}
|
||||
(into [react/scroll-view {:keyboard-should-persist-taps :always
|
||||
:on-content-size-change #(expandable-view-on-update anim-value %2)
|
||||
:bounces false}]
|
||||
(when (or input-focused? (not messages-focused?))
|
||||
elements))]])))
|
||||
|
|
|
@ -113,7 +113,7 @@
|
|||
on-update (input-helper-view-on-update {:opacity-value opacity-value
|
||||
:placeholder placeholder})]
|
||||
{:component-did-update on-update}
|
||||
[(react/animated-view) {:style (style/input-helper-view width opacity-value)}
|
||||
[react/animated-view {:style (style/input-helper-view width opacity-value)}
|
||||
[react/text {:style (style/input-helper-text width)}
|
||||
placeholder]]))
|
||||
|
||||
|
@ -131,7 +131,7 @@
|
|||
set-container-width-fn #(reagent/set-state component {:container-width %})
|
||||
{:keys [width]} (reagent/state component)]
|
||||
[react/view {:style style/input-root}
|
||||
[(react/animated-view) {:style style/input-animated}
|
||||
[react/animated-view {:style style/input-animated}
|
||||
[invisible-input {:set-layout-width-fn set-layout-width-fn}]
|
||||
(if platform/desktop?
|
||||
[basic-text-input-desktop {:set-container-width-fn set-container-width-fn
|
||||
|
@ -156,7 +156,7 @@
|
|||
(defview reply-message [from message-text]
|
||||
(letsubs [username [:contacts/contact-name-by-identity from]
|
||||
current-public-key [:account/public-key]]
|
||||
[(react/scroll-view) {:style style/reply-message-content}
|
||||
[react/scroll-view {:style style/reply-message-content}
|
||||
(chat-utils/format-reply-author from username current-public-key style/reply-message-author)
|
||||
[react/text {:style (message-style/style-message-text false)} message-text]]))
|
||||
|
||||
|
|
|
@ -19,8 +19,8 @@
|
|||
(letsubs [available-commands [:chats/available-commands]]
|
||||
[expandable/expandable-view {:key :suggestions}
|
||||
[react/view
|
||||
[(react/scroll-view) {:keyboard-should-persist-taps :always
|
||||
:bounces false}
|
||||
[react/scroll-view {:keyboard-should-persist-taps :always
|
||||
:bounces false}
|
||||
(when (seq available-commands)
|
||||
(map-indexed
|
||||
(fn [i {:keys [type] :as command}]
|
||||
|
|
|
@ -30,16 +30,16 @@
|
|||
[react/view {:style {:flex 1 :align-items :center :justify-content :center}}
|
||||
[vector-icons/icon :stickers-icons/stickers-big {:color colors/gray}]
|
||||
[react/text {:style {:margin-top 8 :font-size 17}} (i18n/label :t/you-dont-have-stickers)]
|
||||
[(react/touchable-opacity) {:on-press #(do
|
||||
(re-frame/dispatch [:stickers/load-packs])
|
||||
(re-frame/dispatch [:navigate-to :stickers]))}
|
||||
[react/touchable-opacity {:on-press #(do
|
||||
(re-frame/dispatch [:stickers/load-packs])
|
||||
(re-frame/dispatch [:navigate-to :stickers]))}
|
||||
[react/view {:margin-top 6 :height 44 :justify-content :center}
|
||||
[react/text {:style {:color colors/blue}}
|
||||
(i18n/label :t/get-stickers)]]]])
|
||||
|
||||
(defn- stickers-panel [stickers window-width]
|
||||
[react/view {:width window-width :flex 1}
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[react/view {:style styles/stickers-panel}
|
||||
(for [{:keys [uri] :as sticker} stickers]
|
||||
^{:key uri}
|
||||
|
@ -80,12 +80,12 @@
|
|||
{:component-will-update (fn [_ [_ installed-packs selected-pack]]
|
||||
(update-scroll-position @ref installed-packs selected-pack window-width))
|
||||
:component-did-mount #(update-scroll-position @ref installed-packs selected-pack window-width)}
|
||||
[(react/scroll-view) {:style {:flex 1} :horizontal true :paging-enabled true
|
||||
:ref #(reset! ref %)
|
||||
:shows-horizontal-scroll-indicator false
|
||||
:on-momentum-scroll-end #(on-scroll % installed-packs window-width)
|
||||
:scrollEventThrottle 8
|
||||
:on-scroll #(reset! scroll-x (.-nativeEvent.contentOffset.x %))}
|
||||
[react/scroll-view {:style {:flex 1} :horizontal true :paging-enabled true
|
||||
:ref #(reset! ref %)
|
||||
:shows-horizontal-scroll-indicator false
|
||||
:on-momentum-scroll-end #(on-scroll % installed-packs window-width)
|
||||
:scrollEventThrottle 8
|
||||
:on-scroll #(reset! scroll-x (.-nativeEvent.contentOffset.x %))}
|
||||
^{:key "recent"}
|
||||
[recent-stickers-panel window-width]
|
||||
(for [{:keys [stickers id]} installed-packs]
|
||||
|
@ -129,8 +129,8 @@
|
|||
(do
|
||||
(anim/set-value bottom-anim-value (styles/stickers-panel-height))
|
||||
(anim/set-value alpha-value 1)))}
|
||||
[(react/animated-view) {:style {:background-color :white :height (if input-focused? 0 bottom-anim-value)
|
||||
:opacity alpha-value}}
|
||||
[react/animated-view {:style {:background-color :white :height (if input-focused? 0 bottom-anim-value)
|
||||
:opacity alpha-value}}
|
||||
(cond
|
||||
(= selected-pack :recent) [stickers-paging-panel installed-packs selected-pack]
|
||||
(not (seq installed-packs)) [no-stickers-yet-panel]
|
||||
|
@ -142,7 +142,7 @@
|
|||
:selected? false :background-color colors/blue}
|
||||
[vector-icons/icon :main-icons/add {:width 20 :height 20 :color colors/white}]]
|
||||
[react/view {:width 2}]
|
||||
[(react/scroll-view) {:horizontal true :style {:padding-left 2}}
|
||||
[react/scroll-view {:horizontal true :style {:padding-left 2}}
|
||||
[react/view
|
||||
[react/view {:style {:flex-direction :row}}
|
||||
[pack-icon {:id :recent :background-color colors/white}
|
||||
|
|
|
@ -112,7 +112,7 @@
|
|||
(react/dismiss-keyboard!)))}
|
||||
(if platform/desktop?
|
||||
message-view
|
||||
[(react/animated-view) {:style (style/message-view-animated opacity)}
|
||||
[react/animated-view {:style (style/message-view-animated opacity)}
|
||||
message-view])]]))
|
||||
|
||||
(defn tribute-to-talk-header
|
||||
|
@ -469,10 +469,10 @@
|
|||
(when (= chat-id current-chat-id)
|
||||
;; this scroll-view is a hack that allows us to use on-blur and on-focus on Android
|
||||
;; more details here: https://github.com/facebook/react-native/issues/11071
|
||||
[(react/scroll-view) {:scroll-enabled false
|
||||
:style style/scroll-root
|
||||
:content-container-style style/scroll-root
|
||||
:keyboard-should-persist-taps :handled}
|
||||
[react/scroll-view {:scroll-enabled false
|
||||
:style style/scroll-root
|
||||
:content-container-style style/scroll-root
|
||||
:keyboard-should-persist-taps :handled}
|
||||
^{:key current-chat-id}
|
||||
[react/view {:style style/chat-view
|
||||
:on-layout (fn [e]
|
||||
|
|
|
@ -23,7 +23,7 @@
|
|||
[toolbar.view/toolbar nil
|
||||
toolbar.view/default-nav-back
|
||||
(toolbar.view/content-title (i18n/label :t/contacts))]
|
||||
[(react/scroll-view) {:flex 1}
|
||||
[react/scroll-view {:flex 1}
|
||||
[list.views/big-list-item
|
||||
{:style {:margin-vertical 16}
|
||||
:text (i18n/label :t/blocked-users)
|
||||
|
@ -43,8 +43,8 @@
|
|||
:background-color colors/white}
|
||||
[status-bar/status-bar]
|
||||
[toolbar.view/simple-toolbar (i18n/label :t/blocked-users)]
|
||||
[(react/scroll-view) {:style {:background-color colors/white
|
||||
:padding-vertical 8}}
|
||||
[react/scroll-view {:style {:background-color colors/white
|
||||
:padding-vertical 8}}
|
||||
[list.views/flat-list
|
||||
{:data blocked-contacts
|
||||
:key-fn :address
|
||||
|
|
|
@ -59,7 +59,7 @@
|
|||
{:style (styles/add-contact-button-text disable?)}
|
||||
(i18n/label :start-chat)]]]])
|
||||
(when (seq contacts) [react/text {:style styles/new-contact-subtitle} (i18n/label :or-choose-a-contact)])
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[react/view {:style styles/suggested-contacts}
|
||||
(doall
|
||||
(for [c contacts]
|
||||
|
@ -120,7 +120,7 @@
|
|||
(i18n/label :new-public-group-chat)]]]])
|
||||
[topic-input-placeholder]
|
||||
[react/text {:style styles/new-contact-subtitle} (i18n/label :selected-for-you)]
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[react/view {:style styles/suggested-contacts}
|
||||
(doall
|
||||
(for [topic public-chat/default-public-chats]
|
||||
|
|
|
@ -242,19 +242,19 @@
|
|||
(reset! messages-to-load load-step)
|
||||
(reset! chat-id* chat-id)))]
|
||||
[react/view {:style styles/messages-view}
|
||||
[(react/scroll-view) {:scrollEventThrottle 16
|
||||
:headerHeight styles/messages-list-vertical-padding
|
||||
:footerWidth styles/messages-list-vertical-padding
|
||||
:enableArrayScrollingOptimization true
|
||||
:inverted true
|
||||
:on-scroll (fn [e]
|
||||
(let [ne (.-nativeEvent e)
|
||||
y (.-y (.-contentOffset ne))]
|
||||
(when (<= y 0)
|
||||
(when @scroll-timer (js/clearTimeout @scroll-timer))
|
||||
(reset! scroll-timer (js/setTimeout #(re-frame/dispatch [:chat.ui/load-more-messages]) 300)))
|
||||
(reset! scroll-height (+ y (.-height (.-layoutMeasurement ne))))))
|
||||
:ref #(reset! scroll-ref %)}
|
||||
[react/scroll-view {:scrollEventThrottle 16
|
||||
:headerHeight styles/messages-list-vertical-padding
|
||||
:footerWidth styles/messages-list-vertical-padding
|
||||
:enableArrayScrollingOptimization true
|
||||
:inverted true
|
||||
:on-scroll (fn [e]
|
||||
(let [ne (.-nativeEvent e)
|
||||
y (.-y (.-contentOffset ne))]
|
||||
(when (<= y 0)
|
||||
(when @scroll-timer (js/clearTimeout @scroll-timer))
|
||||
(reset! scroll-timer (js/setTimeout #(re-frame/dispatch [:chat.ui/load-more-messages]) 300)))
|
||||
(reset! scroll-height (+ y (.-height (.-layoutMeasurement ne))))))
|
||||
:ref #(reset! scroll-ref %)}
|
||||
[react/view
|
||||
(doall
|
||||
(for [{:keys [from content] :as message-obj} (take @messages-to-load messages)]
|
||||
|
|
|
@ -161,7 +161,7 @@
|
|||
(if logging-in?
|
||||
[components/activity-indicator {:animating true :color :white}]
|
||||
[icons/icon :main-icons/add {:style {:tint-color :white}}])]]]]
|
||||
[(react/scroll-view) {:enableArrayScrollingOptimization true}
|
||||
[react/scroll-view {:enableArrayScrollingOptimization true}
|
||||
[react/view
|
||||
(for [[index chat] (map-indexed vector (or all-home-items chats))]
|
||||
^{:key (first chat)}
|
||||
|
|
|
@ -168,7 +168,7 @@
|
|||
preferred-mailserver-id)
|
||||
pfs? (:pfs? settings)
|
||||
connection-message (connection-status peers-count node-status mailserver-state disconnected)]
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[react/text {:style styles/advanced-settings-title}
|
||||
(i18n/label :advanced-settings)]
|
||||
|
||||
|
@ -225,7 +225,7 @@
|
|||
(views/letsubs [installations [:pairing/installations]
|
||||
installation-id [:pairing/installation-id]
|
||||
installation-name [:pairing/installation-name]]
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
(installations-section
|
||||
installation-id
|
||||
installation-name
|
||||
|
|
|
@ -32,7 +32,7 @@
|
|||
[status-bar/status-bar]
|
||||
[react/keyboard-avoiding-view components.styles/flex
|
||||
[toolbar/simple-toolbar (i18n/label :t/extension) modal?]
|
||||
[(react/scroll-view) {:keyboard-should-persist-taps :handled}
|
||||
[react/scroll-view {:keyboard-should-persist-taps :handled}
|
||||
[react/view styles/wrapper
|
||||
[react/view {:style {:border-radius 8 :margin 10 :padding 8 :background-color colors/red}}
|
||||
[react/text {:style {:color colors/white}}
|
||||
|
@ -91,7 +91,7 @@
|
|||
[status-bar/status-bar]
|
||||
[react/keyboard-avoiding-view components.styles/flex
|
||||
[toolbar/simple-toolbar (i18n/label :t/extension-find)]
|
||||
[(react/scroll-view) {:keyboard-should-persist-taps :handled}
|
||||
[react/scroll-view {:keyboard-should-persist-taps :handled}
|
||||
[react/view styles/wrapper
|
||||
[text-input/text-input-with-label
|
||||
{:label (i18n/label :t/extension-address)
|
||||
|
|
|
@ -90,7 +90,7 @@
|
|||
(list-selection/open-share {:message (i18n/label :t/get-status-at)})))
|
||||
|
||||
(defn toggle-list [contacts render-function]
|
||||
[(react/scroll-view) {:flex 1}
|
||||
[react/scroll-view {:flex 1}
|
||||
(if utils.platform/desktop?
|
||||
(for [contact contacts]
|
||||
^{:key (:public-key contact)}
|
||||
|
@ -152,7 +152,7 @@
|
|||
{:selected (count contacts)
|
||||
:max (dec constants/max-group-chat-participants)})]
|
||||
[group-name-view]
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[list/list-with-label {:flex 1}
|
||||
(i18n/label :t/members-title)
|
||||
[list/flat-list {:data contacts
|
||||
|
|
|
@ -73,7 +73,7 @@
|
|||
(defn pin-view [{:keys [pin title-label description-label step status error-label
|
||||
retry-counter]}]
|
||||
(let [enabled? (not= status :verifying)]
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[react/view styles/pin-container
|
||||
[react/view styles/center-container
|
||||
[react/text {:style styles/center-title-text}
|
||||
|
|
|
@ -25,7 +25,7 @@
|
|||
(defview secret-keys []
|
||||
(letsubs [secrets [:hardwallet-secrets]]
|
||||
[react/view styles/secret-keys-container
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[react/view styles/secret-keys-inner-container
|
||||
[react/view
|
||||
[react/image {:source (resources/get-image :secret-keys)
|
||||
|
@ -235,7 +235,7 @@
|
|||
error [:hardwallet-setup-error]
|
||||
width [:dimensions/window-width]
|
||||
ref (atom nil)]
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[react/view styles/enter-pair-code-container
|
||||
[react/view styles/enter-pair-code-title-container
|
||||
[react/view
|
||||
|
@ -282,7 +282,7 @@
|
|||
|
||||
(defn begin []
|
||||
[react/view styles/card-blank-container
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[react/view styles/hardwallet-card-image-container
|
||||
[react/text {:style styles/card-is-empty-text}
|
||||
(i18n/label :t/card-is-blank)]
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
[status-bar/status-bar]
|
||||
[toolbar/simple-toolbar
|
||||
(i18n/label :t/help-center)]
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[react/view
|
||||
[profile.components/settings-item-separator]
|
||||
[profile.components/settings-item
|
||||
|
|
|
@ -95,7 +95,7 @@
|
|||
(let [{:keys [show? height]} @search-input-state]
|
||||
(when (or show?
|
||||
search-filter)
|
||||
[(react/animated-view)
|
||||
[react/animated-view
|
||||
{:style {:height height}}
|
||||
[search-input search-filter
|
||||
{:on-cancel #(do
|
||||
|
|
|
@ -33,7 +33,7 @@
|
|||
[status-bar/status-bar]
|
||||
[react/keyboard-avoiding-view components.styles/flex
|
||||
[toolbar/simple-toolbar (i18n/label :t/add-network)]
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[react/view styles/edit-network-view
|
||||
[text-input/text-input-with-label
|
||||
{:label (i18n/label :t/name)
|
||||
|
|
|
@ -54,7 +54,7 @@
|
|||
[status-bar/status-bar]
|
||||
[react/keyboard-avoiding-view components.styles/flex
|
||||
[toolbar/simple-toolbar (i18n/label (if id :t/mailserver-details :t/add-mailserver))]
|
||||
[(react/scroll-view) {:keyboard-should-persist-taps :handled}
|
||||
[react/scroll-view {:keyboard-should-persist-taps :handled}
|
||||
[react/view styles/edit-mailserver-view
|
||||
[text-input/text-input-with-label
|
||||
{:label (i18n/label :t/name)
|
||||
|
|
|
@ -146,7 +146,7 @@
|
|||
:on-value-change (partial toggle-enabled! installation-id enabled?)}])]]])
|
||||
|
||||
(defn render-rows [installation-id installation-name installations]
|
||||
[(react/scroll-view) {:style styles/wrapper}
|
||||
[react/scroll-view {:style styles/wrapper}
|
||||
[your-device installation-id installation-name]
|
||||
(when (seq installations)
|
||||
[list/flat-list {:data installations
|
||||
|
@ -156,7 +156,7 @@
|
|||
|
||||
(views/defview edit-installation-name []
|
||||
[react/keyboard-avoiding-view styles/edit-installation
|
||||
[(react/scroll-view) {:keyboard-should-persist-taps :handled}
|
||||
[react/scroll-view {:keyboard-should-persist-taps :handled}
|
||||
[react/view
|
||||
[react/text (i18n/label :t/pairing-please-set-a-name)]]
|
||||
[text-input/text-input-with-label
|
||||
|
@ -197,7 +197,7 @@
|
|||
[toolbar/toolbar {}
|
||||
toolbar/default-nav-back
|
||||
[toolbar/content-title (i18n/label :t/devices)]]
|
||||
[(react/scroll-view) {:style {:background-color :white}}
|
||||
[react/scroll-view {:style {:background-color :white}}
|
||||
(if (string/blank? installation-name)
|
||||
[edit-installation-name]
|
||||
[react/view
|
||||
|
|
|
@ -85,7 +85,7 @@
|
|||
[react/view profile.components.styles/profile
|
||||
[status-bar/status-bar]
|
||||
[profile-contact-toolbar]
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[react/view profile.components.styles/profile-form
|
||||
[profile.components/profile-header
|
||||
{:contact contact
|
||||
|
|
|
@ -105,7 +105,7 @@
|
|||
(if editing?
|
||||
[group-chat-profile-edit-toolbar]
|
||||
[group-chat-profile-toolbar admin?])
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[react/view profile.components.styles/profile-form
|
||||
[profile.components/profile-header
|
||||
{:contact shown-chat
|
||||
|
|
|
@ -36,9 +36,9 @@
|
|||
:second-word (re-frame/dispatch [:my-profile/set-step :first-word])))
|
||||
|
||||
(defn intro []
|
||||
[(react/scroll-view) {:style {:padding-horizontal 16}
|
||||
:content-container-style {:align-items :center
|
||||
:justify-content :center}}
|
||||
[react/scroll-view {:style {:padding-horizontal 16}
|
||||
:content-container-style {:align-items :center
|
||||
:justify-content :center}}
|
||||
(when-not platform/desktop?
|
||||
[react/image {:source (resources/get-image :lock)
|
||||
:style styles/intro-image}])
|
||||
|
|
|
@ -27,7 +27,7 @@
|
|||
|
||||
(defn intro
|
||||
[]
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[react/view {:style styles/intro-container}
|
||||
[react/view {:style {:flex 1
|
||||
:min-height 32}}]
|
||||
|
@ -65,7 +65,7 @@
|
|||
|
||||
(defn number-view
|
||||
[numpad-symbol {:keys [on-press]}]
|
||||
[(react/touchable-opacity)
|
||||
[react/touchable-opacity
|
||||
{:on-press #(on-press numpad-symbol)}
|
||||
[react/view {:style styles/number-container}
|
||||
(if (= numpad-symbol :remove)
|
||||
|
@ -94,7 +94,7 @@
|
|||
|
||||
(defn set-snt-amount
|
||||
[snt-amount]
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
{:content-container-style styles/set-snt-amount-container}
|
||||
[react/view {:style (styles/horizontal-separator 16 32)}]
|
||||
[snt-amount-label snt-amount]
|
||||
|
@ -197,7 +197,7 @@
|
|||
|
||||
(defn edit
|
||||
[snt-amount fiat-value]
|
||||
[(react/scroll-view) {:content-container-style styles/edit-container}
|
||||
[react/scroll-view {:content-container-style styles/edit-container}
|
||||
[react/view {:style styles/edit-screen-top-row}
|
||||
[react/view {:style {:flex-direction :row
|
||||
:justify-content :flex-start
|
||||
|
@ -284,7 +284,7 @@
|
|||
(i18n/label :t/tribute-to-talk)]
|
||||
[react/text {:style styles/step-n}
|
||||
(i18n/label :t/learn-more)]]])
|
||||
[(react/scroll-view) {:content-container-style styles/learn-more-container}
|
||||
[react/scroll-view {:content-container-style styles/learn-more-container}
|
||||
[react/image {:source (resources/get-image :tribute-to-talk)
|
||||
:style styles/learn-more-image}]
|
||||
[react/text {:style styles/learn-more-title-text}
|
||||
|
|
|
@ -300,7 +300,7 @@
|
|||
[react/keyboard-avoiding-view {:style {:flex 1}}
|
||||
[status-bar/status-bar {:type :main}]
|
||||
[toolbar/simple-toolbar label]
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
[view]]]))
|
||||
|
||||
(defview my-profile []
|
||||
|
@ -330,8 +330,8 @@
|
|||
(if editing?
|
||||
[my-profile-edit-toolbar on-show-edit]
|
||||
[my-profile-toolbar])
|
||||
[(react/scroll-view) {:ref #(reset! scroll %)
|
||||
:keyboard-should-persist-taps :handled}
|
||||
[react/scroll-view {:ref #(reset! scroll %)
|
||||
:keyboard-should-persist-taps :handled}
|
||||
[react/view profile.components.styles/profile-form
|
||||
[profile.components/profile-header
|
||||
{:contact current-account
|
||||
|
|
|
@ -64,7 +64,7 @@
|
|||
[status-bar/status-bar]
|
||||
[react/keyboard-avoiding-view components.styles/flex
|
||||
[toolbar/simple-toolbar (i18n/label :t/sticker-market)]
|
||||
[(react/scroll-view) {:keyboard-should-persist-taps :handled :style {:padding 16}}
|
||||
[react/scroll-view {:keyboard-should-persist-taps :handled :style {:padding 16}}
|
||||
[react/view
|
||||
(for [pack packs]
|
||||
^{:key pack}
|
||||
|
@ -87,7 +87,7 @@
|
|||
[installed-icon]
|
||||
[price-badge price id owned pending])]
|
||||
[react/view {:style {:padding-top 8 :flex 1}}
|
||||
[(react/scroll-view) {:keyboard-should-persist-taps :handled :style {:flex 1}}
|
||||
[react/scroll-view {:keyboard-should-persist-taps :handled :style {:flex 1}}
|
||||
[react/view {:flex-direction :row :flex-wrap :wrap}
|
||||
(for [{:keys [uri]} stickers]
|
||||
^{:key uri}
|
||||
|
|
|
@ -31,7 +31,7 @@
|
|||
toolbar/default-nav-back
|
||||
[toolbar/content-title
|
||||
(i18n/label :t/add-custom-token)]]
|
||||
[(react/scroll-view) {:keyboard-should-persist-taps :handled :style {:flex 1 :margin-top 8 :padding-horizontal 16}}
|
||||
[react/scroll-view {:keyboard-should-persist-taps :handled :style {:flex 1 :margin-top 8 :padding-horizontal 16}}
|
||||
[react/view {:style {:flex-direction :row :justify-content :space-between :padding-vertical 10}}
|
||||
[react/text (i18n/label :t/contract-address)]
|
||||
(if in-progress?
|
||||
|
|
|
@ -164,13 +164,13 @@
|
|||
[react/view styles/main-section
|
||||
[status-bar.view/status-bar {:type :wallet-tab}]
|
||||
[settings/toolbar-view]
|
||||
[(react/scroll-view) {:end-fill-color
|
||||
colors/white
|
||||
:refresh-control
|
||||
(reagent/as-element
|
||||
[(react/refresh-control) {:on-refresh #(re-frame/dispatch [:wallet.ui/pull-to-refresh])
|
||||
:tint-color :white
|
||||
:refreshing false}])}
|
||||
[react/scroll-view {:end-fill-color
|
||||
colors/white
|
||||
:refresh-control
|
||||
(reagent/as-element
|
||||
[(react/refresh-control) {:on-refresh #(re-frame/dispatch [:wallet.ui/pull-to-refresh])
|
||||
:tint-color :white
|
||||
:refreshing false}])}
|
||||
(if error-message
|
||||
[snackbar error-message]
|
||||
[total-section portfolio-value currency])
|
||||
|
|
|
@ -36,7 +36,7 @@
|
|||
[wallet.components/toolbar (i18n/label :t/new-request)]
|
||||
[react/view components.styles/flex
|
||||
[common/network-info {:text-color :white}]
|
||||
[(react/scroll-view) {:ref #(reset! scroll %) :keyboardShouldPersistTaps :always}
|
||||
[react/scroll-view {:ref #(reset! scroll %) :keyboardShouldPersistTaps :always}
|
||||
[react/view styles/request-details-wrapper
|
||||
[wallet.components/recipient-selector
|
||||
{:contact-only? true
|
||||
|
|
|
@ -73,10 +73,10 @@
|
|||
bottom-value (animation/create-value -250)
|
||||
opacity-value (animation/create-value 0)]
|
||||
{:component-did-mount #(send.animations/animate-sign-panel opacity-value bottom-value)}
|
||||
[(react/animated-view) {:style (styles/animated-sign-panel bottom-value)}
|
||||
[react/animated-view {:style (styles/animated-sign-panel bottom-value)}
|
||||
(when wrong-password?
|
||||
[tooltip/tooltip (i18n/label :t/wrong-password) styles/password-error-tooltip])
|
||||
[(react/animated-view) {:style (styles/sign-panel opacity-value)}
|
||||
[react/animated-view {:style (styles/sign-panel opacity-value)}
|
||||
[react/view styles/spinner-container
|
||||
(when spinning?
|
||||
[react/activity-indicator {:animating true
|
||||
|
@ -161,10 +161,10 @@
|
|||
[toolbar modal? (i18n/label :t/send-transaction)]
|
||||
[react/view components.styles/flex
|
||||
[common/network-info {:text-color :white}]
|
||||
[(react/scroll-view) {:keyboard-should-persist-taps :always
|
||||
:ref #(reset! scroll %)
|
||||
:on-content-size-change #(when (and (not modal?) scroll @scroll)
|
||||
(.scrollToEnd @scroll))}
|
||||
[react/scroll-view {:keyboard-should-persist-taps :always
|
||||
:ref #(reset! scroll %)
|
||||
:on-content-size-change #(when (and (not modal?) scroll @scroll)
|
||||
(.scrollToEnd @scroll))}
|
||||
(when-not online?
|
||||
[wallet.main.views/snackbar :t/error-cant-send-transaction-offline])
|
||||
[react/view styles/send-transaction-form
|
||||
|
|
|
@ -57,10 +57,10 @@
|
|||
bottom-value (animation/create-value -250)
|
||||
opacity-value (animation/create-value 0)]
|
||||
{:component-did-mount #(send.animations/animate-sign-panel opacity-value bottom-value)}
|
||||
[(react/animated-view) {:style (styles/animated-sign-panel bottom-value)}
|
||||
[react/animated-view {:style (styles/animated-sign-panel bottom-value)}
|
||||
(when (:wrong-password? @value-atom)
|
||||
[tooltip/tooltip (i18n/label :t/wrong-password) styles/password-error-tooltip])
|
||||
[(react/animated-view) {:style (styles/sign-panel opacity-value)}
|
||||
[react/animated-view {:style (styles/sign-panel opacity-value)}
|
||||
[react/view styles/spinner-container
|
||||
(when spinning?
|
||||
[react/activity-indicator {:animating true
|
||||
|
@ -89,7 +89,7 @@
|
|||
[wallet.components/simple-screen {:status-bar-type :modal-wallet}
|
||||
[toolbar true (i18n/label :t/sign-message)]
|
||||
[react/view components.styles/flex
|
||||
[(react/scroll-view)
|
||||
[react/scroll-view
|
||||
(when (= network-status :offline)
|
||||
[wallet.main.views/snackbar :t/error-cant-sign-message-offline])
|
||||
[react/view styles/send-transaction-form
|
||||
|
|
|
@ -248,7 +248,7 @@
|
|||
toolbar/default-nav-back
|
||||
[toolbar/content-title (i18n/label :t/transaction-details)]
|
||||
(when transaction [toolbar/actions (details-action hash url)])]
|
||||
[(react/scroll-view) {:style components.styles/main-container}
|
||||
[react/scroll-view {:style components.styles/main-container}
|
||||
[details-header date type amount-text currency-text]
|
||||
[details-confirmations confirmations confirmations-progress (= :failed type)]
|
||||
[react/view {:style styles/details-separator}]
|
||||
|
|
Loading…
Reference in New Issue