diff --git a/src/status_im/chats_list/screen.cljs b/src/status_im/chats_list/screen.cljs index 19b9dfeca1..9e38f48307 100644 --- a/src/status_im/chats_list/screen.cljs +++ b/src/status_im/chats_list/screen.cljs @@ -13,7 +13,7 @@ [status-im.chats-list.views.chat-list-item :refer [chat-list-item]] [status-im.components.action-button :refer [action-button action-button-item]] - [status-im.components.drawer.view :refer [drawer-view open-drawer]] + [status-im.components.drawer.view :refer [open-drawer]] [status-im.components.styles :refer [color-blue toolbar-background1 toolbar-background2]] @@ -46,41 +46,40 @@ content-height (r/atom 0)] (dispatch [:set :chats-scrolled? false]) (fn [] - [drawer-view - [view st/chats-container - [chats-list-toolbar] - [list-view {:dataSource (to-datasource @chats) - :renderRow (fn [row _ _] - (list-item [chat-list-item row])) - :style st/list-container - ;;; if "maximazing" chat list will make scroll to 0, - ;;; then disable maximazing - :onLayout (fn [event] - (when-not @chats-scrolled? - (let [height (.. event -nativeEvent -layout -height)] - (reset! container-height height)))) - :onContentSizeChange (fn [width height] - (reset! content-height height)) - :onScroll (fn [e] - (let [offset (.. e -nativeEvent -contentOffset -y) - min-content-height (+ @container-height tabs-height) - scrolled? (and (< 0 offset) (< min-content-height @content-height))] - (dispatch [:set :chats-scrolled? scrolled?]) - (dispatch [:set-animation :tabs-bar-animation? true])))}] - [animated-view {:style (st/action-buttons-container @animation? (or @tabs-bar-value 0)) - :pointerEvents :box-none} - [action-button {:buttonColor color-blue - :offsetY 16 - :offsetX 16} - [action-button-item - {:title (label :t/new-chat) - :buttonColor :#9b59b6 - :onPress #(dispatch [:show-group-contacts :people])} - [icon {:name :android-create - :style st/create-icon}]] - [action-button-item - {:title (label :t/new-group-chat) - :buttonColor :#1abc9c - :onPress #(dispatch [:show-group-new])} - [icon {:name :person-stalker - :style st/person-stalker-icon}]]]]]]))) + [view st/chats-container + [chats-list-toolbar] + [list-view {:dataSource (to-datasource @chats) + :renderRow (fn [row _ _] + (list-item [chat-list-item row])) + :style st/list-container + ;;; if "maximazing" chat list will make scroll to 0, + ;;; then disable maximazing + :onLayout (fn [event] + (when-not @chats-scrolled? + (let [height (.. event -nativeEvent -layout -height)] + (reset! container-height height)))) + :onContentSizeChange (fn [width height] + (reset! content-height height)) + :onScroll (fn [e] + (let [offset (.. e -nativeEvent -contentOffset -y) + min-content-height (+ @container-height tabs-height) + scrolled? (and (< 0 offset) (< min-content-height @content-height))] + (dispatch [:set :chats-scrolled? scrolled?]) + (dispatch [:set-animation :tabs-bar-animation? true])))}] + [animated-view {:style (st/action-buttons-container @animation? (or @tabs-bar-value 0)) + :pointerEvents :box-none} + [action-button {:buttonColor color-blue + :offsetY 16 + :offsetX 16} + [action-button-item + {:title (label :t/new-chat) + :buttonColor :#9b59b6 + :onPress #(dispatch [:show-group-contacts :people])} + [icon {:name :android-create + :style st/create-icon}]] + [action-button-item + {:title (label :t/new-group-chat) + :buttonColor :#1abc9c + :onPress #(dispatch [:show-group-new])} + [icon {:name :person-stalker + :style st/person-stalker-icon}]]]]]))) diff --git a/src/status_im/components/main_tabs.cljs b/src/status_im/components/main_tabs.cljs index 01551e75da..d59b1d676b 100644 --- a/src/status_im/components/main_tabs.cljs +++ b/src/status_im/components/main_tabs.cljs @@ -10,6 +10,7 @@ image touchable-highlight get-dimensions]] + [status-im.components.drawer.view :refer [drawer-view]] [status-im.components.animation :as anim] [status-im.chats-list.screen :refer [chats-list]] [status-im.discovery.screen :refer [discovery]] @@ -101,9 +102,10 @@ (defview main-tabs [] [view-id [:get :view-id] tab-animation? [:get :prev-tab-view-id]] - [view {:style common-st/flex} - [view {:style common-st/flex - :pointerEvents (if tab-animation? :none :auto)} - (doall (map #(tab-view %) tab-list))] - [tabs {:selected-view-id view-id - :tab-list tab-list}]]) + [drawer-view + [view {:style common-st/flex} + [view {:style common-st/flex + :pointerEvents (if tab-animation? :none :auto)} + (doall (map #(tab-view %) tab-list))] + [tabs {:selected-view-id view-id + :tab-list tab-list}]]]) diff --git a/src/status_im/contacts/screen.cljs b/src/status_im/contacts/screen.cljs index 880654ab57..97342f9f01 100644 --- a/src/status_im/contacts/screen.cljs +++ b/src/status_im/contacts/screen.cljs @@ -13,7 +13,7 @@ action-button-item]] [status-im.contacts.views.contact :refer [contact-extended-view]] [status-im.components.toolbar :refer [toolbar]] - [status-im.components.drawer.view :refer [drawer-view open-drawer]] + [status-im.components.drawer.view :refer [open-drawer]] [status-im.components.icons.ionicons :refer [icon]] [status-im.components.styles :refer [color-blue hamburger-icon @@ -63,38 +63,37 @@ contcats-count (subscribe [:contacts-count]) show-toolbar-shadow? (r/atom false)] (fn [] - [drawer-view - [view st/contacts-list-container - [contact-list-toolbar] - [view {:style st/toolbar-shadow} - (when @show-toolbar-shadow? - [linear-gradient {:style st/contact-group-header-gradient-bottom - :colors st/contact-group-header-gradient-bottom-colors}])] - (if (pos? @contcats-count) - [scroll-view {:style st/contact-groups - :onScroll (fn [e] - (let [offset (.. e -nativeEvent -contentOffset -y)] - (reset! show-toolbar-shadow? (<= st/contact-group-header-height offset))))} - ;; TODO not implemented: dapps and persons separation - [contact-group - @contacts - @contcats-count - (label :t/contacs-group-dapps) - :dapps true] - [contact-group - @contacts - @contcats-count - (label :t/contacs-group-people) - :people false]] - [view st/empty-contact-groups - [react/icon :group_big st/empty-contacts-icon] - [text {:style st/empty-contacts-text} (label :t/no-contacts)]]) - [action-button {:buttonColor color-blue - :offsetY 16 - :offsetX 16} - [action-button-item - {:title (label :t/new-contact) - :buttonColor :#9b59b6 - :onPress #(dispatch [:navigate-to :new-contact])} - [icon {:name :android-create - :style create-icon}]]]]]))) + [view st/contacts-list-container + [contact-list-toolbar] + [view {:style st/toolbar-shadow} + (when @show-toolbar-shadow? + [linear-gradient {:style st/contact-group-header-gradient-bottom + :colors st/contact-group-header-gradient-bottom-colors}])] + (if (pos? @contcats-count) + [scroll-view {:style st/contact-groups + :onScroll (fn [e] + (let [offset (.. e -nativeEvent -contentOffset -y)] + (reset! show-toolbar-shadow? (<= st/contact-group-header-height offset))))} + ;; TODO not implemented: dapps and persons separation + [contact-group + @contacts + @contcats-count + (label :t/contacs-group-dapps) + :dapps true] + [contact-group + @contacts + @contcats-count + (label :t/contacs-group-people) + :people false]] + [view st/empty-contact-groups + [react/icon :group_big st/empty-contacts-icon] + [text {:style st/empty-contacts-text} (label :t/no-contacts)]]) + [action-button {:buttonColor color-blue + :offsetY 16 + :offsetX 16} + [action-button-item + {:title (label :t/new-contact) + :buttonColor :#9b59b6 + :onPress #(dispatch [:navigate-to :new-contact])} + [icon {:name :android-create + :style create-icon}]]]]))) diff --git a/src/status_im/contacts/views/new_contact.cljs b/src/status_im/contacts/views/new_contact.cljs index 4af9d3c5d4..a45de304a6 100644 --- a/src/status_im/contacts/views/new_contact.cljs +++ b/src/status_im/contacts/views/new_contact.cljs @@ -9,7 +9,6 @@ touchable-highlight]] [status-im.utils.identicon :refer [identicon]] [status-im.components.toolbar :refer [toolbar]] - [status-im.components.drawer.view :refer [drawer-view open-drawer]] [status-im.components.styles :refer [color-purple color-white icon-search @@ -57,23 +56,21 @@ (defview new-contact [] [{:keys [name whisper-identity phone-number] :as new-contact} [:get :new-contact]] - [drawer-view - [view st/contact-form-container - [linear-gradient {:colors ["rgba(182, 116, 241, 1)" "rgba(107, 147, 231, 1)" "rgba(43, 171, 238, 1)"] - :start [0, 0] - :end [0.5, 1] - :locations [0, 0.8 ,1] - :style st/gradient-background}] + [view st/contact-form-container + [linear-gradient {:colors ["rgba(182, 116, 241, 1)" "rgba(107, 147, 231, 1)" "rgba(43, 171, 238, 1)"] + :start [0, 0] + :end [0.5, 1] + :locations [0, 0.8, 1] + :style st/gradient-background}] - [toolbar {:background-color :transparent - :nav-action {:image {:source {:uri :icon_back_white} - :style icon-back} - :handler #(dispatch [:navigate-back])} - :custom-content toolbar-title - :action {:image {:source {:uri :icon_add} - :style icon-search} - :handler #(dispatch [:add-new-contact (merge {:photo-path (identicon whisper-identity)} new-contact)])}}] - [view st/form-container - [contact-whisper-id-input whisper-identity] - [contact-name-input name] - ]]]) + [toolbar {:background-color :transparent + :nav-action {:image {:source {:uri :icon_back_white} + :style icon-back} + :handler #(dispatch [:navigate-back])} + :custom-content toolbar-title + :action {:image {:source {:uri :icon_add} + :style icon-search} + :handler #(dispatch [:add-new-contact (merge {:photo-path (identicon whisper-identity)} new-contact)])}}] + [view st/form-container + [contact-whisper-id-input whisper-identity] + [contact-name-input name]]])