[15569] Select recent tab on messages home when double tapping messages icon (#15604)

src/status_im/events.cljs

@@ -59,7 +59,8 @@
     status-im2.contexts.shell.events
     status-im2.contexts.onboarding.events
     status-im.chat.models.gaps
-    [status-im2.navigation.events :as navigation]))
+    [status-im2.navigation.events :as navigation]
+    status-im2.contexts.chat.home.events))
 
 (re-frame/reg-fx
  :dismiss-keyboard

src/status_im2/contexts/chat/home/events.cljs

@@ -0,0 +1,8 @@
+(ns status-im2.contexts.chat.home.events
+  (:require
+    [utils.re-frame :as rf]))
+
+(rf/defn messages-home-select-tab-event
+  {:events [:messages-home/select-tab]}
+  [{:keys [db]} tab]
+  {:db (assoc db :messages-home/selected-tab tab)})

src/status_im2/contexts/chat/home/view.cljs

@@ -3,7 +3,6 @@
             [quo2.core :as quo]
             [re-frame.core :as re-frame]
             [react-native.core :as rn]
-            [reagent.core :as reagent]
             [status-im2.common.contact-list.view :as contact-list]
             [status-im2.common.home.view :as common.home]
             [status-im2.contexts.chat.home.chat-list-item.view :as chat-list-item]
@@ -24,7 +23,7 @@
 
 (defn filter-items-by-tab
   [tab items]
-  (if (= tab :groups)
+  (if (= tab :tab/groups)
     (filter :group-chat items)
     (filter :chat-id items)))
 
@@ -92,24 +91,24 @@
 
 (defn get-tabs-data
   [dot?]
-  [{:id :recent :label (i18n/label :t/recent) :accessibility-label :tab-recent}
-   {:id :groups :label (i18n/label :t/groups) :accessibility-label :tab-groups}
-   {:id                  :contacts
+  [{:id :tab/recent :label (i18n/label :t/recent) :accessibility-label :tab-recent}
+   {:id :tab/groups :label (i18n/label :t/groups) :accessibility-label :tab-groups}
+   {:id                  :tab/contacts
     :label               (i18n/label :t/contacts)
     :accessibility-label :tab-contacts
     :notification-dot?   dot?}])
 
 (defn home
   []
-  (let [selected-tab (reagent/atom :recent)]
   (fn []
-      (let [pending-contact-requests (rf/sub [:activity-center/pending-contact-requests])]
+    (let [pending-contact-requests (rf/sub [:activity-center/pending-contact-requests])
+          selected-tab             (or (rf/sub [:messages-home/selected-tab]) :tab/recent)]
       [safe-area/consumer
        (fn [{:keys [top]}]
          [:<>
-            (if (= @selected-tab :contacts)
+          (if (= selected-tab :tab/contacts)
             [contacts pending-contact-requests top]
-              [chats @selected-tab top])
+            [chats selected-tab top])
           [rn/view
            {:style (style/blur-container top)}
            [blur/view
@@ -128,6 +127,7 @@
            [quo/tabs
             {:style          style/tabs
              :size           32
-               :on-change      #(reset! selected-tab %)
-               :default-active @selected-tab
-               :data           (get-tabs-data (pos? (count pending-contact-requests)))}]]])]))))
+             :on-change      (fn [tab]
+                               (rf/dispatch [:messages-home/select-tab tab]))
+             :default-active selected-tab
+             :data           (get-tabs-data (pos? (count pending-contact-requests)))}]]])])))

src/status_im2/contexts/shell/bottom_tabs.cljs

@@ -6,7 +6,8 @@
             [status-im2.contexts.shell.style :as style]
             [status-im2.contexts.shell.animation :as animation]
             [status-im2.contexts.shell.constants :as shell.constants]
-            [quo2.components.navigation.bottom-nav-tab :as bottom-nav-tab]))
+            [quo2.components.navigation.bottom-nav-tab :as bottom-nav-tab]
+            [react-native.gesture :as gesture]))
 
 (defn blur-overlay-params
   [style]
@@ -38,7 +39,12 @@
            original-style              (style/bottom-tabs-container pass-through?)
            animated-style              (reanimated/apply-animations-to-style
                                         {:height (:bottom-tabs-height shared-values)}
-                               original-style)]
+                                        original-style)
+           messages-double-tap-gesture (-> (gesture/gesture-tap)
+                                           (gesture/number-of-taps 2)
+                                           (gesture/on-start
+                                            (fn [_event]
+                                              (rf/dispatch [:messages-home/select-tab :tab/recent]))))]
        (animation/load-stack @animation/selected-stack-id)
        (reanimated/set-shared-value (:pass-through? shared-values) pass-through?)
        [reanimated/view {:style animated-style}
@@ -46,6 +52,7 @@
           [blur/view (blur-overlay-params style/bottom-tabs-blur-overlay)])
         [rn/view {:style (style/bottom-tabs)}
          [bottom-tab :i/communities :communities-stack shared-values notifications-data]
-         [bottom-tab :i/messages :chats-stack shared-values notifications-data]
+         [gesture/gesture-detector {:gesture messages-double-tap-gesture}
+          [bottom-tab :i/messages :chats-stack shared-values notifications-data]]
          [bottom-tab :i/wallet :wallet-stack shared-values notifications-data]
          [bottom-tab :i/browser :browser-stack shared-values notifications-data]]]))])

src/status_im2/subs/root.cljs

@@ -281,3 +281,6 @@
 (reg-root-key-sub :messenger/started? :messenger/started?)
 
 (reg-root-key-sub :information-box-states :information-box-states)
+
+; Messages home view -> tabs
+(reg-root-key-sub :messages-home/selected-tab :messages-home/selected-tab)