diff --git a/src/quo/components/list/item.cljs b/src/quo/components/list/item.cljs index bbefa99937..aae2b913f8 100644 --- a/src/quo/components/list/item.cljs +++ b/src/quo/components/list/item.cljs @@ -5,7 +5,6 @@ [quo.components.tooltip :as tooltip] [quo.design-system.colors :as colors] [quo.design-system.spacing :as spacing] - [quo.gesture-handler :as gh] [quo.haptic :as haptic] [quo.platform :as platform] [quo.react-native :as rn] @@ -243,7 +242,7 @@ (not on-long-press)) rn/view animated animated/pressable - :else gh/touchable-highlight)] + :else rn/touchable-highlight)] [rn/view {:background-color (cond (not= background-color nil) background-color @@ -255,7 +254,8 @@ (merge {:type :list-item :disabled disabled :bg-color (when active-background-enabled active-background) - :accessibility-label accessibility-label} + :accessibility-label accessibility-label + :underlay-color (:interactive-02 @colors/theme)} (when on-press {:on-press (fn [] (optional-haptic) diff --git a/src/quo/gesture_handler.cljs b/src/quo/gesture_handler.cljs index 5ebba7480c..bd71200fe0 100644 --- a/src/quo/gesture_handler.cljs +++ b/src/quo/gesture_handler.cljs @@ -28,6 +28,10 @@ (def long-press-gesture-handler (reagent/adapt-react-class LongPressGestureHandler)) +;; NOTE - Touchables provided by react-native-gesture-handler has an issue, +;; if it is pressed rapidly it becomes unresponsive and ignores further on-press calls. +;; Issue: https://github.com/status-im/status-mobile/issues/14020 + (def touchable-without-feedback-class TouchableWithoutFeedback) (def touchable-without-feedback diff --git a/src/status_im/ui/screens/signing/views.cljs b/src/status_im/ui/screens/signing/views.cljs index caa4288ad4..b2610a7721 100644 --- a/src/status_im/ui/screens/signing/views.cljs +++ b/src/status_im/ui/screens/signing/views.cljs @@ -4,7 +4,6 @@ [clojure.string :as string] [quo.core :as quo] [quo.design-system.colors :as colors] - [quo.gesture-handler :as gh] [re-frame.core :as re-frame] [reagent.core :as reagent] [status-im.ethereum.tokens :as tokens] @@ -369,7 +368,9 @@ (defn error-item [] (fn [title show-error] - [gh/touchable-highlight {:on-press #(swap! show-error not)} + [react/touchable-highlight + {:on-press #(swap! show-error not) + :underlay-color (:interactive-02 @colors/theme)} [react/view {:style {:align-items :center :flex-direction :row}} diff --git a/src/status_im/ui2/screens/chat/components/edit/view.cljs b/src/status_im/ui2/screens/chat/components/edit/view.cljs index 6de19bd8c8..0369831308 100644 --- a/src/status_im/ui2/screens/chat/components/edit/view.cljs +++ b/src/status_im/ui2/screens/chat/components/edit/view.cljs @@ -1,6 +1,5 @@ (ns status-im.ui2.screens.chat.components.edit.view (:require [utils.i18n :as i18n] - [quo.gesture-handler :as gesture-handler] [quo2.core :as quo] [quo2.foundations.colors :as colors] [re-frame.core :as rf] @@ -22,14 +21,13 @@ {:weight :medium :size :paragraph-2} (i18n/label :t/editing-message)]]] - [gesture-handler/touchable-without-feedback - {:accessibility-label :reply-cancel-button + [quo/button + {:width 24 + :size 24 + :accessibility-label :reply-cancel-button :on-press #(do (on-cancel) - (rf/dispatch [:chat.ui/cancel-message-edit]))} - [quo/button - {:width 24 - :size 24 - :type :outline} - [quo/icon :i/close - {:size 16 - :color (colors/theme-colors colors/neutral-100 colors/neutral-40)}]]]]) + (rf/dispatch [:chat.ui/cancel-message-edit])) + :type :outline} + [quo/icon :i/close + {:size 16 + :color (colors/theme-colors colors/neutral-100 colors/neutral-40)}]]])