From b6ce60eccf6582803fb23db443a36a858813dfe1 Mon Sep 17 00:00:00 2001 From: Parvesh Monu Date: Mon, 5 Feb 2024 15:26:14 +0530 Subject: [PATCH] Disable multiple button presses (#18478) --- .../ui/screens/browser/eip3326/sheet.cljs | 4 +-- .../ui/screens/communities/invite.cljs | 2 +- .../status_im/ui/screens/ens/views.cljs | 7 ++-- .../status_im/ui/screens/group/views.cljs | 6 ++-- .../network/network_details/views.cljs | 4 +-- .../ui/screens/profile/group_chat/views.cljs | 2 +- src/quo/components/buttons/button/view.cljs | 23 ++++++------- .../calendar/calendar/month_picker/view.cljs | 22 +++++++------ src/quo/components/colors/color/view.cljs | 7 ++-- src/quo/components/list_items/user.cljs | 14 ++++---- .../navigation/bottom_nav_tab/view.cljs | 13 ++++---- .../numbered_keyboard/keyboard_key/view.cljs | 19 +++++------ .../selectors/reactions_selector/view.cljs | 15 +++++---- .../components/selectors/selectors/view.cljs | 3 +- src/react_native/core.cljs | 25 ++++++++++++--- src/react_native/utils.cljs | 32 +++++++++++++++++++ .../common/contact_list_item/view.cljs | 27 ++++++++-------- src/status_im/common/home/top_nav/view.cljs | 3 +- src/status_im/contexts/chat/actions/view.cljs | 4 +-- .../contexts/chat/group_details/view.cljs | 18 ++++++----- .../chat/home/chat_list_item/view.cljs | 2 +- .../contexts/chat/home/new_chat/view.cljs | 9 +++--- .../messages/content/audio/view.cljs | 21 ++++++------ .../contexts/communities/home/view.cljs | 5 +-- .../contexts/communities/overview/view.cljs | 2 +- .../contexts/onboarding/intro/view.cljs | 10 +++--- .../onboarding/new_to_status/view.cljs | 2 +- .../onboarding/syncing/progress/view.cljs | 4 +-- .../contexts/profile/profiles/view.cljs | 4 +-- .../contexts/profile/settings/view.cljs | 4 +-- src/utils/debounce.cljs | 10 +++--- 31 files changed, 194 insertions(+), 129 deletions(-) create mode 100644 src/react_native/utils.cljs diff --git a/src/legacy/status_im/ui/screens/browser/eip3326/sheet.cljs b/src/legacy/status_im/ui/screens/browser/eip3326/sheet.cljs index 6d715fa7f5..cc26237573 100644 --- a/src/legacy/status_im/ui/screens/browser/eip3326/sheet.cljs +++ b/src/legacy/status_im/ui/screens/browser/eip3326/sheet.cljs @@ -63,6 +63,6 @@ [quo/button {:theme :positive :style {:margin-horizontal 8} - :on-press #(debounce/dispatch-and-chill [::network/connect-network-pressed target-network-id] - 1000)} + :on-press #(debounce/throttle-and-dispatch [::network/connect-network-pressed target-network-id] + 1000)} (i18n/label :t/allow)]]]])) diff --git a/src/legacy/status_im/ui/screens/communities/invite.cljs b/src/legacy/status_im/ui/screens/communities/invite.cljs index 18519d8661..5972b6e561 100644 --- a/src/legacy/status_im/ui/screens/communities/invite.cljs +++ b/src/legacy/status_im/ui/screens/communities/invite.cljs @@ -84,7 +84,7 @@ (zero? (count selected))) :accessibility-label :share-community-link :type :secondary - :on-press #(debounce/dispatch-and-chill + :on-press #(debounce/throttle-and-dispatch [(if can-invite? ::communities/invite-people-confirmation-pressed ::communities/share-community-confirmation-pressed) @user-pk diff --git a/src/legacy/status_im/ui/screens/ens/views.cljs b/src/legacy/status_im/ui/screens/ens/views.cljs index 0bbc10c949..399feb5497 100644 --- a/src/legacy/status_im/ui/screens/ens/views.cljs +++ b/src/legacy/status_im/ui/screens/ens/views.cljs @@ -111,7 +111,7 @@ (:available :connected :connected-with-different-key :owned) [react/touchable-highlight - {:on-press #(debounce/dispatch-and-chill [::ens/input-submitted] 3000)} + {:on-press #(debounce/throttle-and-dispatch [::ens/input-submitted] 3000)} [icon-wrapper colors/blue [icons/icon :main-icons/arrow-right {:color colors/white-persist}]]] @@ -365,8 +365,9 @@ :right [react/view {:padding-horizontal 8} [quo/button {:disabled (or (not @checked?) (not sufficient-funds?)) - :on-press #(debounce/dispatch-and-chill [::ens/register-name-pressed address] - 2000)} + :on-press #(debounce/throttle-and-dispatch [::ens/register-name-pressed + address] + 2000)} (if sufficient-funds? (i18n/label :t/ens-register) (i18n/label :t/not-enough-snt))]]}]])))) diff --git a/src/legacy/status_im/ui/screens/group/views.cljs b/src/legacy/status_im/ui/screens/group/views.cljs index 94cd8d41f9..7fcfbe083e 100644 --- a/src/legacy/status_im/ui/screens/group/views.cljs +++ b/src/legacy/status_im/ui/screens/group/views.cljs @@ -139,9 +139,9 @@ {:type :secondary :accessibility-label :create-group-chat-button :disabled group-name-empty? - :on-press #(debounce/dispatch-and-chill [:group-chats.ui/create-pressed - group-name] - 300)} + :on-press #(debounce/throttle-and-dispatch [:group-chats.ui/create-pressed + group-name] + 300)} (i18n/label :t/create-group-chat)]}]]]))) (defn searchable-contact-list diff --git a/src/legacy/status_im/ui/screens/network/network_details/views.cljs b/src/legacy/status_im/ui/screens/network/network_details/views.cljs index c63f59c2cb..cb73125f6a 100644 --- a/src/legacy/status_im/ui/screens/network/network_details/views.cljs +++ b/src/legacy/status_im/ui/screens/network/network_details/views.cljs @@ -6,7 +6,7 @@ [legacy.status-im.ui.screens.network.styles :as st] [legacy.status-im.ui.screens.network.views :as network-settings] [re-frame.core :as re-frame] - [utils.debounce :refer [dispatch-and-chill]] + [utils.debounce :refer [throttle-and-dispatch]] [utils.i18n :as i18n]) (:require-macros [legacy.status-im.utils.views :as views])) @@ -25,7 +25,7 @@ :connected? connected?}] (when-not connected? [react/touchable-highlight - {:on-press #(dispatch-and-chill [::network/connect-network-pressed id] 1000)} + {:on-press #(throttle-and-dispatch [::network/connect-network-pressed id] 1000)} [react/view st/connect-button-container [react/view {:style st/connect-button diff --git a/src/legacy/status_im/ui/screens/profile/group_chat/views.cljs b/src/legacy/status_im/ui/screens/profile/group_chat/views.cljs index 3b55896a80..e3b2fd9874 100644 --- a/src/legacy/status_im/ui/screens/profile/group_chat/views.cljs +++ b/src/legacy/status_im/ui/screens/profile/group_chat/views.cljs @@ -109,7 +109,7 @@ (defn hide-sheet-and-dispatch-old [event] (re-frame/dispatch [:bottom-sheet/hide-old]) - (debounce/dispatch-and-chill event 2000)) + (debounce/throttle-and-dispatch event 2000)) (defn invitation-sheet [{:keys [id]} contact] diff --git a/src/quo/components/buttons/button/view.cljs b/src/quo/components/buttons/button/view.cljs index 37df55236a..c26b55732f 100644 --- a/src/quo/components/buttons/button/view.cljs +++ b/src/quo/components/buttons/button/view.cljs @@ -34,7 +34,7 @@ (fn [{:keys [on-press on-long-press disabled? type background size icon-left icon-right icon-top customization-color theme accessibility-label icon-only? container-style inner-style - pressed? on-press-in on-press-out] + pressed? on-press-in on-press-out allow-multiple-presses?] :or {type :primary size 40 customization-color (cond (= type :primary) :blue @@ -52,16 +52,17 @@ :icon-only? icon-only?}) icon-size (when (= 24 size) 12)] [rn/touchable-without-feedback - {:disabled disabled? - :accessibility-label accessibility-label - :on-press-in (fn [] - (reset! pressed-state? true) - (when on-press-in (on-press-in))) - :on-press-out (fn [] - (reset! pressed-state? nil) - (when on-press-out (on-press-out))) - :on-press on-press - :on-long-press on-long-press} + {:disabled disabled? + :accessibility-label accessibility-label + :on-press-in (fn [] + (reset! pressed-state? true) + (when on-press-in (on-press-in))) + :on-press-out (fn [] + (reset! pressed-state? nil) + (when on-press-out (on-press-out))) + :on-press on-press + :allow-multiple-presses? allow-multiple-presses? + :on-long-press on-long-press} [rn/view {:style (merge (style/shape-style-container size border-radius) diff --git a/src/quo/components/calendar/calendar/month_picker/view.cljs b/src/quo/components/calendar/calendar/month_picker/view.cljs index c915ae2d55..6efa19c1fd 100644 --- a/src/quo/components/calendar/calendar/month_picker/view.cljs +++ b/src/quo/components/calendar/calendar/month_picker/view.cljs @@ -15,11 +15,12 @@ [rn/view {:style style/container} [button/button - {:icon true - :type :outline - :accessibility-label :previous-month-button - :size 24 - :on-press #(on-change (utils/previous-month year month))} + {:icon true + :type :outline + :accessibility-label :previous-month-button + :allow-multiple-presses? true + :size 24 + :on-press #(on-change (utils/previous-month year month))} :i/chevron-left] [text/text {:weight :semi-bold @@ -27,11 +28,12 @@ :style (style/text theme)} (utils/format-month-year year month)] [button/button - {:icon true - :accessibility-label :next-month-button - :size 24 - :type :outline - :on-press #(on-change (utils/next-month year month))} + {:icon true + :accessibility-label :next-month-button + :allow-multiple-presses? true + :size 24 + :type :outline + :on-press #(on-change (utils/next-month year month))} :i/chevron-right]])) (def view (theme/with-theme view-internal)) diff --git a/src/quo/components/colors/color/view.cljs b/src/quo/components/colors/color/view.cljs index 51886c0520..b32450ff3f 100644 --- a/src/quo/components/colors/color/view.cljs +++ b/src/quo/components/colors/color/view.cljs @@ -31,9 +31,10 @@ theme))] [rn/pressable - {:style (style/color-button hex-color selected? idx window-width) - :accessibility-label :color-picker-item - :on-press #(on-press color)} + {:style (style/color-button hex-color selected? idx window-width) + :accessibility-label :color-picker-item + :allow-multiple-presses? true + :on-press #(on-press color)} (if (and (= :feng-shui color) (not selected?)) [feng-shui (assoc props diff --git a/src/quo/components/list_items/user.cljs b/src/quo/components/list_items/user.cljs index 9452d0a4e4..f4b40ac0ea 100644 --- a/src/quo/components/list_items/user.cljs +++ b/src/quo/components/list_items/user.cljs @@ -39,13 +39,15 @@ (defn user [{:keys [short-chat-key primary-name secondary-name photo-path online? contact? verified? - untrustworthy? on-press on-long-press accessory customization-color theme]}] + untrustworthy? on-press on-long-press accessory customization-color theme + allow-multiple-presses?]}] [rn/touchable-highlight - {:style container-style - :underlay-color (colors/resolve-color customization-color theme 5) - :accessibility-label :user-list - :on-press (when on-press on-press) - :on-long-press (when on-long-press on-long-press)} + {:style container-style + :underlay-color (colors/resolve-color customization-color theme 5) + :allow-multiple-presses? allow-multiple-presses? + :accessibility-label :user-list + :on-press (when on-press on-press) + :on-long-press (when on-long-press on-long-press)} [:<> [user-avatar/user-avatar {:full-name primary-name diff --git a/src/quo/components/navigation/bottom_nav_tab/view.cljs b/src/quo/components/navigation/bottom_nav_tab/view.cljs index df1f7e5461..a7c8065c14 100644 --- a/src/quo/components/navigation/bottom_nav_tab/view.cljs +++ b/src/quo/components/navigation/bottom_nav_tab/view.cljs @@ -47,12 +47,13 @@ :height 40 :border-radius 10})] [rn/touchable-without-feedback - {:test-ID test-ID - :on-long-press on-long-press ;;NOTE - this is temporary while supporting old wallet - :on-press on-press - :on-press-in #(toggle-background-color background-color false pass-through?) - :on-press-out #(toggle-background-color background-color true pass-through?) - :accessibility-label accessibility-label} + {:test-ID test-ID + :on-long-press on-long-press ;;NOTE - this is temporary while supporting old wallet + :allow-multiple-presses? true + :on-press on-press + :on-press-in #(toggle-background-color background-color false pass-through?) + :on-press-out #(toggle-background-color background-color true pass-through?) + :accessibility-label accessibility-label} [reanimated/view {:style background-animated-style} ;; In android animations are not working for the animated components which are nested by ;; hole-view, diff --git a/src/quo/components/numbered_keyboard/keyboard_key/view.cljs b/src/quo/components/numbered_keyboard/keyboard_key/view.cljs index 795eb84f99..72d443eb5b 100644 --- a/src/quo/components/numbered_keyboard/keyboard_key/view.cljs +++ b/src/quo/components/numbered_keyboard/keyboard_key/view.cljs @@ -19,15 +19,16 @@ (let [label-color (style/get-label-color disabled? theme blur?) background-color (style/toggle-background-color @pressed? blur? theme)] [rn/pressable - {:accessibility-label (label->accessibility-label label) - :disabled (or disabled? (not label)) - :on-press (fn [] - (when on-press - (on-press label))) - :on-press-in #(reset! pressed? true) - :on-press-out #(reset! pressed? false) - :hit-slop {:top 8 :bottom 8 :left 25 :right 25} - :style (style/container background-color)} + {:accessibility-label (label->accessibility-label label) + :disabled (or disabled? (not label)) + :on-press (fn [] + (when on-press + (on-press label))) + :allow-multiple-presses? true + :on-press-in #(reset! pressed? true) + :on-press-out #(reset! pressed? false) + :hit-slop {:top 8 :bottom 8 :left 25 :right 25} + :style (style/container background-color)} (case type :key [icons/icon label diff --git a/src/quo/components/selectors/reactions_selector/view.cljs b/src/quo/components/selectors/reactions_selector/view.cljs index ecb67b064b..7aa6ce4f96 100644 --- a/src/quo/components/selectors/reactions_selector/view.cljs +++ b/src/quo/components/selectors/reactions_selector/view.cljs @@ -12,12 +12,13 @@ accessibility-label] :or {accessibility-label :reaction}}] [rn/pressable - {:accessibility-label accessibility-label - :style (merge (style/container @pressed?) - container-style) - :on-press (fn [e] - (swap! pressed? not) - (when on-press - (on-press e)))} + {:accessibility-label accessibility-label + :allow-multiple-presses? true + :style (merge (style/container @pressed?) + container-style) + :on-press (fn [e] + (swap! pressed? not) + (when on-press + (on-press e)))} [rn/text (reactions.resource/system-emojis emoji)]]))) diff --git a/src/quo/components/selectors/selectors/view.cljs b/src/quo/components/selectors/selectors/view.cljs index 3577d19d44..85f7530533 100644 --- a/src/quo/components/selectors/selectors/view.cljs +++ b/src/quo/components/selectors/selectors/view.cljs @@ -30,7 +30,8 @@ :theme theme})] [rn/pressable (when-not disabled? - {:on-press #(handle-press on-change internal-checked? actual-checked?)}) + {:on-press #(handle-press on-change internal-checked? actual-checked?) + :allow-multiple-presses? true}) [rn/view {:style outer-styles :needs-offscreen-alpha-compositing true diff --git a/src/react_native/core.cljs b/src/react_native/core.cljs index fee337520e..c9e41a7427 100644 --- a/src/react_native/core.cljs +++ b/src/react_native/core.cljs @@ -7,6 +7,7 @@ [react-native.flat-list :as flat-list] [react-native.platform :as platform] [react-native.section-list :as section-list] + [react-native.utils :as utils] [reagent.core :as reagent])) (def app-state ^js (.-AppState ^js react-native)) @@ -33,12 +34,28 @@ (def text (reagent/adapt-react-class (.-Text ^js react-native))) (def text-input (reagent/adapt-react-class (.-TextInput ^js react-native))) -(def pressable (reagent/adapt-react-class (.-Pressable ^js react-native))) -(def touchable-opacity (reagent/adapt-react-class (.-TouchableOpacity ^js react-native))) -(def touchable-highlight (reagent/adapt-react-class (.-TouchableHighlight ^js react-native))) -(def touchable-without-feedback +(def pressable-class (reagent/adapt-react-class (.-Pressable ^js react-native))) +(def touchable-opacity-class (reagent/adapt-react-class (.-TouchableOpacity ^js react-native))) +(def touchable-highlight-class (reagent/adapt-react-class (.-TouchableHighlight ^js react-native))) +(def touchable-without-feedback-class (reagent/adapt-react-class (.-TouchableWithoutFeedback ^js react-native))) +(defn pressable + [props & children] + (into [pressable-class (utils/custom-pressable-props props)] children)) + +(defn touchable-opacity + [props & children] + (into [touchable-opacity-class (utils/custom-pressable-props props)] children)) + +(defn touchable-highlight + [props & children] + (into [touchable-highlight-class (utils/custom-pressable-props props)] children)) + +(defn touchable-without-feedback + [props & children] + (into [touchable-without-feedback-class (utils/custom-pressable-props props)] children)) + (def flat-list flat-list/flat-list) (def section-list section-list/section-list) diff --git a/src/react_native/utils.cljs b/src/react_native/utils.cljs new file mode 100644 index 0000000000..a96a2f3732 --- /dev/null +++ b/src/react_native/utils.cljs @@ -0,0 +1,32 @@ +(ns react-native.utils) + +(defonce ^:private throttle (atom {})) + +(defn- wrapped-ref + [{:keys [ref]} throttle-id] + (fn [ref-value] + (when ref-value + (when ref + (ref ref-value)) + (reset! throttle-id ref-value)))) + +(defn- throttled-on-press + [{:keys [on-press allow-multiple-presses? throttle-duration]} throttle-id] + (if allow-multiple-presses? + on-press + (fn [] + (let [id @throttle-id] + (when (and id (not (get @throttle id))) + (swap! throttle assoc id true) + (on-press) + (js/setTimeout + #(swap! throttle dissoc id) + (or throttle-duration 500))))))) + +(defn custom-pressable-props + [{:keys [on-press] :as props}] + (let [throttle-id (atom nil)] + (cond-> props + on-press + (assoc :on-press (throttled-on-press props throttle-id) + :ref (wrapped-ref props throttle-id))))) diff --git a/src/status_im/common/contact_list_item/view.cljs b/src/status_im/common/contact_list_item/view.cljs index 00cee05347..d1137ea603 100644 --- a/src/status_im/common/contact_list_item/view.cljs +++ b/src/status_im/common/contact_list_item/view.cljs @@ -5,22 +5,23 @@ [utils.re-frame :as rf])) (defn contact-list-item - [{:keys [on-press on-long-press accessory]} + [{:keys [on-press on-long-press accessory allow-multiple-presses?]} {:keys [primary-name secondary-name public-key compressed-key ens-verified added?]} theme] (let [photo-path (rf/sub [:chats/photo-path public-key]) online? (rf/sub [:visibility-status-updates/online? public-key]) customization-color (rf/sub [:profile/customization-color])] [quo/user - {:customization-color customization-color - :theme theme - :short-chat-key (address/get-shortened-compressed-key (or compressed-key public-key)) - :primary-name primary-name - :secondary-name secondary-name - :photo-path photo-path - :online? online? - :verified? ens-verified - :contact? added? - :on-press on-press - :on-long-press on-long-press - :accessory accessory}])) + {:customization-color customization-color + :allow-multiple-presses? allow-multiple-presses? + :theme theme + :short-chat-key (address/get-shortened-compressed-key (or compressed-key public-key)) + :primary-name primary-name + :secondary-name secondary-name + :photo-path photo-path + :online? online? + :verified? ens-verified + :contact? added? + :on-press on-press + :on-long-press on-long-press + :accessory accessory}])) diff --git a/src/status_im/common/home/top_nav/view.cljs b/src/status_im/common/home/top_nav/view.cljs index 5833e9fb95..126700e684 100644 --- a/src/status_im/common/home/top_nav/view.cljs +++ b/src/status_im/common/home/top_nav/view.cljs @@ -4,7 +4,6 @@ [status-im.common.home.top-nav.style :as style] [status-im.constants :as constants] [status-im.contexts.profile.utils :as profile.utils] - [utils.debounce :refer [dispatch-and-chill]] [utils.re-frame :as rf])) (defn view @@ -36,7 +35,7 @@ {:avatar-on-press #(rf/dispatch [:open-modal :settings]) :scan-on-press #(js/alert "to be implemented") :activity-center-on-press #(rf/dispatch [:activity-center/open]) - :qr-code-on-press #(dispatch-and-chill [:open-modal :share-shell] 1000) + :qr-code-on-press #(rf/dispatch [:open-modal :share-shell]) :container-style (merge style/top-nav-container container-style) :blur? blur? :jump-to? jump-to? diff --git a/src/status_im/contexts/chat/actions/view.cljs b/src/status_im/contexts/chat/actions/view.cljs index a70abba3f3..af55fc3d27 100644 --- a/src/status_im/contexts/chat/actions/view.cljs +++ b/src/status_im/contexts/chat/actions/view.cljs @@ -23,7 +23,7 @@ :label (i18n/label :t/new-chat) :on-press (fn [] (rf/dispatch [:group-chat/clear-contacts]) - (debounce/dispatch-and-chill + (debounce/throttle-and-dispatch [:open-modal :start-a-new-chat] 1000))} {:icon :i/add-user @@ -31,6 +31,6 @@ :label (i18n/label :t/add-a-contact) :sub-label (i18n/label :t/enter-chat-key) :add-divider? true - :on-press #(debounce/dispatch-and-chill + :on-press #(debounce/throttle-and-dispatch [:open-modal :new-contact] 1000)}]]]) diff --git a/src/status_im/contexts/chat/group_details/view.cljs b/src/status_im/contexts/chat/group_details/view.cljs index a5399c9447..a33fd73343 100644 --- a/src/status_im/contexts/chat/group_details/view.cljs +++ b/src/status_im/contexts/chat/group_details/view.cljs @@ -79,10 +79,11 @@ (let [on-toggle #(group-chat-member-toggle member? (swap! checked? not) public-key)] [contact-list-item/contact-list-item (when (not= current-pk public-key) - {:on-press on-toggle - :accessory {:type :checkbox - :checked? @checked? - :on-check on-toggle}}) + {:on-press on-toggle + :allow-multiple-presses? true + :accessory {:type :checkbox + :checked? @checked? + :on-check on-toggle}}) item])))) (defn add-manage-members @@ -135,10 +136,11 @@ extra-data])}])] [contact-list-item/contact-list-item (when (not= public-key current-pk) - {:on-press #(rf/dispatch [:chat.ui/show-profile public-key]) - :on-long-press show-profile-actions - :accessory {:type :options - :on-press show-profile-actions}}) + {:on-press #(rf/dispatch [:chat.ui/show-profile public-key]) + :allow-multiple-presses? true + :on-long-press show-profile-actions + :accessory {:type :options + :on-press show-profile-actions}}) item])) (defn group-details diff --git a/src/status_im/contexts/chat/home/chat_list_item/view.cljs b/src/status_im/contexts/chat/home/chat_list_item/view.cljs index d49da12d06..d1136e5cde 100644 --- a/src/status_im/contexts/chat/home/chat_list_item/view.cljs +++ b/src/status_im/contexts/chat/home/chat_list_item/view.cljs @@ -18,7 +18,7 @@ [chat-id] (fn [] (rf/dispatch [:dismiss-keyboard]) - (debounce/dispatch-and-chill [:chat/navigate-to-chat chat-id] 500))) + (debounce/throttle-and-dispatch [:chat/navigate-to-chat chat-id] 500))) (defn parsed-text-to-one-line [parsed-text] diff --git a/src/status_im/contexts/chat/home/new_chat/view.cljs b/src/status_im/contexts/chat/home/new_chat/view.cljs index 7c83d7e93d..56699e4228 100644 --- a/src/status_im/contexts/chat/home/new_chat/view.cljs +++ b/src/status_im/contexts/chat/home/new_chat/view.cljs @@ -57,10 +57,11 @@ (re-frame/dispatch [:deselect-contact public-key]) (re-frame/dispatch [:select-contact public-key]))] [contact-list-item/contact-list-item - {:on-press on-toggle - :accessory {:type :checkbox - :checked? user-selected? - :on-check on-toggle}} + {:on-press on-toggle + :allow-multiple-presses? true + :accessory {:type :checkbox + :checked? user-selected? + :on-check on-toggle}} item]))) (defn- view-internal diff --git a/src/status_im/contexts/chat/messenger/messages/content/audio/view.cljs b/src/status_im/contexts/chat/messenger/messages/content/audio/view.cljs index 5de4163847..c829a929d4 100644 --- a/src/status_im/contexts/chat/messenger/messages/content/audio/view.cljs +++ b/src/status_im/contexts/chat/messenger/messages/content/audio/view.cljs @@ -190,16 +190,17 @@ {:accessibility-label :audio-message-container :style (style/container)} [rn/touchable-opacity - {:accessibility-label :play-pause-audio-message-button - :on-press #(play-pause-player {:player-key player-key - :player-state player-state - :progress progress - :message-id message-id - :audio-duration-ms duration - :seeking-audio? seeking-audio? - :user-interaction? true - :mediaserver-port mediaserver-port}) - :style (style/play-pause-container)} + {:accessibility-label :play-pause-audio-message-button + :allow-multiple-presses? true + :on-press #(play-pause-player {:player-key player-key + :player-state player-state + :progress progress + :message-id message-id + :audio-duration-ms duration + :seeking-audio? seeking-audio? + :user-interaction? true + :mediaserver-port mediaserver-port}) + :style (style/play-pause-container)} [quo/icon (cond (= @player-state :preparing) diff --git a/src/status_im/contexts/communities/home/view.cljs b/src/status_im/contexts/communities/home/view.cljs index 021eb3cbf0..d8ac34ab54 100644 --- a/src/status_im/contexts/communities/home/view.cljs +++ b/src/status_im/contexts/communities/home/view.cljs @@ -26,8 +26,9 @@ [quo/communities-membership-list-item {:customization-color customization-color :style {:padding-horizontal 20} - :on-press #(debounce/dispatch-and-chill [:communities/navigate-to-community-overview id] - 500) + :on-press #(debounce/throttle-and-dispatch [:communities/navigate-to-community-overview + id] + 500) :on-long-press #(rf/dispatch [:show-bottom-sheet {:content (fn [] diff --git a/src/status_im/contexts/communities/overview/view.cljs b/src/status_im/contexts/communities/overview/view.cljs index 25e2d4ac94..1e26847a3a 100644 --- a/src/status_im/contexts/communities/overview/view.cljs +++ b/src/status_im/contexts/communities/overview/view.cljs @@ -199,7 +199,7 @@ (assoc :on-press (when joined-or-spectated (fn [] (rf/dispatch [:dismiss-keyboard]) - (debounce/dispatch-and-chill + (debounce/throttle-and-dispatch [:communities/navigate-to-community-chat (str community-id id)] 1000))) :on-long-press #(rf/dispatch diff --git a/src/status_im/contexts/onboarding/intro/view.cljs b/src/status_im/contexts/onboarding/intro/view.cljs index e9bc1f0737..3a282e4128 100644 --- a/src/status_im/contexts/onboarding/intro/view.cljs +++ b/src/status_im/contexts/onboarding/intro/view.cljs @@ -19,16 +19,16 @@ (reset! scan-sync-code/dismiss-animations reset-top-animation-fn)) :animations-duration constants/onboarding-modal-animation-duration :animations-delay constants/onboarding-modal-animation-delay - :top-card {:on-press #(debounce/dispatch-and-chill [:open-modal - :sign-in-intro] - 2000) + :top-card {:on-press #(debounce/throttle-and-dispatch [:open-modal + :sign-in-intro] + 2000) :heading (i18n/label :t/sign-in) :animated-heading (i18n/label :t/sign-in-by-syncing) :accessibility-label :already-use-status-button} :bottom-card {:on-press (fn [] (when-let [blur-show-fn @overlay/blur-show-fn-atom] (blur-show-fn)) - (debounce/dispatch-and-chill + (debounce/throttle-and-dispatch [:open-modal :new-to-status] 1000)) :heading (i18n/label :t/new-to-status) @@ -45,7 +45,7 @@ :style style/plain-text} (i18n/label :t/by-continuing-you-accept)] [quo/text - {:on-press #(debounce/dispatch-and-chill [:open-modal :privacy-policy] 1000) + {:on-press #(debounce/throttle-and-dispatch [:open-modal :privacy-policy] 1000) :size :paragraph-2 :weight :regular :style style/highlighted-text} diff --git a/src/status_im/contexts/onboarding/new_to_status/view.cljs b/src/status_im/contexts/onboarding/new_to_status/view.cljs index 45528a65e1..20049cd774 100644 --- a/src/status_im/contexts/onboarding/new_to_status/view.cljs +++ b/src/status_im/contexts/onboarding/new_to_status/view.cljs @@ -31,7 +31,7 @@ (* 2 56) ;; two other list items (* 2 16) ;; spacing between items 220) ;; extra spacing (top bar) - :on-press #(debounce/dispatch-and-chill + :on-press #(debounce/throttle-and-dispatch [:onboarding/navigate-to-create-profile] 1000)}] [rn/view {:style style/subtitle-container} diff --git a/src/status_im/contexts/onboarding/syncing/progress/view.cljs b/src/status_im/contexts/onboarding/syncing/progress/view.cljs index 59292a4e31..adc1da44e1 100644 --- a/src/status_im/contexts/onboarding/syncing/progress/view.cljs +++ b/src/status_im/contexts/onboarding/syncing/progress/view.cljs @@ -35,8 +35,8 @@ in-onboarding? (rf/dispatch [:navigate-back-to :sign-in-intro]) :else (do (rf/dispatch [:navigate-back]) - (debounce/dispatch-and-chill [:open-modal :sign-in] - 1000)))) + (debounce/throttle-and-dispatch [:open-modal :sign-in] + 1000)))) :accessibility-label :try-again-later-button :customization-color profile-color :container-style style/try-again-button} diff --git a/src/status_im/contexts/profile/profiles/view.cljs b/src/status_im/contexts/profile/profiles/view.cljs index 5ddfd31fbd..e833f87955 100644 --- a/src/status_im/contexts/profile/profiles/view.cljs +++ b/src/status_im/contexts/profile/profiles/view.cljs @@ -50,13 +50,13 @@ :on-press (fn [] (when @push-animation-fn-atom (@push-animation-fn-atom)) - (debounce/dispatch-and-chill + (debounce/throttle-and-dispatch [:open-modal :new-to-status] 1000)) :accessibility-label :create-new-profile} {:icon :i/multi-profile :label (i18n/label :t/add-existing-status-profile) - :on-press #(debounce/dispatch-and-chill + :on-press #(debounce/throttle-and-dispatch [:open-modal :sign-in] 1000) :accessibility-label :multi-profile}]]]) diff --git a/src/status_im/contexts/profile/settings/view.cljs b/src/status_im/contexts/profile/settings/view.cljs index 7c49262479..7428f94050 100644 --- a/src/status_im/contexts/profile/settings/view.cljs +++ b/src/status_im/contexts/profile/settings/view.cljs @@ -56,7 +56,7 @@ :on-press #(rf/dispatch [:navigate-back]) :right-side [{:icon-name :i/multi-profile :on-press #(rf/dispatch [:open-modal :sign-in])} {:icon-name :i/qr-code - :on-press #(debounce/dispatch-and-chill [:open-modal :share-shell] 1000)} + :on-press #(debounce/throttle-and-dispatch [:open-modal :share-shell] 1000)} {:icon-name :i/share :on-press not-implemented/alert}]}]] [rn/flat-list {:key :list @@ -74,7 +74,7 @@ :jump-to {:on-press (fn [] (rf/dispatch [:navigate-back]) - (debounce/dispatch-and-chill [:shell/navigate-to-jump-to] 500)) + (debounce/throttle-and-dispatch [:shell/navigate-to-jump-to] 500)) :customization-color customization-color :label (i18n/label :t/jump-to)}} {:position :absolute diff --git a/src/utils/debounce.cljs b/src/utils/debounce.cljs index 93f2d89c00..610255533d 100644 --- a/src/utils/debounce.cljs +++ b/src/utils/debounce.cljs @@ -22,15 +22,15 @@ (clear event-key) (swap! timeout assoc event-key (js/setTimeout #(re-frame/dispatch event) duration-ms)))) -(def chill (atom {})) +(def throttle (atom {})) -(defn dispatch-and-chill +(defn throttle-and-dispatch "Dispatches event and ignores subsequent calls for the duration of `duration-ms`." [event duration-ms] (let [event-key (first event)] - (when-not (get @chill event-key) - (swap! chill assoc event-key true) - (js/setTimeout #(swap! chill assoc event-key false) duration-ms) + (when-not (get @throttle event-key) + (swap! throttle assoc event-key true) + (js/setTimeout #(swap! throttle dissoc event-key) duration-ms) (re-frame/dispatch event)))) (defn debounce