From dea6bdb2ca1ac64ea908c49c1a2cb2702f81ea91 Mon Sep 17 00:00:00 2001 From: Eric Dvorsak Date: Wed, 18 Oct 2017 03:16:37 +0200 Subject: [PATCH] add positional argument for hiding tabs to swipable-tabs component - makes it possible to hide the tabs in a view under certain conditions (e.g when the keyboard is displayed) - hide tabs in main screens when the keyboard is displayed --- src/status_im/components/tabs/views.cljs | 10 ++++++---- src/status_im/ui/screens/main_tabs/views.cljs | 5 +++-- .../ui/screens/wallet/transactions/views.cljs | 2 +- 3 files changed, 10 insertions(+), 7 deletions(-) diff --git a/src/status_im/components/tabs/views.cljs b/src/status_im/components/tabs/views.cljs index 03a28daf1e..af9f7a4fb9 100644 --- a/src/status_im/components/tabs/views.cljs +++ b/src/status_im/components/tabs/views.cljs @@ -18,7 +18,7 @@ (for [[index {:keys [content view-id]}] indexed-tabs] ^{:key index} [tab index content tab-style on-press (is-current-tab? view-id)])]) -(defn swipable-tabs [tabs-list current-tab +(defn swipable-tabs [tabs-list current-tab show-tabs? {:keys [bottom-tabs? navigation-event main-container-style tabs-container-style tab-style] :or {bottom-tabs false navigation-event :navigate-to @@ -32,14 +32,15 @@ indexed-tabs) index->tab (clojure.set/map-invert tab->index) get-tab-index #(get tab->index % 0)] - (fn [tabs-list current-tab] + (fn [tabs-list current-tab show-tabs?] (let [current-tab-index (get-tab-index current-tab) on-press (fn [index] (.scrollBy @swiper (- index current-tab-index))) is-current-tab? (fn [view-id] (= (get-tab-index view-id) current-tab-index))] [react/view styles/main-container - (when-not bottom-tabs? + (when (and (not bottom-tabs?) + show-tabs?) [tabs tabs-container-style indexed-tabs tab-style on-press is-current-tab?]) [react/swiper {:loop false :shows-pagination false @@ -48,5 +49,6 @@ :on-index-changed #(re-frame/dispatch [navigation-event (index->tab %)])} (for [[index {:keys [screen view-id]}] indexed-tabs] ^{:key index} [screen (is-current-tab? view-id)])] - (when bottom-tabs? + (when (and bottom-tabs? + show-tabs?) [tabs tabs-container-style indexed-tabs tab-style on-press is-current-tab?])])))) diff --git a/src/status_im/ui/screens/main_tabs/views.cljs b/src/status_im/ui/screens/main_tabs/views.cljs index 10da40c007..d1773d0756 100644 --- a/src/status_im/ui/screens/main_tabs/views.cljs +++ b/src/status_im/ui/screens/main_tabs/views.cljs @@ -48,10 +48,11 @@ (def tabs-list (map #(update % :content tab-content) tabs-list*)) (views/defview main-tabs [] - (views/letsubs [current-tab [:get :view-id]] + (views/letsubs [keyboard-height [:get :keyboard-height] + current-tab [:get :view-id]] [react/view styles/flex [status-bar {:type (if (= current-tab :wallet) :wallet :main)}] [drawer-view - [tabs/swipable-tabs tabs-list current-tab + [tabs/swipable-tabs tabs-list current-tab (zero? keyboard-height) {:bottom-tabs? true :navigation-event :navigate-to-tab}]]])) diff --git a/src/status_im/ui/screens/wallet/transactions/views.cljs b/src/status_im/ui/screens/wallet/transactions/views.cljs index 9198b1061c..145bf05ff9 100644 --- a/src/status_im/ui/screens/wallet/transactions/views.cljs +++ b/src/status_im/ui/screens/wallet/transactions/views.cljs @@ -180,7 +180,7 @@ [react/view {:style styles/flex} [status-bar/status-bar] [toolbar-view current-tab unsigned-transactions-count] - [tabs/swipable-tabs tabs-list current-tab + [tabs/swipable-tabs tabs-list current-tab true {:navigation-event :navigation-replace :tab-style transactions.styles/tab :tabs-container-style transactions.styles/tabs-container}]]))